From: Young-Ae Kang Date: Wed, 26 Apr 2017 12:57:18 +0000 (+0900) Subject: Change  , ", and ' to space, double quotation mark, and single quotatio... X-Git-Tag: GitHub/PR#40/tizen-studio~193 X-Git-Url: http://review.tizen.org/git/?a=commitdiff_plain;h=8efd1ac91426082fa1592c48d1bc2816250cb06e;p=sdk%2Fonline-doc.git Change  , ", and ' to space, double quotation mark, and single quotation mark respectively for training, guides, and studio; Remove whitespaces Change-Id: I0f6d95d60b78537cf92f681111f417e4f0496b2b --- diff --git a/org.tizen.guides/html/cover_page.htm b/org.tizen.guides/html/cover_page.htm index c1e85f3..c8de0cb 100644 --- a/org.tizen.guides/html/cover_page.htm +++ b/org.tizen.guides/html/cover_page.htm @@ -5,13 +5,13 @@ - + - Tizen Guides + Tizen Guides @@ -20,9 +20,9 @@ Guides

Click the application type you want:

-

Native Application Web Application

+

Native Application Web Application

+ - diff --git a/org.tizen.guides/html/native/alarm/alarm_cover_n.htm b/org.tizen.guides/html/native/alarm/alarm_cover_n.htm index 5b3541b..fd27d05 100644 --- a/org.tizen.guides/html/native/alarm/alarm_cover_n.htm +++ b/org.tizen.guides/html/native/alarm/alarm_cover_n.htm @@ -5,13 +5,13 @@ - + - Alarms and Scheduling + Alarms and Scheduling @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • - +

    Alarms and Scheduling

    @@ -45,7 +45,7 @@

    You can create rules (contextual triggers consisting of an event, conditions, and an action) to monitor the device status or user activities. When the rule is enabled, the system starts to monitor the device status or user activities. When a specific event with certain conditions occurs, a defined action is triggered.

    - +
    diff --git a/org.tizen.guides/html/native/alarm/alarms_n.htm b/org.tizen.guides/html/native/alarm/alarms_n.htm index 38e893c..007e067 100644 --- a/org.tizen.guides/html/native/alarm/alarms_n.htm +++ b/org.tizen.guides/html/native/alarm/alarms_n.htm @@ -5,20 +5,20 @@ - + - Alarms - + Alarms + - +

    Mobile native Wearable native

    - +
    -

    Alarms

    +

    Alarms

    You can launch an application at a specific time using alarms. The mechanism involved in launching the application is the App Control API (in mobile and wearable applications).

    The AppControl API allows launching an application explicitly, giving its package name, or providing certain criteria that the application must meet. For example, the criteria can include the type of data on which the application must be able to operate. The structure containing the criteria is called an application control.

    @@ -66,8 +66,8 @@
  • To use the Alarm API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file: 
     <privileges>
-   <privilege>http://tizen.org/privilege/alarm.get</privilege>
-   <privilege>http://tizen.org/privilege/alarm.set</privilege>
+   <privilege>http://tizen.org/privilege/alarm.get</privilege>
+   <privilege>http://tizen.org/privilege/alarm.set</privilege>
 </privileges>
    • @@ -101,39 +101,39 @@ bool init_alarm() { -    int ret; -    int DELAY = 2; -    int REMIND = 1; -    int alarm_id; - -    app_control_h app_control = NULL; -    ret = app_control_create(&app_control); -    ret = app_control_set_operation(app_control, APP_CONTROL_OPERATION_DEFAULT); -    ret = app_control_set_app_id(app_control, "org.tizen.alarmslave"); + int ret; + int DELAY = 2; + int REMIND = 1; + int alarm_id; + + app_control_h app_control = NULL; + ret = app_control_create(&app_control); + ret = app_control_set_operation(app_control, APP_CONTROL_OPERATION_DEFAULT); + ret = app_control_set_app_id(app_control, "org.tizen.alarmslave");

  • To schedule an alarm after a delay, use the alarm_schedule_after_delay() function:

    - + 
    -    ret = alarm_schedule_after_delay(app_control, DELAY, REMIND, &alarm_id);
+    ret = alarm_schedule_after_delay(app_control, DELAY, REMIND, &alarm_id);
 
-    return true;
+    return true;
 }
-
    +

  • Implement the AlarmTarget application:

    -

    A scheduled alarm calls AlarmTarget's app_control_cb() callback when the alarm expires:

    +

    A scheduled alarm calls AlarmTarget's app_control_cb() callback when the alarm expires:

     void
 service_app_control(app_control_h app_control, void *data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "app_control called by Alarm API.");
+    dlog_print(DLOG_INFO, LOG_TAG, "app_control called by Alarm API.");
 }
    • @@ -146,53 +146,53 @@ service_app_control(app_control_h app_control, void *data)

    Table: tm fields

    - - - - + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    MemberType
    MemberType Meaning Range
    tm_secintSeconds after the minute0-61*
    tm_minintMinutes after the hour0-59
    tm_hourintHours since midnight0-23
    tm_mdayintDay of the month1-31
    tm_monintMonths since January0-11
    tm_yearintYears since 1900
    - - + + tm_sec + int + Seconds after the minute + 0-61* + + + tm_min + int + Minutes after the hour + 0-59 + + + tm_hour + int + Hours since midnight + 0-23 + + + tm_mday + int + Day of the month + 1-31 + + + tm_mon + int + Months since January + 0-11 + + + tm_year + int + Years since 1900 + + + + + +

    The following code schedules an application control to invoke after 4 seconds (using the date.tm_sec member). Using, for example, date.tm_mday, can set the alarm to another day of the month. Since the third parameter is set to 0, the alarm is executed only once.

     struct tm date;
@@ -216,17 +216,17 @@ ret = alarm_schedule_at_date(app, &date, 0, &alarm_id);
 
    The third parameter defines the day of the week on which the alarm recurs. The value is defined with the enum alarm_week_flag_e enumerator (in mobile and wearable applications), and can be a combination of days, for example ALARM_WEEK_FLAG_TUESDAY | ALARM_WEEK_FLAG_FRIDAY. The value can also be a binary, such as 1<<3 | 1<<6.
    
 
 
    The following code schedules an application control to invoke on TUESDAY and FRIDAY:
    
-  
+
 
     struct tm date;
 ret = alarm_get_current_time(&date);
 
 time_t time_current = mktime(&date);
-dlog_print(DLOG_INFO, TAG, "Schedule on date: %s ", ctime(&time_current));
+dlog_print(DLOG_INFO, TAG, "Schedule on date: %s ", ctime(&time_current));
 ret =
-    alarm_schedule_with_recurrence_week_flag(app_control, &date,
-                                             ALARM_WEEK_FLAG_TUESDAY | ALARM_WEEK_FLAG_FRIDAY,
-                                             &alarm_id);
+    alarm_schedule_with_recurrence_week_flag(app_control, &date,
+                                             ALARM_WEEK_FLAG_TUESDAY | ALARM_WEEK_FLAG_FRIDAY,
+                                             &alarm_id);
 
    
 
 
    Listing All Scheduled Alarms and Canceling an Alarm
    
@@ -241,49 +241,49 @@ ret =
 static bool
 on_foreach_registered_alarm(int alarm_id, void *user_data)
 {
-    int flag;
-    int ret = 0;
-    struct tm date;
-    time_t time_current;
-
-    ret = alarm_get_scheduled_date(alarm_id, &date);
-    if (ret != ALARM_ERROR_NONE)
-        dlog_print(DLOG_ERROR, TAG, "Get time Error: %d ", ret);
-
-    /* Logging scheduled alarm info */
-    time_current = mktime(&date);
-    dlog_print(DLOG_INFO, TAG, "Registered alarm: %d on date: %s ",
-               alarm_id, ctime(&time_current));
-
-    ret = alarm_get_scheduled_recurrence_week_flag(alarm_id, &flag);
-    if (ret == 0) {
-        if (flag & ALARM_WEEK_FLAG_SUNDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on SUNDAY \n");
-        if (flag & ALARM_WEEK_FLAG_MONDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on MONDAY \n");
-        if (flag & ALARM_WEEK_FLAG_TUESDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on TUESDAY \n");
-        if (flag & ALARM_WEEK_FLAG_WEDNESDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on WEDNESDAY \n");
-        if (flag & ALARM_WEEK_FLAG_THURSDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on THURSDAY \n");
-        if (flag & ALARM_WEEK_FLAG_FRIDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on FRIDAY \n");
-        if (flag & ALARM_WEEK_FLAG_SATURDAY)
-            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on SATURDAY \n");
-    }
-
-    /* Cancel scheduled alarms */
-    ret = alarm_cancel(alarm_id);
-    if (ret != ALARM_ERROR_NONE)
-        dlog_print(DLOG_ERROR, TAG, "Cancel Error: %d ", ret);
-
-    return true;
+    int flag;
+    int ret = 0;
+    struct tm date;
+    time_t time_current;
+
+    ret = alarm_get_scheduled_date(alarm_id, &date);
+    if (ret != ALARM_ERROR_NONE)
+        dlog_print(DLOG_ERROR, TAG, "Get time Error: %d ", ret);
+
+    /* Logging scheduled alarm info */
+    time_current = mktime(&date);
+    dlog_print(DLOG_INFO, TAG, "Registered alarm: %d on date: %s ",
+               alarm_id, ctime(&time_current));
+
+    ret = alarm_get_scheduled_recurrence_week_flag(alarm_id, &flag);
+    if (ret == 0) {
+        if (flag & ALARM_WEEK_FLAG_SUNDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on SUNDAY \n");
+        if (flag & ALARM_WEEK_FLAG_MONDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on MONDAY \n");
+        if (flag & ALARM_WEEK_FLAG_TUESDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on TUESDAY \n");
+        if (flag & ALARM_WEEK_FLAG_WEDNESDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on WEDNESDAY \n");
+        if (flag & ALARM_WEEK_FLAG_THURSDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on THURSDAY \n");
+        if (flag & ALARM_WEEK_FLAG_FRIDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on FRIDAY \n");
+        if (flag & ALARM_WEEK_FLAG_SATURDAY)
+            dlog_print(DLOG_INFO, TAG, "Alarm Recurrence on SATURDAY \n");
+    }
+
+    /* Cancel scheduled alarms */
+    ret = alarm_cancel(alarm_id);
+    if (ret != ALARM_ERROR_NONE)
+        dlog_print(DLOG_ERROR, TAG, "Cancel Error: %d ", ret);
+
+    return true;
 }
 
 ret = alarm_foreach_registered_alarm(on_foreach_registered_alarm, NULL);
 if (ret != ALARM_ERROR_NONE)
-    dlog_print(DLOG_ERROR, TAG, "Listing Error: %d ", ret);
+    dlog_print(DLOG_ERROR, TAG, "Listing Error: %d ", ret);
    @@ -308,4 +308,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + diff --git a/org.tizen.guides/html/native/alarm/trigger_n.htm b/org.tizen.guides/html/native/alarm/trigger_n.htm index b522d54..ac9e77c 100644 --- a/org.tizen.guides/html/native/alarm/trigger_n.htm +++ b/org.tizen.guides/html/native/alarm/trigger_n.htm @@ -106,10 +106,10 @@

    Events and Conditions

    In a rule, the combination of an event and conditions formulates the logical statement that decides to execute the action of the rule or leave it undone. The event and the conditions are defined in various kinds of contextual information, which can be recognized on the device:

    -
    • An event represents a contextual state change or a contextual event literally, such as "headphone is plugged", "the battery level has dropped to low", or "the user enters his home".
      • -
    • A condition represents a current contextual state or a device or user profile inferred through the usage history, for example, "the current battery level is low", "Wi-Fi connection is active", or "(when receiving an incoming call) the number is the most frequent address in his call logs".
    +
    • An event represents a contextual state change or a contextual event literally, such as "headphone is plugged", "the battery level has dropped to low", or "the user enters his home".
      • +
    • A condition represents a current contextual state or a device or user profile inferred through the usage history, for example, "the current battery level is low", "Wi-Fi connection is active", or "(when receiving an incoming call) the number is the most frequent address in his call logs".
    -

    Defining an event or a condition can involve attribute comparisons and input option parameter settings. The following example illustrates how to formulate a simple rule of "at 10 PM, if the battery is not charging":

    +

    Defining an event or a condition can involve attribute comparisons and input option parameter settings. The following example illustrates how to formulate a simple rule of "at 10 PM, if the battery is not charging":

    1. Create a rule handle. The first parameter (CONTEXT_TRIGGER_LOGICAL_CONJUNCTION) denotes how to combine all condition entries. 
      @@ -117,37 +117,37 @@ context_trigger_rule_h rule = NULL;
 context_trigger_rule_create(CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &rule);
      2. -
    2. Define the event ("at 10 PM every day"). +
    3. Define the event ("at 10 PM every day").

      A CONTEXT_TRIGGER_EVENT_TIME type event entry is created, and a key-value comparison of CONTEXT_TRIGGER_TIME_OF_DAY == 1320 is set to the event. 

       /* Composing an event */
 context_trigger_rule_entry_h event = NULL;
 context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_TIME,
-                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                  &event);
+                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                  &event);
 context_trigger_rule_entry_add_key(event, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_TIME_OF_DAY);
+                                   CONTEXT_TRIGGER_TIME_OF_DAY);
 context_trigger_rule_entry_add_comparison_int(event, CONTEXT_TRIGGER_TIME_OF_DAY,
-                                              CONTEXT_TRIGGER_EQUAL_TO, 1320);
+                                              CONTEXT_TRIGGER_EQUAL_TO, 1320);
 
 /* Adding the event to the rule and releasing the resources */
 context_trigger_rule_add_entry(rule, event);
 context_trigger_rule_entry_destroy(event);
      4. -
    4. Formulate the condition statement ("battery is not charging") and add it to the rule handle. +
    5. Formulate the condition statement ("battery is not charging") and add it to the rule handle.

      In the condition entry of CONTEXT_TRIGGER_CONDITION_BATTERY, the comparison statement is defined as the equality check (CONTEXT_TRIGGER_EQUAL_TO) between the left operand (CONTEXT_TRIGGER_IS_CHARGING) and the right operand (CONTEXT_TRIGGER_FALSE).

       /* Composing a condition */
 context_trigger_rule_entry_h condition = NULL;
 context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_BATTERY,
-                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &condition);
+                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &condition);
 context_trigger_rule_entry_add_key(condition, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_IS_CHARGING);
+                                   CONTEXT_TRIGGER_IS_CHARGING);
 context_trigger_rule_entry_add_comparison_int(condition, CONTEXT_TRIGGER_IS_CHARGING,
-                                              CONTEXT_TRIGGER_EQUAL_TO,
-                                              CONTEXT_TRIGGER_FALSE);
+                                              CONTEXT_TRIGGER_EQUAL_TO,
+                                              CONTEXT_TRIGGER_FALSE);
 
 /* Adding the condition to the rule handle */
 context_trigger_rule_add_entry(rule, condition);
@@ -166,40 +166,40 @@ int place_id;
 
 /* Target place ID must be retrieved through the Geofence Manager API */
 
-/* Composing an event "when the user enters his home" */
+/* Composing an event "when the user enters his home" */
 context_trigger_rule_entry_h event = NULL;
 context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_PLACE,
-                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &event);
+                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &event);
 context_trigger_rule_entry_add_option_int(event, CONTEXT_TRIGGER_PLACE_ID, place_id);
      -

      You can also use an attribute value of the event as an option (or a right operand of a comparison) in a condition. As an example, the logical statement "when receiving a message, if the sender's number is the most frequently communicated number" can be formulated as follows: +

      You can also use an attribute value of the event as an option (or a right operand of a comparison) in a condition. As an example, the logical statement "when receiving a message, if the sender's number is the most frequently communicated number" can be formulated as follows: 

      -/* Composing an event "when receiving a message" */
+/* Composing an event "when receiving a message" */
 context_trigger_rule_entry_h event = NULL;
 context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_MESSAGE,
-                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &event);
+                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &event);
 context_trigger_rule_entry_add_key(event, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_EVENT);
+                                   CONTEXT_TRIGGER_EVENT);
 context_trigger_rule_entry_add_comparison_string(event, CONTEXT_TRIGGER_EVENT,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_RECEIVED);
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_RECEIVED);
 
-/* Composing a condition "if the sender number is the most frequently communicated" */
+/* Composing a condition "if the sender number is the most frequently communicated" */
 context_trigger_rule_entry_h condition = NULL;
 context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_COMMUNICATION_FREQUENCY,
-                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &condition);
+                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &condition);
 
-/* Message sender's address is used as an option of the condition */
+/* Message sender's address is used as an option of the condition */
 context_trigger_rule_entry_add_option(condition, CONTEXT_TRIGGER_ADDRESS,
-                                      CONTEXT_TRIGGER_ADDRESS);
+                                      CONTEXT_TRIGGER_ADDRESS);
 
 /* Checking if the frequency rank of the address is equal to 1 */
 context_trigger_rule_entry_add_key(condition, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_RANK);
+                                   CONTEXT_TRIGGER_RANK);
 context_trigger_rule_entry_add_comparison_int(condition, CONTEXT_TRIGGER_RANK,
-                                              CONTEXT_TRIGGER_EQUAL_TO, 1);
+                                              CONTEXT_TRIGGER_EQUAL_TO, 1);

      The following table lists the available options keys and the corresponding values.

      @@ -242,7 +242,7 @@ context_trigger_rule_entry_add_comparison_int(condition, CONTEXT_TRIGGER_RANK,

      CONTEXT_TRIGGER_TIME_OF_DAY String - Time interval of the day. For example, "13-15" denotes "from 1 PM to 3 PM". + Time interval of the day. For example, "13-15" denotes "from 1 PM to 3 PM". CONTEXT_TRIGGER_DAY_OF_WEEK @@ -263,10 +263,10 @@ context_trigger_rule_entry_add_comparison_int(condition, CONTEXT_TRIGGER_RANK,
      • CONTEXT_TRIGGER_LOGICAL_CONJUNCTION -

        It denotes logical "AND". It means "true only if all components are true".

        +

        It denotes logical "AND". It means "true only if all components are true".

      • CONTEXT_TRIGGER_LOGICAL_DISJUNCTION -

        It denotes logical "OR". It means "true if at least 1 component is true".

        +

        It denotes logical "OR". It means "true if at least 1 component is true".

      @@ -280,43 +280,43 @@ context_trigger_rule_entry_add_comparison_int(condition, CONTEXT_TRIGGER_RANK, /* Composing an event and conditions */ context_trigger_rule_entry_h battery_event; context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_BATTERY, -                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                  &battery_event); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + &battery_event); context_trigger_rule_entry_add_key(battery_event, -                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                   CONTEXT_TRIGGER_LEVEL); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + CONTEXT_TRIGGER_LEVEL); context_trigger_rule_entry_add_comparison_string(battery_event, -                                                 CONTEXT_TRIGGER_LEVEL, -                                                 CONTEXT_TRIGGER_EQUAL_TO, -                                                 CONTEXT_TRIGGER_CRITICAL); + CONTEXT_TRIGGER_LEVEL, + CONTEXT_TRIGGER_EQUAL_TO, + CONTEXT_TRIGGER_CRITICAL); context_trigger_rule_entry_h gps_condition; context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_GPS, -                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                      &gps_condition); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + &gps_condition); context_trigger_rule_entry_add_key(gps_condition, -                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                   CONTEXT_TRIGGER_STATE); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + CONTEXT_TRIGGER_STATE); context_trigger_rule_entry_add_comparison_string(gps_condition, -                                                 CONTEXT_TRIGGER_STATE, -                                                 CONTEXT_TRIGGER_NOT_EQUAL_TO, -                                                 CONTEXT_TRIGGER_DISABLED); + CONTEXT_TRIGGER_STATE, + CONTEXT_TRIGGER_NOT_EQUAL_TO, + CONTEXT_TRIGGER_DISABLED); context_trigger_rule_entry_h wifi_condition; context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_WIFI, -                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                      &wifi_condition); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + &wifi_condition); context_trigger_rule_entry_add_key(wifi_condition, -                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                   CONTEXT_TRIGGER_STATE); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + CONTEXT_TRIGGER_STATE); context_trigger_rule_entry_add_comparison_string(wifi_condition, -                                                 CONTEXT_TRIGGER_STATE, -                                                 CONTEXT_TRIGGER_NOT_EQUAL_TO, -                                                 CONTEXT_TRIGGER_DISABLED); + CONTEXT_TRIGGER_STATE, + CONTEXT_TRIGGER_NOT_EQUAL_TO, + CONTEXT_TRIGGER_DISABLED); /* - Composing a rule "when the battery level becomes critical, - if GPS AND Wi-Fi are enabled" + Composing a rule "when the battery level becomes critical, + if GPS AND Wi-Fi are enabled" */ context_trigger_rule_h conjunction_rule; context_trigger_rule_create(CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, &conjunction_rule); @@ -326,8 +326,8 @@ context_trigger_rule_add_entry(conjunction_rule, wifi_condition); context_trigger_rule_set_action_notification(conjunction_rule, ...); /* - Composing a rule "when the battery level becomes critical, - if GPS OR Wi-Fi is enabled" + Composing a rule "when the battery level becomes critical, + if GPS OR Wi-Fi is enabled" */ context_trigger_rule_h disjunction_rule; context_trigger_rule_create(CONTEXT_TRIGGER_LOGICAL_DISJUNCTION, &disjunction_rule); @@ -339,50 +339,50 @@ context_trigger_rule_set_action_notification(disjunction_rule, ...);
    6. Combining attributes into an event or condition -

      Some event and condition items provide multiple attributes. The logical connection between attributes must be set properly to fulfill the requirement. For example, when you use CONTEXT_TRIGGER_EVENT_TIME to define a rule "at 4 PM every Monday", the comparisons regarding the 2 attributes, CONTEXT_TRIGGER_TIME_OF_DAY and CONTEXT_TRIGGER_DAY_OF_WEEK must be satisfied together.

      +

      Some event and condition items provide multiple attributes. The logical connection between attributes must be set properly to fulfill the requirement. For example, when you use CONTEXT_TRIGGER_EVENT_TIME to define a rule "at 4 PM every Monday", the comparisons regarding the 2 attributes, CONTEXT_TRIGGER_TIME_OF_DAY and CONTEXT_TRIGGER_DAY_OF_WEEK must be satisfied together.

      On the contrary, using CONTEXT_TRIGGER_APP_USE_FREQUENCY, if you want to check whether a specific application belongs to the 5 most frequently used applications, or the application was used at least 10 times, both comparisons against CONTEXT_TRIGGER_RANK and CONTEXT_TRIGGER_TOTAL_COUNT must be connected by a logical disjunction.

      The following example illustrates the cases described above:

      -/* Composing an event "at 4 PM every Monday" */
+/* Composing an event "at 4 PM every Monday" */
 context_trigger_rule_entry_h time_event;
 context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_TIME,
-                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                  &time_event);
+                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                  &time_event);
 context_trigger_rule_entry_add_key(time_event, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_TIME_OF_DAY);
+                                   CONTEXT_TRIGGER_TIME_OF_DAY);
 context_trigger_rule_entry_add_comparison_int(time_event,
-                                              CONTEXT_TRIGGER_TIME_OF_DAY,
-                                              CONTEXT_TRIGGER_EQUAL_TO, 960);
+                                              CONTEXT_TRIGGER_TIME_OF_DAY,
+                                              CONTEXT_TRIGGER_EQUAL_TO, 960);
 context_trigger_rule_entry_add_key(time_event, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_DAY_OF_WEEK);
+                                   CONTEXT_TRIGGER_DAY_OF_WEEK);
 context_trigger_rule_entry_add_comparison_string(time_event,
-                                                 CONTEXT_TRIGGER_DAY_OF_WEEK,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_MON);
+                                                 CONTEXT_TRIGGER_DAY_OF_WEEK,
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_MON);
 
 /*
-   Composing a condition "if an application belongs to the 5,
-   most frequently used apps or is used at least 10 times per day"
+   Composing a condition "if an application belongs to the 5,
+   most frequently used apps or is used at least 10 times per day"
 */
 context_trigger_rule_entry_h app_condition;
 context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_APP_USE_FREQUENCY,
-                                      CONTEXT_TRIGGER_LOGICAL_DISJUNCTION,
-                                      &app_condition);
+                                      CONTEXT_TRIGGER_LOGICAL_DISJUNCTION,
+                                      &app_condition);
 context_trigger_rule_entry_add_option_string(app_condition,
-                                             CONTEXT_TRIGGER_APP_ID, /* App ID */);
+                                             CONTEXT_TRIGGER_APP_ID, /* App ID */);
 context_trigger_rule_entry_add_key(app_condition, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_RANK);
+                                   CONTEXT_TRIGGER_RANK);
 context_trigger_rule_entry_add_comparison_int(app_condition, CONTEXT_TRIGGER_RANK,
-                                              CONTEXT_TRIGGER_LESS_THAN_OR_EQUAL_TO,
-                                              5);
+                                              CONTEXT_TRIGGER_LESS_THAN_OR_EQUAL_TO,
+                                              5);
 context_trigger_rule_entry_add_key(app_condition,
-                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_TOTAL_COUNT);
+                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                   CONTEXT_TRIGGER_TOTAL_COUNT);
 context_trigger_rule_entry_add_comparison_int(app_condition,
-                                              CONTEXT_TRIGGER_TOTAL_COUNT,
-                                              CONTEXT_TRIGGER_GREATER_THAN_OR_EQUAL_TO,
-                                              10);
+                                              CONTEXT_TRIGGER_TOTAL_COUNT,
+                                              CONTEXT_TRIGGER_GREATER_THAN_OR_EQUAL_TO,
+                                              10);
    7. Combining comparisons into an attribute @@ -390,39 +390,39 @@ context_trigger_rule_entry_add_comparison_int(app_condition,

      Similarly as above, regarding an attribute, you can combine multiple comparisons in different ways. For example, if you want to check that the battery level is full or high, use a logical disjunction. If you also want to check whether the current time is between 18:30 and 21:30, use a logical conjunction. The following example illustrates how to compose such conditions:

      -/* Composing a condition "if the battery level is full or high" */
+/* Composing a condition "if the battery level is full or high" */
 context_trigger_rule_entry_h battery_condition;
 context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_BATTERY,
-                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                      &battery_condition);
+                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                      &battery_condition);
 context_trigger_rule_entry_add_key(battery_condition,
-                                   CONTEXT_TRIGGER_LOGICAL_DISJUNCTION,
-                                   CONTEXT_TRIGGER_LEVEL);
+                                   CONTEXT_TRIGGER_LOGICAL_DISJUNCTION,
+                                   CONTEXT_TRIGGER_LEVEL);
 context_trigger_rule_entry_add_comparison_string(battery_condition,
-                                                 CONTEXT_TRIGGER_LEVEL,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_FULL);
+                                                 CONTEXT_TRIGGER_LEVEL,
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_FULL);
 context_trigger_rule_entry_add_comparison_string(battery_condition,
-                                                 CONTEXT_TRIGGER_LEVEL,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_HIGH);
+                                                 CONTEXT_TRIGGER_LEVEL,
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_HIGH);
 
-/* Composing a condition "if the current time is between 18:30 and 21:30" */
+/* Composing a condition "if the current time is between 18:30 and 21:30" */
 context_trigger_rule_entry_h time_condition;
 context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_TIME,
-                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                      &time_condition);
+                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                      &time_condition);
 context_trigger_rule_entry_add_key(time_condition,
-                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_TIME_OF_DAY);
+                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                   CONTEXT_TRIGGER_TIME_OF_DAY);
 context_trigger_rule_entry_add_comparison_int(time_condition,
-                                              CONTEXT_TRIGGER_TIME_OF_DAY,
-                                              CONTEXT_TRIGGER_GREATER_THAN_OR_EQUAL_TO,
-                                              1110);
+                                              CONTEXT_TRIGGER_TIME_OF_DAY,
+                                              CONTEXT_TRIGGER_GREATER_THAN_OR_EQUAL_TO,
+                                              1110);
 context_trigger_rule_entry_add_comparison_int(time_condition,
-                                              CONTEXT_TRIGGER_TIME_OF_DAY,
-                                              CONTEXT_TRIGGER_LESS_THAN_OR_EQUAL_TO,
-                                              1290);
+                                              CONTEXT_TRIGGER_TIME_OF_DAY,
+                                              CONTEXT_TRIGGER_LESS_THAN_OR_EQUAL_TO,
+                                              1290);
      8. @@ -438,7 +438,7 @@ context_trigger_rule_entry_add_comparison_int(time_condition,

      To compose a rule:

        -
      1. Create a rule for "Notify if the battery is not charging and either Wi-Fi or GPS is enabled when the battery level becomes too low". +
      2. Create a rule for "Notify if the battery is not charging and either Wi-Fi or GPS is enabled when the battery level becomes too low".

        Create a rule handle using the context_trigger_rule_create() function. Because both Wi-Fi and GPS conditions need not be met at the same time, the rule must be created with the CONTEXT_TRIGGER_LOGICAL_DISJUNCTION operator.

         context_trigger_rule_h rule = NULL;
@@ -447,13 +447,13 @@ context_trigger_rule_create(CONTEXT_TRIGGER_LOGICAL_DISJUNCTION, &rule);
      3. Set an optional description: 
        -context_trigger_rule_set_description(rule, "Notify if the battery is not charging 
-                                            and either Wi-Fi or GPS is enabled
-                                            when the battery level becomes too low");
+context_trigger_rule_set_description(rule, "Notify if the battery is not charging
+                                            and either Wi-Fi or GPS is enabled
+                                            when the battery level becomes too low");
      - +

      Creating an Event

      To create a CONTEXT_TRIGGER_EVENT_BATTERY event to detect battery level changes:

      @@ -463,8 +463,8 @@ context_trigger_rule_set_description(rule, "Notify if the battery is not ch 
       context_trigger_rule_entry_h battery_event = NULL;
 context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_BATTERY,
-                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                  &battery_event);
+                                  CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                  &battery_event);

      While creating an event handle, the application chooses the logical operator (logical conjunction or disjunction), which is applied to combine the attribute keys for the event. In case of the CONTEXT_TRIGGER_EVENT_BATTERY event, 2 types of contextual states are provided: CONTEXT_TRIGGER_LEVEL and CONTEXT_TRIGGER_IS_CHARGING. Because the application wants to check both if the battery level becomes too low and if the battery is not charging, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION must be applied.

      @@ -473,11 +473,11 @@ context_trigger_rule_event_create(CONTEXT_TRIGGER_EVENT_BATTERY, 
       /* Add a CONTEXT_TRIGGER_LEVEL key */
 context_trigger_rule_entry_add_key(battery_event, CONTEXT_TRIGGER_LOGICAL_DISJUNCTION,
-                                   CONTEXT_TRIGGER_LEVEL);
+                                   CONTEXT_TRIGGER_LEVEL);
 
 /* Add a CONTEXT_TRIGGER_IS_CHARGING key */
 context_trigger_rule_entry_add_key(battery_event, CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_IS_CHARGING);
+                                   CONTEXT_TRIGGER_IS_CHARGING);

      The application wants to check whether the battery level becomes either low, empty, or critical. For this reason, the CONTEXT_TRIGGER_LEVEL key must be added with the CONTEXT_TRIGGER_LOGICAL_DISJUNCTION logical operator.

      @@ -486,23 +486,23 @@ context_trigger_rule_entry_add_key(battery_event, CONTEXT_TRIGGER_LOGICAL_CONJUN 
       /* Add the comparison values for the CONTEXT_TRIGGER_LEVEL key */
 context_trigger_rule_entry_add_comparison_string(battery_event,
-                                                 CONTEXT_TRIGGER_LEVEL,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_LOW);
+                                                 CONTEXT_TRIGGER_LEVEL,
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_LOW);
 context_trigger_rule_entry_add_comparison_string(battery_event,
-                                                 CONTEXT_TRIGGER_LEVEL,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_CRITICAL);
+                                                 CONTEXT_TRIGGER_LEVEL,
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_CRITICAL);
 context_trigger_rule_entry_add_comparison_string(battery_event,
-                                                 CONTEXT_TRIGGER_LEVEL,
-                                                 CONTEXT_TRIGGER_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_EMPTY);
+                                                 CONTEXT_TRIGGER_LEVEL,
+                                                 CONTEXT_TRIGGER_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_EMPTY);
 
 /* Add a comparison value for the CONTEXT_TRIGGER_IS_CHARGING key */
 context_trigger_rule_entry_add_comparison_int(battery_event,
-                                              CONTEXT_TRIGGER_IS_CHARGING,
-                                              CONTEXT_TRIGGER_EQUAL_TO,
-                                              CONTEXT_TRIGGER_FALSE);
+                                              CONTEXT_TRIGGER_IS_CHARGING,
+                                              CONTEXT_TRIGGER_EQUAL_TO,
+                                              CONTEXT_TRIGGER_FALSE);
    8. Add the event entry to the rule: @@ -528,38 +528,38 @@ context_trigger_rule_entry_destroy(battery_event); /* Create a Wi-Fi condition */ context_trigger_rule_entry_h wifi_condition = NULL; context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_WIFI, -                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                      &wifi_condition); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + &wifi_condition); /* Create a GPS condition */ context_trigger_rule_entry_h gps_condition = NULL; context_trigger_rule_condition_create(CONTEXT_TRIGGER_CONDITION_GPS, -                                      CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, -                                      &gps_condition); + CONTEXT_TRIGGER_LOGICAL_CONJUNCTION, + &gps_condition);
    9. Add the attribute key with the context_trigger_rule_entry_add_key() function to specify the comparison terms for each condition: 
       context_trigger_rule_entry_add_key(wifi_condition,
-                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_STATE);
+                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                   CONTEXT_TRIGGER_STATE);
 context_trigger_rule_entry_add_key(gps_condition,
-                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
-                                   CONTEXT_TRIGGER_STATE);
+                                   CONTEXT_TRIGGER_LOGICAL_CONJUNCTION,
+                                   CONTEXT_TRIGGER_STATE);
      10. -
    10. Add a comparison operator and value for the attribute key. +
    11. Add a comparison operator and value for the attribute key.

      Use the context_trigger_rule_entry_add_comparison_int(), context_trigger_rule_entry_add_string(), or context_trigger_rule_entry_add() function, depending on the data type.

      In the following example, the conditions for Wi-Fi and GPS are that they are enabled.

       context_trigger_rule_entry_add_comparison_string(wifi_condition,
-                                                 CONTEXT_TRIGGER_STATE,
-                                                 CONTEXT_TRIGGER_NOT_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_DISABLED);
+                                                 CONTEXT_TRIGGER_STATE,
+                                                 CONTEXT_TRIGGER_NOT_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_DISABLED);
 context_trigger_rule_entry_add_comparison_string(gps_condition,
-                                                 CONTEXT_TRIGGER_STATE,
-                                                 CONTEXT_TRIGGER_NOT_EQUAL_TO,
-                                                 CONTEXT_TRIGGER_DISABLED);
+                                                 CONTEXT_TRIGGER_STATE,
+                                                 CONTEXT_TRIGGER_NOT_EQUAL_TO,
+                                                 CONTEXT_TRIGGER_DISABLED);
    12. Add the conditions to the rule handle: @@ -598,18 +598,18 @@ context_trigger_rule_set_action_app_control(rule, app);
    13. To register a notification posting request: 
      -context_trigger_rule_set_action_notification(rule, "Battery Alert",
-                                             "Battery is getting low. To save your
-                                              battery, turn off Wi-Fi or GPS",
-                                             NULL, NULL);
+context_trigger_rule_set_action_notification(rule, "Battery Alert",
+                                             "Battery is getting low. To save your
+                                              battery, turn off Wi-Fi or GPS",
+                                             NULL, NULL);

      The Contextual Trigger API supports the basic notification type only. A notification can contain a title, content body text, an icon, and an application control to be executed.

      14. - +

      Managing Rules

      - +

      To manage the rules:

      1. To register a rule: @@ -631,23 +631,23 @@ context_trigger_destroy(rule);

      2. To enable and disable a rule:

          -
        • +

        • Enable the rule explicitly with its rule ID:

           context_trigger_enable_rule(rule_id);

          Note that a rule can be managed only by the application that has registered the rule.

          -
          • -
        • +
          • +

        • Disable the rule with its rule ID:

           context_trigger_disable_rule(rule_id);
          • -
        +
        3. -
      3. To remove a rule: +
      4. To remove a rule:

        When no longer needed, delete the rule with the context_trigger_remove_rule() function. Only disabled rules can be deleted.

         context_trigger_remove_rule(rule_id);
@@ -657,7 +657,7 @@ context_trigger_remove_rule(rule_id);
 
 
        Retrieving Rules
        
 
-
        This use case shows how to query the application's own rule IDs, disable the enabled rules, and remove all the rules. Only the owner application can enable, disable, remove, and retrieve the rules.
        
+
        This use case shows how to query the application's own rule IDs, disable the enabled rules, and remove all the rules. Only the owner application can enable, disable, remove, and retrieve the rules.
        
 
 
        To retrieve all rules:
        
 
          
@@ -672,7 +672,7 @@ context_trigger_get_own_rule_ids(&enabled_rule_ids, &enabled_count, NULL
 /* Disable the enabled rules */
 int i = 0;
 for (i = 0; i < enabled_count; i++)
-    context_trigger_disable_rule(enabled_rule_ids[i]);
+    context_trigger_disable_rule(enabled_rule_ids[i]);
      5. Retrieve all the disabled rules owned by the application and remove them: @@ -684,19 +684,19 @@ context_trigger_get_own_rule_ids(NULL, NULL, &disabled_rule_ids, &disabl /* Remove the disabled rules */ for (i = 0; i < disabled_count; i++) -    context_trigger_remove_rule(disabled_rule_ids[i]); + context_trigger_remove_rule(disabled_rule_ids[i]);
      6. Free the memory allocated for the enabled and disabled rules: 
         if (enabled_rule_ids) {
-    free(enabled_rule_ids);
-    enabled_rule_ids = NULL;
+    free(enabled_rule_ids);
+    enabled_rule_ids = NULL;
 }
 
 if (disabled_rule_ids) {
-    free(disabled_rule_ids);
-    disabled_rule_ids = NULL;
+    free(disabled_rule_ids);
+    disabled_rule_ids = NULL;
 }
        7. diff --git a/org.tizen.guides/html/native/app_management/app_communication_n.htm b/org.tizen.guides/html/native/app_management/app_communication_n.htm index 728f67a..c78ab5e 100644 --- a/org.tizen.guides/html/native/app_management/app_communication_n.htm +++ b/org.tizen.guides/html/native/app_management/app_communication_n.htm @@ -5,13 +5,13 @@ - + - Application Data Exchange + Application Data Exchange @@ -27,7 +27,7 @@
      7. Tizen 2.3.1 and Higher for Wearable
    -
    +

    Application Data Exchange

    @@ -49,7 +49,7 @@

    You can package data with a bundle, which is a string-based dictionary abstract data type. You can create bundles, manage their content, access their content through iteration, and encode and decode them.

    - +
    diff --git a/org.tizen.guides/html/native/app_management/app_controls_n.htm b/org.tizen.guides/html/native/app_management/app_controls_n.htm index ecb6f61..c12a6aa 100644 --- a/org.tizen.guides/html/native/app_management/app_controls_n.htm +++ b/org.tizen.guides/html/native/app_management/app_controls_n.htm @@ -5,20 +5,20 @@ - + - Application Controls - + Application Controls + - +

    Mobile native Wearable native

    - +
    -

    Application Controls

    +

    Application Controls

    -

    An application control (app control) is a way of sharing an application's functionality with other applications. To use another application's features through application controls reduces your efforts and time to develop your application.

    +

    An application control (app control) is a way of sharing an application's functionality with other applications. To use another application's features through application controls reduces your efforts and time to develop your application.

    An application can be launched by the user from the launcher or by another application through the application control. The application control launch request describes either an action to be performed by other applications, or the results of that action. The application can also receive results from the launched application through an application control reply.

    @@ -74,15 +74,15 @@

    Launch Types

    You can launch an application with an application control using 2 different launch types:

    -
      -
    • Explicit launch: +
        +
      • Explicit launch:

        Explicit launch means that you launch a specific application with the application ID. When you request an explicit launch:

        • If the underlying application launcher framework finds an application matched with the given application ID in the installed application list, it launches the application in a new process. If the matched application is not found, the framework returns the APP_CONTROL_ERROR_APP_NOT_FOUND result. Additional information (such as operation, URI, or MIME type) is not used to select an application for an explicit launch.
        • If the operation setting in the app_control handle is set to APP_CONTROL_OPERATION_DEFAULT, the application ID must be set. Otherwise the APP_CONTROL_ERROR_INVALID_PARAMETER result is returned.
          • -
        - +
      +
      Note Be careful when using the explicit launch, because if the target application does not exist in the device, you need to handle the APP_CONTROL_ERROR_APP_NOT_FOUND error. If you want to launch any application that supports a certain operation, use the implicit launch. @@ -131,18 +131,18 @@ #include <app.h> #include <dlog.h> -#define TAG "MY_TAG" +#define TAG "MY_TAG" app_control_h app_control; app_control_create(&app_control); app_control_set_operation(app_control, APP_CONTROL_OPERATION_DEFAULT); -app_control_set_app_id(app_control, "org.tizen.calculator"); +app_control_set_app_id(app_control, "org.tizen.calculator"); if (app_control_send_launch_request(app_control, NULL, NULL) == APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_INFO, TAG, "Succeeded to launch a calculator app."); + dlog_print(DLOG_INFO, TAG, "Succeeded to launch a calculator app."); else -    dlog_print(DLOG_ERROR, TAG, "Failed to launch a calculator app."); + dlog_print(DLOG_ERROR, TAG, "Failed to launch a calculator app."); app_control_destroy(app_control); @@ -157,17 +157,17 @@ app_control_destroy(app_control); #include <app.h> #include <dlog.h> -#define TAG "MY_TAG" +#define TAG "MY_TAG" app_control_h app_control; app_control_create(&app_control); app_control_set_operation(app_control, APP_CONTROL_OPERATION_CREATE_CONTENT); -app_control_set_mime(app_control, "image/jpg"); +app_control_set_mime(app_control, "image/jpg"); if (app_control_send_launch_request(app_control, NULL, NULL) == APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_INFO, TAG, "Succeeded to launch a viewer app."); + dlog_print(DLOG_INFO, TAG, "Succeeded to launch a viewer app."); else -    dlog_print(DLOG_ERROR, TAG, "Failed to launch a viewer app."); + dlog_print(DLOG_ERROR, TAG, "Failed to launch a viewer app."); app_control_destroy(app_control); @@ -178,19 +178,19 @@ app_control_destroy(app_control); #include <app.h> #include <dlog.h> -#define TAG "MY_TAG" +#define TAG "MY_TAG" app_control_h app_control; app_control_create(&app_control); app_control_set_operation(app_control, APP_CONTROL_OPERATION_VIEW); -app_control_set_uri(app_control, "file:///home/myhome/Photos/1_photo.jpg"); -app_control_set_mime(app_control, "image/*"); +app_control_set_uri(app_control, "file:///home/myhome/Photos/1_photo.jpg"); +app_control_set_mime(app_control, "image/*"); if (app_control_send_launch_request(app_control, NULL, NULL) == APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_INFO, TAG, "Succeeded to launch a viewer app."); + dlog_print(DLOG_INFO, TAG, "Succeeded to launch a viewer app."); else -    dlog_print(DLOG_ERROR, TAG, "Failed to launch a viewer app."); + dlog_print(DLOG_ERROR, TAG, "Failed to launch a viewer app."); app_control_destroy(app_control); @@ -198,8 +198,8 @@ app_control_destroy(app_control);

    Determining the Application for an Implicit Launch Request

    - -

    In case of an implicit launch, the platform determines which application to launch by "resolving the application control". This means that the platform considers the given conditions (operation, URI, and MIME type) in the launch request, searches the filters (installed applications with available application controls) in the device, and attempts to find a match.

    + +

    In case of an implicit launch, the platform determines which application to launch by "resolving the application control". This means that the platform considers the given conditions (operation, URI, and MIME type) in the launch request, searches the filters (installed applications with available application controls) in the device, and attempts to find a match.

    The launch request conditions are matched to the available filters using the following logic:

    @@ -209,11 +209,11 @@ app_control_destroy(app_control);
  • If the launch request has URI or MIME types as a condition, the comparison is done only among the filters that have URI or MIME types. For example, if the launch request has a URI, but a filter does not, that filter is not added to the result even if the operations are the same. Similarly, if the launch request has MIME types, it is not compared to the filters that have no MIME types. -

    An exception is applied to the URIs with a "file" scheme for the value. If the launch request URI contains an existing file path and no MIME types are supplied, the filters that have the MIME type of the given file path are also added to the results.

    +

    An exception is applied to the URIs with a "file" scheme for the value. If the launch request URI contains an existing file path and no MIME types are supplied, the filters that have the MIME type of the given file path are also added to the results.

    Note - A filter (application) that expects to match with any form of URI and any type of MIME must use '*' and */* in their application control information in the tizen-manifest.xml file, instead of leaving the value to NULL. Otherwise, the application is discarded by the platform when the application control is resolved. + A filter (application) that expects to match with any form of URI and any type of MIME must use '*' and */* in their application control information in the tizen-manifest.xml file, instead of leaving the value to NULL. Otherwise, the application is discarded by the platform when the application control is resolved.
    • @@ -230,7 +230,7 @@ app_control_destroy(app_control);
  • The MIME type match can be an exact or pattern match according to the value in the filters. MIME type filters are matched with the launch request if:
    • Both MIME types are exactly the same.
      • -
    • MIME type in the launch request and filters has the same type and '*' for the subtype.
      • +
    • MIME type in the launch request and filters has the same type and '*' for the subtype.
    • The filters have */* for the MIME type.
    • @@ -513,112 +513,112 @@ app_control_destroy(app_control);
    1. Like a conventional Linux application, the main function of the application is its entry point. In the Tizen application, the main task is to hand over control to the application framework by calling the ui_app_main() function: - + 
      -bool 
+bool
 app_create(void *user_data)
 {
-    /*
-       Take necessary actions before the main event loop starts
-       Initialize UI resources and application data
-       If this function returns true, the application main loop starts
-       If this function returns false, the application terminates
-    */
-    return true;
+    /*
+       Take necessary actions before the main event loop starts
+       Initialize UI resources and application data
+       If this function returns true, the application main loop starts
+       If this function returns false, the application terminates
+    */
+    return true;
 }
 
 void
 app_control(app_control_h app_control, void *user_data)
 {
-    /* Handle the launch request */
+    /* Handle the launch request */
 }
 
 void
 app_pause(void *user_data)
 {
-    /* Take necessary actions when application becomes invisible */
+    /* Take necessary actions when application becomes invisible */
 }
 
 void
 app_resume(void *user_data)
 {
-    /* Take necessary actions when application becomes visible */
+    /* Take necessary actions when application becomes visible */
 }
 
 void
 app_terminate(void *user_data)
 {
-    /* Release all resources */
+    /* Release all resources */
 }
 
 int
 main(int argc, char *argv[])
 {
-    struct appdata ad;
+    struct appdata ad;
 
-    ui_app_lifecycle_callback_s event_callback;
+    ui_app_lifecycle_callback_s event_callback;
 
-    event_callback.create = app_create;
-    event_callback.app_control = app_control;
-    event_callback.pause = app_pause;
-    event_callback.resume = app_resume;
-    event_callback.terminate = app_terminate;
+    event_callback.create = app_create;
+    event_callback.app_control = app_control;
+    event_callback.pause = app_pause;
+    event_callback.resume = app_resume;
+    event_callback.terminate = app_terminate;
 
-    memset(&ad, 0x0, sizeof(struct appdata));
+    memset(&ad, 0x0, sizeof(struct appdata));
 
-    return ui_app_main(argc, argv, &event_callback, &ad);
+    return ui_app_main(argc, argv, &event_callback, &ad);
 }
    2. The ui_app_main() function initializes the application and starts the main loop.

      It takes 4 parameters and uses them to initialize the application. The argc and argv parameters contain the values from the application framework, and you must never change their values. The third parameter is a state transition handler that is responsible for managing the state transitions the application goes through while it is running. The fourth parameter is application data to be passed to each state handler.

      3. -
    3. When the ui_app_main() is first invoked, the application moves from the ready state to the created state, and must initialize itself. During this transition, the application framework calls the application's app_create_cb() state transition callback just before the application enters the main loop. Within the registered callback, you must initialize the application resources and create the main window. +
    4. When the ui_app_main() is first invoked, the application moves from the ready state to the created state, and must initialize itself. During this transition, the application framework calls the application's app_create_cb() state transition callback just before the application enters the main loop. Within the registered callback, you must initialize the application resources and create the main window.

      If the app_create_cb() callback function returns false, the application moves to the terminated state. If it returns true, the application enters the main loop.

      5. -
    5. Just after the application enters the main loop, the application framework calls the application's app_control_cb() callback. +
    6. Just after the application enters the main loop, the application framework calls the application's app_control_cb() callback.

      The callback is passed to the app_control handle containing the reason why the application was launched. For example, the application can be launched to open a file to handle the request that has been sent by other application. The application is always responsible for checking the content of the app_control handle and responding appropriately. The content of the app_control handle can be empty, if the application is launched by the user from the launcher.

      If the application wants to return the result of the application control operation to the application that originally sent the launch request, the result can be sent with the app_control_reply_to_launch_request() function.

      -static void 
+static void
 app_control(app_control_h app_control, void *user_data)
 {
-    struct appdata *ad = (struct appdata *)user_data;
-    char *operation;
-    char *uri;
-    char *mime_type;
-    app_control_h reply;
-    char *app_id;
-
-    app_control_get_operation(app_control, &operation);
-
-    if (!strcmp(operation, APP_CONTROL_OPERATION_VIEW)) {
-        app_control_get_uri(app_control, &uri);
-        app_control_get_mime(app_control, &mime_type);
-
-        if (uri && !strcmp(mime_type, "image/jpg"))
-            display_image_file(ad, uri); /* Display a specific image file */
-    }
-
-    if (!strcmp(operation, APP_CONTROL_OPERATION_CREATE_CONTENT)) {
-        app_control_get_mime(app_control, &mime_type);
-
-        if (!strcmp(mime_type, "text/plain")) {
-            app_control_create(&reply);
-
-            app_get_app_id(&app_id);
-            /* Set the value of APP_CONTROL_DATA_SELECTED to give to caller */
-            app_control_add_extra_data(reply, APP_CONTROL_DATA_SELECTED, app_id);
-            /* Reply to caller */
-            app_control_reply_to_launch_request(reply, app_control,
-                                                APP_CONTROL_RESULT_SUCCEEDED);
-
-            app_control_destroy(reply);
-        }
-    }
+    struct appdata *ad = (struct appdata *)user_data;
+    char *operation;
+    char *uri;
+    char *mime_type;
+    app_control_h reply;
+    char *app_id;
+
+    app_control_get_operation(app_control, &operation);
+
+    if (!strcmp(operation, APP_CONTROL_OPERATION_VIEW)) {
+        app_control_get_uri(app_control, &uri);
+        app_control_get_mime(app_control, &mime_type);
+
+        if (uri && !strcmp(mime_type, "image/jpg"))
+            display_image_file(ad, uri); /* Display a specific image file */
+    }
+
+    if (!strcmp(operation, APP_CONTROL_OPERATION_CREATE_CONTENT)) {
+        app_control_get_mime(app_control, &mime_type);
+
+        if (!strcmp(mime_type, "text/plain")) {
+            app_control_create(&reply);
+
+            app_get_app_id(&app_id);
+            /* Set the value of APP_CONTROL_DATA_SELECTED to give to caller */
+            app_control_add_extra_data(reply, APP_CONTROL_DATA_SELECTED, app_id);
+            /* Reply to caller */
+            app_control_reply_to_launch_request(reply, app_control,
+                                                APP_CONTROL_RESULT_SUCCEEDED);
+
+            app_control_destroy(reply);
+        }
+    }
 }
      @@ -635,21 +635,21 @@ app_control(app_control_h app_control, void *user_data) #include <app.h> #include <dlog.h> -#define TAG "MY_TAG" +#define TAG "MY_TAG" app_control_h app_control; app_control_create(&app_control); app_control_set_operation(app_control, APP_CONTROL_OPERATION_CREATE_CONTENT); -app_control_set_mime(app_control, "text/plain"); +app_control_set_mime(app_control, "text/plain"); /* Set callback function, app_control_result, to get the launch result */ if (app_control_send_launch_request(app_control, app_control_result, NULL) -    == APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_INFO, TAG, "Succeeded: the application is launched."); + == APP_CONTROL_ERROR_NONE) + dlog_print(DLOG_INFO, TAG, "Succeeded: the application is launched."); else -    dlog_print(DLOG_ERROR, TAG, "Failed to launch an application."); + dlog_print(DLOG_ERROR, TAG, "Failed to launch an application."); app_control_destroy(app_control); @@ -661,26 +661,26 @@ app_control_destroy(app_control); #include <app.h> #include <dlog.h> -#define TAG "MY_TAG" +#define TAG "MY_TAG" /* Callback function to get result */ static void app_control_result(app_control_h request, app_control_h reply, app_control_result_e result, -                   void *user_data) + void *user_data) { -    char *value; - -    if (result == APP_CONTROL_RESULT_SUCCEEDED) { -        /* Get the value of APP_CONTROL_DATA_SELECTED sent by callee */ -        if (app_control_get_extra_data(reply, APP_CONTROL_DATA_SELECTED, &value) -            == APP_CONTROL_ERROR_NONE) -            dlog_print(DLOG_INFO, TAG, -                       "[app_control_result_cb] Succeeded: value(%s)", value); -        else -            dlog_print(DLOG_ERROR, TAG, "[app_control_result_cb] Failed"); -    } else { -        dlog_print(DLOG_ERROR, TAG, "[app_control_result_cb] APP_CONTROL_RESULT_FAILED."); -    } + char *value; + + if (result == APP_CONTROL_RESULT_SUCCEEDED) { + /* Get the value of APP_CONTROL_DATA_SELECTED sent by callee */ + if (app_control_get_extra_data(reply, APP_CONTROL_DATA_SELECTED, &value) + == APP_CONTROL_ERROR_NONE) + dlog_print(DLOG_INFO, TAG, + "[app_control_result_cb] Succeeded: value(%s)", value); + else + dlog_print(DLOG_ERROR, TAG, "[app_control_result_cb] Failed"); + } else { + dlog_print(DLOG_ERROR, TAG, "[app_control_result_cb] APP_CONTROL_RESULT_FAILED."); + } } @@ -689,12 +689,12 @@ app_control_result(app_control_h request, app_control_h reply, app_control_resul

      You can allow other applications to launch your application and use your application features through application controls by exporting your application control functionalities. To allow other applications to launch your application implicitly without the application ID, declare your application control information in the tizen-manifest.xml file:

       <app-control>
-   <mime name="application/xhtml+xml"/>
-   <operation name="http://tizen.org/appcontrol/operation/view"/>
-   <uri name="http://test.com"/>
+   <mime name="application/xhtml+xml"/>
+   <operation name="http://tizen.org/appcontrol/operation/view"/>
+   <uri name="http://test.com"/>
 </app-control>
 <app-control>
-   <operation name="http://tizen.org/appcontrol/operation/call"/>
+   <operation name="http://tizen.org/appcontrol/operation/call"/>
 </app-control>
      @@ -708,12 +708,12 @@ app_control_result(app_control_h request, app_control_h reply, app_control_resul
      Note - The URI or MIME type can contain wildcards, such as '*', to match against given conditions in the app control: + The URI or MIME type can contain wildcards, such as '*', to match against given conditions in the app control:
      • In the MIME type, you can use 2 types of wildcards: image/* and */*.
        • -
      • In the URI, a more complex pattern of wildcards with similar semantics as the standard glob() function is available: '*' matches an arbitrary, possibly empty, string, and '?' matches an arbitrary character. Unlike in the glob() function, the '/' character can be matched by the wildcards. There are no [...] character ranges, and the wildcards '*' and '?' cannot be escaped to include them literally in a pattern.
      +
    7. In the URI, a more complex pattern of wildcards with similar semantics as the standard glob() function is available: '*' matches an arbitrary, possibly empty, string, and '?' matches an arbitrary character. Unlike in the glob() function, the '/' character can be matched by the wildcards. There are no [...] character ranges, and the wildcards '*' and '?' cannot be escaped to include them literally in a pattern.
    -

    You can specify the application control information of your application in the application project settings in the Tizen Studio.

    +

    You can specify the application control information of your application in the application project settings in the Tizen Studio.

    Application Group Management

    You can define the application launch mode and group your applications into entities that can be managed together.

    @@ -724,15 +724,15 @@ app_control_result(app_control_h request, app_control_h reply, app_control_resul

    When an application is launched through an app control, its launch mode defines its behavior:

    • The single launch mode means that the application is launched as a main application (in a new group).
    • The caller launch mode means that the application is launched as a sub application belonging to the same group as the caller application who is causing the application to be launched.
    -

    You can set the application launch mode in the manifest file using the launch_mode attribute of the <ui-application> element. If the launch mode is set to caller, the application that calls the app control can define the launch mode for the called application using the app_control_set_launch_mode() function. However, if the called application has set its launch mode in its manifest file to single, that setting overrides the caller application's launch mode request.

    +

    You can set the application launch mode in the manifest file using the launch_mode attribute of the <ui-application> element. If the launch mode is set to caller, the application that calls the app control can define the launch mode for the called application using the app_control_set_launch_mode() function. However, if the called application has set its launch mode in its manifest file to single, that setting overrides the caller application's launch mode request.

  • Managing the application group

    Applications in a same group act as if they are in 1 stack. For example, if application A wants to send an email using email application B, the application A can launch the email application B, making the email application B a sub application in the same group as the application A. When both applications are running, and the user presses the home button, both applications are hidden. When the user later resumes the caller application (application A), the email application B is shown on top of the caller application.

    If an application is launched in a group, it can be terminated by the main (first) application in the group. If the main application is terminated or killed, the sub applications in the group are terminated automatically (they can be terminated by the framework even if they are hidden).

    Figure: Group behavior

    -

    Group behavior

    - +

    Group behavior

    +
    • @@ -743,7 +743,7 @@ app_control_result(app_control_h request, app_control_h reply, app_control_resul

    To use the App Control API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
+   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
 </privileges>
    @@ -765,7 +765,7 @@ app_control_result(app_control_h request, app_control_h reply, app_control_resul 
     ret = app_control_create(&app);
 if (ret != APP_CONTROL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_create() failed. err = %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_create() failed. err = %d", ret);
  • @@ -774,12 +774,12 @@ if (ret != APP_CONTROL_ERROR_NONE) 
     ret = app_control_set_operation(app, APP_CONTROL_OPERATION_VIEW);
 if (ret != APP_CONTROL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "app_control_set_operation() failed. err = %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "app_control_set_operation() failed. err = %d", ret);
 
-ret = app_control_set_mime(app, "image/jpeg");
+ret = app_control_set_mime(app, "image/jpeg");
 if (ret != APP_CONTROL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_set_mime() failed. err = %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_set_mime() failed. err = %d", ret);

    For more information on the common application services and the extra data related to them, see Common Application Controls.

    @@ -789,8 +789,8 @@ if (ret != APP_CONTROL_ERROR_NONE) 
     ret = app_control_add_extra_data(app, Your Message Key, message);
 if (ret != APP_CONTROL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "app_control_add_extra_data() failed. err = %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "app_control_add_extra_data() failed. err = %d", ret);
  • @@ -799,8 +799,8 @@ if (ret != APP_CONTROL_ERROR_NONE) 
     ret = app_control_send_launch_request(app, NULL, NULL);
 if (ret != APP_CONTROL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "app_control_send_launch_request() failed. err = %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "app_control_send_launch_request() failed. err = %d", ret);
    @@ -816,33 +816,33 @@ if (ret != APP_CONTROL_ERROR_NONE) bool _app_control_extra_data_cb(app_control_h app_control, const char *key, void *user_data) { -    int ret; -    char *value; + int ret; + char *value; -    ret = app_control_get_extra_data(app, key, &value); -    if (ret != APP_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "app_control_get_extra_data() failed. err = %d", ret); -    dlog_print(DLOG_DEBUG, LOG_TAG, "[value] %s", value); + ret = app_control_get_extra_data(app, key, &value); + if (ret != APP_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "app_control_get_extra_data() failed. err = %d", ret); + dlog_print(DLOG_DEBUG, LOG_TAG, "[value] %s", value); -    return true; + return true; } ret = app_control_foreach_extra_data(app, _app_control_extra_data_cb, 0); if (ret != APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "app_control_foreach_extra_data() failed. err = %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, + "app_control_foreach_extra_data() failed. err = %d", ret);
  • -

    When your work with the application control is finished, clean up. - To do this, pass the app_control handle to the +

    When your work with the application control is finished, clean up. + To do this, pass the app_control handle to the app_control_destroy() function.

     ret = app_control_destroy(app);
 if (ret != APP_CONTROL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_destroy() failed. err = %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_destroy() failed. err = %d", ret);
    • @@ -850,7 +850,7 @@ if (ret != APP_CONTROL_ERROR_NONE)

    Controlling the Launch Mode

    In this use case, the caller application has a Launch button. When it is clicked, an application control is used to launch a sub application within the same group.

    - +

    To control the launch mode:

    1. Create the UI with the Launch button: @@ -858,38 +858,38 @@ if (ret != APP_CONTROL_ERROR_NONE) static void create_base_gui(appdata_s *ad) { -    Evas_Object *bigbox; -    Evas_Object *bx; -    Evas_Object *bt; - -    ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -    elm_win_autodel_set(ad->win, EINA_TRUE); - -    evas_object_smart_callback_add(ad->win, "delete,request", -                                   win_delete_request_cb, NULL); -    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); - -    bigbox = elm_box_add(ad->win); -    evas_object_size_hint_weight_set(bigbox, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(ad->win, bigbox); -    evas_object_show(bigbox); - -    bx = elm_box_add(ad->win); -    elm_box_pack_end(bigbox, bx); -    evas_object_show(bx); - -    bt = elm_label_add(ad->win); -    elm_object_text_set(bt, "AGT3"); -    elm_box_pack_end(bx, bt); -    evas_object_show(bt); - -    bt = elm_button_add(ad->win); -    elm_object_text_set(bt, "Launch"); -    elm_box_pack_end(bx, bt); -    evas_object_show(bt); -    evas_object_smart_callback_add(bt, "clicked", button_click_cb, NULL); - -    evas_object_show(ad->win); + Evas_Object *bigbox; + Evas_Object *bx; + Evas_Object *bt; + + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_autodel_set(ad->win, EINA_TRUE); + + evas_object_smart_callback_add(ad->win, "delete,request", + win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + + bigbox = elm_box_add(ad->win); + evas_object_size_hint_weight_set(bigbox, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, bigbox); + evas_object_show(bigbox); + + bx = elm_box_add(ad->win); + elm_box_pack_end(bigbox, bx); + evas_object_show(bx); + + bt = elm_label_add(ad->win); + elm_object_text_set(bt, "AGT3"); + elm_box_pack_end(bx, bt); + evas_object_show(bt); + + bt = elm_button_add(ad->win); + elm_object_text_set(bt, "Launch"); + elm_box_pack_end(bx, bt); + evas_object_show(bt); + evas_object_smart_callback_add(bt, "clicked", button_click_cb, NULL); + + evas_object_show(ad->win); }
    2. When the button is clicked, use an application control to launch the sub application. @@ -898,21 +898,21 @@ create_base_gui(appdata_s *ad) static void button_click_cb(void *data, Evas_Object *obj, void *event_info) { -    app_control_h h; + app_control_h h; -    app_control_create(&h); -    app_control_set_operation(h, "http://tizen.org/appcontrol/operation/view"); -    app_control_set_mime(h, "application/pdf"); -    app_control_set_launch_mode(h, APP_CONTROL_LAUNCH_MODE_GROUP); -    app_control_send_launch_request(h, NULL, NULL); + app_control_create(&h); + app_control_set_operation(h, "http://tizen.org/appcontrol/operation/view"); + app_control_set_mime(h, "application/pdf"); + app_control_set_launch_mode(h, APP_CONTROL_LAUNCH_MODE_GROUP); + app_control_send_launch_request(h, NULL, NULL); -    app_control_destroy(h); + app_control_destroy(h); } static void app_control(app_control_h app_control, void *data) { -    /* Handle the launch request */ + /* Handle the launch request */ }
      3. @@ -968,4 +968,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/app_icons_n.htm b/org.tizen.guides/html/native/app_management/app_icons_n.htm index 291500f..075da11 100644 --- a/org.tizen.guides/html/native/app_management/app_icons_n.htm +++ b/org.tizen.guides/html/native/app_management/app_icons_n.htm @@ -5,20 +5,20 @@ - + - Application Icons - + Application Icons + - +

      Mobile native Wearable native

      - +

      Dependencies

        @@ -58,11 +58,11 @@
      • Adding a shortcut in mobile applications only

        You can add a shortcut to the home screen to launch an application.

      • Adding a widget in mobile applications only -

        If you have created a widget application, you can add the widget to the home screen.

        • +

        If you have created a widget application, you can add the widget to the home screen.

      -

      Figure: Badges and shortcuts

      +

      Figure: Badges and shortcuts

      Shortcuts Badges

      Prerequisites

      @@ -74,7 +74,7 @@

      To use the Badge API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

       <privileges>
-   <privilege>http://tizen.org/privilege/notification</privilege>
+   <privilege>http://tizen.org/privilege/notification</privilege>
 </privileges>
      @@ -94,7 +94,7 @@ 
       static int ret = 0;
 
-#define TEST_PKG "org.tizen.badgeapp"
+#define TEST_PKG "org.tizen.badgeapp"
    @@ -103,7 +103,7 @@ static int ret = 0;
  • To use the Shortcut API, the application has to request permission by adding the following privilege to the tizen-manifest.xml file: 
     <privileges>
-   <privilege>http://tizen.org/privilege/shortcut</privilege>
+   <privilege>http://tizen.org/privilege/shortcut</privilege>
 </privileges>
    • @@ -118,19 +118,19 @@ static int ret = 0;

    Creating and Removing a Badge

    - - -

    To create and remove badges:

    - + + +

    To create and remove badges:

    +

    • To create a badge for an application, call the badge_add() function. The parameter defines the application for which the badge is added. If the application is adding a badge for itself, the parameter can be null.

       ret = badge_add(TEST_PKG);
 if (ret != BADGE_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      -

      The application that creates the badge can also update and remove it. When applications are signed with the same certificate, they can control each other's badges.

      +

      The application that creates the badge can also update and remove it. When applications are signed with the same certificate, they can control each other's badges.

      If an application not signed with the same certificate must be allowed manage a badge, use the badge_add() function with a writable application ID. The writable application ID enables another application to control your application to manage the badge. You can also configure your application to handle the badge itself.

      • @@ -140,7 +140,7 @@ if (ret != BADGE_ERROR_NONE) 
       ret = badge_remove(TEST_PKG);
 if (ret != BADGE_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */

    Managing the Badge

    @@ -154,7 +154,7 @@ if (ret != BADGE_ERROR_NONE) unsigned int count = 0; ret = badge_get_count(TEST_PKG, &count); if (ret != BADGE_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -163,24 +163,24 @@ if (ret != BADGE_ERROR_NONE) 
     ret = badge_set_count(TEST_PKG, count+1);
 if (ret != BADGE_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    -
  • Get the display attribute and check whether the badge is visible with the badge_get_display() function. +
  • Get the display attribute and check whether the badge is visible with the badge_get_display() function.

    The parameters are the application which owns the badge, and the value of the display attribute (1 = badge is visible, 0 = badge is hidden).

     unsigned int is_displayed = false;
 ret = badge_get_display(TEST_PKG, &is_displayed);
 if (ret != BADGE_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    • -
  • Set the display attribute with the badge_set_display() function to hide or show the badge. +
  • Set the display attribute with the badge_set_display() function to hide or show the badge.

    The parameters are the application which owns the badge, and the display attribute (1 = badge is visible, 0 = badge is hidden).

     ret = badge_set_display(TEST_PKG, 1);
 if (ret != BADGE_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    • @@ -193,8 +193,8 @@ if (ret != BADGE_ERROR_NONE)

  • Add a shortcut using the shortcut_add_to_home() function:

    -shortcut_add_to_home("Music Player", LAUNCH_BY_APP, NULL, "/path/to/icon", 1,
-                     result_cb, NULL);
+shortcut_add_to_home("Music Player", LAUNCH_BY_APP, NULL, "/path/to/icon", 1,
+                     result_cb, NULL);

    The third parameter can be set to NULL to add a default icon for the application.

    @@ -211,10 +211,10 @@ shortcut_add_to_home("Music Player", LAUNCH_BY_APP, NULL, "/path/ static int result_cb(int ret, void *data) { -    if (ret < 0) -        /* Error handling */ -    else -        /* No error detected */ + if (ret < 0) + /* Error handling */ + else + /* No error detected */ }
    • @@ -226,9 +226,9 @@ result_cb(int ret, void *data)

  • Add a widget with the shortcut_add_to_home_widget() function:

    -shortcut_add_to_home_widget("alter_name", WIDGET_SIZE_1x1, "org.tizen.testwidget",
-                            "/opt/media/Pictures/alter_icon.png",
-                            -1.0f, 0, result_cb, NULL);
+shortcut_add_to_home_widget("alter_name", WIDGET_SIZE_1x1, "org.tizen.testwidget",
+                            "/opt/media/Pictures/alter_icon.png",
+                            -1.0f, 0, result_cb, NULL);

    To add a widget, you have to know the widget ID and supported sizes. The alter name and icon are shown when the widget is not available.

    • @@ -238,10 +238,10 @@ shortcut_add_to_home_widget("alter_name", WIDGET_SIZE_1x1, "org.t static int result_cb(int ret, void *data) { -    if (ret < 0) -        /* Error handling */ -    else -        /* No error detected */ + if (ret < 0) + /* Error handling */ + else + /* No error detected */ } @@ -267,4 +267,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/app_management_cover_n.htm b/org.tizen.guides/html/native/app_management/app_management_cover_n.htm index fbc94c4..db4cc28 100644 --- a/org.tizen.guides/html/native/app_management/app_management_cover_n.htm +++ b/org.tizen.guides/html/native/app_management/app_management_cover_n.htm @@ -5,13 +5,13 @@ - + - Application Management + Application Management @@ -31,7 +31,7 @@
  • Creating Applications with Content Sharing
    • -
    +

    Application Management

    @@ -61,7 +61,7 @@
  • Application Controls -

    The application controls allow you to share an application's functionality. To use another application's features through application controls reduces your efforts and time to develop your own application. You can also allow other applications to share your functionality by exporting your application control functionalities.

    • +

    The application controls allow you to share an application's functionality. To use another application's features through application controls reduces your efforts and time to develop your own application. You can also allow other applications to share your functionality by exporting your application control functionalities.

  • Application Data Exchange @@ -79,7 +79,7 @@

    You can use events to advertise your application activities, or listen to events from other applications or the system. You can broadcast events from your application to all who want to listen. You can also subscribe to events to keep track of what is happening in the system or other applications.

    • - +
    diff --git a/org.tizen.guides/html/native/app_management/app_manager_n.htm b/org.tizen.guides/html/native/app_management/app_manager_n.htm index b4d58de..4b4dfd0 100644 --- a/org.tizen.guides/html/native/app_management/app_manager_n.htm +++ b/org.tizen.guides/html/native/app_management/app_manager_n.htm @@ -5,20 +5,20 @@ - + - Application Manager - + Application Manager + - +

    Mobile native Wearable native

    - +

    Dependencies

    Related Info

    -
      + -

      Iterator functions are used to travel through a list of applications. The app_manager_foreach_app_context() function is used in running applications and the app_manager_foreach_app_info() function is used in available applications. Each function calls a callback function (app_manager_app_context_cb() or app_manager_app_info_cb()), passing the handle for each application.

      +

      Iterator functions are used to travel through a list of applications. The app_manager_foreach_app_context() function is used in running applications and the app_manager_foreach_app_info() function is used in available applications. Each function calls a callback function (app_manager_app_context_cb() or app_manager_app_info_cb()), passing the handle for each application.

      Prerequisites

      To use the functions and data types of the Application Manager API (in mobile and wearable applications), include the <app_manager.h> header file in your application:

      @@ -69,7 +69,7 @@

      To get the running application context and its details, and to operate on the context:

        -
      1. Get the context of the currently running application with the app_manager_get_app_context() function. Its parameters are the ID of the application from which the context is being obtained, and the handle (app_context_h*) to the application context which is filled with the received context. +
      2. Get the context of the currently running application with the app_manager_get_app_context() function. Its parameters are the ID of the application from which the context is being obtained, and the handle (app_context_h*) to the application context which is filled with the received context.

        When an application is not running, it is impossible to get its context.

        @@ -77,7 +77,7 @@ app_context_h app_context = NULL; int ret = app_manager_get_app_context(Your App ID, &app_context); - +

        If the function returns APP_MANAGER_ERROR_NONE, it has executed correctly and the app_context variable now contains the handle to the defined application context.

        3. @@ -102,9 +102,9 @@ bool terminated = false; ret = app_context_is_terminated(app_context, &terminated); if (false == terminated) -    /* Application is running */ + /* Application is running */ else -    /* Application is terminated */ + /* Application is terminated */

      3. Clone the given context handle:

        @@ -120,20 +120,20 @@ bool equal = false; ret = app_context_is_equal(app_context, app_context_cloned, &equal); if (equal) -    /* Contexts are equal */ + /* Contexts are equal */ else -    /* Contexts are not equal */ + /* Contexts are not equal */

  • When you no longer need the application context, call the app_context_destroy() function to remove the handle and release all resources to prevent memory leaks:

     if (app_context) {
-    ret = app_context_destroy(app_context);
-    if (APP_MANAGER_ERROR_NONE != ret)
-        /* Error handling */
+    ret = app_context_destroy(app_context);
+    if (APP_MANAGER_ERROR_NONE != ret)
+        /* Error handling */
 
-        app_context = NULL;
+        app_context = NULL;
 }
    • @@ -153,7 +153,7 @@ int ret = app_info_filter_create(&app_info_filter);
  • Add filter rules: 
    -ret = app_info_filter_add_string(app_info_filter, PACKAGE_INFO_PROP_APP_TYPE, "capp");
+ret = app_info_filter_add_string(app_info_filter, PACKAGE_INFO_PROP_APP_TYPE, "capp");
  • Call the app_info_filter_foreach_appinfo() function and use its callback to retrieve all filtered applications and print their information: @@ -162,33 +162,33 @@ ret = app_info_filter_add_string(app_info_filter, PACKAGE_INFO_PROP_APP_TYPE, &q bool filter_cb(app_info_filter_h app_info, void *user_data) { -    int ret; + int ret; -    char *app_id = NULL; + char *app_id = NULL; -    if (app_info_get_app_id(app_info, &app_id)) -        return false; + if (app_info_get_app_id(app_info, &app_id)) + return false; -    dlog_print(DLOG_INFO, TAG, "app_id \t= [%s]\n", app_id); + dlog_print(DLOG_INFO, TAG, "app_id \t= [%s]\n", app_id); -    free(app_id); + free(app_id); -    return true; + return true; } ret = app_info_filter_foreach_appinfo(filter_cb, NULL); if (ret != APP_MANAGER_ERROR_NONE) -    dlog_print(DLOG_ERROR, TAG, "foreach_app_info_filter error: %d", ret); + dlog_print(DLOG_ERROR, TAG, "foreach_app_info_filter error: %d", ret);
  • When you no longer need the filter, call the app_info_filter_destroy() function to remove the handle and release all resources: 
     if (app_info_filter_h) {
-    ret = app_info_filter_destroy(app_info_filter_h);
-    if (APP_MANAGER_ERROR_NONE != ret)
-        /* Error handling */
+    ret = app_info_filter_destroy(app_info_filter_h);
+    if (APP_MANAGER_ERROR_NONE != ret)
+        /* Error handling */
 
-        app_info_filter_h = NULL;
+        app_info_filter_h = NULL;
 }
    • @@ -215,4 +215,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/app_preferences_n.htm b/org.tizen.guides/html/native/app_management/app_preferences_n.htm index d3b0d16..9baeb1c 100644 --- a/org.tizen.guides/html/native/app_management/app_preferences_n.htm +++ b/org.tizen.guides/html/native/app_management/app_preferences_n.htm @@ -5,7 +5,7 @@ - + @@ -29,23 +29,23 @@

    Content

    Related Info

    -
    +

    Application Preferences

    -

    You can manage application preferences by setting and getting them. You can also share any stored preference data among the applications in the same package.

    +

    You can manage application preferences by setting and getting them. You can also share any stored preference data among the applications in the same package.

    Prerequisites

    @@ -78,7 +78,7 @@ 
    -const char *integer_key = "integer_key";
+const char *integer_key = "integer_key";
 int integer_value = 1;
 int integer_output;
 
@@ -99,8 +99,8 @@ preference_get_int(integer_key, &integer_output);
 
 
    Release the value returned by the get function using the free() function.
    
 
    -const char *string_key = "string_key";
-const char *string_value = "Sample content";
+const char *string_key = "string_key";
+const char *string_value = "Sample content";
 char *string_output;
 bool existing;
 
@@ -128,14 +128,14 @@ preference_set_changed_cb(integer_key, preference_changed_cb_impl, &previous
 void
 preference_changed_cb_impl(const char *key, void *user_data)
 {
-    int ret = 0;
-    int integer_output = 0;
+    int ret = 0;
+    int integer_output = 0;
 
-    dlog_print(DLOG_DEBUG, LOG_TAG, "[preference_changed_cb_impl]\n");
-    preference_get_int(key, &integer_output);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "[preference_changed_cb_impl]\n");
+    preference_get_int(key, &integer_output);
 
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Key: %s has changed its value to %d \n",
-               key, integer_output);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Key: %s has changed its value to %d \n",
+               key, integer_output);
 }
 
    
 
@@ -149,15 +149,15 @@ preference_unset_changed_cb(const char *key);
 
  • To list all records, use the foreach function. The function calls a specific callback function for each key-value pair in the database. You can pass additional data to the function in the user_data field.
 
 
    If the callback function returns false, or if all the records have been opened, the foreach function ends.
    
- 
+
 
     bool
 preference_foreach_item_cb(const char *key, void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "[preference_foreach_item_cb]\n");
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Key found: %s\n", key);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "[preference_foreach_item_cb]\n");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Key found: %s\n", key);
 
-    return true;
+    return true;
 }
 
 preference_foreach_item(preference_foreach_item_cb, NULL);
diff --git a/org.tizen.guides/html/native/app_management/app_resources_n.htm b/org.tizen.guides/html/native/app_management/app_resources_n.htm
index e71517a..f4930c3 100644
--- a/org.tizen.guides/html/native/app_management/app_resources_n.htm
+++ b/org.tizen.guides/html/native/app_management/app_resources_n.htm
@@ -5,15 +5,15 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Application Resources 
-  
+  Application Resources
+ 
  
- 
+
  
    
 	
    
 		
    Mobile native Wearable native
    
@@ -64,8 +64,8 @@
 
  • Using the resources
 
    You can use different resources (such as images, layouts, and sounds) between devices with different device specifications. For example:
    
 
      
-
    • To set a different button image for an application depending on the device's current language setting, use the app_resource_manager_get() function to get the appropriate resource file path.
      • 
-
    • To use different images depending on the device's screen resolution (DPI), use the same app_resource_manager_get() function to get the appropriate image file path.
      • 
+
    • To set a different button image for an application depending on the device's current language setting, use the app_resource_manager_get() function to get the appropriate resource file path.
      • 
+
    • To use different images depending on the device's screen resolution (DPI), use the same app_resource_manager_get() function to get the appropriate image file path.
      • 
 
    
 
    • 
 
  • Testing the resources
@@ -80,7 +80,7 @@
 
 
 
    Prerequisites
    
-	
+
 
    To use the functions and resource types of the Resource Manager API (in mobile and wearable applications), include the <app_resource_manager.h> header file in your application:
    
 
     #include <app_resource_manager.h>
@@ -121,7 +121,7 @@
 
 
    To get the appropriate resource file path in your code:
    
 
      
-
    1. Create the resource manager using the app_resource_manager_init() function. 
+
    2. Create the resource manager using the app_resource_manager_init() function.
 
       app_resource_manager_init();
 
      
@@ -130,7 +130,7 @@ app_resource_manager_init();
 
    3. Get the resource path using the app_resource_manager_get() function. You need 2 parameters:
 
 
        
-
      • Resource ID 
+
      • Resource ID
 
        The resource ID is an identifier for a specific resource. It consists of subdirectories and filenames including its extension. The same resources are located in different locations with the same filename for supporting multiple devices.
        
 
        • 
 
      • Resource type
@@ -144,18 +144,18 @@ app_resource_manager_init();
 Evas_Object *img
 char *img_path = NULL;
 
-app_resource_manager_get(APP_RESOURCE_TYPE_IMAGE, "flag.png", &img_path);
+app_resource_manager_get(APP_RESOURCE_TYPE_IMAGE, "flag.png", &img_path);
 
 Evas* canvas = evas_object_evas_get(ad->conform);
 img = evas_object_image_filled_add(canvas);
 
 if (img_path != NULL) {
-    evas_object_image_file_set(img, img_path, NULL);
+    evas_object_image_file_set(img, img_path, NULL);
 
-    evas_object_move(img, 50, 50);
-    evas_object_resize(img, 300, 200);
-    evas_object_show(img);
-    free(img_path);
+    evas_object_move(img, 50, 50);
+    evas_object_resize(img, 300, 200);
+    evas_object_show(img);
+    free(img_path);
 }
 
    
 
    If the function returns APP_RESOURCE_ERROR_NONE, the resource path has been successfully retrieved.
    
@@ -168,7 +168,7 @@ if (img_path != NULL) {
 static void
 app_terminate(void *data)
 {
-    app_resource_manager_release();
+    app_resource_manager_release();
 }
 
    • 
 
    • 
@@ -184,7 +184,7 @@ app_terminate(void *data)
 
    Connection Explorer buttons
    
 
    If the Connection Explorer view is not visible, open it: in the Tizen Studio menu, go to Window > Show View > Connection Explorer or Window > Show View > Other > Tizen > Connection Explorer.
    
 
-
  • In the Emulator Manager window, the HD Mobile emulator has already been created. 
+
  • In the Emulator Manager window, the HD Mobile emulator has already been created.
 
    Next, create an emulator instance with a WVGA resolution by clicking Create.
    
 
 
    Create a new emulator
    
@@ -245,4 +245,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga
 
 
 
-	
\ No newline at end of file
+
\ No newline at end of file
diff --git a/org.tizen.guides/html/native/app_management/applications_n.htm b/org.tizen.guides/html/native/app_management/applications_n.htm
index 9f8caf1..abebf3c 100644
--- a/org.tizen.guides/html/native/app_management/applications_n.htm
+++ b/org.tizen.guides/html/native/app_management/applications_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Applications 
-  
+  Applications
+ 
  
- 
+
  
    
 	
    
 		
    Mobile native Wearable native
    
 	
    
-	
+
 	
    
 
 
    
-
    Applications
     
+
    Applications
    
 
    A Tizen native application is similar to a conventional Linux application, with some additional features optimized for mobile and wearable devices. The additional features have constraints, such as a relatively small screen size and lack of system resources compared to a larger system. For example, for power management reasons, the application can take actions to reduce usage when it finds out that it has its display window covered over by another application window. State change events are delivered to make it possible to detect these situations.
    
 
 
    Native Application Models
    
@@ -50,7 +50,7 @@
 
      
 	
    • UI Applications
 	
      The UI application is the most general Tizen application that has a graphical user interface. You can create diverse applications with a variety of features, and design versatile applications and intriguing user interfaces with text and graphics while taking advantage of many device functionalities, such as sensors and call operations. In addition, you can, for example, manage content and media files, use network and social services, and provide messaging and embedded Web browsing functionality.
      • 
-	
+
 	
    • Service Applications
 	
      The service application is a Tizen native application without a graphical user interface that runs in the background. They can be very useful in performing activities (such as getting sensor data in the background) that need to run periodically or continuously, but do not require any user intervention.
      • 
 
    
@@ -63,7 +63,7 @@
 
 
    Applications in the same package follow the same installation life-cycle, which is handled by the application package manager. Each application in the package follows its own application life-cycle. Each application (UI application or service application) in an application package can be identified by its own ID.
    
 
-
    Native Application State Change Callbacks
     
+
    Native Application State Change Callbacks
    
 
 
    A Tizen native application can be in one of several different states. Typically, the application is launched by the user from the Launcher, or by another application. When the application is starting, the app_create_cb() function is executed and the main event loop starts. The application is normally at the top of the window, with focus.
    
 
    When the application loses the focus status, the app_pause_cb() callback is invoked. The application can go into the pause state, which means that your application is not terminated but continues to run on the background, when:
    
@@ -92,15 +92,15 @@
 
 
    The following figure shows the UI and service application states.
    
 
-  
    Figure: UI and service application states
     
-  
    UI and service application life-cycle
     
-  
+  
    Figure: UI and service application states
    
+  
    UI and service application life-cycle
    
+
 
    Because the service application has no UI, it neither has a pause state. Since Tizen 2.4, the service application can go into the suspended state. Basically, the service application is running on the background by its nature; so the platform does not allow the running of the service application unless it is designated as a background category application. However, when the UI application that is packaged with the service application is running in the foreground, the service application is also regarded as a foreground application and it can be run without a designated background category.
    
 
 
    Application state changes are managed by the underlying framework. For more information about application state transitions, see Application States and Transitions.
    
 
 
-  
+
 
 
 
@@ -125,4 +125,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga
 
 
 
-	
\ No newline at end of file
+
\ No newline at end of file
diff --git a/org.tizen.guides/html/native/app_management/common_appcontrol_n.htm b/org.tizen.guides/html/native/app_management/common_appcontrol_n.htm
index ea741b9..b340fd4 100644
--- a/org.tizen.guides/html/native/app_management/common_appcontrol_n.htm
+++ b/org.tizen.guides/html/native/app_management/common_appcontrol_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Common Application Controls 
-  
+  Common Application Controls
+ 
  
- 
+
  
    
 	
    
 		
    Mobile native Wearable native
    
 	
    
-	
+
 	
    
 
 
    
-
    Common Application Controls
     
+
    Common Application Controls
    
 
 
    An application control provides functions for launching other applications with a specific operation, URI, MIME type, and extra data. The requesting application can get a result back from the launched application. This topic introduces the common application controls that you can use.
    
 
 
    All the common application controls are supported in mobile applications, except for the Input Delegator. In Tizen 2.3.2 and higher, only the Map and Input Delegator are supported in wearable applications.
    
 
-	
+
 	  
    
         Note
         It is possible that no application suitable to receive the application control exists. In that case, before you send the launch request, verify that a suitable application exists.
@@ -104,7 +104,7 @@ app_control_h app_control;
 app_control_create(&app_control);
 
 app_control_set_operation(app_control, APP_CONTROL_OPERATION_SEARCH);
-app_control_add_extra_data(app_control, APP_CONTROL_DATA_TEXT, "tizen");
+app_control_add_extra_data(app_control, APP_CONTROL_DATA_TEXT, "tizen");
 
 app_control_send_launch_request(app_control, NULL, NULL);
 app_control_destroy(app_control);
@@ -119,8 +119,8 @@ app_control_destroy(app_control);
 
 
    Operation
    
 
    • http://tizen.org/appcontrol/operation/view (in .c files and manifest file)
      • 
-
    • APP_CONTROL_OPERATION_VIEW (in .c files only)
    	
-	
+
  • APP_CONTROL_OPERATION_VIEW (in .c files only)
    • 
+
 
    URI (Mandatory)
    
 
      
 	
    • http:<path>
      • 
@@ -143,7 +143,7 @@ app_control_h app_control;
 app_control_create(&app_control);
 
 app_control_set_operation(app_control, APP_CONTROL_OPERATION_VIEW);
-app_control_set_uri(app_control, "https://www.tizen.org");
+app_control_set_uri(app_control, "https://www.tizen.org");
 
 app_control_send_launch_request(app_control, NULL, NULL);
 app_control_destroy(app_control);
@@ -153,14 +153,14 @@ app_control_destroy(app_control);
 
 
      Adding a Calendar Event
      
 
-
      To add a new event to the user's calendar, use the APP_CONTROL_OPERATION_ADD operation with the application/vnd.tizen.calendar MIME type. To specify various event details, refer to the extras defined below.
      
+
      To add a new event to the user's calendar, use the APP_CONTROL_OPERATION_ADD operation with the application/vnd.tizen.calendar MIME type. To specify various event details, refer to the extras defined below.
      
 
 
      Figure: Adding a calendar event
      
 
      Adding a calendar event
      
 
 
      Operation
      
 
      • http://tizen.org/appcontrol/operation/add (in .c files and manifest file)
        • 
-
      • APP_CONTROL_OPERATION_ADD (in .c files only)
      	
+
    • APP_CONTROL_OPERATION_ADD (in .c files only)
    
 
    MIME Type (Mandatory)
    
 	
    application/vnd.tizen.calendar
    
 
    Extra Input
    
@@ -207,7 +207,7 @@ app_control_destroy(app_control);
 			
 		
 	
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -216,9 +216,9 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_ADD);
-app_control_set_mime(service, "application/vnd.tizen.calendar");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TITLE, "My event");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "My event text");
+app_control_set_mime(service, "application/vnd.tizen.calendar");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TITLE, "My event");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "My event text");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -226,7 +226,7 @@ app_control_send_launch_request(service, NULL, NULL);
 
 
    Editing a Calendar Event
    
 
-
    To edit an existing event in the user's calendar, use the APP_CONTROL_OPERATION_EDIT operation with the application/vnd.tizen.calendar MIME type. To specify various event details, refer to the extras defined below.
    
+
    To edit an existing event in the user's calendar, use the APP_CONTROL_OPERATION_EDIT operation with the application/vnd.tizen.calendar MIME type. To specify various event details, refer to the extras defined below.
    
 
 
    Figure: Editing a calendar event
    
 
    Editing a calendar event
    
@@ -293,10 +293,10 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_EDIT);
-app_control_set_mime(service, "application/vnd.tizen.calendar");
-app_control_add_extra_data(service, APP_CONTROL_DATA_ID, "42");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TITLE, "Edited Title");
-app_control_add_extra_data(service, APP_CONTROL_DATA_CALENDAR_ALL_DAY, "true");
+app_control_set_mime(service, "application/vnd.tizen.calendar");
+app_control_add_extra_data(service, APP_CONTROL_DATA_ID, "42");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TITLE, "Edited Title");
+app_control_add_extra_data(service, APP_CONTROL_DATA_CALENDAR_ALL_DAY, "true");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -304,7 +304,7 @@ app_control_send_launch_request(service, NULL, NULL);
 
 
    Viewing a Calendar Event
    
 
-
    To display a specified event in the user's calendar, use the APP_CONTROL_OPERATION_VIEW operation. To specify various event details, refer to the extras defined below.
    
+
    To display a specified event in the user's calendar, use the APP_CONTROL_OPERATION_VIEW operation. To specify various event details, refer to the extras defined below.
    
 
    To display a specified event from a vcalendar file, use the file: URI. To display a specified event using the calendar ID, use the application/vnd.tizen.calendar MIME type with APP_CONTROL_DATA_ID.
    
 
 
    Figure: Viewing a calendar event
    
@@ -319,7 +319,7 @@ app_control_send_launch_request(service, NULL, NULL);
 
    MIME Type
    
 	
      
 		
    • application/vnd.tizen.calendar
-		
      In case of viewing an event by an event ID, the event ID (ID in the _calendar_event view) extra data and application/vnd.tizen.calendar MIME type must be specified.
      •            
+		
      In case of viewing an event by an event ID, the event ID (ID in the _calendar_event view) extra data and application/vnd.tizen.calendar MIME type must be specified.
      
 		
    • text/x-vcalendar (for vcalendar file)
      • 
 		
    • text/vcalendar (for vcalendar file)
      • 
 	
    
@@ -345,7 +345,7 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
-app_control_set_uri(service, "file://<app's shared path>/Calendar3.vcs");
+app_control_set_uri(service, "file://<app's shared path>/Calendar3.vcs");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -356,8 +356,8 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
-app_control_set_mime(service, "application/vnd.tizen.calendar");
-app_control_add_extra_data(service, APP_CONTROL_DATA_ID, "42");
+app_control_set_mime(service, "application/vnd.tizen.calendar");
+app_control_add_extra_data(service, APP_CONTROL_DATA_ID, "42");
 
 app_control_send_launch_request(service, NULL, NULL);
 app_control_destroy(service);
@@ -365,7 +365,7 @@ app_control_destroy(service);
 
 
    Selecting a Calendar Event
    
 
-
    To select a specified event in the user's calendar, use the APP_CONTROL_OPERATION_PICK operation with the application/vnd.tizen.calendar MIME type. To specify various event details, refer to the extras defined below.
    
+
    To select a specified event in the user's calendar, use the APP_CONTROL_OPERATION_PICK operation with the application/vnd.tizen.calendar MIME type. To specify various event details, refer to the extras defined below.
    
 
    Figure: Selecting a calendar event
    
 
    Selecting a calendar event
    
 
@@ -397,7 +397,7 @@ app_control_destroy(service);
 			
 		
 	
-
    Extra Output
     
+
    Extra Output
    
 	
@@ -422,9 +422,9 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_PICK);
-app_control_set_mime(service, "application/vnd.tizen.calendar");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "id");
-app_control_add_extra_data(service, APP_CONTROL_DATA_SELECTION_MODE, "single");
+app_control_set_mime(service, "application/vnd.tizen.calendar");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "id");
+app_control_add_extra_data(service, APP_CONTROL_DATA_SELECTION_MODE, "single");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -449,14 +449,14 @@ app_control_send_launch_request(service, NULL, NULL);
 void
 launchCall()
 {
-    app_control_h request = NULL;
-    app_control_create(&request);
+    app_control_h request = NULL;
+    app_control_create(&request);
 
-    app_control_set_operation(request, APP_CONTROL_OPERATION_CALL);
-    app_control_set_uri(request, "tel:0123456789");
+    app_control_set_operation(request, APP_CONTROL_OPERATION_CALL);
+    app_control_set_uri(request, "tel:0123456789");
 
-    app_control_send_launch_request(request, NULL, NULL);
-    app_control_destroy(request);
+    app_control_send_launch_request(request, NULL, NULL);
+    app_control_destroy(request);
 }
 
 
@@ -479,14 +479,14 @@ launchCall()
 void
 launchCall()
 {
-    app_control_h request = NULL;
-    app_control_create(&request);
+    app_control_h request = NULL;
+    app_control_create(&request);
 
-    app_control_set_operation(request, APP_CONTROL_OPERATION_DIAL);
-    app_control_set_uri(request, "tel:0123456789");
+    app_control_set_operation(request, APP_CONTROL_OPERATION_DIAL);
+    app_control_set_uri(request, "tel:0123456789");
 
-    app_control_send_launch_request(request, NULL, NULL);
-    app_control_destroy(request);
+    app_control_send_launch_request(request, NULL, NULL);
+    app_control_destroy(request);
 }
 
 
@@ -519,7 +519,7 @@ launchCall()
                 
-			                   
+			
    
 		
 			
    APP_CONTROL_DATA_TOTAL_SIZE
                 The total size of items to be returned in bytes. This key must be passed as a string.
 				This key is optional.
    
 		    
 	
    
 
    Extra Output
    
@@ -534,7 +534,7 @@ launchCall()
 				The path of the created image or video file. This key must be passed as a string.
 			
 		
-	        
+	
 
    Example Code
    
 
     #include <app_control.h>
@@ -543,7 +543,7 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_CREATE_CONTENT);
-app_control_set_mime(service, "image/*");
+app_control_set_mime(service, "image/*");
 
 app_control_send_launch_request(service, NULL, NULL);
 app_control_destroy(service);
@@ -568,7 +568,7 @@ app_control_destroy(service);
 				APP_CONTROL_DATA_TOTAL_SIZE
 				The total size of items to be returned in bytes. This key must be passed as a string.
 				This key is optional.
-			                   
+			
 		
 	
 
    Extra Output
    
@@ -583,7 +583,7 @@ app_control_destroy(service);
 				The path of the created file. This key must be passed as a string.
 			
 		
-	        
+	
 
    Example Code
    
 
     #include <app_control.h>
@@ -616,7 +616,7 @@ app_control_destroy(service);
 				APP_CONTROL_DATA_TOTAL_SIZE
 				The total size of items to be returned in bytes. This key must be passed as a string.
 				This key is optional.
-			                   
+			
 		
 	
 
    Extra Output
    
@@ -631,7 +631,7 @@ app_control_destroy(service);
 				The path of the created file. This key must be passed as a string.
 			
 		
-	        
+	
 
    Example Code
    
 
     #include <app_control.h>
@@ -681,7 +681,7 @@ app_control_destroy(service);
 			
 			
 				APP_CONTROL_DATA_NAME
-				The contact's name. This key must be passed as a string.
+				The contact's name. This key must be passed as a string.
 			
 		
 	
@@ -704,11 +704,11 @@ app_control_h request;
 app_control_create(&request);
 
 app_control_set_operation(request, APP_CONTROL_OPERATION_ADD);
-app_control_set_mime(request, "application/vnd.tizen.contact");
+app_control_set_mime(request, "application/vnd.tizen.contact");
 
-app_control_add_extra_data(request, APP_CONTROL_DATA_PHONE, "0123456789");
-app_control_add_extra_data(request, APP_CONTROL_DATA_EMAIL, "tizen@tizen.org");
-app_control_add_extra_data(request, APP_CONTROL_DATA_NAME, "Tizen User");
+app_control_add_extra_data(request, APP_CONTROL_DATA_PHONE, "0123456789");
+app_control_add_extra_data(request, APP_CONTROL_DATA_EMAIL, "tizen@tizen.org");
+app_control_add_extra_data(request, APP_CONTROL_DATA_NAME, "Tizen User");
 
 app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
 
@@ -777,12 +777,12 @@ app_control_h request;
 app_control_create(&request);
 
 app_control_set_operation(request, APP_CONTROL_OPERATION_EDIT);
-app_control_set_mime(request, "application/vnd.tizen.contact");
+app_control_set_mime(request, "application/vnd.tizen.contact");
 
 app_control_add_extra_data(request, APP_CONTROL_DATA_ID, personId);
 
-app_control_add_extra_data(request, APP_CONTROL_DATA_PHONE, "0987654321");
-app_control_add_extra_data(request, APP_CONTROL_DATA_EMAIL, "2nd Email");
+app_control_add_extra_data(request, APP_CONTROL_DATA_PHONE, "0987654321");
+app_control_add_extra_data(request, APP_CONTROL_DATA_EMAIL, "2nd Email");
 
 app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
 
@@ -832,43 +832,43 @@ app_control_destroy(request);
 int
 launchContactDetails(const char* personId)
 {
-    app_control_h request;
-    app_control_create(&request);
+    app_control_h request;
+    app_control_create(&request);
 
-    app_control_set_operation(request, APP_CONTROL_OPERATION_VIEW);
-    app_control_set_mime(request, "application/vnd.tizen.contact");
-    app_control_add_extra_data(request, APP_CONTROL_DATA_ID, personId);
+    app_control_set_operation(request, APP_CONTROL_OPERATION_VIEW);
+    app_control_set_mime(request, "application/vnd.tizen.contact");
+    app_control_add_extra_data(request, APP_CONTROL_DATA_ID, personId);
 
-    app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    int result = app_control_send_launch_request(request, NULL, NULL);
-    app_control_destroy(request);
+    int result = app_control_send_launch_request(request, NULL, NULL);
+    app_control_destroy(request);
 
-    return result;
+    return result;
 }
 
 int
 launchViewVcard(const char *uri)
 {
-    app_control_h request;
-    app_control_create(&request);
+    app_control_h request;
+    app_control_create(&request);
 
-    app_control_set_operation(request, APP_CONTROL_OPERATION_VIEW);
-    app_control_set_mime(request, "text/vcard");
-    app_control_set_uri(request, uri);
+    app_control_set_operation(request, APP_CONTROL_OPERATION_VIEW);
+    app_control_set_mime(request, "text/vcard");
+    app_control_set_uri(request, uri);
 
-    app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    int result = app_control_send_launch_request(request, NULL, NULL);
-    app_control_destroy(request);
+    int result = app_control_send_launch_request(request, NULL, NULL);
+    app_control_destroy(request);
 
-    return result;
+    return result;
 }
 
    
 
 
    Selecting a Contact
    
 
-
    To select a specified contact in the user's contacts, use the APP_CONTROL_OPERATION_PICK operation with the application/vnd.tizen.contact MIME type. To specify various contact details, refer to the extras defined below.
    
+
    To select a specified contact in the user's contacts, use the APP_CONTROL_OPERATION_PICK operation with the application/vnd.tizen.contact MIME type. To specify various contact details, refer to the extras defined below.
    
 
 
    Figure: Selecting a contact
    
 
    Selecting a contact
    
@@ -914,7 +914,7 @@ launchViewVcard(const char *uri)
 			
 			
 				APP_CONTROL_DATA_SELECTED
-				The extra field to get the return information. The content of this key depends on its type: 
+				The extra field to get the return information. The content of this key depends on its type:
 				
      
 				
    • id – The database record ID of the selected person (ID in the _contacts_person view).
      • 
 				
    • phone – The database record ID of the number of the selected person (ID in the _contacts_number view).
      • 
@@ -931,22 +931,22 @@ launchViewVcard(const char *uri)
 
       int
 launchContactPick(const char *selectionMode, const char *resultType,
-                  app_control_reply_cb replyCallback, void *userData)
+                  app_control_reply_cb replyCallback, void *userData)
 {
-    app_control_h request;
-    app_control_create(&request);
+    app_control_h request;
+    app_control_create(&request);
 
-    app_control_set_operation(request, APP_CONTROL_OPERATION_PICK);
-    app_control_set_mime(request, "application/vnd.tizen.contact");
+    app_control_set_operation(request, APP_CONTROL_OPERATION_PICK);
+    app_control_set_mime(request, "application/vnd.tizen.contact");
 
-    app_control_add_extra_data(request, APP_CONTROL_DATA_SELECTION_MODE, selectionMode);
-    app_control_add_extra_data(request, APP_CONTROL_DATA_TYPE, resultType);
-    app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_add_extra_data(request, APP_CONTROL_DATA_SELECTION_MODE, selectionMode);
+    app_control_add_extra_data(request, APP_CONTROL_DATA_TYPE, resultType);
+    app_control_set_launch_mode(request, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    int result = app_control_send_launch_request(request, replyCallback, userData);
-    app_control_destroy(request);
+    int result = app_control_send_launch_request(request, replyCallback, userData);
+    app_control_destroy(request);
 
-    return result;
+    return result;
 }
 
      
 
@@ -975,10 +975,10 @@ launchContactPick(const char *selectionMode, const char *resultType,
 		
 		
 			APP_CONTROL_DATA_TYPE
-			The type of contact. The available values are my_profile and person. This key must be passed as a string.                          
+			The type of contact. The available values are my_profile and person. This key must be passed as a string.
 		
 	
-	   
+	
 
      Example Code
      
 
       #include <app_control.h>
@@ -987,8 +987,8 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_SHARE);
-app_control_set_mime(service, "application/vnd.tizen.contact");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "person");
+app_control_set_mime(service, "application/vnd.tizen.contact");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "person");
 app_control_add_extra_data(service, APP_CONTROL_DATA_ID, person_id);
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
@@ -1018,9 +1018,9 @@ app_control_destroy(service);
 			APP_CONTROL_DATA_ID
 			The database record IDs of the person (ID in the _contacts_person view). This key must be passed as an array.
 			This key is mandatory.
-		                   
+		
 	
-	     
+	
 
      Example Code
      
 
       #include <app_control.h>
@@ -1031,7 +1031,7 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_MULTI_SHARE);
-app_control_set_mime(service, "application/vnd.tizen.contact");
+app_control_set_mime(service, "application/vnd.tizen.contact");
 app_control_add_extra_data_array(service, APP_CONTROL_DATA_ID, contacts, 3);
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
@@ -1075,11 +1075,11 @@ app_control_destroy(service);
 			
 				APP_CONTROL_DATA_BCC
 				The email address of the recipients that must be blind carbon copied. This key must be passed as an array.
-						
+			
 			
 				APP_CONTROL_DATA_SUBJECT
 				The subject of an email message. This key must be passed as a string.
-						
+			
 			
 				APP_CONTROL_DATA_TEXT
 				The body of the email to be sent. This key must be passed as a string.
@@ -1090,20 +1090,20 @@ app_control_destroy(service);
 			
 		
 	
-	
+
 
      Example Code
      
 
       app_control_h service;
 app_control_create(&service);
 
-char* cc[2] = {"cc@tizen.org", "cc2@tizen.org"};
-char* bcc[2] = {"bcc@tizen.org", "bcc2@tizen.org"};
+char* cc[2] = {"cc@tizen.org", "cc2@tizen.org"};
+char* bcc[2] = {"bcc@tizen.org", "bcc2@tizen.org"};
 app_control_set_operation(service, APP_CONTROL_OPERATION_COMPOSE);
-app_control_set_uri(service, "mailto:to@tizen.org");
+app_control_set_uri(service, "mailto:to@tizen.org");
 app_control_add_extra_data_array(service, APP_CONTROL_DATA_CC, cc, 2);
 app_control_add_extra_data_array(service, APP_CONTROL_DATA_BCC, bcc, 2);
-app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "test subject");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "line1\nline2");
+app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "test subject");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "line1\nline2");
 
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
@@ -1129,7 +1129,7 @@ app_control_destroy(service);
 
      MIME Type
      
 	
      Any MIME type that your application needs, such as image/jpg, video/*, or */*
      
 	
      In case of sharing a single item through APP_CONTROL_DATA_PATH and URI specified with mailto:, the MIME type must be explicitly set. 
      
-	
+
 
      Extra Input
      
 	
@@ -1145,14 +1145,14 @@ app_control_destroy(service);
 			
      
 		
 		
 	
      
-	
+
 
      Example Code
      
 
       #define PATH_MAX 128
 
 char *shared_res_path = app_get_shared_resource_path();
 char img_path[PATH_MAX] = {0,};
-snprintf(img_path, PATH_MAX, "%s/image.jpg", shared_res_path);
+snprintf(img_path, PATH_MAX, "%s/image.jpg", shared_res_path);
 free(shared_res_path);
 
 app_control_h service;
@@ -1160,8 +1160,8 @@ app_control_create(&service);
 
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 app_control_set_operation(service, APP_CONTROL_OPERATION_SHARE);
-app_control_set_uri(service, "mailto:");
-app_control_set_mime(service, "image/*");
+app_control_set_uri(service, "mailto:");
+app_control_set_mime(service, "image/*");
 app_control_add_extra_data(service, APP_CONTROL_DATA_PATH, img_path);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -1185,7 +1185,7 @@ app_control_destroy(service);
 
      MIME Type (Mandatory)
      
 	
      Any MIME type that your application needs, such as image/jpg, video/*, or */*
      
 	
      If you try to share a set of files with different MIME types, use <type>/* or */*. For example, if you send video/mp4 and audio/ogg, the MIME type must be */*.
      
-	
+
 
      Extra Input
      
 	
@@ -1201,7 +1201,7 @@ app_control_destroy(service);
 			
      
 		
 		
 	
      
-	
+
 
      Example Code
      
 
       #define PATH_MAX 128
@@ -1210,8 +1210,8 @@ char *shared_res_path = app_get_shared_resource_path();
 char img1_path[PATH_MAX] = {0,};
 char img2_path[PATH_MAX] = {0,};
 const char *path_array[2] = {img1_path, img2_path};
-snprintf(img1_path, PATH_MAX, "%s/image.jpg", shared_res_path);
-snprintf(img2_path, PATH_MAX, "%s/image2.jpg", shared_res_path);
+snprintf(img1_path, PATH_MAX, "%s/image.jpg", shared_res_path);
+snprintf(img2_path, PATH_MAX, "%s/image2.jpg", shared_res_path);
 free(shared_res_path);
 
 app_control_h service;
@@ -1219,8 +1219,8 @@ app_control_create(&service);
 
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 app_control_set_operation(service, APP_CONTROL_OPERATION_MULTI_SHARE);
-app_control_set_uri(service, "mailto:");
-app_control_set_mime(service, "image/*");
+app_control_set_uri(service, "mailto:");
+app_control_set_mime(service, "image/*");
 app_control_add_extra_data_array(service, APP_CONTROL_DATA_PATH, path_array, 2);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -1241,7 +1241,7 @@ app_control_destroy(service);
 
      mailto:
      
 
      Only an empty mailto: field is allowed. It filters out all but email applications in the system.
      
 
-	
+
 
      Extra Input
      
 	
@@ -1263,10 +1263,10 @@ app_control_destroy(service);
 			
-						
+			
      
 		
      
 				APP_CONTROL_DATA_PATH
 				The list of multiple file paths to be shared using an email message. This key must be passed as an array.
      
 		      
 	
      
-	
+
 
      Example Code
      
 
       #define PATH_MAX 128
@@ -1275,8 +1275,8 @@ char *shared_res_path = app_get_shared_resource_path();
 char img1_path[PATH_MAX] = {0,};
 char img2_path[PATH_MAX] = {0,};
 const char *path_array[2] = {img1_path, img2_path};
-snprintf(img1_path, PATH_MAX, "%s/image.jpg", shared_res_path);
-snprintf(img2_path, PATH_MAX, "%s/image2.jpg", shared_res_path);
+snprintf(img1_path, PATH_MAX, "%s/image.jpg", shared_res_path);
+snprintf(img2_path, PATH_MAX, "%s/image2.jpg", shared_res_path);
 free(shared_res_path);
 
 app_control_h service;
@@ -1284,10 +1284,10 @@ app_control_create(&service);
 
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 app_control_set_operation(service, APP_CONTROL_OPERATION_SHARE_TEXT);
-app_control_set_uri(service, "mailto:");
+app_control_set_uri(service, "mailto:");
 app_control_add_extra_data_array(service, APP_CONTROL_DATA_PATH, path_array, 2);
-app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "test subject");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "line1\nline2");
+app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "test subject");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "line1\nline2");
 
 app_control_send_launch_request(service, NULL, NULL);
 app_control_destroy(service);
@@ -1338,9 +1338,9 @@ app_control_destroy(service);
                        
                                APP_CONTROL_DATA_SELECTED
                                The list of selected file paths. This key must be passed as an array.
-                                          
+                       
                
-               
+       
 
      Example Code
      
 
       #include <app_control.h>
@@ -1349,7 +1349,7 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_PICK);
-app_control_add_extra_data(service, APP_CONTROL_DATA_SELECTION_MODE, "single");
+app_control_add_extra_data(service, APP_CONTROL_DATA_SELECTION_MODE, "single");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -1373,7 +1373,7 @@ app_control_h app_control;
 app_control_create(&app_control);
 
 app_control_set_operation(app_control, APP_CONTROL_OPERATION_DOWNLOAD);
-app_control_set_uri(app_control, "http://PATH_TO_FILE");
+app_control_set_uri(app_control, "http://PATH_TO_FILE");
 
 app_control_send_launch_request(app_control, NULL, NULL);
 app_control_destroy(app_control);
@@ -1401,7 +1401,7 @@ app_control_destroy(app_control);
 	
      Show the map at the location of a given keyword (address or POI). For example: geo:0,0?q=Eiffel%20Tower
      
 	
      All strings passed in the geo: URI must be encoded. If only geo: is used, it filters out all but map applications in the system, and the location to be shown depends on the application scenario and configuration.
      
 	
    
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1410,34 +1410,34 @@ app_control_destroy(app_control);
 int
 show_maps_operation(void)
 {
-    int ret = 0;
+    int ret = 0;
 
-    app_control_h service = NULL;
-    app_control_create(&service);
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
-    app_control_set_uri(service, "geo:50.1,-50.1");
+    app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
+    app_control_set_uri(service, "geo:50.1,-50.1");
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -1454,8 +1454,8 @@ show_maps_operation(void)
    
    Show the map at the location of a given keyword (address or POI). For example: geo:0,0?q=Eiffel%20Tower
    
    
    All strings passed in the geo: URI must be encoded.
    
    
    If only geo: is used, it filters out all but map applications in the system, and the location to be shown depends on the application scenario and configuration.
    
-	
-	
+
+
 
    Extra Input
    
 	
@@ -1499,10 +1499,10 @@ show_maps_operation(void)
 				
-						
+			
-	
    
 		
    APP_CONTROL_DATA_PATH
 				The file path of the image showing the selected location. This key must be passed as a string.
 				
    
 		
    	
-	
+	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1511,53 +1511,53 @@ show_maps_operation(void)
 int
 pick_location_operation(void)
 {
-    int ret = 0;
+    int ret = 0;
 
-    app_control_h service = NULL;
-    app_control_create(&service);
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_PICK);
-    app_control_set_uri(service, "geo:0,0?q=Eiffel Tower");
-    app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "all");
-    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_PICK);
+    app_control_set_uri(service, "geo:0,0?q=Eiffel Tower");
+    app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "all");
+    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    app_control_send_launch_request(service, pick_reply_cb, NULL);
-    app_control_destroy(service);
+    app_control_send_launch_request(service, pick_reply_cb, NULL);
+    app_control_destroy(service);
 
-    return 0;
+    return 0;
 }
 
 void
 pick_reply_cb(app_control_h request, app_control_h reply, app_control_result_e result,
-              void *user_data)
+              void *user_data)
 {
-    char *address = NULL;
-    char *name = NULL;
-    char *geocode = NULL;
-    char *path = NULL;
-
-    if (result == APP_CONTROL_RESULT_SUCCEEDED) {
-        app_control_get_extra_data(reply, APP_CONTROL_DATA_SELECTED, &address);
-        app_control_get_extra_data(reply, APP_CONTROL_DATA_NAME, &name);
-        app_control_get_extra_data(reply, APP_CONTROL_DATA_LOCATION, &geocode);
-        app_control_get_extra_data(reply, APP_CONTROL_DATA_PATH, &path);
-
-        dlog_print(DLOG_INFO, LOG_TAG, "Selected address: %s", address);
-        dlog_print(DLOG_INFO, LOG_TAG, "Selected name: %s", name);
-        dlog_print(DLOG_INFO, LOG_TAG, "Selected location: %s", geocode);
-        dlog_print(DLOG_INFO, LOG_TAG, "Map image path: %s", path);
-
-        free(address);
-        free(name);
-        free(geocode);
-        free(path);
-    }
+    char *address = NULL;
+    char *name = NULL;
+    char *geocode = NULL;
+    char *path = NULL;
+
+    if (result == APP_CONTROL_RESULT_SUCCEEDED) {
+        app_control_get_extra_data(reply, APP_CONTROL_DATA_SELECTED, &address);
+        app_control_get_extra_data(reply, APP_CONTROL_DATA_NAME, &name);
+        app_control_get_extra_data(reply, APP_CONTROL_DATA_LOCATION, &geocode);
+        app_control_get_extra_data(reply, APP_CONTROL_DATA_PATH, &path);
+
+        dlog_print(DLOG_INFO, LOG_TAG, "Selected address: %s", address);
+        dlog_print(DLOG_INFO, LOG_TAG, "Selected name: %s", name);
+        dlog_print(DLOG_INFO, LOG_TAG, "Selected location: %s", geocode);
+        dlog_print(DLOG_INFO, LOG_TAG, "Map image path: %s", path);
+
+        free(address);
+        free(name);
+        free(geocode);
+        free(path);
+    }
 }
 
    
 
@@ -1606,7 +1606,7 @@ pick_reply_cb(app_control_h request, app_control_h reply, app_control_result_e r
 			
 		
 	
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1615,10 +1615,10 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_COMPOSE);
-app_control_set_uri(service, "mmsto:1234567890");
+app_control_set_uri(service, "mmsto:1234567890");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
-app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "My text");
-app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "My subject");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "My text");
+app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "My subject");
 
 app_control_send_launch_request(service, NULL, NULL);
 
    
@@ -1641,7 +1641,7 @@ app_control_send_launch_request(service, NULL, NULL);
 
    MIME Type
    
 	
    Any MIME type that your application needs, such as image/jpg, video/*, or */*
    
 	
    In case of sharing a single item through APP_CONTROL_DATA_PATH and URI specified with mmsto:, the MIME type must be explicitly set.
    
-	
+
 
    Extra Input
    
 	
@@ -1657,7 +1657,7 @@ app_control_send_launch_request(service, NULL, NULL);
 			
    
 		
 		
 	
    
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1689,7 +1689,7 @@ app_control_send_launch_request(service, NULL, NULL);
 
    MIME Type (Mandatory)
    
 	
    Any MIME type that your application needs, such as image/jpg, video/*, or */*
    
 	
    If you try to share a set of files with different MIME types, use <type>/* or */*. For example, if you send video/mp4 and audio/ogg, the MIME type must be */*.
    
-	
+
 
    Extra Input
    
 	
@@ -1705,7 +1705,7 @@ app_control_send_launch_request(service, NULL, NULL);
 			
    
 		
 		
 	
    
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1716,7 +1716,7 @@ app_control_create(&service);
 const char* paths[] = {IMAGE_PATH1, IMAGE_PATH2};
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_MULTI_SHARE);
-app_control_set_uri(service, "mmsto:");
+app_control_set_uri(service, "mmsto:");
 app_control_add_extra_data_array(service, APP_CONTROL_DATA_PATH, paths, 2);
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
@@ -1738,7 +1738,7 @@ app_control_send_launch_request(service, NULL, NULL);
 	
  • mmsto:
    • 
 	
 	
    Only an empty sms: or mmsto: field is allowed. This can be used to filter out all but message applications available in the system.
    
-	
+
 
    Extra Input
    
 	
@@ -1760,10 +1760,10 @@ app_control_send_launch_request(service, NULL, NULL);
 			
-						
+			
    
 		
    
 				APP_CONTROL_DATA_PATH
 				The list of multiple file paths to be shared in a multimedia message. This key must be passed as an array.
    
 		    
 	
    
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1772,9 +1772,9 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_SHARE_TEXT);
-app_control_set_uri(service, "mmsto:");
-app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "Hello, My name is Tizy.");
-app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "My subject");
+app_control_set_uri(service, "mmsto:");
+app_control_add_extra_data(service, APP_CONTROL_DATA_TEXT, "Hello, My name is Tizy.");
+app_control_add_extra_data(service, APP_CONTROL_DATA_SUBJECT, "My subject");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -1819,34 +1819,34 @@ app_control_send_launch_request(service, NULL, NULL);
 int
 play_audio_operation(const char* audio_uri)
 {
-    int ret = 0;
+    int ret = 0;
 
-    app_control_h service = NULL;
-    app_control_create(&service);
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler\n");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
-    app_control_set_uri(service, audio_uri);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
+    app_control_set_uri(service, audio_uri);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -1877,34 +1877,34 @@ play_audio_operation(const char* audio_uri)
 int
 view_image_operation(const char* image_uri)
 {
-    int ret = 0;
+    int ret = 0;
 
-    app_control_h service = NULL;
-    app_control_create(&service);
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler\n");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
-    app_control_set_uri(service, image_uri);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_VIEW);
+    app_control_set_uri(service, image_uri);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -1921,7 +1921,7 @@ view_image_operation(const char* image_uri)
       
      
       
    • audio/*
      • 
       
    • image/*
      • 
-      
    • video/*
      •         
+      
    • video/*
      • 
       
    
 
 
    Extra Input
    
@@ -1957,11 +1957,11 @@ view_image_operation(const char* image_uri)
 			
 			
 				APP_CONTROL_DATA_SELECTED
-				The paths of the selected files. This key must be passed as an array.                              
-			                   
+				The paths of the selected files. This key must be passed as an array.
+			
 		
-	   
-	
+	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -1970,35 +1970,35 @@ view_image_operation(const char* image_uri)
 int
 retrieve_media_operation(const char* mime_type)
 {
-    int ret = 0;
+    int ret = 0;
 
-    app_control_h service = NULL;
-    app_control_create(&service);
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler\n");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_PICK);
-    app_control_set_mime(service, mime_type);
-    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_PICK);
+    app_control_set_mime(service, mime_type);
+    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to request!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to request!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2020,32 +2020,32 @@ retrieve_media_operation(const char* mime_type)
 int
 launch_setting(void)
 {
-    int ret = 0;
-    app_control_h service = NULL;
-    app_control_create(&service);
+    int ret = 0;
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch settings!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch settings!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch settings!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch settings!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2062,7 +2062,7 @@ launch_setting(void)
 
    • http://tizen.org/appcontrol/operation/setting/bt_enable (in .c files and manifest file)
      • 
 
    • APP_CONTROL_OPERATION_SETTING_BT_ENABLE (in .c files only)
    
 
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -2070,32 +2070,32 @@ launch_setting(void)
 int
 bt_enable_operation(void)
 {
-    int ret = 0;
-    app_control_h service = NULL;
-    app_control_create(&service);
+    int ret = 0;
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_BT_ENABLE);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_BT_ENABLE);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2110,7 +2110,7 @@ bt_enable_operation(void)
 
    • http://tizen.org/appcontrol/operation/setting/bt_visibility (in .c files and manifest file)
      • 
 
    • APP_CONTROL_OPERATION_SETTING_BT_VISIBILITY (in .c files only)
    
 
-	
+
 
    Example Code
    
 
     #include <app_control.h>
@@ -2118,32 +2118,32 @@ bt_enable_operation(void)
 int
 bt_visibility_operation(void)
 {
-    int ret = 0;
-    app_control_h service = NULL;
-    app_control_create(&service);
+    int ret = 0;
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_BT_VISIBILITY);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_BT_VISIBILITY);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2161,38 +2161,38 @@ bt_visibility_operation(void)
 
    • http://tizen.org/appcontrol/operation/setting/location (in .c files and manifest file)
      • 
 
    • APP_CONTROL_OPERATION_SETTING_LOCATION (in .c files only)
    
 
-	
+
 
    Example Code
    
 
     int
 location_setting(void)
 {
-    int ret = 0;
-    app_control_h service = NULL;
-    app_control_create(&service);
+    int ret = 0;
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_LOCATION);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_LOCATION);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch location settings!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch location settings!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch location settings!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch location settings!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2237,33 +2237,33 @@ location_setting(void)
 int
 nfc_setting(void)
 {
-    int ret = 0;
+    int ret = 0;
 
-    app_control_h service = NULL;
-    app_control_create(&service);
+    app_control_h service = NULL;
+    app_control_create(&service);
 
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_NFC);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_NFC);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch NFC settings app!\n");
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to launch NFC settings app!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch NFC settings app!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch NFC settings app!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2279,35 +2279,35 @@ nfc_setting(void)
 
    • http://tizen.org/appcontrol/operation/setting/wifi (in .c files and manifest file)
      • 
 
    • APP_CONTROL_OPERATION_SETTING_WIFI (in .c files only)
    
 
-	
+
 
    Example Code
    
 
     int
 wifi_launch_operation(void)
 {
-    int ret = 0;
-    app_control_h service = NULL;
+    int ret = 0;
+    app_control_h service = NULL;
 
-    ret = app_control_create(&service);
+    ret = app_control_create(&service);
 
-    if (ret != APP_CONTROL_ERROR_NONE || service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
+    if (ret != APP_CONTROL_ERROR_NONE || service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to create app control handler");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    app_control_set_operation(service,  APP_CONTROL_OPERATION_SETTING_WIFI);
+    app_control_set_operation(service,  APP_CONTROL_OPERATION_SETTING_WIFI);
 
-    ret = app_control_send_launch_request(service, NULL, NULL);
-    app_control_destroy(service);
+    ret = app_control_send_launch_request(service, NULL, NULL);
+    app_control_destroy(service);
 
-    if (ret != APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch Wi-Fi setting application");
+    if (ret != APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to launch Wi-Fi setting application");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
 
    
 
@@ -2329,12 +2329,12 @@ wifi_launch_operation(void)
                                Key
                                Description
                                Note
-                                          
+                       
                        
                                APP_CONTROL_DATA_TOTAL_SIZE
                                The total size of items to be returned in bytes. This key must be passed as a string.
                                This key is optional.
-                                          
+                       
                
        
 
@@ -2344,14 +2344,14 @@ wifi_launch_operation(void)
                        
                                Key
                                Value description
-                                          
+                       
                        
                                APP_CONTROL_DATA_SELECTED
                                The path of the created audio file. This key must be passed as a string.
-                                          
+                       
                
-               
-
    Example Code
           
+       
+
    Example Code
    
 
     #include <app_control.h>
 
@@ -2359,7 +2359,7 @@ app_control_h service;
 app_control_create(&service);
 
 app_control_set_operation(service, APP_CONTROL_OPERATION_CREATE_CONTENT);
-app_control_set_mime(service, "audio/m4a");
+app_control_set_mime(service, "audio/m4a");
 app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
 app_control_send_launch_request(service, NULL, NULL);
@@ -2367,7 +2367,7 @@ app_control_send_launch_request(service, NULL, NULL);
 
 
    VPN Service in Mobile Applications
    
 
-	
+
 	  
    
         Note
         In mobile applications, this application control is available since Tizen 3.0.
@@ -2424,39 +2424,39 @@ app_control_send_launch_request(service, NULL, NULL);
 int
 launch_vpn_service_appcontrol(void)
 {
-    app_control_h service;
-    app_control_create(&service);
+    app_control_h service;
+    app_control_create(&service);
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_VPN);
-    app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "up");
-    app_control_add_extra_data(service, APP_CONTROL_DATA_NAME, "tizen");
-    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_VPN);
+    app_control_add_extra_data(service, APP_CONTROL_DATA_TYPE, "up");
+    app_control_add_extra_data(service, APP_CONTROL_DATA_NAME, "tizen");
+    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    app_control_send_launch_request(service, vpn_appcontrol_result_cb, NULL);
-    app_control_destroy(service);
+    app_control_send_launch_request(service, vpn_appcontrol_result_cb, NULL);
+    app_control_destroy(service);
 }
 
 static void
 vpn_appcontrol_result_cb(app_control_h request, app_control_h reply,
-                         app_control_result_e result, void *user_data)
+                         app_control_result_e result, void *user_data)
 {
-    char *result_txt;
-
-    switch (result) {
-    case APP_CONTROL_RESULT_APP_STARTED:
-    case APP_CONTROL_RESULT_SUCCEEDED:
-      dlog_print(DLOG_INFO, LOG_TAG, "Success!");
-      break;
-    case APP_CONTROL_RESULT_FAILED:
-      dlog_print(DLOG_INFO, LOG_TAG, "Failed!");
-      break;
-    case APP_CONTROL_RESULT_CANCELED:
-      dlog_print(DLOG_INFO, LOG_TAG, "Canceled!");
-      break;
-    }
-
-    app_control_get_extra_data(reply, APP_CONTROL_DATA_TEXT, &result_txt);
-    dlog_print(DLOG_INFO, LOG_TAG, "Result: %s", result_txt);
+    char *result_txt;
+
+    switch (result) {
+    case APP_CONTROL_RESULT_APP_STARTED:
+    case APP_CONTROL_RESULT_SUCCEEDED:
+      dlog_print(DLOG_INFO, LOG_TAG, "Success!");
+      break;
+    case APP_CONTROL_RESULT_FAILED:
+      dlog_print(DLOG_INFO, LOG_TAG, "Failed!");
+      break;
+    case APP_CONTROL_RESULT_CANCELED:
+      dlog_print(DLOG_INFO, LOG_TAG, "Canceled!");
+      break;
+    }
+
+    app_control_get_extra_data(reply, APP_CONTROL_DATA_TEXT, &result_txt);
+    dlog_print(DLOG_INFO, LOG_TAG, "Result: %s", result_txt);
 }
 
    
 
@@ -2507,11 +2507,11 @@ vpn_appcontrol_result_cb(app_control_h request, app_control_h reply,
                        
                        
                                APP_CONTROL_DATA_INPUT_DEFAULT_TEXT
-                               The preformatted text to be used as default input, such as "http://" for Web addresses. This key must be passed as a string.
+                               The preformatted text to be used as default input, such as "http://" for Web addresses. This key must be passed as a string.
                        
                       
                                APP_CONTROL_DATA_INPUT_GUIDE_TEXT
-                               The guide text, such as "Input user name". This key must be passed as a string.
+                               The guide text, such as "Input user name". This key must be passed as a string.
                       
                        
                                APP_CONTROL_DATA_INPUT_PREDICTION_HINT
@@ -2540,29 +2540,29 @@ vpn_appcontrol_result_cb(app_control_h request, app_control_h reply,
 void
 call_control()
 {
-    app_control_h service;
-    app_control_create(&service);
+    app_control_h service;
+    app_control_create(&service);
 
-    app_control_set_operation(service, APP_CONTROL_OPERATION_GET_INPUT);
-    app_control_set_mime(service, "text/plain");
-    app_control_add_extra_data(service, APP_CONTROL_DATA_INPUT_TYPE, "input_voice");
-    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
+    app_control_set_operation(service, APP_CONTROL_OPERATION_GET_INPUT);
+    app_control_set_mime(service, "text/plain");
+    app_control_add_extra_data(service, APP_CONTROL_DATA_INPUT_TYPE, "input_voice");
+    app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP);
 
-    app_control_send_launch_request(service, app_control_result, NULL);
-    app_control_destroy(service);
+    app_control_send_launch_request(service, app_control_result, NULL);
+    app_control_destroy(service);
 }
 
 static void
 app_control_result(app_control_h request, app_control_h reply, app_control_result_e result,
-                   void *user_data) 
+                   void *user_data)
 {
-    char *value;
-    if (result == APP_CONTROL_RESULT_SUCCEEDED) {
-        int ret = app_control_get_extra_data(reply, APP_CONTROL_DATA_TEXT, &value);
-        if (ret == APP_CONTROL_ERROR_NONE) {
-            /*  Value is the result string */
-        }
-    }
+    char *value;
+    if (result == APP_CONTROL_RESULT_SUCCEEDED) {
+        int ret = app_control_get_extra_data(reply, APP_CONTROL_DATA_TEXT, &value);
+        if (ret == APP_CONTROL_ERROR_NONE) {
+            /*  Value is the result string */
+        }
+    }
 }
 
    
 
@@ -2588,4 +2588,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga
 
 
 
-	
\ No newline at end of file
+
\ No newline at end of file
diff --git a/org.tizen.guides/html/native/app_management/dali_app_n.htm b/org.tizen.guides/html/native/app_management/dali_app_n.htm
index 5238666..131f99a 100644
--- a/org.tizen.guides/html/native/app_management/dali_app_n.htm
+++ b/org.tizen.guides/html/native/app_management/dali_app_n.htm
@@ -66,7 +66,7 @@
 
 
    Application Types
    
 
-
    With the DALi UI, you can create the following application types:
     
+
    With the DALi UI, you can create the following application types:
    
 
 
      
 
    • Basic UI application
diff --git a/org.tizen.guides/html/native/app_management/dali_basic_app_n.htm b/org.tizen.guides/html/native/app_management/dali_basic_app_n.htm
index 5aa9891..043c4ae 100644
--- a/org.tizen.guides/html/native/app_management/dali_basic_app_n.htm
+++ b/org.tizen.guides/html/native/app_management/dali_basic_app_n.htm
@@ -199,7 +199,7 @@ mApplication.InitSignal().Connect( this, &HelloWorld::Create );
 
       Stage stage = Stage::GetCurrent();
 
-TextLabel textLabel = TextLabel::New( "Hello World" );
+TextLabel textLabel = TextLabel::New( "Hello World" );
 stage.Add( textLabel );
 
      
 
diff --git a/org.tizen.guides/html/native/app_management/dali_watch_app_n.htm b/org.tizen.guides/html/native/app_management/dali_watch_app_n.htm
index 52cd075..d0adf2c 100644
--- a/org.tizen.guides/html/native/app_management/dali_watch_app_n.htm
+++ b/org.tizen.guides/html/native/app_management/dali_watch_app_n.htm
@@ -172,20 +172,20 @@ WatchApplication application = WatchApplication::New( &argc, &argv );
 
       class WatchExample : public ConnectionTracker
 {
-  public:
-    WatchExample( WatchApplication& application )
-    : mApplication( application )
-    {
-      mApplication.InitSignal().Connect( this, &WatchExample::Create );
-    }
-
-    void Create( Application& application )
-    {
-      // Create a DALi UI component
-    }
-
-  private:
-    WatchApplication& mApplication;
+  public:
+    WatchExample( WatchApplication& application )
+    : mApplication( application )
+    {
+      mApplication.InitSignal().Connect( this, &WatchExample::Create );
+    }
+
+    void Create( Application& application )
+    {
+      // Create a DALi UI component
+    }
+
+  private:
+    WatchApplication& mApplication;
 }
 
      
 
      • 
@@ -201,12 +201,12 @@ mApplication.TimeTickSignal().Connect( this, &WatchExample::OnTimeTick );
 // Update clock hands on the tick event
 void OnTimeTick( Application& application, const WatchTime& time )
 {
-  UpdateClockHands(time.GetHour(), time.GetMinute(), time.GetSecond());
+  UpdateClockHands(time.GetHour(), time.GetMinute(), time.GetSecond());
 }
 
 void UpdateClockHands(int hour, int min, int sec)
 {
-  // Update the angle of each hand
+  // Update the angle of each hand
 }
 
    
 
diff --git a/org.tizen.guides/html/native/app_management/data_bundles_n.htm b/org.tizen.guides/html/native/app_management/data_bundles_n.htm
index 0827105..2f46367 100644
--- a/org.tizen.guides/html/native/app_management/data_bundles_n.htm
+++ b/org.tizen.guides/html/native/app_management/data_bundles_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Data Bundle 
-  
+  Data Bundle
+ 
  
- 
+
  
    
 	
    
 		
    Mobile native Wearable native
    
 	
    
-	
+
 	
    
 		
    Dependencies
    
 		
      
@@ -46,8 +46,8 @@
 
    
 
 
    
- 
    Data Bundle
     
-  
+ 
    Data Bundle
    
+
 
    A bundle is a string-based dictionary abstract data type (ADT). A dictionary is an ordered or unordered list of key-value pairs, where keys are used to locate elements in the list. The key is always a string.
    
 
 
    The main features of the Bundle API include:
    
@@ -88,31 +88,31 @@ bundle_free(bund);
 
 
  
    Adding Content to a Bundle
    
- 
+
  
    The bundle content is in the form of key-value pairs. The key is always a string. The value can be of the following types:
    
 
- 
    Table: Bundle value types
     
+ 
    Table: Bundle value types
    
 
-     
-      
-      
-    
-      
-      
-     
-     
-      
-      
-     
-     
-      
-      
-     
-    
-  
    
    
    Value constantValue type
     
     
    BUNDLE_TYPE_STRString (default)
    BUNDLE_TYPE_STR_ARRAYString array
    BUNDLE_TYPE_BYTEByte
     
-	
+     Value constant
+     Value type
+    
+    
+     BUNDLE_TYPE_STR
+     String (default)
+    
+    
+     BUNDLE_TYPE_STR_ARRAY
+     String array
+    
+    
+     BUNDLE_TYPE_BYTE
+     Byte
+    
+   
+  
+
 
    To add content to a bundle, use a function associated with the type of the value you want to add:
    
 
      
  
    • bundle_add_str_array()
      • 
@@ -121,14 +121,14 @@ bundle_free(bund);
 
    
 
 
    -const char* array [3] = {"Var1", "Var2", "Var3"};
+const char* array [3] = {"Var1", "Var2", "Var3"};
 int array_len = 3;
 
-bundle_add_str(bund, "Str", "String content");
+bundle_add_str(bund, "Str", "String content");
 
-bundle_add_str_array(bund, "Array", array, array_len);
+bundle_add_str_array(bund, "Array", array, array_len);
 
-bundle_add_byte(bund, "Byte", "Byte content", 12);
+bundle_add_byte(bund, "Byte", "Byte content", 12);
 
    
 
 
    When operating on bytes, remember to control the length of the given chain.
    
@@ -139,8 +139,8 @@ bundle_add_byte(bund, "Byte", "Byte content", 12);
 
    To manage the bundle content:
    
 
 
      
-
    1. Get values from the bundle using the function associated with the type of the value you want to get: 
- 
+
    2. Get values from the bundle using the function associated with the type of the value you want to get:
+
 
        
 
      • bundle_get_str()
        • 
 
      • bundle_get_str_array()
        • 
@@ -153,26 +153,26 @@ bundle_add_byte(bund, "Byte", "Byte content", 12);
 void
 test_bundle_add_del_get(void)
 {
-    bundle *b = NULL;
-    int count = 0;
-    char *value;
+    bundle *b = NULL;
+    int count = 0;
+    char *value;
 
-    b = bundle_create();
+    b = bundle_create();
 
-    bundle_add_str(b, "key1", "val1");
-    bundle_add_str(b, "key2", "val2");
-    bundle_get_str(b, "key2", &value);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "the value of key2: %s", value);
+    bundle_add_str(b, "key1", "val1");
+    bundle_add_str(b, "key2", "val2");
+    bundle_get_str(b, "key2", &value);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "the value of key2: %s", value);
 
-    count = bundle_get_count(b);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "the number of bundle items: %d", count);
+    count = bundle_get_count(b);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "the number of bundle items: %d", count);
  • Delete a key-value pair from the bundle content using the bundle_del() function: 
    -    bundle_del(b, "key2");
+    bundle_del(b, "key2");
 
-    bundle_free(b);
+    bundle_free(b);
 }
    • @@ -188,57 +188,57 @@ test_bundle_add_del_get(void) 
     void
 iterate_bundle_foreach(const char *key, const int type, bundle_keyval_t *kv,
-                       void *user_data)
+                       void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "key: %s, type: %d ", key, type);
-
-    void *ptr = NULL;
-    char *buff = NULL;
-    unsigned int size = 0;
-    if (type == BUNDLE_TYPE_STR) {
-        bundle_keyval_get_basic_val((bundle_keyval_t *)kv, &ptr, &size);
-        buff = malloc(sizeof(char)* size + 1);
-        snprintf(buff, size + 1, "%s", ((char*)ptr));
-        dlog_print(DLOG_DEBUG, LOG_TAG,
-                   "Found STR -KEY: %s, VAL: %s, SIZE: %d", key, buff, size);
-        free(buff);
-    } else if (type == BUNDLE_TYPE_BYTE) {
-        bundle_keyval_get_basic_val((bundle_keyval_t *)kv, &ptr, &size);
-        buff = malloc(sizeof(char)* size + 1);
-        snprintf(buff, size + 1, "%s", ((char*)ptr));
-        dlog_print(DLOG_DEBUG, LOG_TAG,
-                   "Found STR -KEY: %s, VAL: %s, SIZE: %d", key, buff, size);
-        free(buff);
-    } else if (type == BUNDLE_TYPE_STR_ARRAY) {
-        void ** array;
-        unsigned int len = 0;
-        size_t *element_size = NULL;
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Found STR_ARRAY -KEY: %s", key);
-        bundle_keyval_get_array_val((bundle_keyval_t *)kv, &array, &len, &element_size);
-        dlog_print(DLOG_DEBUG, LOG_TAG, "-Array len: %d", len);
-        for (int i = 0; i < len; i++)
-            dlog_print(DLOG_DEBUG, LOG_TAG, "-%s", (char*)array[i]);
-    }
+    dlog_print(DLOG_DEBUG, LOG_TAG, "key: %s, type: %d ", key, type);
+
+    void *ptr = NULL;
+    char *buff = NULL;
+    unsigned int size = 0;
+    if (type == BUNDLE_TYPE_STR) {
+        bundle_keyval_get_basic_val((bundle_keyval_t *)kv, &ptr, &size);
+        buff = malloc(sizeof(char)* size + 1);
+        snprintf(buff, size + 1, "%s", ((char*)ptr));
+        dlog_print(DLOG_DEBUG, LOG_TAG,
+                   "Found STR -KEY: %s, VAL: %s, SIZE: %d", key, buff, size);
+        free(buff);
+    } else if (type == BUNDLE_TYPE_BYTE) {
+        bundle_keyval_get_basic_val((bundle_keyval_t *)kv, &ptr, &size);
+        buff = malloc(sizeof(char)* size + 1);
+        snprintf(buff, size + 1, "%s", ((char*)ptr));
+        dlog_print(DLOG_DEBUG, LOG_TAG,
+                   "Found STR -KEY: %s, VAL: %s, SIZE: %d", key, buff, size);
+        free(buff);
+    } else if (type == BUNDLE_TYPE_STR_ARRAY) {
+        void ** array;
+        unsigned int len = 0;
+        size_t *element_size = NULL;
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Found STR_ARRAY -KEY: %s", key);
+        bundle_keyval_get_array_val((bundle_keyval_t *)kv, &array, &len, &element_size);
+        dlog_print(DLOG_DEBUG, LOG_TAG, "-Array len: %d", len);
+        for (int i = 0; i < len; i++)
+            dlog_print(DLOG_DEBUG, LOG_TAG, "-%s", (char*)array[i]);
+    }
 }
 
 void
 test_bundle_foreach(void)
 {
-    const char *s_arr[] = {"abc", "bcd", "cde"};
-    bundle *b;
-    b = bundle_create();
+    const char *s_arr[] = {"abc", "bcd", "cde"};
+    bundle *b;
+    b = bundle_create();
 
-    bundle_add_str(b, "k1", "v1");
-    bundle_add_byte(b, "k2", "v2", 3);
-    bundle_add_str_array(b, "k3", s_arr, 3);
+    bundle_add_str(b, "k1", "v1");
+    bundle_add_byte(b, "k2", "v2", 3);
+    bundle_add_str_array(b, "k3", s_arr, 3);
 
-    bundle_foreach(b, iterate_bundle_foreach, NULL);
-    bundle_free(b);
+    bundle_foreach(b, iterate_bundle_foreach, NULL);
+    bundle_free(b);
 }

    Encoding and Decoding a Bundle

    - +

    To store or send a bundle over a serial connection, encode it to bundle_raw (a typedef of unsigned char) with the bundle_encode() function, and write the bundle_raw instance to a file, for example.

    To open the encoded bundle, use the bundle_decode() function. When you no longer need them, release the encoded data and the created bundle.

    @@ -246,25 +246,25 @@ test_bundle_foreach(void) void test_bundle_encode_decode(void) { -    bundle *b1; -    bundle *b1; -    bundle_raw *r; -    int size_r; -    char *value; + bundle *b1; + bundle *b1; + bundle_raw *r; + int size_r; + char *value; -    b1 = bundle_create(); -    bundle_add_str(b1, "k1", "v1"); -    bundle_add_str(b1, "k2", "v2"); + b1 = bundle_create(); + bundle_add_str(b1, "k1", "v1"); + bundle_add_str(b1, "k2", "v2"); -    bundle_encode(b1, &r, &size_r); + bundle_encode(b1, &r, &size_r); -    b2 = bundle_decode(r, size_r); + b2 = bundle_decode(r, size_r); -    bundle_get_str(b1, "k1", &value); -    dlog_print(DLOG_DEBUG, LOG_TAG, "value of k1 after decode: %s", value); + bundle_get_str(b1, "k1", &value); + dlog_print(DLOG_DEBUG, LOG_TAG, "value of k1 after decode: %s", value); -    bundle_free(b1); -    bundle_free(b2); + bundle_free(b1); + bundle_free(b2); } @@ -290,4 +290,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/data_control_n.htm b/org.tizen.guides/html/native/app_management/data_control_n.htm index 694a7c4..8a94c75 100644 --- a/org.tizen.guides/html/native/app_management/data_control_n.htm +++ b/org.tizen.guides/html/native/app_management/data_control_n.htm @@ -5,20 +5,20 @@ - + - Data Control - + Data Control + - +

    Mobile native Wearable native

    - +

    Dependencies

      @@ -45,7 +45,7 @@

      Data Control

      The data control is a standard mechanism for exchanging specific data between applications.

      - +

      A provider application shares its data, and a consumer application can request the shared data. All applications can function as consumers and request data shared by other applications using a data control. However, only service applications can function as providers and share their own data.

      The main features of the Data Control API include:

      @@ -62,8 +62,8 @@

      You can monitor data changes and provide notifications about them. The available notification types are listed in the data_control_data_change_type_e enumerator (in mobile and wearable applications).

    To create a provider, you must export its provider functionalities in the application project settings in the IDE. For the consumer to access shared data, it must know the provider ID and data ID.

    - -

    Figure: Data control mechanism

    + +

    Figure: Data control mechanism

    Data control mechanism

    Prerequisites

    @@ -76,8 +76,8 @@

    To use the Data Control API (in mobile and wearable applications), the consumer has to request permission by adding the following privileges to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/datasharing</privilege>
-   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
+   <privilege>http://tizen.org/privilege/datasharing</privilege>
+   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
 </privileges>
    @@ -86,24 +86,24 @@

    The following code example shows how the <datacontrol> element is consequently added to the tizen-manifest.xml file:

    -<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns="http://tizen.org/ns/packages" api-version="2.4"
-          package="@PACKAGE_NAME@" version="@VERSION@" install-location="internal-only">
-   <label>datacontrolprovider</label>
-   <author email="PUT YOUR EMAIL" href="www.tizen.org">PUT YOUR NAME</author>
-   <description>datacontrolprovider</description>
-   <service-application appid="org.tizen.datacontrolprovider"
-                   exec="datacontrolprovider"
-                   nodisplay="true" multiple="false" type="capp" taskmanage="true"
-                   auto-restart="false" on-boot="false">
-      <datacontrol providerid = "Your Provider ID"
-                   access="ReadWrite" type="Sql"/>
-      <datacontrol providerid = "Your Provider ID"
-                   access="ReadWrite" type="Map"/>
-   </service-application>
-   <privileges>
-      <privilege>http://tizen.org/privilege/datasharing</privilege>
-   </privileges>
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.4"
+          package="@PACKAGE_NAME@" version="@VERSION@" install-location="internal-only">
+   <label>datacontrolprovider</label>
+   <author email="PUT YOUR EMAIL" href="www.tizen.org">PUT YOUR NAME</author>
+   <description>datacontrolprovider</description>
+   <service-application appid="org.tizen.datacontrolprovider"
+                   exec="datacontrolprovider"
+                   nodisplay="true" multiple="false" type="capp" taskmanage="true"
+                   auto-restart="false" on-boot="false">
+      <datacontrol providerid = "Your Provider ID"
+                   access="ReadWrite" type="Sql"/>
+      <datacontrol providerid = "Your Provider ID"
+                   access="ReadWrite" type="Map"/>
+   </service-application>
+   <privileges>
+      <privilege>http://tizen.org/privilege/datasharing</privilege>
+   </privileges>
 </manifest>
    @@ -136,8 +136,8 @@ 
     struct map_data {
-    char **str_arr;
-    int arr_size;
+    char **str_arr;
+    int arr_size;
 };
 typedef struct map_data map_data_s;
 
@@ -146,118 +146,118 @@ static GHashTable *map_repository_test;
 /* Callback for handling the get operation request */
 void
 get_value_request_cb(int request_id, data_control_h provider, const char *key,
-                     void *user_data)
+                     void *user_data)
 {
-    map_data_s* map_data =
-        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
-
-    int ret_value_count = 0;
-    char **val_arr = NULL;
-    if (map_data != NULL) {
-        val_arr = map_data->str_arr;
-        ret_value_count = map_data->arr_size;
-    }
-
-    int ret = data_control_provider_send_map_get_value_result(request_id, val_arr,
-                                                              ret_value_count);
-    if (ret != DATA_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "send_map_get_result failed with error: %d", ret);
-    else
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "Get value success request_id: %d", request_id);
+    map_data_s* map_data =
+        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
+
+    int ret_value_count = 0;
+    char **val_arr = NULL;
+    if (map_data != NULL) {
+        val_arr = map_data->str_arr;
+        ret_value_count = map_data->arr_size;
+    }
+
+    int ret = data_control_provider_send_map_get_value_result(request_id, val_arr,
+                                                              ret_value_count);
+    if (ret != DATA_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "send_map_get_result failed with error: %d", ret);
+    else
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "Get value success request_id: %d", request_id);
 }
 
 /* Callback for handling the set operation request */
 void
 set_value_request_cb(int request_id, data_control_h provider, const char *key,
-                     const char *old_value, const char *new_value,
-                     void *user_data)
+                     const char *old_value, const char *new_value,
+                     void *user_data)
 {
-    map_data_s* map_data =
-        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
-    if (map_data != NULL) {
-        for (int i = 0; i < map_data->arr_size; i++) {
-            if (strcmp(map_data->str_arr[i], old_value) == 0)
-                map_data->str_arr[i] = g_strdup(new_value);
-        }
-    }
-
-    int ret = data_control_provider_send_map_result(request_id);
-    if (ret != DATA_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "send_map_result failed with error: %d", ret);
-    else
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "Set value success request_id: %d", request_id);
+    map_data_s* map_data =
+        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
+    if (map_data != NULL) {
+        for (int i = 0; i < map_data->arr_size; i++) {
+            if (strcmp(map_data->str_arr[i], old_value) == 0)
+                map_data->str_arr[i] = g_strdup(new_value);
+        }
+    }
+
+    int ret = data_control_provider_send_map_result(request_id);
+    if (ret != DATA_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "send_map_result failed with error: %d", ret);
+    else
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "Set value success request_id: %d", request_id);
 }
 
 /* Callback for handling the add operation request */
 void
 add_value_request_cb(int request_id, data_control_h provider, const char *key,
-                     const char *value, void *user_data)
+                     const char *value, void *user_data)
 {
-    map_data_s* map_data =
-        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
-
-    if (map_data == NULL) {
-        map_data = (map_data_s*)(g_malloc(sizeof(*map_data)));
-        map_data->arr_size = 0;
-        map_data->str_arr = (char**)calloc(1, sizeof(char*));
-        map_data->str_arr[0] = g_strdup(value);
-        g_hash_table_insert(map_repository_test, g_strdup(key), map_data);
-    } else {
-        char **new_arr = (char**)calloc(map_data->arr_size+2, sizeof(char*));
-        for (int i = 0; i < map_data->arr_size; i++)
-            new_arr[i] = g_strdup(map_data->str_arr[i]);
-        free(map_data->str_arr);
-        new_arr[map_data->arr_size] = g_strdup(value);
-        map_data->str_arr = g_strdupv(new_arr);
-        free(new_arr);
-    }
-    map_data->arr_size += 1;
-
-    int ret = data_control_provider_send_map_result(request_id);
-    if (ret != DATA_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "send_map_result failed with error: %d", ret);
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Add value success request_id: %d %d %s",
-                   request_id, map_data->arr_size, map_data->str_arr[0]);
-    }
+    map_data_s* map_data =
+        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
+
+    if (map_data == NULL) {
+        map_data = (map_data_s*)(g_malloc(sizeof(*map_data)));
+        map_data->arr_size = 0;
+        map_data->str_arr = (char**)calloc(1, sizeof(char*));
+        map_data->str_arr[0] = g_strdup(value);
+        g_hash_table_insert(map_repository_test, g_strdup(key), map_data);
+    } else {
+        char **new_arr = (char**)calloc(map_data->arr_size+2, sizeof(char*));
+        for (int i = 0; i < map_data->arr_size; i++)
+            new_arr[i] = g_strdup(map_data->str_arr[i]);
+        free(map_data->str_arr);
+        new_arr[map_data->arr_size] = g_strdup(value);
+        map_data->str_arr = g_strdupv(new_arr);
+        free(new_arr);
+    }
+    map_data->arr_size += 1;
+
+    int ret = data_control_provider_send_map_result(request_id);
+    if (ret != DATA_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "send_map_result failed with error: %d", ret);
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Add value success request_id: %d %d %s",
+                   request_id, map_data->arr_size, map_data->str_arr[0]);
+    }
 }
 
 /* Callback for handling the remove operation request */
 void
 remove_value_request_cb(int request_id, data_control_h provider, const char *key,
-                        const char *value, void *user_data)
+                        const char *value, void *user_data)
 {
-    map_data_s* map_data =
-        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
-
-    if (map_data != NULL) {
-        int size = map_data->arr_size;
-        for (int i = 0; i < size; i++) {
-            if (strcmp(map_data->str_arr[i], value) == 0) {
-                free(map_data->str_arr[i]);
-                map_data->arr_size--;
-            }
-        }
-        if (map_data->arr_size == 0) {
-            if (!g_hash_table_remove(map_repository_test, key)) {
-                dlog_print(DLOG_ERROR, LOG_TAG, "remove value failed -%s", key);
-
-                return;
-            }
-        }
-    }
-
-    int ret = data_control_provider_send_map_result(request_id);
-    if (ret != DATA_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "send_map_result failed with error: %d", ret);
-    else
-        dlog_print(DLOG_INFO, LOG_TAG, "Remove value Success");
+    map_data_s* map_data =
+        (map_data_s*)g_hash_table_lookup(map_repository_test, key);
+
+    if (map_data != NULL) {
+        int size = map_data->arr_size;
+        for (int i = 0; i < size; i++) {
+            if (strcmp(map_data->str_arr[i], value) == 0) {
+                free(map_data->str_arr[i]);
+                map_data->arr_size--;
+            }
+        }
+        if (map_data->arr_size == 0) {
+            if (!g_hash_table_remove(map_repository_test, key)) {
+                dlog_print(DLOG_ERROR, LOG_TAG, "remove value failed -%s", key);
+
+                return;
+            }
+        }
+    }
+
+    int ret = data_control_provider_send_map_result(request_id);
+    if (ret != DATA_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "send_map_result failed with error: %d", ret);
+    else
+        dlog_print(DLOG_INFO, LOG_TAG, "Remove value Success");
 }
    @@ -267,50 +267,50 @@ remove_value_request_cb(int request_id, data_control_h provider, const char *key void __free_key(gpointer data) { -    if (data) { -        g_free(data); -        data = NULL; -        dlog_print(DLOG_INFO, LOG_TAG, "Remove key"); -    } + if (data) { + g_free(data); + data = NULL; + dlog_print(DLOG_INFO, LOG_TAG, "Remove key"); + } } void __free_data(gpointer data) { -    if (data) { -        g_free(data); -        data = NULL; -        dlog_print(DLOG_INFO, LOG_TAG, "Remove value"); -    } + if (data) { + g_free(data); + data = NULL; + dlog_print(DLOG_INFO, LOG_TAG, "Remove value"); + } } data_control_provider_map_cb map_callback; void initialize_datacontrol_provider() { -    map_repository_test = g_hash_table_new_full(g_str_hash, g_str_equal, -                                                __free_key, __free_data); - -    map_callback.get_cb = get_value_request_cb; -    map_callback.add_cb = add_value_request_cb; -    map_callback.remove_cb = remove_value_request_cb; -    map_callback.set_cb = set_value_request_cb; - -    int result = data_control_provider_map_register_cb(&map_callback); -    if (result != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "data_control_provider_map_register_cb failed with error: %d", -                   result); -    else -        dlog_print(DLOG_INFO, LOG_TAG, "Provider map register success"); + map_repository_test = g_hash_table_new_full(g_str_hash, g_str_equal, + __free_key, __free_data); + + map_callback.get_cb = get_value_request_cb; + map_callback.add_cb = add_value_request_cb; + map_callback.remove_cb = remove_value_request_cb; + map_callback.set_cb = set_value_request_cb; + + int result = data_control_provider_map_register_cb(&map_callback); + if (result != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "data_control_provider_map_register_cb failed with error: %d", + result); + else + dlog_print(DLOG_INFO, LOG_TAG, "Provider map register success"); } static bool app_create(void *data) { -    initialize_datacontrol_provider() + initialize_datacontrol_provider() -    return true; + return true; } @@ -324,63 +324,63 @@ app_create(void *data) /* Callback for the get operation response */ void map_get_response_cb(int request_id, data_control_h provider, -                    char **ret_value_list, int ret_value_count, bool provider_ret, -                    const char *error, void *user_data) + char **ret_value_list, int ret_value_count, bool provider_ret, + const char *error, void *user_data) { -    if (provider_ret) { -        dlog_print(DLOG_INFO, LOG_TAG, -                   "The get operation is successful. Value count: %d ", -                   ret_value_count); -        for (int i = 0; i < ret_value_count; i++) -            dlog_print(DLOG_INFO, LOG_TAG, "(%d) Return value: %s ", -                       i, ret_value_list[i]); -    } else { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "The get operation for the request %d failed. -                    error message: %s", request_id, error); -    } + if (provider_ret) { + dlog_print(DLOG_INFO, LOG_TAG, + "The get operation is successful. Value count: %d ", + ret_value_count); + for (int i = 0; i < ret_value_count; i++) + dlog_print(DLOG_INFO, LOG_TAG, "(%d) Return value: %s ", + i, ret_value_list[i]); + } else { + dlog_print(DLOG_ERROR, LOG_TAG, + "The get operation for the request %d failed. + error message: %s", request_id, error); + } } /* Callback for the set operation response */ void map_set_response_cb(int request_id, data_control_h provider, bool provider_ret, -                    const char *error, void *user_data) + const char *error, void *user_data) { -    if (provider_ret) { -        dlog_print(DLOG_INFO, LOG_TAG, "The set operation is successful"); -    } else { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "The set operation for the request %d failed. -                    error message: %s", request_id, error); -    } + if (provider_ret) { + dlog_print(DLOG_INFO, LOG_TAG, "The set operation is successful"); + } else { + dlog_print(DLOG_ERROR, LOG_TAG, + "The set operation for the request %d failed. + error message: %s", request_id, error); + } } /* Callback for the add operation response */ void map_add_response_cb(int request_id, data_control_h provider, bool provider_ret, -                    const char *error, void *user_data) + const char *error, void *user_data) { -    if (provider_ret) { -        dlog_print(DLOG_INFO, LOG_TAG, "The add operation is successful"); -    } else { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "The add operation for the request %d failed. -                    error message: %s", request_id, error); -    } + if (provider_ret) { + dlog_print(DLOG_INFO, LOG_TAG, "The add operation is successful"); + } else { + dlog_print(DLOG_ERROR, LOG_TAG, + "The add operation for the request %d failed. + error message: %s", request_id, error); + } } /* Callback for the remove operation response */ void map_remove_response_cb(int request_id, data_control_h provider, bool provider_ret, -                       const char *error, void *user_data) + const char *error, void *user_data) { -    if (provider_ret) { -        dlog_print(DLOG_INFO, LOG_TAG, "The remove operation is successful"); -    } else { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "The remove operation for the request %d failed. -                    error message: %s", request_id, error); -    } + if (provider_ret) { + dlog_print(DLOG_INFO, LOG_TAG, "The remove operation is successful"); + } else { + dlog_print(DLOG_ERROR, LOG_TAG, + "The remove operation for the request %d failed. + error message: %s", request_id, error); + } } @@ -391,68 +391,68 @@ data_control_map_response_cb map_callback; void initialize_datacontrol_consumer(appdata_s *ad) { -    const char *provider_id = Your Provider ID; -    const char *data_id = "table"; -    int ret; - -    /* Create data control handler */ -    ret = data_control_map_create(&(ad->provider_h)); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "creating data control provider failed with error: %d", ret); -    ret = data_control_map_set_provider_id(ad->provider_h, provider_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "setting provider id failed with error: %d", ret); -    ret = data_control_map_set_data_id(ad->provider_h, data_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "setting data id failed with error: %d", ret); - -    /* Set response callbacks */ -    map_callback.get_cb = map_get_response_cb; -    map_callback.set_cb = map_set_response_cb; -    map_callback.add_cb = map_add_response_cb; -    map_callback.remove_cb = map_remove_response_cb; - -    /* Register response callbacks */ -    ret = data_control_map_register_response_cb(ad->provider_h, -                                                &map_callback, NULL); -    if (ret != DATA_CONTROL_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "Registering the callback function failed with error: %d", ret); - -        if (ret == DATA_CONTROL_ERROR_IO_ERROR) -            dlog_print(DLOG_ERROR, LOG_TAG, "I/O error"); -        else -            dlog_print(DLOG_ERROR, LOG_TAG, "Out of memory"); -    } - -    int req_id = 0; - -    /* Send a request to add a value */ -    const char *key = "key"; -    const char *value = "value"; -    data_control_map_add(ad->provider_h, key, value, &req_id); - -    /* Send a request to get a value */ -    data_control_map_get(ad->provider_h, key, &req_id); - -    /* Send a request to set a value */ -    const char *old_value = "old value"; -    const char *new_value = "new value"; -    data_control_map_set(ad->provider_h, key, old_value, new_value, &req_id); - -    /* Send a request to remove a value */ -    data_control_map_remove(ad->provider_h, key, value, &req_id); + const char *provider_id = Your Provider ID; + const char *data_id = "table"; + int ret; + + /* Create data control handler */ + ret = data_control_map_create(&(ad->provider_h)); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "creating data control provider failed with error: %d", ret); + ret = data_control_map_set_provider_id(ad->provider_h, provider_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "setting provider id failed with error: %d", ret); + ret = data_control_map_set_data_id(ad->provider_h, data_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "setting data id failed with error: %d", ret); + + /* Set response callbacks */ + map_callback.get_cb = map_get_response_cb; + map_callback.set_cb = map_set_response_cb; + map_callback.add_cb = map_add_response_cb; + map_callback.remove_cb = map_remove_response_cb; + + /* Register response callbacks */ + ret = data_control_map_register_response_cb(ad->provider_h, + &map_callback, NULL); + if (ret != DATA_CONTROL_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "Registering the callback function failed with error: %d", ret); + + if (ret == DATA_CONTROL_ERROR_IO_ERROR) + dlog_print(DLOG_ERROR, LOG_TAG, "I/O error"); + else + dlog_print(DLOG_ERROR, LOG_TAG, "Out of memory"); + } + + int req_id = 0; + + /* Send a request to add a value */ + const char *key = "key"; + const char *value = "value"; + data_control_map_add(ad->provider_h, key, value, &req_id); + + /* Send a request to get a value */ + data_control_map_get(ad->provider_h, key, &req_id); + + /* Send a request to set a value */ + const char *old_value = "old value"; + const char *new_value = "new value"; + data_control_map_set(ad->provider_h, key, old_value, new_value, &req_id); + + /* Send a request to remove a value */ + data_control_map_remove(ad->provider_h, key, value, &req_id); } static bool app_create(void *data) { -    initialize_datacontrol_consumer(ad); + initialize_datacontrol_consumer(ad); -    return true; + return true; } @@ -479,109 +479,109 @@ static sqlite3* db; /* Callback for handling the insert operation request */ void insert_request_cb(int request_id, data_control_h provider, bundle *insert_data, -                  void *user_data) + void *user_data) { -    char* command = data_control_provider_create_insert_statement(provider, -                                                                  insert_data); -    int ret = sqlite3_exec(db, command, NULL, NULL, NULL); - -    if (ret != SQLITE_OK) { -        data_control_provider_send_error(request_id, sqlite3_errmsg(db)); -        free(command); - -        return; -    } -    dlog_print(DLOG_INFO, LOG_TAG, "[insert_request_cb] insert success"); - -    long long inserted_row_id = sqlite3_last_insert_rowid(db); -    ret = data_control_provider_send_insert_result(request_id, inserted_row_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "insert_send_result failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "[insert_request_cb] send result success"); - -    free(command); + char* command = data_control_provider_create_insert_statement(provider, + insert_data); + int ret = sqlite3_exec(db, command, NULL, NULL, NULL); + + if (ret != SQLITE_OK) { + data_control_provider_send_error(request_id, sqlite3_errmsg(db)); + free(command); + + return; + } + dlog_print(DLOG_INFO, LOG_TAG, "[insert_request_cb] insert success"); + + long long inserted_row_id = sqlite3_last_insert_rowid(db); + ret = data_control_provider_send_insert_result(request_id, inserted_row_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "insert_send_result failed with error: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "[insert_request_cb] send result success"); + + free(command); } /* Callback for handling the select operation request */ void select_request_cb(int request_id, data_control_h provider, -                  const char **column_list, int column_count, const char *where, -                  const char *order, void *user_data) + const char **column_list, int column_count, const char *where, + const char *order, void *user_data) { -    sqlite3_stmt* sql_stmt = NULL; - -    char* command = data_control_provider_create_select_statement(provider, -                                                                  column_list, -                                                                  column_count, -                                                                  where, -                                                                  order); -    int ret = sqlite3_prepare_v2(db, command, strlen(command), &sql_stmt, NULL); -    if (ret != SQLITE_OK) { -        data_control_provider_send_error(request_id, sqlite3_errmsg(db)); -        free(command); - -        return; -    } - -    ret = data_control_provider_send_select_result(request_id, (void *)sql_stmt); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "select_send_result failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "[select_request_cb] send result success"); - -    sqlite3_finalize(sql_stmt); -    free(command); + sqlite3_stmt* sql_stmt = NULL; + + char* command = data_control_provider_create_select_statement(provider, + column_list, + column_count, + where, + order); + int ret = sqlite3_prepare_v2(db, command, strlen(command), &sql_stmt, NULL); + if (ret != SQLITE_OK) { + data_control_provider_send_error(request_id, sqlite3_errmsg(db)); + free(command); + + return; + } + + ret = data_control_provider_send_select_result(request_id, (void *)sql_stmt); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "select_send_result failed with error: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "[select_request_cb] send result success"); + + sqlite3_finalize(sql_stmt); + free(command); } /* Callback for handling the update operation request */ void update_request_cb(int request_id, data_control_h provider, bundle *update_data, -                  const char *where, void *user_data) + const char *where, void *user_data) { -    char* command = data_control_provider_create_update_statement(provider, -                                                                  update_data, -                                                                  where); -    int ret = sqlite3_exec(db, command, NULL, NULL, NULL); -    if (ret != SQLITE_OK) { -        data_control_provider_send_error(request_id, sqlite3_errmsg(db)); -        free(command); - -        return; -    } - -    ret = data_control_provider_send_update_result(request_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "update_send_result failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "[update_request_cb] send result success"); - -    free(command); + char* command = data_control_provider_create_update_statement(provider, + update_data, + where); + int ret = sqlite3_exec(db, command, NULL, NULL, NULL); + if (ret != SQLITE_OK) { + data_control_provider_send_error(request_id, sqlite3_errmsg(db)); + free(command); + + return; + } + + ret = data_control_provider_send_update_result(request_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "update_send_result failed with error: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "[update_request_cb] send result success"); + + free(command); } /* Callback for handling the delete operation request */ void delete_request_cb(int request_id, data_control_h provider, const char *where, -                  void *user_data) + void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, -               "[delete_request_cb] request_id(%d)", request_id); -    char* command = data_control_provider_create_delete_statement(provider, where); -    int ret = sqlite3_exec(db, command, NULL, NULL, NULL); -    if (ret != SQLITE_OK) { -        data_control_provider_send_error(request_id, sqlite3_errmsg(db)); -        free(command); - -        return; -    } - -    ret = data_control_provider_send_delete_result(request_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "delete_send_result failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "[delete_request_cb] delete success"); - -    free(command); + dlog_print(DLOG_INFO, LOG_TAG, + "[delete_request_cb] request_id(%d)", request_id); + char* command = data_control_provider_create_delete_statement(provider, where); + int ret = sqlite3_exec(db, command, NULL, NULL, NULL); + if (ret != SQLITE_OK) { + data_control_provider_send_error(request_id, sqlite3_errmsg(db)); + free(command); + + return; + } + + ret = data_control_provider_send_delete_result(request_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "delete_send_result failed with error: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "[delete_request_cb] delete success"); + + free(command); } @@ -591,58 +591,58 @@ delete_request_cb(int request_id, data_control_h provider, const char *where, int create_database() { -    dlog_print(DLOG_INFO, LOG_TAG, "%s%s", app_get_data_path(), "test.db"); + dlog_print(DLOG_INFO, LOG_TAG, "%s%s", app_get_data_path(), "test.db"); -    int open_flags = (SQLITE_OPEN_READWRITE | SQLITE_OPEN_CREATE); + int open_flags = (SQLITE_OPEN_READWRITE | SQLITE_OPEN_CREATE); -    int ret = sqlite3_open_v2(Your DB Path, &db, open_flags, NULL); -    if (ret != SQLITE_OK) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "database creation failed with error: %d", ret); + int ret = sqlite3_open_v2(Your DB Path, &db, open_flags, NULL); + if (ret != SQLITE_OK) { + dlog_print(DLOG_ERROR, LOG_TAG, + "database creation failed with error: %d", ret); -        return ret; -    } + return ret; + } -    char* sql_command = "CREATE TABLE IF NOT EXISTS Dictionary (WORD VARCHAR(30), -                         WORD_DESC TEXT, WORD_NUM INT, Point INT)"; -    ret = sqlite3_exec(db, sql_command, NULL, NULL, NULL); -    if (ret != SQLITE_OK) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "database table creation failed with error: %d", ret); + char* sql_command = "CREATE TABLE IF NOT EXISTS Dictionary (WORD VARCHAR(30), + WORD_DESC TEXT, WORD_NUM INT, Point INT)"; + ret = sqlite3_exec(db, sql_command, NULL, NULL, NULL); + if (ret != SQLITE_OK) + dlog_print(DLOG_ERROR, LOG_TAG, + "database table creation failed with error: %d", ret); -    sql_command = "CREATE TABLE IF NOT EXISTS Note -                   (TITLE VARCHAR(30), CONTENTS TEXT)"; -    ret = sqlite3_exec(db, sql_command, NULL, NULL, NULL); -    if (ret != SQLITE_OK) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "database table creation failed with error: %d", ret); + sql_command = "CREATE TABLE IF NOT EXISTS Note + (TITLE VARCHAR(30), CONTENTS TEXT)"; + ret = sqlite3_exec(db, sql_command, NULL, NULL, NULL); + if (ret != SQLITE_OK) + dlog_print(DLOG_ERROR, LOG_TAG, + "database table creation failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "DB init Success."); + dlog_print(DLOG_INFO, LOG_TAG, "DB init Success."); -    return ret; + return ret; } void initialize_datacontrol_provider() { -    dlog_print(DLOG_INFO, LOG_TAG, "initialize_datacontrol_provider"); - -    int result = create_database(); -    if (result != SQLITE_OK) -        return; - -    sql_callback = -        (data_control_provider_sql_cb *)malloc(sizeof(data_control_provider_sql_cb)); -    sql_callback->select_cb = select_request_cb; -    sql_callback->insert_cb = insert_request_cb; -    sql_callback->delete_cb = delete_request_cb; -    sql_callback->update_cb = update_request_cb; -    result = data_control_provider_sql_register_cb(sql_callback, NULL); -    if (result != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, -                   "data_control_sql_response_c failed with error: %d", result); -    else -        dlog_print(DLOG_INFO, LOG_TAG, "Provider SQL register success"); + dlog_print(DLOG_INFO, LOG_TAG, "initialize_datacontrol_provider"); + + int result = create_database(); + if (result != SQLITE_OK) + return; + + sql_callback = + (data_control_provider_sql_cb *)malloc(sizeof(data_control_provider_sql_cb)); + sql_callback->select_cb = select_request_cb; + sql_callback->insert_cb = insert_request_cb; + sql_callback->delete_cb = delete_request_cb; + sql_callback->update_cb = update_request_cb; + result = data_control_provider_sql_register_cb(sql_callback, NULL); + if (result != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, + "data_control_sql_response_c failed with error: %d", result); + else + dlog_print(DLOG_INFO, LOG_TAG, "Provider SQL register success"); } @@ -651,77 +651,77 @@ initialize_datacontrol_provider()
    1. The consumer sends requests for the insert, select, update, and delete operations to the provider, and receives the results as a response from the provider.

      Implement the response callbacks, which receive the request result and data from the provider:

      - + 
       /* Callback for the insert operation response */
 void
 sql_insert_response_cb(int request_id, data_control_h provider,
-                       long long inserted_row_id, bool provider_result,
-                       const char *error, void *user_data)
+                       long long inserted_row_id, bool provider_result,
+                       const char *error, void *user_data)
 {
-    if (provider_result) {
-        dlog_print(DLOG_INFO, LOG_TAG, "The insert operation is successful");
-    } else {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "The insert operation for the request %d failed.
-                    error message: %s", request_id, error);
-    }
+    if (provider_result) {
+        dlog_print(DLOG_INFO, LOG_TAG, "The insert operation is successful");
+    } else {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "The insert operation for the request %d failed.
+                    error message: %s", request_id, error);
+    }
 }
 
 /* Callback for the select operation response */
 void
 sql_select_response_cb(int request_id, data_control_h provider,
-                       result_set_cursor cursor, bool provider_result,
-                       const char *error, void *user_data)
+                       result_set_cursor cursor, bool provider_result,
+                       const char *error, void *user_data)
 {
-    if (provider_result) {
-        dlog_print(DLOG_INFO, LOG_TAG, "The select operation is successful");
-    } else {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "The select operation for the request %d failed.
-                    error message: %s", request_id, error);
-    }
-
-    while (data_control_sql_step_next(cursor) == DATA_CONTROL_ERROR_NONE) {
-        char word[32] = {0,};
-        char word_desc[32] = {0,};
-        long long word_number = -1;
-
-        data_control_sql_get_text_data(cursor, 0, word);
-        data_control_sql_get_text_data(cursor, 1, word_desc);
-        data_control_sql_get_int64_data(cursor, 2, &word_number);
-
-        dlog_print(DLOG_INFO, LOG_TAG, "Word: %s, Word DESC: %s, Word NUM: %ld ",
-                   word, word_desc, word_number);
-    }
+    if (provider_result) {
+        dlog_print(DLOG_INFO, LOG_TAG, "The select operation is successful");
+    } else {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "The select operation for the request %d failed.
+                    error message: %s", request_id, error);
+    }
+
+    while (data_control_sql_step_next(cursor) == DATA_CONTROL_ERROR_NONE) {
+        char word[32] = {0,};
+        char word_desc[32] = {0,};
+        long long word_number = -1;
+
+        data_control_sql_get_text_data(cursor, 0, word);
+        data_control_sql_get_text_data(cursor, 1, word_desc);
+        data_control_sql_get_int64_data(cursor, 2, &word_number);
+
+        dlog_print(DLOG_INFO, LOG_TAG, "Word: %s, Word DESC: %s, Word NUM: %ld ",
+                   word, word_desc, word_number);
+    }
 }
 
 /* Callback for the update operation response */
 void
 sql_update_response_cb(int request_id, data_control_h provider,
-                       bool provider_result, const char *error, void *user_data)
+                       bool provider_result, const char *error, void *user_data)
 {
-    if (provider_result) {
-        dlog_print(DLOG_INFO, LOG_TAG, "The update operation is successful");
-    } else {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "The update operation for the request %d failed.
-                    error message: %s", request_id, error);
-    }
+    if (provider_result) {
+        dlog_print(DLOG_INFO, LOG_TAG, "The update operation is successful");
+    } else {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "The update operation for the request %d failed.
+                    error message: %s", request_id, error);
+    }
 }
 
 /* Callback for the delete operation response */
 void
 sql_delete_response_cb(int request_id, data_control_h provider,
-                       bool provider_result, const char *error, void *user_data)
+                       bool provider_result, const char *error, void *user_data)
 {
-    if (provider_result) {
-        dlog_print(DLOG_INFO, LOG_TAG, "The delete operation is successful");
-    } else {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "The delete operation for the request %d failed.
-                    error message: %s", request_id, error);
-    }
+    if (provider_result) {
+        dlog_print(DLOG_INFO, LOG_TAG, "The delete operation is successful");
+    } else {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "The delete operation for the request %d failed.
+                    error message: %s", request_id, error);
+    }
 }

      Once you get the result_set_cursor object in the select operation response callback, you can use the following functions to get information:

      @@ -745,88 +745,88 @@ data_control_sql_response_cb sql_callback; void initialize_datacontrol_consumer(appdata_s *ad) { -    int ret; + int ret; -    const char *provider_id = Your Provider ID; -    const char *data_id = "Dictionary"; + const char *provider_id = Your Provider ID; + const char *data_id = "Dictionary"; -    /* Create data control handler */ -    ret = data_control_sql_create(&(ad->provider_h)); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "creating data control provider failed with error: %d", ret); + /* Create data control handler */ + ret = data_control_sql_create(&(ad->provider_h)); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "creating data control provider failed with error: %d", ret); -    ret = data_control_sql_set_provider_id(ad->provider_h, provider_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "setting provider id failed with error: %d", ret); + ret = data_control_sql_set_provider_id(ad->provider_h, provider_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "setting provider id failed with error: %d", ret); -    ret = data_control_sql_set_data_id(ad->provider_h, data_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "setting data id failed with error: %d", ret); + ret = data_control_sql_set_data_id(ad->provider_h, data_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "setting data id failed with error: %d", ret); -    /* Set response callbacks */ -    sql_callback.delete_cb = sql_delete_response_cb; -    sql_callback.insert_cb = sql_insert_response_cb; -    sql_callback.select_cb = sql_select_response_cb; -    sql_callback.update_cb = sql_update_response_cb; + /* Set response callbacks */ + sql_callback.delete_cb = sql_delete_response_cb; + sql_callback.insert_cb = sql_insert_response_cb; + sql_callback.select_cb = sql_select_response_cb; + sql_callback.update_cb = sql_update_response_cb; -    /* Register response callbacks */ -    ret = data_control_sql_register_response_cb(ad->provider_h, -                                                &sql_callback, NULL); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "Registering the callback function failed with error: %d", ret); + /* Register response callbacks */ + ret = data_control_sql_register_response_cb(ad->provider_h, + &sql_callback, NULL); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "Registering the callback function failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "Init data control success"); + dlog_print(DLOG_INFO, LOG_TAG, "Init data control success"); -    int req_id = 0; + int req_id = 0; -    /* Send a request to insert a row */ -    bundle *b = bundle_create(); -    bundle_add_str(b, "WORD", "'test'"); -    bundle_add_str(b, "WORD_DESC", "'test desc'"); + /* Send a request to insert a row */ + bundle *b = bundle_create(); + bundle_add_str(b, "WORD", "'test'"); + bundle_add_str(b, "WORD_DESC", "'test desc'"); -    data_control_sql_insert(ad->provider_h, b, &req_id); + data_control_sql_insert(ad->provider_h, b, &req_id); -    /* Send a request to select a row */ -    char *column_list[2]; -    column_list[0] = "WORD"; -    column_list[1] = "WORD_DESC"; + /* Send a request to select a row */ + char *column_list[2]; + column_list[0] = "WORD"; + column_list[1] = "WORD_DESC"; -    const char *where = "WORD = 'test'"; -    const char *order = "WORD ASC"; + const char *where = "WORD = 'test'"; + const char *order = "WORD ASC"; -    data_control_sql_select(ad->provider_h, column_list, 2, where, order, &req_id); + data_control_sql_select(ad->provider_h, column_list, 2, where, order, &req_id); -    /* Send a request to add a row */ -    bundle_add_str(b, "WORD", "'test_new'"); -    data_control_sql_update(ad->provider_h, b, where, &req_id); + /* Send a request to add a row */ + bundle_add_str(b, "WORD", "'test_new'"); + data_control_sql_update(ad->provider_h, b, where, &req_id); -    /* Send a request to delete a row */ -    const char *where_delete = "WORD = 'test'"; -    result = data_control_sql_delete(ad->provider_h, where_delete, &req_id); + /* Send a request to delete a row */ + const char *where_delete = "WORD = 'test'"; + result = data_control_sql_delete(ad->provider_h, where_delete, &req_id); -    /* Free memory */ -    bundle_free(b); + /* Free memory */ + bundle_free(b); } static bool app_create(void *data) { -    /* -     Take necessary actions before main event loop starts -     Initialize UI resources and application data -     If this function returns true, the main loop of application starts -     If this function returns false, the application is terminated -    */ -    appdata_s *ad = data; - -    create_base_gui(ad); -    initialize_datacontrol_consumer(ad); - -    return true; + /* + Take necessary actions before main event loop starts + Initialize UI resources and application data + If this function returns true, the main loop of application starts + If this function returns false, the application is terminated + */ + appdata_s *ad = data; + + create_base_gui(ad); + initialize_datacontrol_consumer(ad); + + return true; }
      2. @@ -834,32 +834,32 @@ app_create(void *data)

      To send requests to a specific table, use the data_control_sql_set_data_id() function:

       {
-    bundle *b;
-    int ret;
-
-    /* Insert data to the Note table */
-    ret = data_control_sql_set_data_id(ad->provider_h, "Note");
-    if (ret != DATA_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "setting data id failed with error: %d", ret);
-
-    b = bundle_create();
-    bundle_add_str(b, "TITLE", "'test'");
-    bundle_add_str(b, "CONTENTS", "'test contents'");
-    data_control_sql_insert(ad->provider_h, b, &req_id);
-    bundle_free(b);
-
-    /* Insert data to the Dictionary table */
-    ret = data_control_sql_set_data_id(ad->provider_h, "Dictionary");
-    if (ret != DATA_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "setting data id failed with error: %d", ret);
-
-    b = bundle_create();
-    bundle_add_str(b, "WORD", "'test'");
-    bundle_add_str(b, "WORD_DESC", "'test desc'");
-    data_control_sql_insert(ad->provider_h, b, &req_id);
-    bundle_free(b);
+    bundle *b;
+    int ret;
+
+    /* Insert data to the Note table */
+    ret = data_control_sql_set_data_id(ad->provider_h, "Note");
+    if (ret != DATA_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "setting data id failed with error: %d", ret);
+
+    b = bundle_create();
+    bundle_add_str(b, "TITLE", "'test'");
+    bundle_add_str(b, "CONTENTS", "'test contents'");
+    data_control_sql_insert(ad->provider_h, b, &req_id);
+    bundle_free(b);
+
+    /* Insert data to the Dictionary table */
+    ret = data_control_sql_set_data_id(ad->provider_h, "Dictionary");
+    if (ret != DATA_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "setting data id failed with error: %d", ret);
+
+    b = bundle_create();
+    bundle_add_str(b, "WORD", "'test'");
+    bundle_add_str(b, "WORD_DESC", "'test desc'");
+    data_control_sql_insert(ad->provider_h, b, &req_id);
+    bundle_free(b);
 }
      @@ -867,7 +867,7 @@ app_create(void *data)

    Monitoring Data Changes

    -

    If the consumer wants to receive data change notifications from the provider, it can request notifications with a data change callback:

    +

    If the consumer wants to receive data change notifications from the provider, it can request notifications with a data change callback:

    • The consumer can add a data change callback using the data_control_add_data_change_cb() function. When no longer needed, the callback can be removed using the data_control_remove_data_change_cb() function.
    • To accept the callback addition and notification request from the consumer, the provider uses the data_control_provider_add_data_change_consumer_filter_cb() function to add a notification filter. When no longer needed, the filter can be removed using the data_control_provider_remove_data_change_consumer_filter_cb() function.
      • @@ -878,49 +878,49 @@ app_create(void *data)
      1. Implement monitoring in the provider application. -

        When the provider's data changes, the provider can send information about the changed data to the consumers who have registered a data change notification callback.

        +

        When the provider's data changes, the provider can send information about the changed data to the consumers who have registered a data change notification callback.

        When a consumer attempts to register a data change notification callback, the provider can decide whether to allow it.

         bool
 change_noti_consumer_list_cb(data_control_h provider, char *consumer_appid,
-                             void *user_data)
+                             void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "Added change noti consumer appid: %s", consumer_appid);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "Added change noti consumer appid: %s", consumer_appid);
 
-    return true;
+    return true;
 }
 
 bool
 consumer_filter_cb_1(data_control_h provider, char *consumer_appid, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "consumer appid %s try to add data change callback", consumer_appid);
-    if (strcmp(consumer_appid, "org.tizen.helloworld_consumer2") == 0) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Invalid appid: %s", consumer_appid);
-
-        return false;
-    }
-    data_control_provider_foreach_data_change_consumer(provider,
-                                                       &change_noti_consumer_list_cb,
-                                                       NULL);
-
-    return true;
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "consumer appid %s try to add data change callback", consumer_appid);
+    if (strcmp(consumer_appid, "org.tizen.helloworld_consumer2") == 0) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Invalid appid: %s", consumer_appid);
+
+        return false;
+    }
+    data_control_provider_foreach_data_change_consumer(provider,
+                                                       &change_noti_consumer_list_cb,
+                                                       NULL);
+
+    return true;
 }
 
 bool
 consumer_filter_cb_2(data_control_h provider, char *consumer_appid, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "consumer appid %s try to add data change callback", consumer_appid);
-    if (strcmp(consumer_appid, "org.tizen.helloworld_consumer3") == 0) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Invalid appid: %s", consumer_appid);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "consumer appid %s try to add data change callback", consumer_appid);
+    if (strcmp(consumer_appid, "org.tizen.helloworld_consumer3") == 0) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Invalid appid: %s", consumer_appid);
 
-        return false;
-    }
+        return false;
+    }
 
-    return true;
+    return true;
 }
 
 /* Add the filter for the accepted callback registration */
@@ -928,61 +928,61 @@ int filter_callback_id_1;
 int filter_callback_id_2;
 void
 add_consumer_filter_cb_func(void *data, Evas_Object *obj EINA_UNUSED,
-                            void *event_info EINA_UNUSED)
+                            void *event_info EINA_UNUSED)
 {
-    data_control_provider_add_data_change_consumer_filter_cb(consumer_filter_cb_1,
-                                                             NULL,
-                                                             &filter_callback_id_1);
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "filter_callback_id_1 id: %d", filter_callback_id_1);
-
-    data_control_provider_add_data_change_consumer_filter_cb(consumer_filter_cb_2,
-                                                             NULL,
-                                                             &filter_callback_id_2);
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "filter_callback_id_2 id: %d", filter_callback_id_2);
+    data_control_provider_add_data_change_consumer_filter_cb(consumer_filter_cb_1,
+                                                             NULL,
+                                                             &filter_callback_id_1);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "filter_callback_id_1 id: %d", filter_callback_id_1);
+
+    data_control_provider_add_data_change_consumer_filter_cb(consumer_filter_cb_2,
+                                                             NULL,
+                                                             &filter_callback_id_2);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "filter_callback_id_2 id: %d", filter_callback_id_2);
 }
 
 /* Remove the filter */
 void
 remove_consumer_filter_cb_func(void *data, Evas_Object *obj EINA_UNUSED,
-                               void *event_info EINA_UNUSED)
+                               void *event_info EINA_UNUSED)
 {
-    data_control_provider_remove_data_change_consumer_filter_cb(filter_callback_id_1);
-    dlog_print(DLOG_INFO, LOG_TAG, "remove callback %d", filter_callback_id_1);
+    data_control_provider_remove_data_change_consumer_filter_cb(filter_callback_id_1);
+    dlog_print(DLOG_INFO, LOG_TAG, "remove callback %d", filter_callback_id_1);
 
-    data_control_provider_remove_data_change_consumer_filter_cb(filter_callback_id_2);
-    dlog_print(DLOG_INFO, LOG_TAG, "remove callback %d", filter_callback_id_2);
+    data_control_provider_remove_data_change_consumer_filter_cb(filter_callback_id_2);
+    dlog_print(DLOG_INFO, LOG_TAG, "remove callback %d", filter_callback_id_2);
 }
 
 /* Send a data change notification */
 void
 update_request_cb(int request_id, data_control_h provider, bundle *update_data,
-                  const char *where, void *user_data)
+                  const char *where, void *user_data)
 {
-    char* command = data_control_provider_create_update_statement(provider,
-                                                                  update_data, where);
-    int ret = sqlite3_exec(db, command, NULL, NULL, NULL);
-    if (ret != SQLITE_OK) {
-        data_control_provider_send_error(request_id, sqlite3_errmsg(db));
-        free(command);
-
-        return;
-    }
-
-    ret = data_control_provider_send_update_result(request_id);
-    if (ret != DATA_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "update_send_result failed with error: %d", ret);
-    dlog_print(DLOG_INFO, LOG_TAG, "[update_request_cb] send result success");
-
-    data_control_provider_send_data_change_noti(provider,
-                                                DATA_CONTROL_DATA_CHANGE_SQL_UPDATE,
-                                                update_data);
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "[send data change notification] Notify data change");
-
-    free(command);
+    char* command = data_control_provider_create_update_statement(provider,
+                                                                  update_data, where);
+    int ret = sqlite3_exec(db, command, NULL, NULL, NULL);
+    if (ret != SQLITE_OK) {
+        data_control_provider_send_error(request_id, sqlite3_errmsg(db));
+        free(command);
+
+        return;
+    }
+
+    ret = data_control_provider_send_update_result(request_id);
+    if (ret != DATA_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "update_send_result failed with error: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "[update_request_cb] send result success");
+
+    data_control_provider_send_data_change_noti(provider,
+                                                DATA_CONTROL_DATA_CHANGE_SQL_UPDATE,
+                                                update_data);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "[send data change notification] Notify data change");
+
+    free(command);
 }
        2. @@ -994,25 +994,25 @@ update_request_cb(int request_id, data_control_h provider, bundle *update_data, /* Triggered when the data change notification arrives */ void data_change_cb(data_control_h provider, data_control_data_change_type_e type, -               bundle *data, void *user_data) + bundle *data, void *user_data) { -    char *word; -    char *word_desc; -    char *word_num; - -    bundle_get_str(data, "WORD", &word); -    bundle_get_str(data, "WORD_DESC", &word_desc); -    bundle_get_str(data, "WORD_NUM", &word_num); -    dlog_print(DLOG_INFO, LOG_TAG, "%d type noti, changed data: %s, %s, %s", -               type, word, word_desc, word_num); + char *word; + char *word_desc; + char *word_num; + + bundle_get_str(data, "WORD", &word); + bundle_get_str(data, "WORD_DESC", &word_desc); + bundle_get_str(data, "WORD_NUM", &word_num); + dlog_print(DLOG_INFO, LOG_TAG, "%d type noti, changed data: %s, %s, %s", + type, word, word_desc, word_num); } /* Triggered when the provider has accepted the callback registration */ void result_cb(data_control_h provider, data_control_error_e result, int callback_id, -          void *user_data) + void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "Add data change callback RESULT: %d", result); + dlog_print(DLOG_INFO, LOG_TAG, "Add data change callback RESULT: %d", result); } /* Register the callback */ @@ -1020,99 +1020,99 @@ int cb_id; void add_data_change_cb_func(void *data, Evas_Object *obj, void *event_info) { -    appdata_s *ad = (appdata_s *)data; -    int ret = data_control_add_data_change_cb(ad->provider_h, data_change_cb, NULL, -                                              result_cb, NULL, &cb_id); -    if (ret != DATA_CONTROL_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "add data change callback failed with error: %d", ret); -    dlog_print(DLOG_INFO, LOG_TAG, "add data change callback done: %d", cb_id); + appdata_s *ad = (appdata_s *)data; + int ret = data_control_add_data_change_cb(ad->provider_h, data_change_cb, NULL, + result_cb, NULL, &cb_id); + if (ret != DATA_CONTROL_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, + "add data change callback failed with error: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add data change callback done: %d", cb_id); } /* Remove the callback */ void remove_data_change_cb_func(void *data, Evas_Object *obj, void *event_info) { -    appdata_s *ad = (appdata_s *)data; -    data_control_remove_data_change_cb(ad->provider_h, cb_id); -    dlog_print(DLOG_INFO, LOG_TAG, "remove data change callback done: %d", cb_id); + appdata_s *ad = (appdata_s *)data; + data_control_remove_data_change_cb(ad->provider_h, cb_id); + dlog_print(DLOG_INFO, LOG_TAG, "remove data change callback done: %d", cb_id); }
      -

      Data Control Export

      +

      Data Control Export

      -

      You can export the provider functionalities of your Tizen native service application in the application project settings in the Tizen Studio. The provider ID, type, and accessibility must be specified for the available data control.

      -

      Figure: Exporting data control

      -

      Exporting data control

      -

      The data model must be opened to the public to help other applications to use the exported data controls. The data model consists of the following data:

      +

      You can export the provider functionalities of your Tizen native service application in the application project settings in the Tizen Studio. The provider ID, type, and accessibility must be specified for the available data control.

      +

      Figure: Exporting data control

      +

      Exporting data control

      +

      The data model must be opened to the public to help other applications to use the exported data controls. The data model consists of the following data:

        -
      • Provider ID +
      • Provider ID
          -
        • It is used for identifying the data control provider.
          • +
        • It is used for identifying the data control provider.
        • It must be unique and use a fully-qualified domain name.
          • -
        • It must consist of alpha-numeric letters separated with the period (".") character, and it must start with a letter.
          • -
        • Platform-defined data control provider is defined in the http://tizen.org/datacontrol/provider/<application name> format.
          • -
        • User-defined data control provider is defined in the http://<vendor.com>/datacontrol/provider/<application name> format.
          • +
        • It must consist of alpha-numeric letters separated with the period (".") character, and it must start with a letter.
          • +
        • Platform-defined data control provider is defined in the http://tizen.org/datacontrol/provider/<application name> format.
          • +
        • User-defined data control provider is defined in the http://<vendor.com>/datacontrol/provider/<application name> format.
        -
        • -
      • Data ID +
        • +
      • Data ID
          -
        • It is used for identifying data (usually a database table name or a registry section name) exported by the data control provider.
          • -
        • It must be unique in the data control provider and it is given as a string of one or more components, separated by a slash ("/") character.
          • +
        • It is used for identifying data (usually a database table name or a registry section name) exported by the data control provider.
          • +
        • It must be unique in the data control provider and it is given as a string of one or more components, separated by a slash ("/") character.
        -
        • -
      • Type +
        • +
      • Type
          -
        • You can use Tizen native applications that provide their own data structure table and implement the SQL-type data control provider using the database file.
          • -
        • You can use Tizen native applications that provide their own key-value pairs data structure map and implement the map-type data control provider using registry file or collection map classes.
          • +
        • You can use Tizen native applications that provide their own data structure table and implement the SQL-type data control provider using the database file.
          • +
        • You can use Tizen native applications that provide their own key-value pairs data structure map and implement the map-type data control provider using registry file or collection map classes.
        -
        • -
      • Data schema +
        • +
      • Data schema
          -
        • SQL-type data control exports column names and types of the data structure table.
          • -
        • Map-type data control exports key names and types of the data structure map.
          • +
        • SQL-type data control exports column names and types of the data structure table.
          • +
        • Map-type data control exports key names and types of the data structure map.
        -
        • -
      • Data accessibility

        Tizen native applications can control read and write access from other applications by defining data control accessibility.

        • + +
      • Data accessibility

        Tizen native applications can control read and write access from other applications by defining data control accessibility.

      - -

      Table: Data model example of a data control provider

      + +

      Table: Data model example of a data control provider

      - - - - - + + + + + - - - + + + +

      (Type: Integer)

      - +

      (Type: String)

      + - - - + + + +

      (Type: String)

      - +

      (Type: String)

      +
      Data control typeData control provider IDData control data IDData schemaData accessibilityData control typeData control provider IDData control data IDData schemaData accessibility
      SQLhttp://<vendor.com>/datacontrol/provider/sampledata1SQLhttp://<vendor.com>/datacontrol/provider/sampledata1 column1 -

      (Type: Integer)

      		 column2 -

      (Type: String)

      		Read-Only Read-Only
      Maphttp://<vendor.com>/datacontrol/provider/sample2data2Maphttp://<vendor.com>/datacontrol/provider/sample2data2 key1 -

      (Type: String)

      		 key2 -

      (Type: String)

      		Read-Write Read-Write
      - + diff --git a/org.tizen.guides/html/native/app_management/efl_app_n.htm b/org.tizen.guides/html/native/app_management/efl_app_n.htm index e00f87c..023c1e0 100644 --- a/org.tizen.guides/html/native/app_management/efl_app_n.htm +++ b/org.tizen.guides/html/native/app_management/efl_app_n.htm @@ -5,13 +5,13 @@ - + - EFL Applications + EFL Applications @@ -20,7 +20,7 @@

      Mobile native Wearable native

      - +

      Dependencies

      -
    +

    EFL Applications

    - +

    You can use the Enlightenment Foundation Libraries (EFL) to create a 2D-based Tizen native application. However, EFL supports 2.5D and 3D effects and 3D objects as well. For 3D-based Tizen native applications, you can use the Dynamic Animation Library (DALi) UI toolkit as well.

    - -

    EFL is a collection of libraries that are independent or can build on top of each-other. They provide useful features that complement an OS's existing environment, rather than wrap and abstract it, trying to be their own environment and OS in its entirety. This means that EFL expects you to use other system libraries and APIs in conjunction with EFL libraries to provide a whole working application or library - simply using EFL as a set of convenient pre-made libraries to accomplish a whole host of complex or painful tasks for you.

    + +

    EFL is a collection of libraries that are independent or can build on top of each-other. They provide useful features that complement an OS's existing environment, rather than wrap and abstract it, trying to be their own environment and OS in its entirety. This means that EFL expects you to use other system libraries and APIs in conjunction with EFL libraries to provide a whole working application or library - simply using EFL as a set of convenient pre-made libraries to accomplish a whole host of complex or painful tasks for you.

    Basic Fundamentals

    @@ -72,7 +72,7 @@

    Application Types

    -

    With the EFL UI, you can create the following application types:

    +

    With the EFL UI, you can create the following application types:

    • Basic UI application @@ -88,7 +88,7 @@

      The widget application is available for both mobile and wearable devices.

    - +
    diff --git a/org.tizen.guides/html/native/app_management/efl_ui_app_n.htm b/org.tizen.guides/html/native/app_management/efl_ui_app_n.htm index 7be912c..98f666d 100644 --- a/org.tizen.guides/html/native/app_management/efl_ui_app_n.htm +++ b/org.tizen.guides/html/native/app_management/efl_ui_app_n.htm @@ -5,13 +5,13 @@ - + - EFL Basic UI Application + EFL Basic UI Application @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - + -
    +

    EFL Basic UI Application

    - +

    To create an EFL basic UI application, you must:

    • Define the the application fundamentals, mainly the entry point and life-cycle callbacks. @@ -58,110 +58,110 @@

      The following table lists the application state change events.

      Table: Application state change events

      - - - - - - - - - - - - - - - - - - - - - - - +
      CallbackDescription
      app_create_cb()Used to take necessary actions before the main event loop starts. Place the UI generation code here to prevent missing any events from your application UI.
      app_pause_cb()Used to take necessary actions when the application becomes invisible. For example, release memory resources so other applications can use them. Do not starve the foreground application that is interacting with the user.
      app_resume_cb()Used to take necessary actions when the application becomes visible. If you relinquish anything in the app_pause_cb() callback, re-allocate those resources here before the application resumes.
      app_terminate_cb()Used to take necessary actions when the application is terminating. Release all resources, especially any allocations and shared resources, so that other running applications can fully use any shared resources.
      + + + + + + + + + + + + + + + + + + + + + +
      CallbackDescription
      app_create_cb()Used to take necessary actions before the main event loop starts. Place the UI generation code here to prevent missing any events from your application UI.
      app_pause_cb()Used to take necessary actions when the application becomes invisible. For example, release memory resources so other applications can use them. Do not starve the foreground application that is interacting with the user.
      app_resume_cb()Used to take necessary actions when the application becomes visible. If you relinquish anything in the app_pause_cb() callback, re-allocate those resources here before the application resumes.
      app_terminate_cb()Used to take necessary actions when the application is terminating. Release all resources, especially any allocations and shared resources, so that other running applications can fully use any shared resources.
      - +

      For more information, see Application State and Transition Management.

      To listen to system events, use the ui_app_add_event_handler() function. The system events are triggered with the app_event_cb() callback function. The following table lists the event types.

      Table: Event types

      - - - - - - - - - - - - - - - - - - - - - - - - - - +
      Event typeDescription
      APP_EVENT_LOW_MEMORYEvent type for the callback function that is responsible for saving data in the main memory to a persistent memory or storage to avoid data loss in case the Tizen platform Low Memory Killer kills your application to get more free memory. The callback function must also release any cached data in the main memory to secure more free memory.
      APP_EVENT_LOW_BATTERYEvent type for the callback function that is responsible for saving data in the main memory to a persistent memory or storage to avoid data loss in case the power goes off completely. The callback function must also stop heavy CPU consumption or power consumption activities to save the remaining power.
      APP_EVENT_DEVICE_ORIENTATION_CHANGEDEvent type for the callback function that is responsible for changing the display orientation to match the device orientation.
      APP_EVENT_LANGUAGE_CHANGEDEvent type for the callback function that is responsible for refreshing the display into the new language.
      APP_EVENT_REGION_FORMAT_CHANGEDEvent type for the callback function that is responsible for refreshing the display into the new time zone.
      + + + + + + + + + + + + + + + + + + + + + + + + + - - + + - -
      Event typeDescription
      APP_EVENT_LOW_MEMORYEvent type for the callback function that is responsible for saving data in the main memory to a persistent memory or storage to avoid data loss in case the Tizen platform Low Memory Killer kills your application to get more free memory. The callback function must also release any cached data in the main memory to secure more free memory.
      APP_EVENT_LOW_BATTERYEvent type for the callback function that is responsible for saving data in the main memory to a persistent memory or storage to avoid data loss in case the power goes off completely. The callback function must also stop heavy CPU consumption or power consumption activities to save the remaining power.
      APP_EVENT_DEVICE_ORIENTATION_CHANGEDEvent type for the callback function that is responsible for changing the display orientation to match the device orientation.
      APP_EVENT_LANGUAGE_CHANGEDEvent type for the callback function that is responsible for refreshing the display into the new language.
      APP_EVENT_REGION_FORMAT_CHANGEDEvent type for the callback function that is responsible for refreshing the display into the new time zone.
      APP_EVENT_SUSPENDED_STATE_CHANGEDEvent type for the callback function that is responsible for taking necessary actions before entering the suspended state or after exiting from the state. (Supported since Tizen 2.4.)APP_EVENT_SUSPENDED_STATE_CHANGEDEvent type for the callback function that is responsible for taking necessary actions before entering the suspended state or after exiting from the state. (Supported since Tizen 2.4.)
      - -

      Application States and Transitions

      + + -

      The Tizen native application can be in one of several different application states.

      +

      Application States and Transitions

      + +

      The Tizen native application can be in one of several different application states.

      The Application API defines 5 states with corresponding transition handlers. The state transition is notified through a state transition callback function, whether the application is created, running, paused, resumed, or terminated. The application must react to each state change appropriately.

      Table: Application states

      - - - - - - - - - - - - - - - - - - - - - - - - - - - -
      StateDescription
      READYApplication is launched.
      CREATEDApplication starts the main loop.
      RUNNINGApplication is running and visible to the user.
      PAUSEDApplication is running but invisible to the user.
      TERMINATEDApplication is terminated.
      - + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      StateDescription
      READYApplication is launched.
      CREATEDApplication starts the main loop.
      RUNNINGApplication is running and visible to the user.
      PAUSEDApplication is running but invisible to the user.
      TERMINATEDApplication is terminated.
      +

      The following figure illustrates the application state transitions.

      - +

      Figure: Application state transitions

      Application state transitions

      - +

      Prerequisites

      @@ -183,11 +183,11 @@ int main(int argc, char *argv[]) { -    /* Create a ui_app_lifecycle_callback_s object and initialize its contents to 0 */ -    ui_app_lifecycle_callback_s event_callback = {0,}; + /* Create a ui_app_lifecycle_callback_s object and initialize its contents to 0 */ + ui_app_lifecycle_callback_s event_callback = {0,}; -    /* Run the application */ -    return ui_app_main(&argc, &argv, &event_callback, NULL); + /* Run the application */ + return ui_app_main(&argc, &argv, &event_callback, NULL); }
      • @@ -223,79 +223,79 @@ main(int argc, char *argv[]) to each callback invoked through the Application API */ struct appdata { -    char *several; -    char *fields; + char *several; + char *fields; }; typedef struct appdata appdata_s; static bool app_create(void *data) { -    /* -     Hook to take necessary actions before main event loop starts; this -     usually means initializing the UI and application data (the "data" -     parameter to this function) -    */ - -    appdata_s *ad = data; -    create_gui(ad); - -    /* If this function returns true, the main loop starts */ -    /* If this function returns false, the application is terminated */ -    return true; + /* + Hook to take necessary actions before main event loop starts; this + usually means initializing the UI and application data (the "data" + parameter to this function) + */ + + appdata_s *ad = data; + create_gui(ad); + + /* If this function returns true, the main loop starts */ + /* If this function returns false, the application is terminated */ + return true; } static void app_control(app_control_h app_control, void *data) { -    /* -     Handle the launch request, show the user the task requested through the -     "app_control" parameter (see the next step) -    */ + /* + Handle the launch request, show the user the task requested through the + "app_control" parameter (see the next step) + */ } static void app_pause(void *data) { -    /* Take necessary actions when application becomes invisible */ + /* Take necessary actions when application becomes invisible */ } static void app_resume(void *data) { -    /* Take necessary actions when application becomes visible */ + /* Take necessary actions when application becomes visible */ } static void app_terminate(void *data) { -    /* Release all resources */ -    appdata_s *ad = data; + /* Release all resources */ + appdata_s *ad = data; -    if (!ad) -        return; + if (!ad) + return; -    /* -     If specific steps are needed: -     destroy_gui(ad); -    */ + /* + If specific steps are needed: + destroy_gui(ad); + */ } int main(int argc, char *argv[]) { -    appdata_s ad = {0,}; -    ui_app_lifecycle_callback_s event_callback = {0,}; - -    /* Set the callbacks for the application logic */ -    event_callback.create = app_create; -    event_callback.terminate = app_terminate; -    event_callback.pause = app_pause; -    event_callback.resume = app_resume; -    event_callback.app_control = app_control; - -    /* Note the &ad below is how the struct is given to the callbacks */ -    return ui_app_main(argc, argv, &event_callback, &ad); + appdata_s ad = {0,}; + ui_app_lifecycle_callback_s event_callback = {0,}; + + /* Set the callbacks for the application logic */ + event_callback.create = app_create; + event_callback.terminate = app_terminate; + event_callback.pause = app_pause; + event_callback.resume = app_resume; + event_callback.app_control = app_control; + + /* Note the &ad below is how the struct is given to the callbacks */ + return ui_app_main(argc, argv, &event_callback, &ad); } @@ -312,112 +312,112 @@ main(int argc, char *argv[])

      For more information about launching other applications from your application using application controls, see Application Controls.

      - +

      Background Categories

      Since Tizen 2.4, the application is not allowed to run on the background except when it is explicitly declared to do so. The following table lists the background categories that allow the application to run on the background.

      Table: Allowed background application policy

      - - - + + + - - - - + + + + - - - - + + + + - - - - + + + + - + - - + + - + - - + + - + - - + + - + - +
      Background category
      Background category Description Related APIsManifest file <background-category> element value
      MediaManifest file <background-category> element value
      Media Playing audio, recording, and outputting streaming video on the background Multimedia API (in mobile and wearable applications)media
      Downloadmedia
      Download Downloading data with the Tizen Download-manager API Download API (in mobile applications)download
      Background networkdownload
      Background network Processing general network operations on the background (such as sync-manager, IM, and VOIP) Sync Manager API (in mobile applications), Socket, and Curl API (in mobile and wearable applications)background-networkbackground-network
      Location
      Location Processing location data on the background Location API (in mobile and wearable applications)locationlocation
      Sensor (context)
      Sensor (context) Processing context data from the sensors, such as gesture Sensor API (in mobile and wearable applications)sensorsensor
      IoT Communication/Connectivity
      IoT Communication/Connectivity Communicating between external devices on the background (such as Wi-Fi and Bluetooth) Wi-Fi (in mobile and wearable applications) and Bluetooth API (in mobile and wearable applications)iot-communicationiot-communication

      Describing the Background Category

      An application with a background running capability must declare the background category in its manifest file:

      -<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns="http://tizen.org/ns/packages" api-version="2.4" package="org.tizen.test" 
-          version="1.0.0">
-   <ui-application appid="org.tizen.test" exec="text" type="capp" multiple="false"
-                   taskmanage="true" nodisplay="false">
-      <icon>rest.png</icon>
-      <label>rest</label>
-      <!--For API version 2.4 and higher-->
-      <background-category value="media"/>
-      <background-category value="download"/>
-      <background-category value="background-network"/>
-   </ui-application>
-   <service-application appid="org.tizen.test-service" exec="test-service" multiple="false"
-                        type="capp">
-      <background-category value="background-network"/>
-      <background-category value="location"/>
-   </service-application>
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.4" package="org.tizen.test"
+          version="1.0.0">
+   <ui-application appid="org.tizen.test" exec="text" type="capp" multiple="false"
+                   taskmanage="true" nodisplay="false">
+      <icon>rest.png</icon>
+      <label>rest</label>
+      <!--For API version 2.4 and higher-->
+      <background-category value="media"/>
+      <background-category value="download"/>
+      <background-category value="background-network"/>
+   </ui-application>
+   <service-application appid="org.tizen.test-service" exec="test-service" multiple="false"
+                        type="capp">
+      <background-category value="background-network"/>
+      <background-category value="location"/>
+   </service-application>
 </manifest>
      Note - The <background-category> element is supported since the API version 2.4. An application with a <background-category> element declared can fail to be installed on devices with a Tizen version lower than 2.4. In this case, declare the background category as <metadata key="http://tizen.org/metadata/background-category/<value>"/>. + The <background-category> element is supported since the API version 2.4. An application with a <background-category> element declared can fail to be installed on devices with a Tizen version lower than 2.4. In this case, declare the background category as <metadata key="http://tizen.org/metadata/background-category/<value>"/>. 
      -<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3"
-          package="org.tizen.test" version="1.0.0">
-   <ui-application appid="org.tizen.test" exec="text" type="capp" multiple="false"
-                   taskmanage="true" nodisplay="false">
-      <icon>rest.png</icon>
-      <label>rest</label>
-      <!--For API version lower than 2.4-->
-      <metadata key="http://tizen.org/metadata/background-category/media"/>
-      <metadata key="http://tizen.org/metadata/background-category/download"/>
-      <metadata key="http://tizen.org/metadata/background-category/background-network"/>
-   </ui-application>
-   <service-application appid="org.tizen.test-service" exec="test-service"
-                        multiple="false" type="capp">
-      <metadata key="http://tizen.org/metadata/background-category/background-network"/>
-      <metadata key="http://tizen.org/metadata/background-category/location"/>
-   </service-application>
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3"
+          package="org.tizen.test" version="1.0.0">
+   <ui-application appid="org.tizen.test" exec="text" type="capp" multiple="false"
+                   taskmanage="true" nodisplay="false">
+      <icon>rest.png</icon>
+      <label>rest</label>
+      <!--For API version lower than 2.4-->
+      <metadata key="http://tizen.org/metadata/background-category/media"/>
+      <metadata key="http://tizen.org/metadata/background-category/download"/>
+      <metadata key="http://tizen.org/metadata/background-category/background-network"/>
+   </ui-application>
+   <service-application appid="org.tizen.test-service" exec="test-service"
+                        multiple="false" type="capp">
+      <metadata key="http://tizen.org/metadata/background-category/background-network"/>
+      <metadata key="http://tizen.org/metadata/background-category/location"/>
+   </service-application>
 </manifest>
      -

      The <metadata key="http://tizen.org/metadata/bacgkround-category/<value>"/> element has no effect on Tizen 2.3 devices, but, in Tizen 2.4 and higher devices, it has the same effect as the <background-category> element.

      +

      The <metadata key="http://tizen.org/metadata/bacgkround-category/<value>"/> element has no effect on Tizen 2.3 devices, but, in Tizen 2.4 and higher devices, it has the same effect as the <background-category> element.

      The background category of your application can be specified in the application project settings in the Tizen Studio.

      - +
    diff --git a/org.tizen.guides/html/native/app_management/event_n.htm b/org.tizen.guides/html/native/app_management/event_n.htm index c7317ba..539b6e5 100644 --- a/org.tizen.guides/html/native/app_management/event_n.htm +++ b/org.tizen.guides/html/native/app_management/event_n.htm @@ -5,15 +5,15 @@ - + - Event Broadcast and Subscription - + Event Broadcast and Subscription + - +

    Mobile native Wearable native

    @@ -28,8 +28,8 @@

    Content

    @@ -78,22 +78,22 @@

    To use the functions and data types of the Event API (in mobile and wearable applications), include the <app_event.h> header file in your application:

     #include <app_event.h>
-
    +
  • To use Launch-On-Events in your application, define the http://tizen.org/appcontrol/operation/launch_on_event operation in the tizen-manifest.xml file.

    The URI name for the operation represents the event name in the Launch-On-Event format (event://{Event_Name}).

     <app-control>
-   <operation name="http://tizen.org/appcontrol/operation/launch_on_event"/>
-   <uri name="event://tizen.system.event.battery_charger_status"/>
+   <operation name="http://tizen.org/appcontrol/operation/launch_on_event"/>
+   <uri name="event://tizen.system.event.battery_charger_status"/>
 </app-control>
    • - +

    Publishing an Event

    - +

    To publish an event to all listeners:

      @@ -102,9 +102,9 @@ static void user_event_cb(const char *event_name, bundle *event_data, void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "user_event_cb: %s \n", event_name); + dlog_print(DLOG_INFO, LOG_TAG, "user_event_cb: %s \n", event_name); -    return; + return; } @@ -114,11 +114,11 @@ int ret = EVENT_ERROR_NONE; event_handler_h event_handler; bundle *event_data = NULL; -ret = event_add_event_handler("event.org.tizen.senderapp.user_event", -                              user_event_cb, "CUSTOM_EVENT_KEY", &event_handler); +ret = event_add_event_handler("event.org.tizen.senderapp.user_event", + user_event_cb, "CUSTOM_EVENT_KEY", &event_handler); if (ret != EVENT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret); event_data = bundle_create(); @@ -127,10 +127,10 @@ ret = bundle_add_str(event_data, user_data_key, user_data);
    1. Use the event_publish_app_event() function to publish the event: 
      -ret = event_publish_app_event("event.org.tizen.senderapp.user_event", event_data);
+ret = event_publish_app_event("event.org.tizen.senderapp.user_event", event_data);
 
 if (ret != EVENT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
    2. When no longer needed, free the bundle: @@ -139,8 +139,8 @@ ret = bundle_free(event_data);
    - - + +

    Subscribing to an Event

    To subscribe to a predefined system event or user-defined event:

    @@ -153,25 +153,25 @@ ret = bundle_free(event_data); 
     static void
 battery_event_callback(const char *event_name, bundle *event_data,
-                       void *user_data)
+                       void *user_data)
 {
-    /* event_name is the event name */
-    dlog_print(DLOG_INFO, LOG_TAG, "event_name is [%s]", event_name);
+    /* event_name is the event name */
+    dlog_print(DLOG_INFO, LOG_TAG, "event_name is [%s]", event_name);
 
-    /* event_data is the event data, its type is bundle */
-    char *battery_level_status = NULL;
-    battery_level_status = bundle_get_val(event_data,
-                                          EVENT_KEY_BATTERY_LEVEL_STATUS);
+    /* event_data is the event data, its type is bundle */
+    char *battery_level_status = NULL;
+    battery_level_status = bundle_get_val(event_data,
+                                          EVENT_KEY_BATTERY_LEVEL_STATUS);
 }
 
 event_handler_h handler;
 
 /* Register the event handler */
 int ret = event_add_event_handler(SYSTEM_EVENT_BATTERY_LEVEL_STATUS,
-                                  (event_cb)battery_event_cb,
-                                  user_data, &handler);
+                                  (event_cb)battery_event_cb,
+                                  user_data, &handler);
 if (ret != EVENT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
    @@ -179,18 +179,18 @@ if (ret != EVENT_ERROR_NONE)

    When defining an event name for a user event (such as event.org.tizen.senderapp.user_event), the name format is event.{sender appid}.{user-defined name}. The {user-defined name} must:

      -
    • Contain only the ASCII characters "[A-Z][a-z][0-9]_" and not begin with a digit.
      • -
    • Not contain the '.' (period) character.
      • +
    • Contain only the ASCII characters "[A-Z][a-z][0-9]_" and not begin with a digit.
      • +
    • Not contain the '.' (period) character.
    • Not exceed the maximum name length (127 bytes).
    • Be at least 1 byte in length.
    -ret = event_add_event_handler("event.org.tizen.senderapp.user_event",
-                              utc_event_cb_with_valid_check,
-                              "CUSTOM_EVENT_KEY", &event_handler);
+ret = event_add_event_handler("event.org.tizen.senderapp.user_event",
+                              utc_event_cb_with_valid_check,
+                              "CUSTOM_EVENT_KEY", &event_handler);
 
 if (ret != EVENT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
    @@ -200,16 +200,16 @@ if (ret != EVENT_ERROR_NONE) 
     ret = event_remove_event_handler(handler);
 if (ret != EVENT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG, "err: [%d]", ret);
    - +

    Managing Launch-On-Events

    To register an interest in a Launch-On-Event, define the http://tizen.org/appcontrol/operation/launch_on_event operation in the tizen-manifest.xml file.

    - +
    Note Only service applications can register and receive Launch-On-Events. @@ -227,15 +227,15 @@ if (ret != EVENT_ERROR_NONE) tizen.system.event.battery_charger_status - When the charger state is "connected". + When the charger state is "connected". tizen.system.event.usb_status - When the USB state is "connected". + When the USB state is "connected". tizen.system.event.earjack_status - When the earjack status is "connected". + When the earjack status is "connected". tizen.system.event.incoming_msg @@ -250,27 +250,27 @@ if (ret != EVENT_ERROR_NONE) static void *app_control(app_control_h app_control, void *data) { -    char *event_uri = "event://tizen.system.event.battery_charger_status"; -    char *operation; -    char *uri; -    char *event_value; -    ret = app_control_get_operation(app_control, &operation); - -    if (ret == APP_CONTROL_ERROR_NONE && operation && -        strcmp(operation, APP_CONTROL_OPERATION_LAUNCH_ON_EVENT) == 0) { -        ret = app_control_get_uri(app_control, &uri); -        if (ret == APP_CONTROL_ERROR_NONE && uri) { -            if (strncmp(uri, event_uri, strlen(event_uri) + 1) == 0) { -                ret = app_control_get_extra_data(app_control, "battery_charger_status", -                                                 &event_value); -                if (ret == APP_CONTROL_ERROR_NONE && event_value) -                    free(event_value); -                /* Use event_add_event_handler() for further event subscriptions here */ -            } -            free(uri); -        } -        free(operation); -    } + char *event_uri = "event://tizen.system.event.battery_charger_status"; + char *operation; + char *uri; + char *event_value; + ret = app_control_get_operation(app_control, &operation); + + if (ret == APP_CONTROL_ERROR_NONE && operation && + strcmp(operation, APP_CONTROL_OPERATION_LAUNCH_ON_EVENT) == 0) { + ret = app_control_get_uri(app_control, &uri); + if (ret == APP_CONTROL_ERROR_NONE && uri) { + if (strncmp(uri, event_uri, strlen(event_uri) + 1) == 0) { + ret = app_control_get_extra_data(app_control, "battery_charger_status", + &event_value); + if (ret == APP_CONTROL_ERROR_NONE && event_value) + free(event_value); + /* Use event_add_event_handler() for further event subscriptions here */ + } + free(uri); + } + free(operation); + } }

    The application can get the event name and data in the first app_control_cb() callback, which is called after the application state changes to created.

    @@ -300,16 +300,16 @@ static void battery_charger_status
    • -

      "disconnected": Charger is not connected

      +

      "disconnected": Charger is not connected

    • -

      "connected": Charger is connected

      +

      "connected": Charger is connected

    • -

      "charging": Charging is enabled

      +

      "charging": Charging is enabled

    • -

      "discharging": Charging is disabled (for example, 100% full state)

      +

      "discharging": Charging is disabled (for example, 100% full state)

    @@ -326,20 +326,20 @@ static void
    • -

      "empty"

      +

      "empty"

      • -

    • "critical"

      +

    • "critical"

      • -

    • "low"

      +

    • "low"

      • -

    • "high"

      +

    • "high"

      • -

    • "full"

      +

    • "full"

    When the battery level has changed. - You can get the current value with the device_battery_get_level_status() function. + You can get the current value with the device_battery_get_level_status() function. deviced @@ -347,10 +347,10 @@ static void tizen.system.event.usb_status usb_status
      -

    • "disconnected": USB cable is not connected

      +

    • "disconnected": USB cable is not connected

      • -

    • "connected": USB cable is connected, but the service is not available

      • -

    • "available": USB service is available (for example, mtp or SDB)

      +

    • "connected": USB cable is connected, but the service is not available

      • +

    • "available": USB service is available (for example, mtp or SDB)

    @@ -365,10 +365,10 @@ static void earjack_status
    • -

      "disconnected": Earjack is not connected

      +

      "disconnected": Earjack is not connected

    • -

      "connected": Earjack is connected

      +

      "connected": Earjack is connected

    @@ -382,11 +382,11 @@ static void tizen.system.event.display_state display_state
      -

    • "normal": Display on, normal brightness

      +

    • "normal": Display on, normal brightness

      • -

    • "dim": Display on, dimmed brightness

      +

    • "dim": Display on, dimmed brightness

      • -

    • "off": Display off

      +

    • "off": Display off

    @@ -399,11 +399,11 @@ static void system tizen.system.event.boot_completed N/A - N/A + N/A When platform booting has been completed. - You can treat the initial value as false before you receive this event. If the application is already in a boot-completed state before you register an event handler, you receive the event as soon as you register the event handler. + You can treat the initial value as false before you receive this event. If the application is already in a boot-completed state before you register an event handler, you receive the event as soon as you register the event handler. tizen.system.event.system_shutdown @@ -421,10 +421,10 @@ static void tizen.system.event.low_memory low_memory
      -

    • "normal": Available > 200MB

      +

    • "normal": Available > 200MB

      • -

    • "soft_warning": 100MB < available <= 200MB

      • -

    • "hard_warning": Available <= 100MB

      • +

    • "soft_warning": 100MB < available <= 200MB

      • +

    • "hard_warning": Available <= 100MB

    Note @@ -443,9 +443,9 @@ static void tizen.system.event.wifi_state wifi_state
      -

    • "on": Wi-Fi on

      • -

    • "off": Wi-Fi off

      • -

    • "connected": Wi-Fi connection established

      • +

    • "on": Wi-Fi on

      • +

    • "off": Wi-Fi off

      • +

    • "connected": Wi-Fi connection established

    @@ -457,8 +457,8 @@ static void tizen.system.event.bt_state bt_state
      -

    • "off": Legacy Bluetooth off

      • -

    • "on": Legacy Bluetooth on

      • +

    • "off": Legacy Bluetooth off

      • +

    • "on": Legacy Bluetooth on

    @@ -469,8 +469,8 @@ static void bt_le_state
      -

    • "off": LE function off

      • -

    • "on": LE function on

      • +

    • "off": LE function off

      • +

    • "on": LE function on

    @@ -481,12 +481,12 @@ static void bt_transfering_state
      -

    • "non_transfering": Idle state

      • -

    • "transfering": File is transferring

      • +

    • "non_transfering": Idle state

      • +

    • "transfering": File is transferring

    - When the file transfer state has changed. + When the file transfer state has changed. @@ -496,14 +496,14 @@ static void tizen.system.event.location_enable_state location_enable_state
      -

    • "disabled": Location disabled

      +

    • "disabled": Location disabled

      • -

    • "enabled": Location enabled

      +

    • "enabled": Location enabled

    - When the location-enable_state has been changed, for example, by the user toggling the location setting in the settings menu or quick panel. + When the location-enable_state has been changed, for example, by the user toggling the location setting in the settings menu or quick panel. You can get the current value with the location_manager_is_enabled_method() function. @@ -511,9 +511,9 @@ static void tizen.system.event.gps_enable_state gps_enable_state
      -

    • "disabled": GPS disabled

      +

    • "disabled": GPS disabled

      • -

    • "enabled": GPS enabled

      +

    • "enabled": GPS enabled

    @@ -526,9 +526,9 @@ static void tizen.system.event.nps_enable_state nps_enable_state
      -

    • "disabled": NPS disabled

      +

    • "disabled": NPS disabled

      • -

    • "enabled": NPS enabled

      +

    • "enabled": NPS enabled

    @@ -543,11 +543,11 @@ static void tizen.system.event.incoming_msg msg_type
      -

    • "sms": SMS-type message

      +

    • "sms": SMS-type message

      • -

    • "push": Push-type message

      +

    • "push": Push-type message

      • -

    • "cb": Cb-type message

      +

    • "cb": Cb-type message

    @@ -580,7 +580,7 @@ static void time tizen.system.event.time_zone time_zone - The value of this key is the time zone value of the time zone database, for example, "Asia/Seoul", "America/New_York". For more information, see the IANA Time Zone Database. + The value of this key is the time zone value of the time zone database, for example, "Asia/Seoul", "America/New_York". For more information, see the IANA Time Zone Database. When the time zone has changed. @@ -591,8 +591,8 @@ static void locale tizen.system.event.hour_format hour_format -
    • "12"
      • -
    • "24"
    +
    • "12"
      • +
    • "24"
    When the hour_format has changed, for example, by the user toggling the date and time settings for the 24-hour clock (where OFF stands for the 12-hour clock). @@ -623,11 +623,11 @@ static void sound tizen.system.event.silent_mode silent_mode -
    • "on"
      • -
    • "off"
    +
    • "on"
      • +
    • "off"
    - When the ringtone has been changed to 0 or another mode. For example, if the call slider has been changed to 0, silent_mode is "on". Otherwise, silent_mode is "off". + When the ringtone has been changed to 0 or another mode. For example, if the call slider has been changed to 0, silent_mode is "on". Otherwise, silent_mode is "off". You can get the current value with the SYSTEM_SETTINGS_KEY_SOUND_SILENT_MODE key. @@ -635,8 +635,8 @@ static void vibration tizen.system.event.vibration_state vibration_state -
    • "on"
      • -
    • "off"
    +
    • "on"
      • +
    • "off"
    When the vibration state has changed. @@ -647,8 +647,8 @@ static void screen tizen.system.event.screen_autorotate_state screen_autorotate_state -
    • "on"
      • -
    • "off"
    +
    • "on"
      • +
    • "off"
    When the screen_autorotate_state has been changed, for example, by the user toggling the display settings. @@ -659,8 +659,8 @@ static void mobile tizen.system.event.mobile_data_state mobile_data_state -
    • "on"
      • -
    • "off"
    +
    • "on"
      • +
    • "off"
    When the mobile_data_state has been changed, for example, by the user toggling the network settings. @@ -670,8 +670,8 @@ static void tizen.system.event.data_roaming_state data_roaming_state -
    • "on"
      • -
    • "off"
    +
    • "on"
      • +
    • "off"
    When the data_roaming_state has been changed, for example, by the user toggling the network settings. @@ -715,4 +715,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/message_port_n.htm b/org.tizen.guides/html/native/app_management/message_port_n.htm index 9394304..2ce51a1 100644 --- a/org.tizen.guides/html/native/app_management/message_port_n.htm +++ b/org.tizen.guides/html/native/app_management/message_port_n.htm @@ -5,20 +5,20 @@ - + - Message Port - + Message Port + - +

    Mobile native Wearable native

    - + @@ -71,39 +71,39 @@ #include <message_port.h> - +

    Using Uni-directional Communication

    To use uni-directional communication, you must check whether the message port of a remote application is registered with the message_port_check_remote_port() function. You can then send messages to the remote application using the message_port_send_message() function. The remote application can receive the messages using the message_port_register_local_port() function.

    -

    Figure: Uni-directional message port communication

    -

    Uni-directional message port communication

    -

    To send a message from Application 1 to Application 2 using the Message Port API:

    +

    Figure: Uni-directional message port communication

    +

    Uni-directional message port communication

    +

    To send a message from Application 1 to Application 2 using the Message Port API:

    1. Register a local port in Application 2.

      - +

      To register the local port, call the message_port_register_local_port() function and implement a callback for it in Application 2:

       void
 message_port_cb(int local_port_id, const char *remote_app_id, const char *remote_port,
-                bool trusted_remote_port, bundle *message, void *user_data)
+                bool trusted_remote_port, bundle *message, void *user_data)
 {
-    char *command = NULL;
-    char *data = NULL;
-    bundle_get_str(message, "command", &command);
-    bundle_get_str(message, "data", &data);
-    
-    dlog_print(DLOG_INFO, TAG, "Message from %s, command: %s data: %s",
-               remote_app_id, command, data);
+    char *command = NULL;
+    char *data = NULL;
+    bundle_get_str(message, "command", &command);
+    bundle_get_str(message, "data", &data);
+
+    dlog_print(DLOG_INFO, TAG, "Message from %s, command: %s data: %s",
+               remote_app_id, command, data);
 }
 
 int port_id = message_port_register_local_port(local_port, message_port_cb, NULL);
 if (port_id < 0)
-    dlog_print(DLOG_ERROR, LOG_TAG, "Port register error: %d", port_id);
+    dlog_print(DLOG_ERROR, LOG_TAG, "Port register error: %d", port_id);
 else
-    dlog_print(DLOG_INFO, LOG_TAG, "port_id: %d", port_id);
+    dlog_print(DLOG_INFO, LOG_TAG, "port_id: %d", port_id);
      2. @@ -115,14 +115,14 @@ else bool test_check_remote_port() { -    int ret; -    bool found; + int ret; + bool found; -    ret = message_port_check_remote_port(remote_app_id, remote_port, &found); -    if (ret != MESSAGE_PORT_ERROR_NONE) -        dlog_print(DLOG_ERROR, TAG, "message_port_check_remote_port error: %d", ret); + ret = message_port_check_remote_port(remote_app_id, remote_port, &found); + if (ret != MESSAGE_PORT_ERROR_NONE) + dlog_print(DLOG_ERROR, TAG, "message_port_check_remote_port error: %d", ret); -    return found; + return found; } @@ -137,75 +137,75 @@ test_check_remote_port() void send_message(void) { -    int ret; -    bundle *b = bundle_create(); -    bundle_add_str(b, "command", "begin"); -    bundle_add_str(b, "data", "dummy"); -    ret = message_port_send_message(remote_app_id, remote_port, b); -    if (ret != MESSAGE_PORT_ERROR_NONE) -        dlog_print(DLOG_ERROR, TAG, "message_port_check_remote_port error: %d", ret); -    else -        dlog_print(DLOG_INFO, TAG, "Send message done"); -    bundle_free(b); + int ret; + bundle *b = bundle_create(); + bundle_add_str(b, "command", "begin"); + bundle_add_str(b, "data", "dummy"); + ret = message_port_send_message(remote_app_id, remote_port, b); + if (ret != MESSAGE_PORT_ERROR_NONE) + dlog_print(DLOG_ERROR, TAG, "message_port_check_remote_port error: %d", ret); + else + dlog_print(DLOG_INFO, TAG, "Send message done"); + bundle_free(b); }

    Using Bi-directional Communication

    - -

    To use bi-directional communication, you must check whether the message port of a remote application is registered with the message_port_check_remote_port() function. You can then send messages and local message port information to the remote application using the message_port_send_message_with_local_port() function. The remote application can use the local message port information to send response messages after it receives your messages using the message_port_register_local_port() function.

    - -

    Figure: Bi-directional message port communication

    + +

    To use bi-directional communication, you must check whether the message port of a remote application is registered with the message_port_check_remote_port() function. You can then send messages and local message port information to the remote application using the message_port_send_message_with_local_port() function. The remote application can use the local message port information to send response messages after it receives your messages using the message_port_register_local_port() function.

    + +

    Figure: Bi-directional message port communication

    Bi-directional message port communication

    To send a message from Application 1 to Application 2, and from Application 2 to Application 1:

    1. Implement the response logic in both applications:

      - - + + 
       void
 message_port_cb(int local_port_id, const char *remote_app_id, const char *remote_port,
-                bool trusted_remote_port, bundle *message, void *user_data)
+                bool trusted_remote_port, bundle *message, void *user_data)
 {
-    int ret;
-    char *command = NULL;
-    char *data = NULL;
-    bundle_get_str(message, "command", &command);
-    bundle_get_str(message, "data", &data);
-
-    dlog_print(DLOG_INFO, TAG, "Message from %s, command: %s data: %s",
-               remote_app_id, command, data);
-
-    bundle *reply = bundle_create();
-    bundle_add_str(reply, "result", "GOT_IT");
-    ret = message_port_send_message(remote_app_id, remote_port, reply);
-    bundle_free(reply);
-    if (ret != MESSAGE_PORT_ERROR_NONE)
-        dlog_print(DLOG_ERROR, TAG, "Port send message error: %d", ret);
+    int ret;
+    char *command = NULL;
+    char *data = NULL;
+    bundle_get_str(message, "command", &command);
+    bundle_get_str(message, "data", &data);
+
+    dlog_print(DLOG_INFO, TAG, "Message from %s, command: %s data: %s",
+               remote_app_id, command, data);
+
+    bundle *reply = bundle_create();
+    bundle_add_str(reply, "result", "GOT_IT");
+    ret = message_port_send_message(remote_app_id, remote_port, reply);
+    bundle_free(reply);
+    if (ret != MESSAGE_PORT_ERROR_NONE)
+        dlog_print(DLOG_ERROR, TAG, "Port send message error: %d", ret);
 }

    2. Register the local port in Application 1.

      -

      Call the message_port_register_local_port() function in Application 1:

      - +

      Call the message_port_register_local_port() function in Application 1:

      + 
       void
 message_port_cb(int local_port_id, const char *remote_app_id, const char *remote_port,
-                bool trusted_remote_port, bundle *message, void *user_data)
+                bool trusted_remote_port, bundle *message, void *user_data)
 {
-    char *result = NULL;
-    bundle_get_str(message, "result", &result);
-    dlog_print(DLOG_INFO, TAG, "Message from %s, result: %s ", remote_app_id, result);
+    char *result = NULL;
+    bundle_get_str(message, "result", &result);
+    dlog_print(DLOG_INFO, TAG, "Message from %s, result: %s ", remote_app_id, result);
 }
 
 int local_port_id = message_port_register_local_port(local_port, message_port_cb);
 if (local_port_id < 0)
-    dlog_print(DLOG_ERROR, TAG, "Port register error: %d", local_port_id);
+    dlog_print(DLOG_ERROR, TAG, "Port register error: %d", local_port_id);
 else
-    dlog_print(DLOG_INFO, TAG, "port_id: %d", port_id);
+    dlog_print(DLOG_INFO, TAG, "port_id: %d", port_id);
      3. @@ -216,39 +216,39 @@ else void send_message_with_local_port(int local_port_id) { -    int ret; -    bundle *b = bundle_create(); -    bundle_add_str(b, "command", "begin"); -    bundle_add_str(b, "data", "dummy"); - -    ret = message_port_send_message_with_local_port(remote_app_id, remote_port, -                                                    b, local_port_id); -    if (ret != MESSAGE_PORT_ERROR_NONE) -        dlog_print(DLOG_ERROR, TAG, -                   "message_port_send_message_with_local_port error: %d", -                   ret); -    else -        dlog_print(DLOG_INFO, TAG, "Send message done"); -    bundle_free(b); + int ret; + bundle *b = bundle_create(); + bundle_add_str(b, "command", "begin"); + bundle_add_str(b, "data", "dummy"); + + ret = message_port_send_message_with_local_port(remote_app_id, remote_port, + b, local_port_id); + if (ret != MESSAGE_PORT_ERROR_NONE) + dlog_print(DLOG_ERROR, TAG, + "message_port_send_message_with_local_port error: %d", + ret); + else + dlog_print(DLOG_INFO, TAG, "Send message done"); + bundle_free(b); } if (test_check_remote_port()) { -    dlog_print(DLOG_INFO, TAG, "Remote port check success."); -    send_message_with_local_port(local_port_id); + dlog_print(DLOG_INFO, TAG, "Remote port check success."); + send_message_with_local_port(local_port_id); }

    Using Trusted Communication

    -

    The trusted message port instance can be retrieved using the message_port_register_trusted_local_port() function. Communication over the trusted message port is allowed only if both applications are signed with a certificate that is uniquely assigned to its developer.

    -

    Figure: Trusted uni-directional message port communication

    +

    The trusted message port instance can be retrieved using the message_port_register_trusted_local_port() function. Communication over the trusted message port is allowed only if both applications are signed with a certificate that is uniquely assigned to its developer.

    +

    Figure: Trusted uni-directional message port communication

    Trusted uni-directional message port communication

    The trusted communication work similarly as normal message port communication. The only difference is that you must use trusted functions instead of normal functions, as defined in the following table.

    Table: Corresponding normal and trusted communication functions

    - +
    @@ -291,4 +291,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/package_manager_n.htm b/org.tizen.guides/html/native/app_management/package_manager_n.htm index 3138ba9..7caf115 100644 --- a/org.tizen.guides/html/native/app_management/package_manager_n.htm +++ b/org.tizen.guides/html/native/app_management/package_manager_n.htm @@ -5,20 +5,20 @@ - + - Package Manager - + Package Manager + - +

    Mobile native Wearable native

    - +

    Dependencies

      @@ -64,7 +64,7 @@

      To use the Package Manager API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

       <privileges>
-   <privilege>http://tizen.org/privilege/packagemanager.info</privilege>
+   <privilege>http://tizen.org/privilege/packagemanager.info</privilege>
 </privileges>
      @@ -72,8 +72,8 @@ 
       #include <package_manager.h>
      - - + +

      Retrieving All Package Information

      To retrieve all package information of installed packages:

      @@ -85,54 +85,54 @@ void package_info_cb(package_info_h package_info, void *user_data) { -    int ret; - -    char *pkg = NULL; -    char *label = NULL; -    char *icon = NULL; -    char *version = NULL; -    char *type = NULL; -    package_info_installed_storage_type_e storage; -    bool system; -    bool removable; -    bool preload; - -    package_info_get_package(package_info, &pkg); -    package_info_get_label(package_info, &label); -    package_info_get_icon(package_info, &icon); -    package_info_get_version(package_info, &version); -    package_info_get_type(package_info, &type); -    package_info_get_installed_storage(package_info, &storage); -    package_info_is_system_package(package_info, &system); -    package_info_is_removable_package(package_info, &removable); -    package_info_is_preload_package(package_info, &preload); - -    dlog_print(DLOG_INFO, TAG, "pkg \t= [%s]\n", pkg); -    dlog_print(DLOG_INFO, TAG, "label \t= [%s]\n", label); -    dlog_print(DLOG_INFO, TAG, "icon \t= [%s]\n", icon); -    dlog_print(DLOG_INFO, TAG, "version \t= [%s]\n", version); -    dlog_print(DLOG_INFO, TAG, "type \t= [%s]\n", type); -    dlog_print(DLOG_INFO, TAG, "storage \t= [%d]\n", storage); -    dlog_print(DLOG_INFO, TAG, "system \t= [%d]\n", system); -    dlog_print(DLOG_INFO, TAG, "removable \t= [%d]\n", removable); -    dlog_print(DLOG_INFO, TAG, "preload \t= [%d]\n", preload); - -    free(pkg); -    free(label); -    free(icon); -    free(version); -    free(type); + int ret; + + char *pkg = NULL; + char *label = NULL; + char *icon = NULL; + char *version = NULL; + char *type = NULL; + package_info_installed_storage_type_e storage; + bool system; + bool removable; + bool preload; + + package_info_get_package(package_info, &pkg); + package_info_get_label(package_info, &label); + package_info_get_icon(package_info, &icon); + package_info_get_version(package_info, &version); + package_info_get_type(package_info, &type); + package_info_get_installed_storage(package_info, &storage); + package_info_is_system_package(package_info, &system); + package_info_is_removable_package(package_info, &removable); + package_info_is_preload_package(package_info, &preload); + + dlog_print(DLOG_INFO, TAG, "pkg \t= [%s]\n", pkg); + dlog_print(DLOG_INFO, TAG, "label \t= [%s]\n", label); + dlog_print(DLOG_INFO, TAG, "icon \t= [%s]\n", icon); + dlog_print(DLOG_INFO, TAG, "version \t= [%s]\n", version); + dlog_print(DLOG_INFO, TAG, "type \t= [%s]\n", type); + dlog_print(DLOG_INFO, TAG, "storage \t= [%d]\n", storage); + dlog_print(DLOG_INFO, TAG, "system \t= [%d]\n", system); + dlog_print(DLOG_INFO, TAG, "removable \t= [%d]\n", removable); + dlog_print(DLOG_INFO, TAG, "preload \t= [%d]\n", preload); + + free(pkg); + free(label); + free(icon); + free(version); + free(type); }
    • Use the package_manager_foreach_package_info() function to retrieve all package information by invoking a callback for each retrieved package: 
       ret = package_manager_foreach_package_info(package_info_cb, NULL);
 if (ret != PACKAGE_MANAGER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, TAG, "foreach_package_info error: %d", ret);
+    dlog_print(DLOG_ERROR, TAG, "foreach_package_info error: %d", ret);

      • Retrieving Specific Package Information

      - +

      To get specific package information:

      1. Use the package_manager_get_package_info() function. @@ -154,15 +154,15 @@ char *version = NULL; char *label = NULL; char *type = NULL; package_info_h package_info = NULL; -package_manager_get_package_info("PACKAGE-ID", &package_info); +package_manager_get_package_info("PACKAGE-ID", &package_info); package_info_get_version(package_info, &version); package_info_get_label(package_info, &label); package_info_get_type(package_info, &type); -dlog_print(DLOG_INFO, TAG, "label \t= [%s]\n", label); -dlog_print(DLOG_INFO, TAG, "icon \t= [%s]\n", icon); -dlog_print(DLOG_INFO, TAG, "version \t= [%s]\n", version); +dlog_print(DLOG_INFO, TAG, "label \t= [%s]\n", label); +dlog_print(DLOG_INFO, TAG, "icon \t= [%s]\n", icon); +dlog_print(DLOG_INFO, TAG, "version \t= [%s]\n", version); free(label); free(icon); @@ -197,17 +197,17 @@ package_manager_set_event_status(manager, PACKAGE_MANAGER_STATUS_TYPE_ALL); 
         void
 event_cb(const char *type, const char *package, package_manager_event_type_e event_type,
-         package_manager_event_state_e event_state, int progress,
-         package_manager_error_e error, void *user_data)
+         package_manager_event_state_e event_state, int progress,
+         package_manager_error_e error, void *user_data)
 {
-    if (event_state == PACKAGE_MANAGER_EVENT_STATE_STARTED)
-        dlog_print(DLOG_INFO, LOG_TAG, "Started");
-    else if (event_state == PACKAGE_MANAGER_EVENT_STATE_PROCESSING)
-        dlog_print(DLOG_INFO, LOG_TAG, "Progress: %d", progress);
-    else if (event_state == PACKAGE_MANAGER_EVENT_STATE_COMPLETED)
-        dlog_print(DLOG_INFO, LOG_TAG, "Completed");
-    else
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed");
+    if (event_state == PACKAGE_MANAGER_EVENT_STATE_STARTED)
+        dlog_print(DLOG_INFO, LOG_TAG, "Started");
+    else if (event_state == PACKAGE_MANAGER_EVENT_STATE_PROCESSING)
+        dlog_print(DLOG_INFO, LOG_TAG, "Progress: %d", progress);
+    else if (event_state == PACKAGE_MANAGER_EVENT_STATE_COMPLETED)
+        dlog_print(DLOG_INFO, LOG_TAG, "Completed");
+    else
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed");
 }
 
 package_manager_set_event_cb(manager, event_cb, NULL);
@@ -244,4 +244,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga
 
 
 
-	
\ No newline at end of file
+
\ No newline at end of file
diff --git a/org.tizen.guides/html/native/app_management/service_app_n.htm b/org.tizen.guides/html/native/app_management/service_app_n.htm
index 70d75a3..7998777 100644
--- a/org.tizen.guides/html/native/app_management/service_app_n.htm
+++ b/org.tizen.guides/html/native/app_management/service_app_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Service Applications 
-  
+  Service Applications
+ 
  
- 
+
  
        
 	
        
 		
        Mobile native Wearable native
        
 	
        
-	
+
 	
        
 
 
        
-
        Service Applications
         
+
        Service Applications
        
 
 
        Service applications are Tizen native applications with no graphical user interface that run in the background. They can be very useful in performing activities (such as getting sensor data in the background) that need to run periodically or continuously, but do not require any user intervention.
        
 
@@ -94,7 +94,7 @@
    Normal communication
    - +

    Because the service application has no UI, it neither has a pause state. Since Tizen 2.4, the service application can go into the suspended state. Basically, the service application is running on the background by its nature; so the platform does not allow the running of the service application unless it is designated as a background category application. However, when the UI application that is packaged with the service application is running in the foreground, the service application is also regarded as a foreground application and it can be run without a designated background category. For more information on using and defining a background category, see Background Categories.

    Event Callbacks

    @@ -137,7 +137,7 @@ service_app_low_memory_cb() - Used to take necessary actions in low memory situations. + Used to take necessary actions in low memory situations.

    Save data in the main memory to a persistent memory or storage, to avoid data loss in case the Tizen platform Low Memory Killer kills your application to get more free memory. Release any cached data in the main memory to secure more free memory.

    @@ -152,17 +152,17 @@

    Describe your service application attributes in the manifest file. The attributes determine the application behavior. The following code example illustrates how you can define the attributes:

    -<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns="http://tizen.org/ns/packages" package="org.tizen.message" version="0.2.7"
-          install-location="internal-only">
-   <label>Message</label>
-   <description>Message Application</description>
-   <service-application appid="org.tizen.message"
-                        exec="/usr/apps/org.tizen.message/bin/message" nodisplay="true"
-                        multiple="false" type="capp" taskmanage="false">
-      <icon>org.tizen.message.png</icon>
-      <label>Message</label>
-   </service-application>
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns="http://tizen.org/ns/packages" package="org.tizen.message" version="0.2.7"
+          install-location="internal-only">
+   <label>Message</label>
+   <description>Message Application</description>
+   <service-application appid="org.tizen.message"
+                        exec="/usr/apps/org.tizen.message/bin/message" nodisplay="true"
+                        multiple="false" type="capp" taskmanage="false">
+      <icon>org.tizen.message.png</icon>
+      <label>Message</label>
+   </service-application>
 </manifest>
    @@ -170,7 +170,7 @@
    • auto-restart

      If set to true, the application restarts whenever it terminates abnormally. If the application is running, it is launched after installing or upgrading the package.

      - +
      Note This attribute is not supported in Tizen wearable devices. Since Tizen 2.4, this attribute is not supported in all Tizen devices. Because of this, the auto-restart attribute used in a lower API version package than 2.4 is ignored in the devices with the Tizen platform version 2.4 and higher. @@ -263,9 +263,9 @@ bool service_app_create(void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); -    return true; + return true; }
      • @@ -277,10 +277,10 @@ service_app_create(void *data) void service_app_terminate(void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); -    service_app_exit(); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); + service_app_exit(); -    return; + return; } @@ -291,10 +291,10 @@ service_app_terminate(void *data) void service_app_control(app_control_h app_control, void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); -    service_app_exit(); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); + service_app_exit(); -    return; + return; } @@ -309,10 +309,10 @@ service_app_control(app_control_h app_control, void *data) void service_app_low_memory_callback(void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); -    service_app_exit(); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); + service_app_exit(); -    return; + return; } @@ -323,10 +323,10 @@ service_app_low_memory_callback(void *data) void service_app_low_battery_callback(void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); -    service_app_exit(); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); + service_app_exit(); -    return; + return; } @@ -340,18 +340,18 @@ service_app_low_battery_callback(void *data) int main(int argc, char* argv[]) { -    appdata_s ad = {0,}; -    service_app_lifecycle_callback_s event_callback = {0,}; + appdata_s ad = {0,}; + service_app_lifecycle_callback_s event_callback = {0,}; -    dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s", __func__); -    event_callback.create = service_app_create; -    event_callback.terminate = service_app_terminate; -    event_callback.app_control = service_app_control; + event_callback.create = service_app_create; + event_callback.terminate = service_app_terminate; + event_callback.app_control = service_app_control; -    dlog_print(DLOG_DEBUG, LOG_TAG, "service_app_main() is called."); + dlog_print(DLOG_DEBUG, LOG_TAG, "service_app_main() is called."); -    return service_app_main(argc, argv, &event_callback, &ad); + return service_app_main(argc, argv, &event_callback, &ad); } @@ -379,4 +379,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/ui_app_n.htm b/org.tizen.guides/html/native/app_management/ui_app_n.htm index 399a8ed..359bec4 100644 --- a/org.tizen.guides/html/native/app_management/ui_app_n.htm +++ b/org.tizen.guides/html/native/app_management/ui_app_n.htm @@ -5,13 +5,13 @@ - + - UI Applications + UI Applications @@ -20,7 +20,7 @@

      Mobile native Wearable native

      - +

      Dependencies

      -
    +

    UI Applications

    - +

    UI applications are Tizen native applications with a graphical user interface that run in the foreground. Since they have a UI, they allow the user to easily interact with them.

    - +

    A Tizen native UI application is similar to a conventional Linux application, with some additional features optimized for mobile and wearable devices. The additional features have constraints, such as a relatively small screen size and lack of system resources compared to a larger system. For example, for power management reasons, the application can take actions to reduce usage when it finds out that it has its display window covered over by another application window. State change events are delivered to make it possible to detect these situations.

    When creating a native UI application, you can select between EFL and DALi UI frameworks:

    @@ -50,14 +50,14 @@
  • EFL

    The EFL application is based on the Enlightenment Foundation Library. The EFL application provides a 2D-based Tizen native application, and streamlined graphic core libraries you need to create powerful applications. EFL needs relatively low memory but provides high performance, and supports a retained mode graphics system and user-centric features, such as themes, 2D/3D effects, and accessibility. In addition, EFL supports various resolutions with the same layout, fast and small file systems, a variety of programming language bindings, and a separate UI and logic.

    - -

    For more information on the available application types with EFL, see EFL Applications.

    + +

    For more information on the available application types with EFL, see EFL Applications.

  • DALi

    The DALi application is based on the Dynamic Animation Library. DALi internally defines a virtual 3D world (space) and maintains hierarchical objects in the 3D world. The hierarchical object tree is known as the scene graph. A node in the scene graph can have several children but often only a single parent, with the effect of a parent applied to all its child nodes; an operation performed on a group automatically propagates its effect to all of its members.

    - -

    For more information on the available application types with DALi, see DALi Applications.

    + +

    For more information on the available application types with DALi, see DALi Applications.

    • diff --git a/org.tizen.guides/html/native/app_management/watch_app_n.htm b/org.tizen.guides/html/native/app_management/watch_app_n.htm index 807e9fb..4ecab17 100644 --- a/org.tizen.guides/html/native/app_management/watch_app_n.htm +++ b/org.tizen.guides/html/native/app_management/watch_app_n.htm @@ -5,20 +5,20 @@ - + - EFL Watch Application - + EFL Watch Application + - +

    Wearable native

    - +

    Dependencies

      @@ -52,7 +52,7 @@

      Tizen allows you to create a watch application and manage its life-cycle to retrieve the current date and time and display it accurately on the screen.

      This feature is supported in wearable applications only.

      - +

      The main features of the Watch Application API include:

      • Managing the application life-cycle @@ -72,14 +72,14 @@ Clock menu

        Prerequisites

        - +

        To enable your application to use the watch functionality:

        1. -

          To use the Watch Application API's watch_app_ambient_tick_cb() callback in the ambient mode, the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

          +

          To use the Watch Application API's watch_app_ambient_tick_cb() callback in the ambient mode, the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

           <privileges>
-   <privilege>http://tizen.org/privilege/alarm.set</privilege>
+   <privilege>http://tizen.org/privilege/alarm.set</privilege>
 </privileges>
          2. @@ -90,8 +90,8 @@ bool support; int ret; ret = -    system_info_get_platform_bool("http://tizen.org/feature/screen.always_on.high_color", -                                  &support); + system_info_get_platform_bool("http://tizen.org/feature/screen.always_on.high_color", + &support); @@ -103,7 +103,7 @@ ret =
        2. Edit the watch application settings in the manifest file.
        -

        Managing the Application Life-cycle

        +

        Managing the Application Life-cycle

        You can create and initialize a watch application with the main() function. To start an event loop, use the watch_app_main() function. Before calling this function, set up the watch_app_lifecycle_callback_s structure variable, which contains the required event callbacks.

        @@ -174,15 +174,15 @@ ret =

        1. Register the necessary callbacks:

            -
          • The create event is triggered before the application main loop starts. In this callback, you can initialize the application resources, such as create windows and data structures. +
          • The create event is triggered before the application main loop starts. In this callback, you can initialize the application resources, such as create windows and data structures. 
             bool
 app_create(int width, int height, void* user_data)
 {
-    /* Hook to take necessary actions before the main event loop starts */
-    /* This usually means initializing the UI and application data */
+    /* Hook to take necessary actions before the main event loop starts */
+    /* This usually means initializing the UI and application data */
 
-    return true;
+    return true;
 }
            • @@ -191,8 +191,8 @@ app_create(int width, int height, void* user_data) void app_control(app_control_h app_control, void* user_data) { -    /* Handle the launch request */ -    /* Show the user the task requested through the "app_control" parameter */ + /* Handle the launch request */ + /* Show the user the task requested through the "app_control" parameter */ } @@ -201,8 +201,8 @@ app_control(app_control_h app_control, void* user_data) void app_pause(void* user_data) { -    /* Take necessary actions when application becomes invisible */ -    /* Release the resources needed to draw the normal watch */ + /* Take necessary actions when application becomes invisible */ + /* Release the resources needed to draw the normal watch */ } @@ -211,8 +211,8 @@ app_pause(void* user_data) void app_resume(void* user_data) { -    /* Take the necessary actions when application becomes visible */ -    /* Acquire the resources needed to draw the normal watch */ + /* Take the necessary actions when application becomes visible */ + /* Acquire the resources needed to draw the normal watch */ } @@ -221,7 +221,7 @@ app_resume(void* user_data) void app_terminate(void* user_data) { -    /* Release all resources */ + /* Release all resources */ } @@ -230,8 +230,8 @@ app_terminate(void* user_data) void app_time_tick(watch_time_h watch_time, void* user_data) { -    /* Called at least once per second */ -    /* Draw a normal watch with the hour, minute, and second */ + /* Called at least once per second */ + /* Draw a normal watch with the hour, minute, and second */ } @@ -242,22 +242,22 @@ app_time_tick(watch_time_h watch_time, void* user_data) int main(int argc, char* argv[]) { -    appdata ad = {0,}; -    watch_app_lifecycle_callback_s callback = {0,}; - -    callback.create = app_create; -    callback.app_control = app_control; -    callback.terminate = app_terminate; -    callback.pause = app_pause; -    callback.resume = app_resume; -    callback.time_tick = app_time_tick; -    /* Ambient mode callbacks */ - -    int ret = watch_app_main(argc, argv, &callback, &ad); -    if (ret != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_main() failed. err = %d", ret); - -    return ret; + appdata ad = {0,}; + watch_app_lifecycle_callback_s callback = {0,}; + + callback.create = app_create; + callback.app_control = app_control; + callback.terminate = app_terminate; + callback.pause = app_pause; + callback.resume = app_resume; + callback.time_tick = app_time_tick; + /* Ambient mode callbacks */ + + int ret = watch_app_main(argc, argv, &callback, &ad); + if (ret != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_main() failed. err = %d", ret); + + return ret; } @@ -267,7 +267,7 @@ main(int argc, char* argv[])

            To manage callbacks related to system status changes:

            -
              +

              1. Define the following callback functions:

                • lang_changed(): Triggered when the system language changes and the messages are translated.
                  • @@ -280,25 +280,25 @@ main(int argc, char* argv[]) void lang_changed(app_event_info_h event_info, void* user_data) { -    /* Take the necessary actions when the language setting changes */ + /* Take the necessary actions when the language setting changes */ } void region_changed(app_event_info_h event_info, void* user_data) { -    /* Take the necessary actions when the region setting changes */ + /* Take the necessary actions when the region setting changes */ } void low_battery(app_event_info_h event_info, void* user_data) { -    /* Take the necessary actions when the system is running low on battery */ + /* Take the necessary actions when the system is running low on battery */ } void low_memory(app_event_info_h event_info, void* user_data) { -    /* Take the necessary actions when the system is running low on memory */ + /* Take the necessary actions when the system is running low on memory */ }

                • Register the callback functions:

                  @@ -306,24 +306,24 @@ low_memory(app_event_info_h event_info, void* user_data) bool app_create(void *user_date) { -    /* Register a callback for each system event */ -    if (watch_app_add_event_handler(&handler, APP_EVENT_LANGUAGE_CHANGED, lang_changed, -                                    NULL) != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); + /* Register a callback for each system event */ + if (watch_app_add_event_handler(&handler, APP_EVENT_LANGUAGE_CHANGED, lang_changed, + NULL) != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); -    if (watch_app_add_event_handler(&handler, APP_EVENT_REGION_FORMAT_CHANGED, -                                    region_changed, NULL) != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); + if (watch_app_add_event_handler(&handler, APP_EVENT_REGION_FORMAT_CHANGED, + region_changed, NULL) != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); -    if (watch_app_add_event_handler(&handler, APP_EVENT_LOW_BATTERY, low_battery, NULL) -        != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); + if (watch_app_add_event_handler(&handler, APP_EVENT_LOW_BATTERY, low_battery, NULL) + != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); -    if (watch_app_add_event_handler(&handler, APP_EVENT_LOW_MEMORY, low_ memory, NULL) -        != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); + if (watch_app_add_event_handler(&handler, APP_EVENT_LOW_MEMORY, low_ memory, NULL) + != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_add_event_handler() failed"); -    return true; + return true; }
              @@ -336,58 +336,58 @@ app_create(void *user_date)
            1. Get the window object with the watch_app_get_elm_win() function: 
               struct _appdata {
-    Evas *evas;
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label;
+    Evas *evas;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label;
 };
 typedef struct _appdata appdata;
 
 static void
 __create_base_gui(appdata *ad, int width, int height)
 {
-    int ret;
-    watch_time_h watch_time = NULL;
-    ret = watch_app_get_elm_win(&ad->win);
-
-    if (ret != APP_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret);
-
-        return;
-    }
-    evas_object_resize(ad->win, width, height);
-    ad->conform = elm_conformant_add(ad->win);
-    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-    elm_win_resize_object_add(ad->win, ad->conform);
-    evas_object_show(ad->conform);
-    ad->label = elm_label_add(ad->conform);
-    evas_object_resize(ad->label, width, height / 3);
-    evas_object_move(ad->label, 0, height / 3);
-    evas_object_show(ad->label);
+    int ret;
+    watch_time_h watch_time = NULL;
+    ret = watch_app_get_elm_win(&ad->win);
+
+    if (ret != APP_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret);
+
+        return;
+    }
+    evas_object_resize(ad->win, width, height);
+    ad->conform = elm_conformant_add(ad->win);
+    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+    elm_win_resize_object_add(ad->win, ad->conform);
+    evas_object_show(ad->conform);
+    ad->label = elm_label_add(ad->conform);
+    evas_object_resize(ad->label, width, height / 3);
+    evas_object_move(ad->label, 0, height / 3);
+    evas_object_show(ad->label);
            2. Get the time handle for the current time with the watch_time_get_current_time() function: 
              -    ret = watch_time_get_current_time(&watch_time);
-    if (ret != APP_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get current time. err = %d", ret);
-    __update_watch(ad, watch_time);
+    ret = watch_time_get_current_time(&watch_time);
+    if (ret != APP_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get current time. err = %d", ret);
+    __update_watch(ad, watch_time);
 }
 
 bool
 app_create(void *user_date)
 {
-    /* Define system callbacks */
+    /* Define system callbacks */
 
-    appdata *ad = data;
-    __create_base_gui(ad, width, height);
+    appdata *ad = data;
+    __create_base_gui(ad, width, height);
 
-    return true;
+    return true;
 }
              3. -
            3. When you no longer need the watch_time_h time handle, release it with the watch_time_delete() function. +
            4. When you no longer need the watch_time_h time handle, release it with the watch_time_delete() function.
            @@ -405,29 +405,29 @@ app_create(void *user_date) static void __update_watch(appdata *ad, watch_time_h watch_time) { -    watch_text[TEXT_BUF_SIZE]; -    int hour24; -    int minute; -    int second; - -    if (watch_time == NULL) -        return; - -    watch_time_get_hour24(watch_time, &hour24); -    watch_time_get_minute(watch_time, &minute); -    watch_time_get_second(watch_time, &second); -    snprintf(watch_text, TEXT_BUF_SIZE, -             "<align=center>Hello Watch<br/>%02d:%02d:%02d</align>", -             hour24, minute, second); -    elm_object_text_set(ad->label, watch_text); + watch_text[TEXT_BUF_SIZE]; + int hour24; + int minute; + int second; + + if (watch_time == NULL) + return; + + watch_time_get_hour24(watch_time, &hour24); + watch_time_get_minute(watch_time, &minute); + watch_time_get_second(watch_time, &second); + snprintf(watch_text, TEXT_BUF_SIZE, + "<align=center>Hello Watch<br/>%02d:%02d:%02d</align>", + hour24, minute, second); + elm_object_text_set(ad->label, watch_text); } static void __create_base_gui(appdata *ad, int width, int height) { -    /* Get the window object and time handle */ + /* Get the window object and time handle */ -    __update_watch(ad, watch_time); + __update_watch(ad, watch_time); } @@ -441,24 +441,24 @@ __create_base_gui(appdata *ad, int width, int height)

            To use the ambient mode:

              -
            1. Define the ambient mode callbacks. +
            2. Define the ambient mode callbacks.

              • The ambient_changed event is triggered when the ambient mode is enabled or disabled in the device. You can use the callback to initialize your ambient mode UI.

              • The ambient_tick event is triggered every minute while the device is in the ambient mode. You can use the callback to update the time on your watch application in the ambient mode. In this callback, do not perform time-consuming task and always update the UI as fast as possible. The platform can put the device to sleep shortly after the ambient tick expires.

               void
 app_ambient_tick(watch_time_h watch_time, void* user_data)
 {
-    appdata *ad = user_data;
-    __update_watch(ad, watch_time);
+    appdata *ad = user_data;
+    __update_watch(ad, watch_time);
 }
 
 void
 app_ambient_changed(bool ambient_mode, void* user_data)
 {
-    if (ambient_mode)
-        /* Prepare to enter the ambient mode */
-    else
-        /* Prepare to exit the ambient mode */
+    if (ambient_mode)
+        /* Prepare to enter the ambient mode */
+    else
+        /* Prepare to exit the ambient mode */
 }
              3. @@ -467,23 +467,23 @@ app_ambient_changed(bool ambient_mode, void* user_data) int main(int argc, char* argv[]) { -    appdata ad = {0,}; -    watch_app_lifecycle_callback_s callback = {0,}; + appdata ad = {0,}; + watch_app_lifecycle_callback_s callback = {0,}; -    /* Other life-cycle callbacks */ + /* Other life-cycle callbacks */ -    callback.ambient_tick = app_ambient_tick; -    callback.ambient_changed = app_ambient_changed; + callback.ambient_tick = app_ambient_tick; + callback.ambient_changed = app_ambient_changed; -    int ret = watch_app_main(argc, argv, &callback, &ad); -    if (ret != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_main() failed. err = %d", ret); + int ret = watch_app_main(argc, argv, &callback, &ad); + if (ret != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "watch_app_main() failed. err = %d", ret); -    return ret; + return ret; } -
            +
        @@ -507,4 +507,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/app_management/widget_app_n.htm b/org.tizen.guides/html/native/app_management/widget_app_n.htm index 2136d70..683093a 100644 --- a/org.tizen.guides/html/native/app_management/widget_app_n.htm +++ b/org.tizen.guides/html/native/app_management/widget_app_n.htm @@ -5,20 +5,20 @@ - + - EFL Widget Application - + EFL Widget Application + - +

        Mobile native Wearable native

        - +

        Dependencies

        Related Info

          @@ -68,7 +68,7 @@ The widget application UI has a limitation with the scroll action to provide better user experience. Design the widget UI to display all the information within the given area of the screen points.

          To draw the UI, use a single window that is returned by the widget_app_get_elm_win() function. Do not create additional windows. A stack of widget application windows gets corrupted, because the platform handles the widget application window in a special way.

        - +
      @@ -110,7 +110,7 @@ - +

      Widget Instance States and Events

      The following figure illustrates the widget instance states during the instance life-cycle:

      @@ -126,7 +126,7 @@

      The following table lists the callbacks you can use as the instance state changes.

      - +

      Table: Instance state change callbacks

      @@ -162,24 +162,24 @@ -
      Called when an event for updating the widget is received.
      - -

      To register widget instance callbacks, use the widget_app_class_create() function within the widget_app_create_cb() callback function:

      + + +

      To register widget instance callbacks, use the widget_app_class_create() function within the widget_app_create_cb() callback function:

       static widget_class_h
 widget_app_create(void *user_data)
 {
-    widget_instance_lifecycle_callback_s ops = {
-        .create = widget_instance_create,
-        .destroy = widget_instance_destroy,
-        .pause = widget_instance_pause,
-        .resume = widget_instance_resume,
-        .update = widget_instance_update,
-        .resize = widget_instance_resize,
-    };
-
-    return widget_app_class_create(ops, user_data);
+    widget_instance_lifecycle_callback_s ops = {
+        .create = widget_instance_create,
+        .destroy = widget_instance_destroy,
+        .pause = widget_instance_pause,
+        .resume = widget_instance_resume,
+        .update = widget_instance_update,
+        .resize = widget_instance_resize,
+    };
+
+    return widget_app_class_create(ops, user_data);
 }
      @@ -200,7 +200,7 @@ widget_app_create(void *user_data)
    • Edit the widget application settings in the manifest file.
      • -

      Creating the Widget Application

      +

      Creating the Widget Application

      The widget application starts with the main() function, which creates and initializes the application. The widget_app_main() function is used to start the application event loop. Before calling this function, set up the widget_app_lifecycle_callback_s structure variable, which is passed to the function.

      To create the widget application:

      @@ -212,17 +212,17 @@ widget_app_create(void *user_data) int main(int argc, char *argv[]) { -    widget_app_lifecycle_callback_s ops = {0,}; -    int ret; + widget_app_lifecycle_callback_s ops = {0,}; + int ret; -    ops.create = widget_app_create; -    ops.terminate = widget_app_terminate; + ops.create = widget_app_create; + ops.terminate = widget_app_terminate; -    ret = widget_app_main(argc, argv, &ops, NULL); -    if (ret != WIDGET_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "widget_app_main() failed. err = %d", ret); + ret = widget_app_main(argc, argv, &ops, NULL); + if (ret != WIDGET_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "widget_app_main() failed. err = %d", ret); -    return ret; + return ret; } @@ -231,31 +231,31 @@ main(int argc, char *argv[]) widget_class_h widget_app_create(void *user_data) { -    /* Hook to take necessary actions before main event loop starts */ -    widget_instance_lifecycle_callback_s obj_callback = {0,}; -    app_event_handler_h handlers[5] = {NULL,}; + /* Hook to take necessary actions before main event loop starts */ + widget_instance_lifecycle_callback_s obj_callback = {0,}; + app_event_handler_h handlers[5] = {NULL,}; -    /* Register the callback functions for the widget instance life-cycle */ + /* Register the callback functions for the widget instance life-cycle */
    • Register the callback functions for the system events.

      At the end of the widget_app_create() function, remember to create a widget instance class and return a handle for it, so that the handle can be used for making widget instances.

      -    /* Register the callback functions for system events */
-    widget_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY],
-                                 APP_EVENT_LOW_BATTERY,
-                                 widget_app_low_battery, NULL);
-    widget_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
-                                 widget_app_low_memory, NULL);
-    widget_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED],
-                                 APP_EVENT_LANGUAGE_CHANGED,
-                                 widget_app_lang_changed, NULL);
-    widget_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED],
-                                 APP_EVENT_REGION_FORMAT_CHANGED,
-                                 widget_app_region_changed, NULL);
-
-    return widget_app_class_create(obj_callback, user_data);
+    /* Register the callback functions for system events */
+    widget_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY],
+                                 APP_EVENT_LOW_BATTERY,
+                                 widget_app_low_battery, NULL);
+    widget_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
+                                 widget_app_low_memory, NULL);
+    widget_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED],
+                                 APP_EVENT_LANGUAGE_CHANGED,
+                                 widget_app_lang_changed, NULL);
+    widget_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED],
+                                 APP_EVENT_REGION_FORMAT_CHANGED,
+                                 widget_app_region_changed, NULL);
+
+    return widget_app_class_create(obj_callback, user_data);
 }

      When the system-related callback are no longer needed, remove them with the widget_app_remove_event_handler() function.

      @@ -266,33 +266,33 @@ widget_app_create(void *user_data) void widget_app_lang_changed(app_event_info_h event_info, void* user_data) { -    /* Take actions when language setting changes and messages must be translated */ -    char *locale = NULL; -    app_event_get_language(event_info, &locale); -    elm_language_set(locale); -    free(locale); + /* Take actions when language setting changes and messages must be translated */ + char *locale = NULL; + app_event_get_language(event_info, &locale); + elm_language_set(locale); + free(locale); } void widget_app_region_changed(app_event_info_h event_info, void* user_data) { -    /* Take actions when the time zone changes */ + /* Take actions when the time zone changes */ } void widget_app_low_battery(app_event_info_h event_info, void* user_data) { -    /* Take actions when system is running low on battery (less than 5%) */ -    /* Save the work and avoid battery-intensive processes */ -    widget_app_exit(); + /* Take actions when system is running low on battery (less than 5%) */ + /* Save the work and avoid battery-intensive processes */ + widget_app_exit(); } void widget_app_low_memory(app_event_info_h event_info, void* user_data) { -    /* Take actions when system is running on low memory */ -    /* Save the work and release resources; if necessary, some apps can be killed */ -    widget_app_exit(); + /* Take actions when system is running on low memory */ + /* Save the work and release resources; if necessary, some apps can be killed */ + widget_app_exit(); }
      • @@ -302,7 +302,7 @@ widget_app_low_memory(app_event_info_h event_info, void* user_data) static void widget_app_terminate(void *user_data) { -    /* Release all resources */ + /* Release all resources */ } @@ -318,33 +318,33 @@ widget_app_terminate(void *user_data) 
       int
 widget_instance_create(widget_context_h context, bundle *content, int w, int h,
-                       void *user_data)
+                       void *user_data)
 {
-    widget_instance_data_s *wid =
-        (widget_instance_data_s*)malloc(sizeof(widget_instance_data_s));
-    int ret;
+    widget_instance_data_s *wid =
+        (widget_instance_data_s*)malloc(sizeof(widget_instance_data_s));
+    int ret;
 
-    if (content != NULL)
-        /* Recover the previous status with the bundle object */
+    if (content != NULL)
+        /* Recover the previous status with the bundle object */
 
-    /* Create the UI */
+    /* Create the UI */
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
      -
    • This callback is triggered when the widget instance is destroyed. +
    • This callback is triggered when the widget instance is destroyed.

      Release all widget resources. If the reason for the termination is not WIDGET_APP_DESTROY_TYPE_PERMANENT, store the current status with the incoming bundle.

       int
 widget_instance_destroy(widget_context_h context, widget_app_destroy_type_e reason,
-                        bundle *content, void *user_data)
+                        bundle *content, void *user_data)
 {
-    if (reason != WIDGET_APP_DESTROY_TYPE_PERMANENT)
-        /* Save the current status at the bundle object */
+    if (reason != WIDGET_APP_DESTROY_TYPE_PERMANENT)
+        /* Save the current status at the bundle object */
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
      @@ -356,7 +356,7 @@ widget_instance_destroy(widget_context_h context, widget_app_destroy_type_e reas int widget_instance_pause(widget_context_h context, void *user_data) { -    return WIDGET_ERROR_NONE; + return WIDGET_ERROR_NONE; }
      • @@ -366,7 +366,7 @@ widget_instance_pause(widget_context_h context, void *user_data) int widget_instance_resume(widget_context_h context, void *user_data) { -    return WIDGET_ERROR_NONE; + return WIDGET_ERROR_NONE; } @@ -376,8 +376,8 @@ widget_instance_resume(widget_context_h context, void *user_data) int widget_instance_resize(widget_context_h context, int w, int h, void *user_data) { -    return WIDGET_ERROR_NONE; -} + return WIDGET_ERROR_NONE; +}
    • This callback is triggered when a widget update event is received. @@ -385,9 +385,9 @@ widget_instance_resize(widget_context_h context, int w, int h, void *user_data) 
       int
 widget_instance_update(widget_context_h context, bundle *content, int force,
-                       void *user_data)
+                       void *user_data)
 {
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
      • @@ -399,18 +399,18 @@ widget_instance_update(widget_context_h context, bundle *content, int force, widget_class_h widget_app_create(void *user_data) { -    widget_instance_lifecycle_callback_s obj_callback = {0,}; -    /* Register the callback functions */ -    obj_callback.create = widget_instance_create; -    obj_callback.destroy = widget_instance_destroy; -    obj_callback.pause = widget_instance_pause; -    obj_callback.resume = widget_instance_resume; -    obj_callback.resize = widget_instance_resize; -    obj_callback.update = widget_instance_update; - -    /* Register system-related callbacks */ - -    return widget_app_class_create(obj_callback, user_data); + widget_instance_lifecycle_callback_s obj_callback = {0,}; + /* Register the callback functions */ + obj_callback.create = widget_instance_create; + obj_callback.destroy = widget_instance_destroy; + obj_callback.pause = widget_instance_pause; + obj_callback.resume = widget_instance_resume; + obj_callback.resize = widget_instance_resize; + obj_callback.update = widget_instance_update; + + /* Register system-related callbacks */ + + return widget_app_class_create(obj_callback, user_data); } @@ -421,70 +421,70 @@ widget_app_create(void *user_data)

      To draw the widget UI, you must get a window object with the widget_app_get_elm_win() function and create the UI on the home screen:

       struct widget_instance_data {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label;
 };
 typedef struct widget_instance_data widget_instance_data_s;
 
 static int
 widget_instance_create(widget_context_h context, bundle *content, int w, int h,
-                       void *user_data)
+                       void *user_data)
 {
-    widget_instance_data_s *wid =
-        (widget_instance_data_s*)malloc(sizeof(widget_instance_data_s));
+    widget_instance_data_s *wid =
+        (widget_instance_data_s*)malloc(sizeof(widget_instance_data_s));
 
-    int ret;
-    if (content != NULL)
-        /* Recover the previous status with the bundle object */
+    int ret;
+    if (content != NULL)
+        /* Recover the previous status with the bundle object */
 
-    /* Window */
-    ret = widget_app_get_elm_win(context, &wid->win);
-    if (ret != WIDGET_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret);
+    /* Window */
+    ret = widget_app_get_elm_win(context, &wid->win);
+    if (ret != WIDGET_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret);
 
-        return WIDGET_ERROR_FAULT;
-    }
+        return WIDGET_ERROR_FAULT;
+    }
 
-    evas_object_resize(wid->win, w, h);
+    evas_object_resize(wid->win, w, h);
 
-    /* Conformant */
-    wid->conform = elm_conformant_add(wid->win);
-    evas_object_size_hint_weight_set(wid->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-    elm_win_resize_object_add(wid->win, wid->conform);
-    evas_object_show(wid->conform);
+    /* Conformant */
+    wid->conform = elm_conformant_add(wid->win);
+    evas_object_size_hint_weight_set(wid->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+    elm_win_resize_object_add(wid->win, wid->conform);
+    evas_object_show(wid->conform);
 
-    /* Label */
-    wid->label = elm_label_add(wid->conform);
-    evas_object_resize(wid->label, w, h / 3);
-    evas_object_move(wid->label, 0, h / 3);
-    evas_object_show(wid->label);
-    elm_object_text_set(wid->label, "Hello widget");
+    /* Label */
+    wid->label = elm_label_add(wid->conform);
+    evas_object_resize(wid->label, w, h / 3);
+    evas_object_move(wid->label, 0, h / 3);
+    evas_object_show(wid->label);
+    elm_object_text_set(wid->label, "Hello widget");
 
-    /* Show the window after the base GUI is set up */
-    evas_object_show(wid->win);
+    /* Show the window after the base GUI is set up */
+    evas_object_show(wid->win);
 
-    widget_app_context_set_tag(context, wid);
+    widget_app_context_set_tag(context, wid);
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
 
 int
 widget_instance_destroy(widget_context_h context, widget_app_destroy_type_e reason,
-                        bundle *content, void *user_data)
+                        bundle *content, void *user_data)
 {
-    if (reason != WIDGET_APP_DESTROY_TYPE_PERMANENT)
-        /* Save the current status at the bundle object */
+    if (reason != WIDGET_APP_DESTROY_TYPE_PERMANENT)
+        /* Save the current status at the bundle object */
 
-    widget_instance_data_s *wid = NULL;
-    widget_app_context_get_tag(context, (void**)&wid);
+    widget_instance_data_s *wid = NULL;
+    widget_app_context_get_tag(context, (void**)&wid);
 
-    if (wid->win)
-        evas_object_del(wid->win);
+    if (wid->win)
+        evas_object_del(wid->win);
 
-    free(wid);
+    free(wid);
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
      @@ -495,35 +495,35 @@ widget_instance_destroy(widget_context_h context, widget_app_destroy_type_e reas
    • You can set a customized widget instance with the widget_app_context_set_tag() function when the instance is created. To update or destroy the customized widget, get the instance with the widget_app_context_get_tag() function. 
       struct _user_defined_s {
-    int val1;
+    int val1;
 };
 typedef struct _user_defined_s user_defined_s;
 
 int
 widget_instance_create(widget_context_h context, bundle *content, int w, int h,
-                       void *user_data)
+                       void *user_data)
 {
-    user_defined_s *uds = (user_defined_s*)malloc(sizeof(user_defined_s));
-    uds->val1 = 0;
-    widget_app_context_set_tag(context, uds);
+    user_defined_s *uds = (user_defined_s*)malloc(sizeof(user_defined_s));
+    uds->val1 = 0;
+    widget_app_context_set_tag(context, uds);
 }
 
 int
 widget_instance_destroy(widget_context_h context, widget_destroy_type_e reason,
-                        bundle *content, void *user_data)
+                        bundle *content, void *user_data)
 {
-    user_defined_s *uds = NULL;
-    widget_app_context_get_tag(context, (void**)&uds);
-    free(uds);
+    user_defined_s *uds = NULL;
+    widget_app_context_get_tag(context, (void**)&uds);
+    free(uds);
 }
 
 int
 widget_instance_update(widget_context_h context, bundle *content, int force,
-                       void *user_data)
+                       void *user_data)
 {
-    user_defined_s *uds = NULL;
-    widget_app_context_get_tag(context, (void**)&uds);
-    uds->val1 = 1;
+    user_defined_s *uds = NULL;
+    widget_app_context_get_tag(context, (void**)&uds);
+    uds->val1 = 1;
 }
      • @@ -532,10 +532,10 @@ widget_instance_update(widget_context_h context, bundle *content, int force, 
       int
 widget_instance_update(widget_context_h context, bundle *content, int force,
-                       void *user_data)
+                       void *user_data)
 {
-    const char *inst_id = NULL;
-    inst_id = widget_app_get_id(context);
+    const char *inst_id = NULL;
+    inst_id = widget_app_get_id(context);
 }
      @@ -549,12 +549,12 @@ widget_instance_update(widget_context_h context, bundle *content, int force,
    • The Weather application is launched when user selects it from the application list.
    • The widget is launched when the Home screen is on screen and is terminated when the Home screen is hidden.
    -

    Although the widget wants to share some data from the Weather application (such as the user's favorite city), it is ineffective for the widget to launch the Weather application every time to retrieve such data. This inefficiency makes it difficult to use typical IPC mechanisms, such as socket and Message Port, in which both the receiver and sender processes must be alive for communication. To overcome this issue, the widget application must use a communication type where the data is permanently stored somewhere in the system.

    +

    Although the widget wants to share some data from the Weather application (such as the user's favorite city), it is ineffective for the widget to launch the Weather application every time to retrieve such data. This inefficiency makes it difficult to use typical IPC mechanisms, such as socket and Message Port, in which both the receiver and sender processes must be alive for communication. To overcome this issue, the widget application must use a communication type where the data is permanently stored somewhere in the system.

    In the Tizen platform, applications in the same package (including widget applications) can access files in the data directory of the package installation path. This means that the UI (or service) application can first write files to the data directory, and the widget can later read them, or vice versa.

    -

    Figure: Sharing through the data directory

    -

    Sharing through the data directory

    +

    Figure: Sharing through the data directory

    +

    Sharing through the data directory

    To manage data through the data directory:

    @@ -569,7 +569,7 @@ widget_instance_update(widget_context_h context, bundle *content, int force,

    The following figure illustrates typical data control flows between the set of UI, service, and widget applications.

    -

    Figure: Sharing through data control

    +

    Figure: Sharing through data control

    Sharing through data control

    @@ -601,4 +601,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/connectivity/bluetooth_n.htm b/org.tizen.guides/html/native/connectivity/bluetooth_n.htm index 21712dc..0a2eab6 100644 --- a/org.tizen.guides/html/native/connectivity/bluetooth_n.htm +++ b/org.tizen.guides/html/native/connectivity/bluetooth_n.htm @@ -62,7 +62,7 @@
  • Releasing All Resources
    • - +

    Related Info

    • Bluetooth API for Mobile Native
      • @@ -84,15 +84,15 @@

      The main features of the Bluetooth API include:

        -
      • Managing the local Bluetooth adapter +
      • Managing the local Bluetooth adapter

        The Bluetooth Adapter API (in mobile and wearable applications) provides functions for setting up Bluetooth and discovering other devices. The API is used to control the Bluetooth adapter: you must enable the adapter before any other Bluetooth actions, and when you no longer need it, disable it to save device power. You can check and monitor the adapter state.

        You can control the visibility of the device, meaning whether its name appears to others searching for Bluetooth devices. In addition, you can discover neighboring Bluetooth devices. This process is asynchronous, so you must build and hold the list of devices in the neighborhood.

        • -
      • Discovering devices +
      • Discovering devices

        The Bluetooth Device API (in mobile and wearable applications) provides functions for managing bonds with other devices and searching for supported services. The API is used to handle the connection with other devices and to search for services available on remote devices.

        You can discover other Bluetooth devices. The device discovery process can retrieve multiple types of Bluetooth devices, such as printers, mobile phones, and headphones.

        • -
      • Creating a bonding with a Bluetooth device +
      • Creating a bonding with a Bluetooth device

        You can create a bonding with another device with the Bluetooth Device API. The bonding allows the 2 devices to establish a connection.

        Connected devices exchange keys needed for encrypted communication, but each connection has to be approved by the latest application user. You can also set authorization of other devices. Authorized devices are connected automatically without the latest user being asked for authorization.

        • @@ -120,12 +120,12 @@

        Push and accept objects, such as pictures.

      • Exchanging data with Bluetooth LE

        The Bluetooth LE Adapter API (in mobile and wearable applications) provides functions for managing the Bluetooth Low Energy (BLE) connections with other BLE devices and exchanging data between them.

        -

        You can control the visibility of the BLE device, meaning whether its name appears to others searching for BLE devices. In addition, you discover neighboring BLE devices. This process is asynchronous, so you must build and hold the list of devices in the neighborhood.

        +

        You can control the visibility of the BLE device, meaning whether its name appears to others searching for BLE devices. In addition, you discover neighboring BLE devices. This process is asynchronous, so you must build and hold the list of devices in the neighborhood.

        You can use LE operations to manage scans, discover nearby devices, add advertising data, set the advertising connectable mode, set the advertising mode, and start and stop advertising.

        -
        • +
      • Controlling remote audio and video devices with Bluetooth AVRCP

        The Bluetooth AVRCP feature (in mobile applications) provides functions for remotely controlling audio and video devices.

        -

        Bluetooth AVRCP is used with A2DP. You can handle remote controls (such as play, pause, stop, equalizer, repeat, shuffle, and scan) through AVRCP.

        • +

        Bluetooth AVRCP is used with A2DP. You can handle remote controls (such as play, pause, stop, equalizer, repeat, shuffle, and scan) through AVRCP.

      Remember to release all resources when you are done.

      @@ -141,11 +141,11 @@

      To use the Bluetooth API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

       <privileges>
-   <privilege>http://tizen.org/privilege/bluetooth</privilege>
+   <privilege>http://tizen.org/privilege/bluetooth</privilege>
 </privileges>
      -
    • +

    • To use the functions and data types of the Bluetooth API, include the <bluetooth.h> header file in your application:

       #include <bluetooth.h>
@@ -160,19 +160,19 @@ bt_error_e ret;
 
 ret = bt_initialize();
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_initialize] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_initialize] failed.");
 
-    return;
+    return;
 }

      • Enabling and Disabling Bluetooth

      - +

      To allow the user to enable or disable Bluetooth, use the application control to display the Bluetooth activation settings.

      The Bluetooth API does not contain functions for enabling or disabling Bluetooth. You must display the Bluetooth activation settings application to allow the user to toggle the Bluetooth state.

      -

      Figure: Bluetooth activation settings application (off screen on the left and on screen on the right)

      -

      Bluetooth activation settings application (off screen on the left and on screen on the right)

      +

      Figure: Bluetooth activation settings application (off screen on the left and on screen on the right)

      +

      Bluetooth activation settings application (off screen on the left and on screen on the right)

       #include <app_control.h>
@@ -181,29 +181,29 @@ if (ret != BT_ERROR_NONE) {
 int
 bt_onoff_operation(void)
 {
-    int ret = 0;
-    app_control_h service = NULL;
-    app_control_create(&service);
-    if (service == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "service_create failed!\n");
+    int ret = 0;
+    app_control_h service = NULL;
+    app_control_create(&service);
+    if (service == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "service_create failed!\n");
 
-        return 0;
-    }
-    app_control_set_operation(service, "APP_CONTROL_OPERATION_SETTING_BT_ENABLE");
-    ret = app_control_send_launch_request(service, NULL, NULL);
+        return 0;
+    }
+    app_control_set_operation(service, "APP_CONTROL_OPERATION_SETTING_BT_ENABLE");
+    ret = app_control_send_launch_request(service, NULL, NULL);
 
-    app_control_destroy(service);
-    if (ret == APP_CONTROL_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to Bluetooth On/Off app!\n");
+    app_control_destroy(service);
+    if (ret == APP_CONTROL_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to Bluetooth On/Off app!\n");
 
-        return 0;
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to relaunch Bluetooth On/Off app!\n");
+        return 0;
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to relaunch Bluetooth On/Off app!\n");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }
      @@ -218,14 +218,14 @@ bt_adapter_state_e adapter_state; /* Check whether the Bluetooth adapter is enabled */ ret = bt_adapter_get_state(&adapter_state); if (ret != BT_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_get_state] failed"); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_get_state] failed"); -    return; + return; } /* If the Bluetooth adapter is not enabled */ if (adapter_state == BT_ADAPTER_DISABLED) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "Bluetooth adapter is not enabled. You should enable Bluetooth!!"); + dlog_print(DLOG_ERROR, LOG_TAG, + "Bluetooth adapter is not enabled. You should enable Bluetooth!!"); @@ -238,67 +238,67 @@ bt_error_e ret; void adapter_state_changed_cb(int result, bt_adapter_state_e adapter_state, void* user_data) { -    if (result != BT_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "[adapter_state_changed_cb] failed! result=%d", -                   result); - -        return; -    } -    if (adapter_state == BT_ADAPTER_ENABLED) { -        dlog_print(DLOG_INFO, LOG_TAG, -                   "[adapter_state_changed_cb] Bluetooth is enabled!"); - -        /* Get information about Bluetooth adapter */ -        char *local_address = NULL; -        bt_adapter_get_address(&local_address); -        dlog_print(DLOG_INFO, LOG_TAG, -                   "[adapter_state_changed_cb] Adapter address: %s.", -                   local_address); -        if (local_address) -            free(local_address); -        char *local_name; -        bt_adapter_get_name(&local_name); -        dlog_print(DLOG_INFO, LOG_TAG, -                   "[adapter_state_changed_cb] Adapter name: %s.", -                   local_name); -        if (local_name) -            free(local_name); -        /* Visibility mode of the Bluetooth device */ -        bt_adapter_visibility_mode_e mode; -        /* -         Duration until the visibility mode is changed -         so that other devices cannot find your device -        */ -        int duration = 1; -        bt_adapter_get_visibility(&mode, &duration); -        switch (mode) { -        case BT_ADAPTER_VISIBILITY_MODE_NON_DISCOVERABLE: -            dlog_print(DLOG_INFO, LOG_TAG, -                       "[adapter_state_changed_cb] Visibility: NON_DISCOVERABLE"); -            break; -        case BT_ADAPTER_VISIBILITY_MODE_GENERAL_DISCOVERABLE: -            dlog_print(DLOG_INFO, LOG_TAG, -                       "[adapter_state_changed_cb] Visibility: GENERAL_DISCOVERABLE"); -            break; -        case BT_ADAPTER_VISIBILITY_MODE_LIMITED_DISCOVERABLE: -            dlog_print(DLOG_INFO, LOG_TAG, -                       "[adapter_state_changed_cb] Visibility: LIMITED_DISCOVERABLE"); -            break; -        } -    } else { -        dlog_print(DLOG_INFO, LOG_TAG, -                   "[adapter_state_changed_cb] Bluetooth is disabled!"); -        /* -         When you try to get device information -         by invoking bt_adapter_get_name(), bt_adapter_get_address(), -         or bt_adapter_get_visibility(), BT_ERROR_NOT_ENABLED occurs -        */ -    } + if (result != BT_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "[adapter_state_changed_cb] failed! result=%d", + result); + + return; + } + if (adapter_state == BT_ADAPTER_ENABLED) { + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Bluetooth is enabled!"); + + /* Get information about Bluetooth adapter */ + char *local_address = NULL; + bt_adapter_get_address(&local_address); + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Adapter address: %s.", + local_address); + if (local_address) + free(local_address); + char *local_name; + bt_adapter_get_name(&local_name); + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Adapter name: %s.", + local_name); + if (local_name) + free(local_name); + /* Visibility mode of the Bluetooth device */ + bt_adapter_visibility_mode_e mode; + /* + Duration until the visibility mode is changed + so that other devices cannot find your device + */ + int duration = 1; + bt_adapter_get_visibility(&mode, &duration); + switch (mode) { + case BT_ADAPTER_VISIBILITY_MODE_NON_DISCOVERABLE: + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Visibility: NON_DISCOVERABLE"); + break; + case BT_ADAPTER_VISIBILITY_MODE_GENERAL_DISCOVERABLE: + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Visibility: GENERAL_DISCOVERABLE"); + break; + case BT_ADAPTER_VISIBILITY_MODE_LIMITED_DISCOVERABLE: + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Visibility: LIMITED_DISCOVERABLE"); + break; + } + } else { + dlog_print(DLOG_INFO, LOG_TAG, + "[adapter_state_changed_cb] Bluetooth is disabled!"); + /* + When you try to get device information + by invoking bt_adapter_get_name(), bt_adapter_get_address(), + or bt_adapter_get_visibility(), BT_ERROR_NOT_ENABLED occurs + */ + } } ret = bt_adapter_set_state_changed_cb(adapter_state_changed_cb, NULL); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_set_state_changed_cb()] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_set_state_changed_cb()] failed."); @@ -323,61 +323,61 @@ if (ret != BT_ERROR_NONE) #include <glib.h> /* For GList */ void adapter_device_discovery_state_changed_cb(int result, -                                          bt_adapter_device_discovery_state_e -                                          discovery_state, -                                          bt_adapter_device_discovery_info_s -                                          *discovery_info, -                                          void* user_data) + bt_adapter_device_discovery_state_e + discovery_state, + bt_adapter_device_discovery_info_s + *discovery_info, + void* user_data) { -    if (result != BT_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "[adapter_device_discovery_state_changed_cb] failed! -                    result(%d).", result); - -        return; -    } -    GList** searched_device_list = (GList**)user_data; -    switch (discovery_state) { -    case BT_ADAPTER_DEVICE_DISCOVERY_STARTED: -        dlog_print(DLOG_INFO, LOG_TAG, "BT_ADAPTER_DEVICE_DISCOVERY_STARTED"); -        break; -    case BT_ADAPTER_DEVICE_DISCOVERY_FINISHED: -        dlog_print(DLOG_INFO, LOG_TAG, "BT_ADAPTER_DEVICE_DISCOVERY_FINISHED"); -        break; -    case BT_ADAPTER_DEVICE_DISCOVERY_FOUND: -        dlog_print(DLOG_INFO, LOG_TAG, "BT_ADAPTER_DEVICE_DISCOVERY_FOUND"); -        if (discovery_info != NULL) { -            dlog_print(DLOG_INFO, LOG_TAG, -                       "Device Address: %s", -                       discovery_info->remote_address); -            dlog_print(DLOG_INFO, LOG_TAG, -                       "Device Name is: %s", -                       discovery_info->remote_name); -            bt_adapter_device_discovery_info_s * new_device_info = -                malloc(sizeof(bt_adapter_device_discovery_info_s)); -            if (new_device_info != NULL) { -                memcpy(new_device_info, discovery_info, -                       sizeof(bt_adapter_device_discovery_info_s)); -                new_device_info->remote_address = -                    strdup(discovery_info->remote_address); -                new_device_info->remote_name = -                    strdup(discovery_info->remote_name); -                *searched_device_list = g_list_append(*searched_device_list, -                                                      (gpointer)new_device_info); -            } -        } -        break; -    } + if (result != BT_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "[adapter_device_discovery_state_changed_cb] failed! + result(%d).", result); + + return; + } + GList** searched_device_list = (GList**)user_data; + switch (discovery_state) { + case BT_ADAPTER_DEVICE_DISCOVERY_STARTED: + dlog_print(DLOG_INFO, LOG_TAG, "BT_ADAPTER_DEVICE_DISCOVERY_STARTED"); + break; + case BT_ADAPTER_DEVICE_DISCOVERY_FINISHED: + dlog_print(DLOG_INFO, LOG_TAG, "BT_ADAPTER_DEVICE_DISCOVERY_FINISHED"); + break; + case BT_ADAPTER_DEVICE_DISCOVERY_FOUND: + dlog_print(DLOG_INFO, LOG_TAG, "BT_ADAPTER_DEVICE_DISCOVERY_FOUND"); + if (discovery_info != NULL) { + dlog_print(DLOG_INFO, LOG_TAG, + "Device Address: %s", + discovery_info->remote_address); + dlog_print(DLOG_INFO, LOG_TAG, + "Device Name is: %s", + discovery_info->remote_name); + bt_adapter_device_discovery_info_s * new_device_info = + malloc(sizeof(bt_adapter_device_discovery_info_s)); + if (new_device_info != NULL) { + memcpy(new_device_info, discovery_info, + sizeof(bt_adapter_device_discovery_info_s)); + new_device_info->remote_address = + strdup(discovery_info->remote_address); + new_device_info->remote_name = + strdup(discovery_info->remote_name); + *searched_device_list = g_list_append(*searched_device_list, + (gpointer)new_device_info); + } + } + break; + } } GList *devices_list = NULL; ret = -    bt_adapter_set_device_discovery_state_changed_cb(adapter_device_discovery_state_changed_cb, -                                                     (void*)&devices_list); + bt_adapter_set_device_discovery_state_changed_cb(adapter_device_discovery_state_changed_cb, + (void*)&devices_list); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "[bt_adapter_set_device_discovery_state_changed_cb] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, + "[bt_adapter_set_device_discovery_state_changed_cb] failed.");
    • Start the discovery process: @@ -389,7 +389,7 @@ ret = bt_adapter_start_device_discovery(); int bt_adapter_le_start_device_discovery(void); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_start_device_discovery] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_start_device_discovery] failed.");

      You can discover a nearby remote Bluetooth device, if the remote device Bluetooth is enabled and in a discovery mode.

      @@ -401,13 +401,13 @@ if (ret != BT_ERROR_NONE) 
       ret = bt_device_create_bond(bt_server_address);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_device_create_bond] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_device_create_bond] failed.");
 
-    return;
+    return;
 } else {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "[bt_device_create_bond] succeeded.
-                device_bond_created_cb callback will be called.");
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "[bt_device_create_bond] succeeded.
+                device_bond_created_cb callback will be called.");
 }
      @@ -417,30 +417,30 @@ if (ret != BT_ERROR_NONE) { void device_bond_created_cb(int result, bt_device_info_s *device_info, void *user_data) { -    if (result != BT_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "[bt_device_bond_created_cb] failed. result(%d).", -                   result); - -        return; -    } - -    if (device_info != NULL && !strcmp(device_info->remote_address, -                                       remote_server_address)) { -        dlog_print(DLOG_INFO, LOG_TAG, -                   "Callback: A bond with chat_server is created."); -        dlog_print(DLOG_INFO, LOG_TAG, -                   "Callback: The number of service - %d.", -                   device_info->service_count); -        int i = 0; -        dlog_print(DLOG_INFO, LOG_TAG, "Callback: is_bonded - %d.", -                   device_info->is_bonded); -        dlog_print(DLOG_INFO, LOG_TAG, "Callback: is_connected - %d.", -                   device_info->is_connected); -    } else { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "Callback: A bond with another device is created."); -    } + if (result != BT_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "[bt_device_bond_created_cb] failed. result(%d).", + result); + + return; + } + + if (device_info != NULL && !strcmp(device_info->remote_address, + remote_server_address)) { + dlog_print(DLOG_INFO, LOG_TAG, + "Callback: A bond with chat_server is created."); + dlog_print(DLOG_INFO, LOG_TAG, + "Callback: The number of service - %d.", + device_info->service_count); + int i = 0; + dlog_print(DLOG_INFO, LOG_TAG, "Callback: is_bonded - %d.", + device_info->is_bonded); + dlog_print(DLOG_INFO, LOG_TAG, "Callback: is_connected - %d.", + device_info->is_connected); + } else { + dlog_print(DLOG_ERROR, LOG_TAG, + "Callback: A bond with another device is created."); + } } /* @@ -452,9 +452,9 @@ device_bond_created_cb(int result, bt_device_info_s *device_info, void *user_dat ret = bt_device_set_bond_created_cb(device_bond_created_cb, bt_server_address); if (ret != BT_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_device_set_bond_created_cb] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_device_set_bond_created_cb] failed."); -    return; + return; } @@ -468,56 +468,56 @@ if (ret != BT_ERROR_NONE) { 
       /* Server address for connecting */
 char *bt_server_address = NULL;
-const char *remote_server_name = "server device";
+const char *remote_server_name = "server device";
 
 bool
 adapter_bonded_device_cb(bt_device_info_s *device_info, void *user_data)
 {
-    if (device_info == NULL)
-        return true;
-    if (!strcmp(device_info->remote_name, (char*)user_data)) {
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "The server device is found in bonded device list. address(%s)",
-                   device_info->remote_address);
-        bt_server_address = strdup(device_info->remote_address);
-        /* If you want to stop iterating, you can return "false" */
-    }
-    /* Get information about bonded device */
-    int count_of_bonded_device = 1;
-    dlog_print(DLOG_INFO, LOG_TAG, "Get information about the bonded device(%d)",
-               count_of_bonded_device);
-    dlog_print(DLOG_INFO, LOG_TAG, "remote address = %s.",
-               device_info->remote_address);
-    dlog_print(DLOG_INFO, LOG_TAG, "remote name = %s.", device_info->remote_name);
-    dlog_print(DLOG_INFO, LOG_TAG, "service count = %d.", device_info->service_count);
-    dlog_print(DLOG_INFO, LOG_TAG, "bonded?? %d.", device_info->is_bonded);
-    dlog_print(DLOG_INFO, LOG_TAG, "connected?? %d.", device_info->is_connected);
-    dlog_print(DLOG_INFO, LOG_TAG, "authorized?? %d.", device_info->is_authorized);
-
-    dlog_print(DLOG_INFO, LOG_TAG, "major_device_class %d.",
-               device_info->bt_class.major_device_class);
-    dlog_print(DLOG_INFO, LOG_TAG, "minor_device_class %d.",
-               device_info->bt_class.minor_device_class);
-    dlog_print(DLOG_INFO, LOG_TAG, "major_service_class_mask %d.",
-               device_info->bt_class.major_service_class_mask);
-    count_of_bonded_device++;
-
-    /* Keep iterating */
-
-    return true;
+    if (device_info == NULL)
+        return true;
+    if (!strcmp(device_info->remote_name, (char*)user_data)) {
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "The server device is found in bonded device list. address(%s)",
+                   device_info->remote_address);
+        bt_server_address = strdup(device_info->remote_address);
+        /* If you want to stop iterating, you can return "false" */
+    }
+    /* Get information about bonded device */
+    int count_of_bonded_device = 1;
+    dlog_print(DLOG_INFO, LOG_TAG, "Get information about the bonded device(%d)",
+               count_of_bonded_device);
+    dlog_print(DLOG_INFO, LOG_TAG, "remote address = %s.",
+               device_info->remote_address);
+    dlog_print(DLOG_INFO, LOG_TAG, "remote name = %s.", device_info->remote_name);
+    dlog_print(DLOG_INFO, LOG_TAG, "service count = %d.", device_info->service_count);
+    dlog_print(DLOG_INFO, LOG_TAG, "bonded?? %d.", device_info->is_bonded);
+    dlog_print(DLOG_INFO, LOG_TAG, "connected?? %d.", device_info->is_connected);
+    dlog_print(DLOG_INFO, LOG_TAG, "authorized?? %d.", device_info->is_authorized);
+
+    dlog_print(DLOG_INFO, LOG_TAG, "major_device_class %d.",
+               device_info->bt_class.major_device_class);
+    dlog_print(DLOG_INFO, LOG_TAG, "minor_device_class %d.",
+               device_info->bt_class.minor_device_class);
+    dlog_print(DLOG_INFO, LOG_TAG, "major_service_class_mask %d.",
+               device_info->bt_class.major_service_class_mask);
+    count_of_bonded_device++;
+
+    /* Keep iterating */
+
+    return true;
 }
 
 ret = bt_adapter_foreach_bonded_device(adapter_bonded_device_cb, remote_server_name);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_foreach_bonded_device] failed!");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_foreach_bonded_device] failed!");
 
 if (bt_server_address != NULL)
-    free(bt_server_address);
+    free(bt_server_address);

      To remove a device from the bonded list, call the bt_device_destroy_bond() function.

    - - + +
    Note A Bluetooth device must be in a discovery mode (visible) for other devices to find it and connect to it. If you want other devices to find your device, you must set the device to be visible. @@ -538,12 +538,12 @@ bt_adapter_visibility_mode_e mode; int duration = 1; bt_adapter_get_visibility(&mode, &duration); if (mode == BT_ADAPTER_VISIBILITY_MODE_NON_DISCOVERABLE) -    dlog_print(DLOG_INFO, LOG_TAG, "The device is not discoverable."); + dlog_print(DLOG_INFO, LOG_TAG, "The device is not discoverable."); else if (mode == BT_ADAPTER_VISIBILITY_MODE_GENERAL_DISCOVERABLE) -    dlog_print(DLOG_INFO, LOG_TAG, "The device is discoverable. No time limit."); + dlog_print(DLOG_INFO, LOG_TAG, "The device is discoverable. No time limit."); else -    dlog_print(DLOG_INFO, LOG_TAG, -               "The device is discoverable for a set period of time."); + dlog_print(DLOG_INFO, LOG_TAG, + "The device is discoverable for a set period of time.");
  • @@ -558,29 +558,29 @@ else int bt_set_visibility_operation(void) { -    int ret = 0; -    app_control_h service = NULL; -    app_control_create(&service); -    if (service == NULL) { -        dlog_print(DLOG_INFO, LOG_TAG, "service_create failed!\n"); + int ret = 0; + app_control_h service = NULL; + app_control_create(&service); + if (service == NULL) { + dlog_print(DLOG_INFO, LOG_TAG, "service_create failed!\n"); -        return 0; -    } -    app_control_set_operation(service, "APP_CONTROL_OPERATION_SETTING_BT_VISIBILITY"); -    ret = app_control_send_launch_request(service, NULL, NULL); + return 0; + } + app_control_set_operation(service, "APP_CONTROL_OPERATION_SETTING_BT_VISIBILITY"); + ret = app_control_send_launch_request(service, NULL, NULL); -    app_control_destroy(service); -    if (ret == APP_CONTROL_ERROR_NONE) { -        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to Bluetooth On/Off app!\n"); + app_control_destroy(service); + if (ret == APP_CONTROL_ERROR_NONE) { + dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to Bluetooth On/Off app!\n"); -        return 0; -    } else { -        dlog_print(DLOG_INFO, LOG_TAG, "Failed to relaunch Bluetooth On/Off app!\n"); + return 0; + } else { + dlog_print(DLOG_INFO, LOG_TAG, "Failed to relaunch Bluetooth On/Off app!\n"); -        return -1; -    } + return -1; + } -    return 0; + return 0; }
    • @@ -589,51 +589,51 @@ bt_set_visibility_operation(void) 
     void
 adapter_visibility_mode_changed_cb(int result,
-                                   bt_adapter_visibility_mode_e visibility_mode,
-                                   void* user_data)
+                                   bt_adapter_visibility_mode_e visibility_mode,
+                                   void* user_data)
 {
-    if (result != BT_ERROR_NONE) {
-        /* Error handling */
-
-        return;
-    }
-    if (visibility_mode == BT_ADAPTER_VISIBILITY_MODE_NON_DISCOVERABLE)
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "[visibility_mode_changed_cb] None discoverable mode!");
-    else if (visibility_mode == BT_ADAPTER_VISIBILITY_MODE_GENERAL_DISCOVERABLE)
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "[visibility_mode_changed_cb] General discoverable mode!");
-    else
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "[visibility_mode_changed_cb] Limited discoverable mode!");
+    if (result != BT_ERROR_NONE) {
+        /* Error handling */
+
+        return;
+    }
+    if (visibility_mode == BT_ADAPTER_VISIBILITY_MODE_NON_DISCOVERABLE)
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "[visibility_mode_changed_cb] None discoverable mode!");
+    else if (visibility_mode == BT_ADAPTER_VISIBILITY_MODE_GENERAL_DISCOVERABLE)
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "[visibility_mode_changed_cb] General discoverable mode!");
+    else
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "[visibility_mode_changed_cb] Limited discoverable mode!");
 }
 
 ret = bt_adapter_set_visibility_mode_changed_cb(adapter_visibility_mode_changed_cb,
-                                                NULL);
+                                                NULL);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "[bt_adapter_set_visibility_mode_changed_cb] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "[bt_adapter_set_visibility_mode_changed_cb] failed.");

    Connecting to Other Devices Using SPP

    - -

    To connect to other devices:

    + +

    To connect to other devices:

    • Connect as a server:

      1. To establish a connection with your device acting as a server, create an RFCOMM Bluetooth socket using the bt_socket_create_rfcomm() function.

        -

        The first parameter is the UUID of the service, which uniquely identifies which service to provide. The UUID must match with the UUID in the client's incoming connection for the connection to be accepted. The second parameter is the RFCOMM socket file descriptor as an output parameter.

        +

        The first parameter is the UUID of the service, which uniquely identifies which service to provide. The UUID must match with the UUID in the client's incoming connection for the connection to be accepted. The second parameter is the RFCOMM socket file descriptor as an output parameter.

        -const char* my_uuid="00001101-0000-1000-8000-00805F9B34FB";
+const char* my_uuid="00001101-0000-1000-8000-00805F9B34FB";
 int server_socket_fd = -1;
 bt_error_e ret;
 
 ret = bt_socket_create_rfcomm(my_uuid, &server_socket_fd);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "bt_socket_create_rfcomm() failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "bt_socket_create_rfcomm() failed.");
      2. @@ -641,14 +641,14 @@ if (ret != BT_ERROR_NONE) 
         ret = bt_socket_listen_and_accept_rfcomm(server_socket_fd, 5);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_listen_and_accept_rfcomm] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_listen_and_accept_rfcomm] failed.");
 
-    return;
+    return;
 } else {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "[bt_socket_listen_and_accept_rfcomm] Succeeded.
-                bt_socket_connection_state_changed_cb will be called.");
-    /* Waiting for incoming connections */
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "[bt_socket_listen_and_accept_rfcomm] Succeeded.
+                bt_socket_connection_state_changed_cb will be called.");
+    /* Waiting for incoming connections */
 }
        3. @@ -658,56 +658,56 @@ if (ret != BT_ERROR_NONE) { 
         void
 socket_connection_state_changed(int result,
-                                bt_socket_connection_state_e connection_state,
-                                bt_socket_connection_s *connection,
-                                void *user_data)
+                                bt_socket_connection_state_e connection_state,
+                                bt_socket_connection_s *connection,
+                                void *user_data)
 {
-    if (result != BT_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "[socket_connection_state_changed_cb] failed.
-                    result =%d.", result);
-
-        return;
-    }
-
-    if (connection_state == BT_SOCKET_CONNECTED) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Callback: Connected.");
-        if (connection != NULL) {
-            dlog_print(DLOG_INFO, LOG_TAG, "Callback: Socket of connection - %d.",
-                       connection->socket_fd);
-            dlog_print(DLOG_INFO, LOG_TAG, "Callback: Role of connection - %d.",
-                       connection->local_role);
-            dlog_print(DLOG_INFO, LOG_TAG,
-                       "Callback: Address of connection - %s.",
-                       connection->remote_address);
-            /* socket_fd is used for sending data and disconnecting a device */
-            server_socket_fd = connection->socket_fd;
-        } else {
-            dlog_print(DLOG_INFO, LOG_TAG, "Callback: No connection data");
-        }
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "Callback: Disconnected.");
-        if (connection != NULL) {
-            dlog_print(DLOG_INFO, LOG_TAG,
-                       "Callback: Socket of disconnection - %d.",
-                       connection->socket_fd);
-            dlog_print(DLOG_INFO, LOG_TAG,
-                       "Callback: Address of connection - %s.",
-                       connection->remote_address);
-        } else {
-            dlog_print(DLOG_INFO, LOG_TAG, "Callback: No connection data");
-        }
-    }
+    if (result != BT_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "[socket_connection_state_changed_cb] failed.
+                    result =%d.", result);
+
+        return;
+    }
+
+    if (connection_state == BT_SOCKET_CONNECTED) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Callback: Connected.");
+        if (connection != NULL) {
+            dlog_print(DLOG_INFO, LOG_TAG, "Callback: Socket of connection - %d.",
+                       connection->socket_fd);
+            dlog_print(DLOG_INFO, LOG_TAG, "Callback: Role of connection - %d.",
+                       connection->local_role);
+            dlog_print(DLOG_INFO, LOG_TAG,
+                       "Callback: Address of connection - %s.",
+                       connection->remote_address);
+            /* socket_fd is used for sending data and disconnecting a device */
+            server_socket_fd = connection->socket_fd;
+        } else {
+            dlog_print(DLOG_INFO, LOG_TAG, "Callback: No connection data");
+        }
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "Callback: Disconnected.");
+        if (connection != NULL) {
+            dlog_print(DLOG_INFO, LOG_TAG,
+                       "Callback: Socket of disconnection - %d.",
+                       connection->socket_fd);
+            dlog_print(DLOG_INFO, LOG_TAG,
+                       "Callback: Address of connection - %s.",
+                       connection->remote_address);
+        } else {
+            dlog_print(DLOG_INFO, LOG_TAG, "Callback: No connection data");
+        }
+    }
 }
 
 bt_error_e ret;
 ret = bt_socket_set_connection_state_changed_cb(socket_connection_state_changed,
-                                                NULL);
+                                                NULL);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "[bt_socket_set_connection_state_changed_cb] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "[bt_socket_set_connection_state_changed_cb] failed.");
 
-    return;
+    return;
 }
        @@ -722,15 +722,15 @@ if (ret != BT_ERROR_NONE) {

        The callback is invoked whenever the connection state changes (for example, when you connect to the server device). 

         ret = bt_socket_set_connection_state_changed_cb(socket_connection_state_changed,
-                                                NULL);
+                                                NULL);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "[bt_socket_set_connection_state_changed_cb] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "[bt_socket_set_connection_state_changed_cb] failed.");
 
-    return;
+    return;
 }
        - +
        Note When you connect to a Bluetooth server device, retrieve the server socket file descriptor (bt_socket_connection_s->socket_fd) in the callback and store it for later use. You need the file descriptor when sending data or disconnecting from the service. @@ -740,17 +740,17 @@ if (ret != BT_ERROR_NONE) {

        Request a connection to the Bluetooth server using the bt_socket_connect_rfcomm() function.

        The first parameter is the address of the remote device. You can get it from the bt_device_info_s structure (in mobile and wearable applications), which is returned in a callback after you bond with the server device or query a previously bonded device. The second parameter is the UUID for the specific RFCOMM-based service on a remote device. The UUID must match the UUID used by the server device in the bt_socket_create_rfcomm() function.

        -const char *service_uuid="00001101-0000-1000-8000-00805F9B34FB";
+const char *service_uuid="00001101-0000-1000-8000-00805F9B34FB";
 
 ret = bt_socket_connect_rfcomm(bt_server_address, service_uuid);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_connect_rfcomm] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_connect_rfcomm] failed.");
 
-    return;
+    return;
 } else {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "[bt_socket_connect_rfcomm] Succeeded.
-                bt_socket_connection_state_changed_cb will be called.");
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "[bt_socket_connect_rfcomm] Succeeded.
+                bt_socket_connection_state_changed_cb will be called.");
 }
        @@ -764,12 +764,12 @@ if (ret != BT_ERROR_NONE) {

        1. To write data, use the bt_socket_send_data() function. The first parameter is the socket file descriptor from the socket connection state change callback, the second parameter is the data to be sent, and the third parameter is the data length.

           bt_error_e ret;
-char data[] = "Sending test";
+char data[] = "Sending test";
 int client_socket_fd = 0;
 
 ret = bt_socket_send_data(client_socket_fd, data, sizeof(data));
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_send_data] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_send_data] failed.");

        2. To read data from other devices, you must set up the data received callback, which is invoked when your device receives data from other Bluetooth devices.

          @@ -781,19 +781,19 @@ bt_error_e ret; void bt_socket_data_received_cb(bt_socket_received_data_s* data, void* user_data) { -    if (data == NULL) { -        dlog_print(DLOG_INFO, LOG_TAG, "No received data!"); + if (data == NULL) { + dlog_print(DLOG_INFO, LOG_TAG, "No received data!"); -        return; -    } -    dlog_print(DLOG_INFO, LOG_TAG, "Socket fd: %d", data->socket_fd); -    dlog_print(DLOG_INFO, LOG_TAG, "Data: %s", data->data); -    dlog_print(DLOG_INFO, LOG_TAG, "Size: %d", data->data_size); + return; + } + dlog_print(DLOG_INFO, LOG_TAG, "Socket fd: %d", data->socket_fd); + dlog_print(DLOG_INFO, LOG_TAG, "Data: %s", data->data); + dlog_print(DLOG_INFO, LOG_TAG, "Size: %d", data->data_size); } ret = bt_socket_set_data_received_cb(bt_socket_data_received_cb, NULL); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_data_received_cb] regist failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_data_received_cb] regist failed.");
        @@ -802,34 +802,34 @@ if (ret != BT_ERROR_NONE)

        To disconnect from a device:

        -
        • If your device is a Bluetooth server, disconnect from the client with the bt_socket_destroy_rfcomm() function: +
          • If your device is a Bluetooth server, disconnect from the client with the bt_socket_destroy_rfcomm() function: 
             bt_error_e ret;
 
-/* You can get "server_socket_fd" from output of bt_socket_create_rfcomm() */
+/* You can get "server_socket_fd" from output of bt_socket_create_rfcomm() */
 ret = bt_socket_destroy_rfcomm(server_socket_fd);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_destroy_rfcomm] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_socket_destroy_rfcomm] failed.");
 else
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "[bt_socket_destroy_rfcomm] succeeded. socket_fd = %d",
-               server_socket_fd);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "[bt_socket_destroy_rfcomm] succeeded. socket_fd = %d",
+               server_socket_fd);
            • -
          • If your device is a Bluetooth client, disconnect from the server with the bt_socket_disconnect_rfcomm() function: +
          • If your device is a Bluetooth client, disconnect from the server with the bt_socket_disconnect_rfcomm() function: 
             bt_error_e ret;
 
-/* You can get "server_socket_fd" from bt_socket_connection_state_changed_cb() */
+/* You can get "server_socket_fd" from bt_socket_connection_state_changed_cb() */
 ret = bt_socket_disconnect_rfcomm(server_socket_fd);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "[bt_socket_destroy_rfcomm] failed. server_socket_fd = %d.",
-               server_socket_fd);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "[bt_socket_destroy_rfcomm] failed. server_socket_fd = %d.",
+               server_socket_fd);
 else
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "[bt_socket_destroy_rfcomm] succeeded. server_socket_fd = %d.",
-               server_socket_fd);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "[bt_socket_destroy_rfcomm] succeeded. server_socket_fd = %d.",
+               server_socket_fd);

          Handling GATT Operation Preconditions

          @@ -841,14 +841,14 @@ int ret = BT_ERROR_NONE; /* For information on the callback, see Managing Bluetooth LE Scans */ ret = bt_adapter_le_start_scan(__bt_adapter_le_scan_result_cb, NULL); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_start_scan] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_start_scan] failed."); /* Wait while the system searches for the LE target you want to connect to */ /* If you find the LE target you want, stop the scan */ ret = bt_adapter_le_stop_scan(); ret = bt_gatt_connect(ADDRESS_BLE_DEVICE_YOU_WANT, false); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to connect LE device."); + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to connect LE device.");

          Managing the GATT Client Operations

          @@ -860,16 +860,16 @@ int ret = 0; /* Register for GATT connection callback */ void __bt_gatt_connection_state_changed_cb(int result, bool connected, -                                      const char *remote_address, void *user_data) + const char *remote_address, void *user_data) { -    if (connected) -        dlog_print(DLOG_INFO, LOG_TAG, "LE connected"); -    else -        dlog_print(DLOG_INFO, LOG_TAG, "LE disconnected"); + if (connected) + dlog_print(DLOG_INFO, LOG_TAG, "LE connected"); + else + dlog_print(DLOG_INFO, LOG_TAG, "LE disconnected"); } ret = bt_gatt_set_connection_state_changed_cb(__bt_gatt_connection_state_changed_cb, -                                              NULL); + NULL);
        • Create a client to connect to a remote service device: @@ -878,7 +878,7 @@ int ret = 0; ret = bt_gatt_client_create(remote_addr, &client); if (ret == BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Success"); + dlog_print(DLOG_INFO, LOG_TAG, "Success"); return; @@ -891,7 +891,7 @@ char *addr = NULL; ret = bt_gatt_client_get_remote_address(client, &addr); if (ret == BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Success"); + dlog_print(DLOG_INFO, LOG_TAG, "Success"); return; @@ -903,9 +903,9 @@ return; int ret = 0; ret = -    bt_gatt_client_foreach_services(client, __bt_gatt_client_foreach_svc_cb, NULL); + bt_gatt_client_foreach_services(client, __bt_gatt_client_foreach_svc_cb, NULL); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "failed"); + dlog_print(DLOG_INFO, LOG_TAG, "failed"); return; @@ -914,24 +914,24 @@ return; 
           bool
 __bt_gatt_client_foreach_svc_cb(int total, int index, bt_gatt_h svc_handle,
-                                void *data)
+                                void *data)
 {
-    int ret;
-    char *uuid = NULL;
+    int ret;
+    char *uuid = NULL;
 
-    bt_gatt_get_uuid(svc_handle, &uuid);
-    dlog_print(DLOG_INFO, LOG_TAG, "[%d / %d] uuid: (%s)", index, total, uuid);
+    bt_gatt_get_uuid(svc_handle, &uuid);
+    dlog_print(DLOG_INFO, LOG_TAG, "[%d / %d] uuid: (%s)", index, total, uuid);
 
-    g_free(uuid);
+    g_free(uuid);
 
-    ret = bt_gatt_service_foreach_characteristics(svc_handle,
-                                                  __bt_gatt_client_foreach_chr_cb,
-                                                  NULL);
-    if (ret != BT_ERROR_NONE)
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "bt_gatt_service_foreach_characteristics failed: %d", ret);
+    ret = bt_gatt_service_foreach_characteristics(svc_handle,
+                                                  __bt_gatt_client_foreach_chr_cb,
+                                                  NULL);
+    if (ret != BT_ERROR_NONE)
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "bt_gatt_service_foreach_characteristics failed: %d", ret);
 
-    return true;
+    return true;
 }
          • @@ -939,44 +939,44 @@ __bt_gatt_client_foreach_svc_cb(int total, int index, bt_gatt_h svc_handle, 
           bool
 __bt_gatt_client_foreach_chr_cb(int total, int index, bt_gatt_h chr_handle,
-                                void *data)
+                                void *data)
 {
-    int ret;
-    char *uuid = NULL;
+    int ret;
+    char *uuid = NULL;
 
-    bt_gatt_get_uuid(chr_handle, &uuid);
+    bt_gatt_get_uuid(chr_handle, &uuid);
 
-    dlog_print(DLOG_INFO, LOG_TAG, "\t[%d / %d] uuid: (%s)", index, total, uuid);
+    dlog_print(DLOG_INFO, LOG_TAG, "\t[%d / %d] uuid: (%s)", index, total, uuid);
 
-    g_free(uuid);
+    g_free(uuid);
 
-    ret =
-        bt_gatt_characteristic_foreach_descriptors(chr_handle,
-                                                   __bt_gatt_client_foreach_desc_cb,
-                                                   NULL);
-    if (ret != BT_ERROR_NONE)
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "bt_gatt_characteristic_foreach_descriptors failed: %d", ret);
+    ret =
+        bt_gatt_characteristic_foreach_descriptors(chr_handle,
+                                                   __bt_gatt_client_foreach_desc_cb,
+                                                   NULL);
+    if (ret != BT_ERROR_NONE)
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "bt_gatt_characteristic_foreach_descriptors failed: %d", ret);
 
-    return true;
+    return true;
 }
          -
        • Use the bt_gatt_client_foreach_desc_cb() callback to get the descriptor data: +
        • Use the bt_gatt_client_foreach_desc_cb() callback to get the descriptor data: 
           bool
 __bt_gatt_client_foreach_desc_cb(int total, int index, bt_gatt_h desc_handle,
-                                 void *data)
+                                 void *data)
 {
-    char *uuid = NULL;
+    char *uuid = NULL;
 
-    bt_gatt_get_uuid(desc_handle, &uuid);
+    bt_gatt_get_uuid(desc_handle, &uuid);
 
-    dlog_print(DLOG_INFO, LOG_TAG, "\t\t[%d / %d] uuid: (%s)", index, total, uuid);
+    dlog_print(DLOG_INFO, LOG_TAG, "\t\t[%d / %d] uuid: (%s)", index, total, uuid);
 
-    g_free(uuid);
+    g_free(uuid);
 
-    return true;
+    return true;
 }
          • @@ -984,112 +984,112 @@ __bt_gatt_client_foreach_desc_cb(int total, int index, bt_gatt_h desc_handle,
        • Read the value of the given attribute handle: 
          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
-char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
+char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
 /* Client characteristic configuration */
-char *desc_uuid = "00002902-0000-1000-8000-00805f9b34fb";
+char *desc_uuid = "00002902-0000-1000-8000-00805f9b34fb";
 bt_gatt_h svc = NULL;
 bt_gatt_h chr = NULL;
 bt_gatt_h desc = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &chr);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_service_get_characteristic failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_service_get_characteristic failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_characteristic_get_descriptor(chr, desc_uuid, &desc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_characteristic_get_descriptor failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_characteristic_get_descriptor failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_client_read_value(desc, __bt_gatt_client_read_complete_cb, NULL);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_read_value failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_read_value failed: %d", ret);
 
-    return;
+    return;
 }
-
          +

          After the reading operation is complete, use the bt_gatt_client_read_complete_cb() callback to handle values:

           void
 __bt_gatt_client_read_complete_cb(int result, bt_gatt_h gatt_handle, void *data)
 {
-    char *uuid = NULL;
+    char *uuid = NULL;
 
-    bt_gatt_get_uuid(gatt_handle, &uuid);
+    bt_gatt_get_uuid(gatt_handle, &uuid);
 
-    dlog_print(DLOG_INFO, LOG_TAG, "Read %s for uuid: (%s)",
-               result == BT_ERROR_NONE ? "Success" : "Fail", uuid);
+    dlog_print(DLOG_INFO, LOG_TAG, "Read %s for uuid: (%s)",
+               result == BT_ERROR_NONE ? "Success" : "Fail", uuid);
 
-    g_free(uuid);
+    g_free(uuid);
 
-    if (result != BT_ERROR_NONE)
-        return;
+    if (result != BT_ERROR_NONE)
+        return;
 
-    return;
+    return;
 }
        • Set a value for the given attribute handle: 
          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
-char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
+char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
 /* Client characteristic configuration */
-char *desc_uuid = "00002902-0000-1000-8000-00805f9b34fb";
+char *desc_uuid = "00002902-0000-1000-8000-00805f9b34fb";
 bt_gatt_h svc = NULL;
 bt_gatt_h chr = NULL;
 bt_gatt_h desc = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &chr);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_service_get_characteristic failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_service_get_characteristic failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_characteristic_get_descriptor(chr, desc_uuid, &desc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_characteristic_get_descriptor failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_characteristic_get_descriptor failed: %d", ret);
 
-    return;
+    return;
 }
 
-ret = __bt_gatt_client_set_value("int32", "1234", desc);
+ret = __bt_gatt_client_set_value("int32", "1234", desc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_set_value failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_set_value failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_client_write_value(desc, __bt_gatt_client_write_complete_cb, NULL);
 
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_write_value failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_write_value failed: %d", ret);
 
-    return;
+    return;
 }

          The __bt_gatt_client_set_value() function is defined below:

          @@ -1097,48 +1097,48 @@ if (ret != BT_ERROR_NONE) { int __bt_gatt_client_set_value(char *type, char *value, bt_gatt_h h) { -    int ret; -    int s_val; -    unsigned int u_val; -    char *buf; -    int len; - -    if (strcasecmp(type, "int8") == 0) { -        s_val = atoi(value); -        buf = (char *)&s_val; -        len = 1; -    } else if (strcasecmp(type, "int16") == 0) { -        s_val = atoi(value); -        buf = (char *)&s_val; -        len = 2; -    } else if (strcasecmp(type, "int32") == 0) { -        s_val = atoi(value); -        buf = (char *)&s_val; -        len = 4; -    } else if (strcasecmp(type, "uint8") == 0) { -        u_val = strtoul(value, NULL, 10); -        buf = (char *)&u_val; -        len = 1; -    } else if (strcasecmp(type, "uint16") == 0) { -        u_val = strtoul(value, NULL, 10); -        buf = (char *)&u_val; -        len = 2; -    } else if (strcasecmp(type, "uint32") == 0) { -        u_val = strtoul(value, NULL, 10); -        buf = (char *)&u_val; -        len = 4; -    } else if (strcasecmp(type, "str") == 0) { -        buf = value; -        len = strlen(buf); -    } else { -        return BT_ERROR_INVALID_PARAMETER; -    } - -    ret = bt_gatt_set_value(h, buf, len); -    if (ret != BT_ERROR_NONE) -        TC_PRT("bt_gatt_set_value failed: %d", ret); - -    return ret; + int ret; + int s_val; + unsigned int u_val; + char *buf; + int len; + + if (strcasecmp(type, "int8") == 0) { + s_val = atoi(value); + buf = (char *)&s_val; + len = 1; + } else if (strcasecmp(type, "int16") == 0) { + s_val = atoi(value); + buf = (char *)&s_val; + len = 2; + } else if (strcasecmp(type, "int32") == 0) { + s_val = atoi(value); + buf = (char *)&s_val; + len = 4; + } else if (strcasecmp(type, "uint8") == 0) { + u_val = strtoul(value, NULL, 10); + buf = (char *)&u_val; + len = 1; + } else if (strcasecmp(type, "uint16") == 0) { + u_val = strtoul(value, NULL, 10); + buf = (char *)&u_val; + len = 2; + } else if (strcasecmp(type, "uint32") == 0) { + u_val = strtoul(value, NULL, 10); + buf = (char *)&u_val; + len = 4; + } else if (strcasecmp(type, "str") == 0) { + buf = value; + len = strlen(buf); + } else { + return BT_ERROR_INVALID_PARAMETER; + } + + ret = bt_gatt_set_value(h, buf, len); + if (ret != BT_ERROR_NONE) + TC_PRT("bt_gatt_set_value failed: %d", ret); + + return ret; }

          After the writing operation is complete, use the bt_gatt_client_write_complete_cb() callback to finish the task:

          @@ -1146,50 +1146,50 @@ __bt_gatt_client_set_value(char *type, char *value, bt_gatt_h h) void __bt_gatt_client_write_complete_cb(int result, bt_gatt_h gatt_handle, void *data) { -    char *uuid = NULL; + char *uuid = NULL; -    bt_gatt_get_uuid(gatt_handle, &uuid); + bt_gatt_get_uuid(gatt_handle, &uuid); -    dlog_print(DLOG_INFO, LOG_TAG, "Write %s for uuid: (%s)", -               result == BT_ERROR_NONE ? "Success" : "Fail", uuid); + dlog_print(DLOG_INFO, LOG_TAG, "Write %s for uuid: (%s)", + result == BT_ERROR_NONE ? "Success" : "Fail", uuid); -    g_free(uuid); + g_free(uuid); -    return; + return; }
        • Register a callback function to be invoked when the characteristic value changes on the remote device: 
          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb";
-char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb";
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb";
+char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb";
 bt_gatt_h svc = NULL;
 bt_gatt_h chr = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &chr);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret =
-    bt_gatt_client_set_characteristic_value_changed_cb(chr,
-                                                       __bt_gatt_client_value_changed_cb,
-                                                       NULL);
+    bt_gatt_client_set_characteristic_value_changed_cb(chr,
+                                                       __bt_gatt_client_value_changed_cb,
+                                                       NULL);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_client_set_characteristic_value_changed_cb failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_client_set_characteristic_value_changed_cb failed: %d", ret);
 
-    return;
+    return;
 }

          After registering the callback operation, use the __bt_gatt_client_value_changed_cb() callback to display the changed value:

          @@ -1197,48 +1197,48 @@ if (ret != BT_ERROR_NONE) { void __bt_gatt_client_value_changed_cb(bt_gatt_h chr, char *value, int len, void *user_data) { -    char *uuid = NULL; -    int i; + char *uuid = NULL; + int i; -    bt_gatt_get_uuid(chr, &uuid); + bt_gatt_get_uuid(chr, &uuid); -    dlog_print(DLOG_INFO, LOG_TAG, "Value changed for [%s]", uuid); -    dlog_print(DLOG_INFO, LOG_TAG, "len [%d]", len); -    for (i = 0; i < len; i++) -        dlog_print(DLOG_INFO, LOG_TAG, "value %u", value[i]); -    g_free(uuid); + dlog_print(DLOG_INFO, LOG_TAG, "Value changed for [%s]", uuid); + dlog_print(DLOG_INFO, LOG_TAG, "len [%d]", len); + for (i = 0; i < len; i++) + dlog_print(DLOG_INFO, LOG_TAG, "value %u", value[i]); + g_free(uuid); -    return; + return; }

          When you no longer need the value change notifications, deregister the callback.

          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
-char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
+char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
 bt_gatt_h svc = NULL;
 bt_gatt_h chr = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &chr);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
 
-    return;
+    return;
 }
 
 ret = bt_gatt_client_unset_characteristic_value_changed_cb(chr);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_client_unset_characteristic_value_changed_cb failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_client_unset_characteristic_value_changed_cb failed: %d", ret);
 
-    return;
+    return;
 }
          • @@ -1253,7 +1253,7 @@ ret = bt_gatt_unset_connection_state_changed_cb(); /* Destroy the client */ ret = bt_gatt_client_destroy(client); if (ret == BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Success"); + dlog_print(DLOG_INFO, LOG_TAG, "Success"); client = NULL; return; @@ -1276,7 +1276,7 @@ bt_gatt_type_e gatt_type; ret = bt_gatt_get_type(gatt_handle, &gatt_type); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_type failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_type failed: %d", ret);
        • Get the UUID of a service, characteristic, or descriptor handle: @@ -1289,7 +1289,7 @@ char *uuid = NULL; ret = bt_gatt_get_uuid(gatt_handle, &uuid); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_uuid failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_uuid failed: %d", ret);
        • Get the value of a characteristic or descriptor handle: @@ -1303,7 +1303,7 @@ char *value = NULL; ret = bt_gatt_get_value(gatt_handle, &value, &len); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_value failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_value failed: %d", ret);
        • Get the value of a characteristic or descriptor handle as an integer type: @@ -1318,7 +1318,7 @@ int value; ret = bt_gatt_get_int_value(gatt_handle, type, offset, &value); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_int_value failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_int_value failed: %d", ret);
        • Get the value of a characteristic or descriptor handle as a float type: @@ -1333,63 +1333,63 @@ float value; ret = bt_gatt_get_float_value(gatt_handle, type, offset, &value); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_float_value failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_get_float_value failed: %d", ret);
        • Get a service handle with a specific UUID: 
          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
 bt_gatt_h svc = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
        • Get a characteristic handle with a specific UUID: 
          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
-char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
+char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
 bt_gatt_h svc = NULL;
 bt_gatt_h chr = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
-    break;
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    break;
 }
 
 ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &chr);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
        • Get a descriptor handle with a specific UUID: 
          -char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
-char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
+char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */
+char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */
 /* Client characteristic configuration */
-char *desc_uuid = "00002902-0000-1000-8000-00805f9b34fb";
+char *desc_uuid = "00002902-0000-1000-8000-00805f9b34fb";
 bt_gatt_h svc = NULL;
 bt_gatt_h chr = NULL;
 bt_gatt_h desc = NULL;
 
 ret = bt_gatt_client_get_service(client, svc_uuid, &svc);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
-    break;
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_client_get_service failed: %d", ret);
+    break;
 }
 
 ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &chr);
 if (ret != BT_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
-    break;
+    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_characteristic failed: %d", ret);
+    break;
 }
 
 ret = bt_gatt_characteristic_get_descriptor(chr, desc_uuid, &desc);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_characteristic_get_descriptor failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_characteristic_get_descriptor failed: %d", ret);
        • Get the properties using the characteristic handle: @@ -1401,8 +1401,8 @@ int properties; ret = bt_gatt_characteristic_get_properties(chr, &properties); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, -               "bt_gatt_characteristic_get_properties failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, + "bt_gatt_characteristic_get_properties failed: %d", ret);
        • Get the service handle to which the specified characteristic belongs: @@ -1413,7 +1413,7 @@ bt_gatt_h chr = NULL; ret = bt_gatt_characteristic_get_service(chr, &svc); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_characteristic_get_service failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_characteristic_get_service failed: %d", ret);
        • Get the characteristic handle to which the specified descriptor belongs: @@ -1424,8 +1424,8 @@ bt_gatt_h dsc = NULL; ret = bt_gatt_descriptor_get_characteristic(dsc, &chr); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, -               "bt_gatt_descriptor_get_characteristic failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, + "bt_gatt_descriptor_get_characteristic failed: %d", ret);
        • Get the client handle to which the specified service belongs: @@ -1436,7 +1436,7 @@ bt_gatt_client_h client = NULL; ret = bt_gatt_service_get_client(svc, &client); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_client failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, "bt_gatt_service_get_client failed: %d", ret);
        • Get the write type of the specified characteristic: @@ -1447,11 +1447,11 @@ bt_gatt_write_type_e write_type; ret = bt_gatt_characteristic_get_write_type(chr, &write_type); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, -               "bt_gatt_characteristic_get_write_type failed: %d", ret); + dlog_print(DLOG_INFO, LOG_TAG, + "bt_gatt_characteristic_get_write_type failed: %d", ret);
          • -
        • Get an included service's handle with a specific UUID: +
        • Get an included service's handle with a specific UUID: 
           bt_gatt_h svc = NULL;
 bt_gatt_h included_svc = NULL;
@@ -1461,8 +1461,8 @@ bt_gatt_write_type_e write_type = NULL;
 
 ret = bt_gatt_service_get_included_service(svc, uuid, &included_svc);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "bt_gatt_service_get_included_service failed: %d", ret);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "bt_gatt_service_get_included_service failed: %d", ret);
        @@ -1486,7 +1486,7 @@ bt_gatt_h characteristic_handle = NULL; ret = bt_gatt_set_value(characteristic_handle, char_value, 1); if (ret == BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Success"); + dlog_print(DLOG_INFO, LOG_TAG, "Success");
      3. Set or update the characteristic value (integer type value): @@ -1502,7 +1502,7 @@ bt_gatt_h characteristic_handle = NULL; ret = bt_gatt_set_int_value(characteristic_handle, BT_DATA_TYPE_UINT16, char_value, 1); if (ret == BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Success"); + dlog_print(DLOG_INFO, LOG_TAG, "Success");
      4. Set or update the characteristic value (float type value): @@ -1517,7 +1517,7 @@ bt_gatt_h characteristic_handle = NULL; */ ret = bt_gatt_set_float_value(characteristic_handle, BT_DATA_TYPE_FLOAT, 123, -2, 1); if (ret == BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Success"); + dlog_print(DLOG_INFO, LOG_TAG, "Success");
      5. Set the characteristic write type: @@ -1525,51 +1525,51 @@ if (ret == BT_ERROR_NONE) void __write_completed_cb(int result, bt_gatt_h request_handle, void *user_data) { -    if (result != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Write request failed"); + if (result != BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Write request failed"); } int main() { -    int ret = 0; -    bt_gatt_h svc = NULL; -    bt_gatt_h battery_svc = NULL; -    bt_gatt_h control_point = NULL; -    char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */ -    char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */ + int ret = 0; + bt_gatt_h svc = NULL; + bt_gatt_h battery_svc = NULL; + bt_gatt_h control_point = NULL; + char *svc_uuid = "0000180f-0000-1000-8000-00805f9b34fb"; /* Battery service */ + char *chr_uuid = "00002a19-0000-1000-8000-00805f9b34fb"; /* Battery level */ -    ret = bt_gatt_client_get_service(client, svc_uuid, &battery_svc); -    if (ret == BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Success"); + ret = bt_gatt_client_get_service(client, svc_uuid, &battery_svc); + if (ret == BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Success"); -    ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &control_point); -    if (ret == BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Success"); + ret = bt_gatt_service_get_characteristic(svc, chr_uuid, &control_point); + if (ret == BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Success"); -    ret = bt_gatt_characteristic_set_write_type(control_point, -                                                BT_GATT_WRITE_TYPE_WRITE); -    if (ret == BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Success"); + ret = bt_gatt_characteristic_set_write_type(control_point, + BT_GATT_WRITE_TYPE_WRITE); + if (ret == BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Success"); -    ret = bt_gatt_set_value(control_point, value, len); -    if (ret == BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Success"); + ret = bt_gatt_set_value(control_point, value, len); + if (ret == BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Success"); -    ret = bt_gatt_client_write_value(control_point, __write_completed_cb, NULL); -    if (ret == BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Success"); + ret = bt_gatt_client_write_value(control_point, __write_completed_cb, NULL); + if (ret == BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Success"); -    return ret; + return ret; }
    -

    Exchanging Data Using OPP

    - -

    The OPP is a basic profile for sending objects, such as pictures, virtual business cards, or schedules. The sender, which is a client, always initiates the transactions (called "push"), not the receiver, which is a server.

    -

    To exchange data with Object Push Profile (OPP):

    +

    Exchanging Data Using OPP

    + +

    The OPP is a basic profile for sending objects, such as pictures, virtual business cards, or schedules. The sender, which is a client, always initiates the transactions (called "push"), not the receiver, which is a server.

    +

    To exchange data with Object Push Profile (OPP):

    • Exchange data in a server role:
        @@ -1584,18 +1584,18 @@ storage_get_directory(0, STORAGE_DIRECTORY_DOWNLOADS, &directory); void connection_requested_cb_for_opp_server(const char *remote_address, -                                       void *user_data) + void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "remote_address: %s", remote_address); + dlog_print(DLOG_INFO, LOG_TAG, "remote_address: %s", remote_address); } ret = -    bt_opp_server_initialize_by_connection_request(directory, -                                                   connection_requested_cb_for_opp_server, -                                                   NULL); + bt_opp_server_initialize_by_connection_request(directory, + connection_requested_cb_for_opp_server, + NULL); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "[bt_opp_server_initialize_by_connection_request] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, + "[bt_opp_server_initialize_by_connection_request] failed."); free(directory); @@ -1603,35 +1603,35 @@ free(directory);

        When a client requests a file push, accept or reject it using the following functions:

         bt_error_e ret;
-const char file_name [18] = "tempfile";
+const char file_name [18] = "tempfile";
 
 void
 bt_opp_server_transfer_progress_cb_for_opp(const char *file, long long size,
-                                           int percent, void *user_data)
+                                           int percent, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "file: %s", file);
-    dlog_print(DLOG_INFO, LOG_TAG, "size: %ld", size);
-    dlog_print(DLOG_INFO, LOG_TAG, "percent: %d", percent);
+    dlog_print(DLOG_INFO, LOG_TAG, "file: %s", file);
+    dlog_print(DLOG_INFO, LOG_TAG, "size: %ld", size);
+    dlog_print(DLOG_INFO, LOG_TAG, "percent: %d", percent);
 }
 
 void
 bt_opp_server_transfer_finished_cb_for_opp(int result, const char *file,
-                                           long long size, void *user_data)
+                                           long long size, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "result: %d", result);
-    dlog_print(DLOG_INFO, LOG_TAG, "file: %s", file);
-    dlog_print(DLOG_INFO, LOG_TAG, "size: %ld", size);
+    dlog_print(DLOG_INFO, LOG_TAG, "result: %d", result);
+    dlog_print(DLOG_INFO, LOG_TAG, "file: %s", file);
+    dlog_print(DLOG_INFO, LOG_TAG, "size: %ld", size);
 }
 
 ret = bt_opp_server_accept(bt_opp_server_transfer_progress_cb_for_opp,
-                           bt_opp_server_transfer_finished_cb_for_opp,
-                           file_name, NULL, NULL);
+                           bt_opp_server_transfer_finished_cb_for_opp,
+                           file_name, NULL, NULL);
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_opp_server_accept] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_opp_server_accept] failed.");
 
 ret = bt_opp_server_reject();
 if (ret != BT_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_opp_server_reject] failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_opp_server_reject] failed.");
      @@ -1645,9 +1645,9 @@ bt_error_e ret; ret = bt_opp_client_initialize(); if (ret != BLUETOOTH_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_initialize() failed"); + dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_initialize() failed"); -    return -1; + return -1; }
      • @@ -1656,18 +1656,18 @@ if (ret != BLUETOOTH_ERROR_NONE) { 
       bt_error_e ret;
 char *resource_path = NULL;
-char caller_id_path[1024] = {'\0',};
+char caller_id_path[1024] = {'\0',};
 
 resource_path = app_get_resource_path();
-snprintf(caller_id_path, sizeof(caller_id_path)-1, "%s/image1.jpg", resource_path);
+snprintf(caller_id_path, sizeof(caller_id_path)-1, "%s/image1.jpg", resource_path);
 free(resource_path);
 
 ret = bt_opp_client_add_file(caller_id_path);
 
 if (ret != BLUETOOTH_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_add_file() failed");
+    dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_add_file() failed");
 
-    return -1;
+    return -1;
 }
      @@ -1679,40 +1679,40 @@ char remote_addr[18] = REMOTE_DEVICE_MAC_ADDRESS; void __bt_opp_client_push_responded_cb(int result, -                                  const char *remote_address, -                                  void *user_data) + const char *remote_address, + void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "result: %d", result); -    dlog_print(DLOG_INFO, LOG_TAG, "remote_address: %s", remote_address); + dlog_print(DLOG_INFO, LOG_TAG, "result: %d", result); + dlog_print(DLOG_INFO, LOG_TAG, "remote_address: %s", remote_address); } void __bt_opp_client_push_progress_cb(const char *file, -                                 long long size, -                                 int percent, -                                 void *user_data) + long long size, + int percent, + void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "size: %ld", (long)size); -    dlog_print(DLOG_INFO, LOG_TAG, "percent: %d", percent); -    dlog_print(DLOG_INFO, LOG_TAG, "file: %s", file); + dlog_print(DLOG_INFO, LOG_TAG, "size: %ld", (long)size); + dlog_print(DLOG_INFO, LOG_TAG, "percent: %d", percent); + dlog_print(DLOG_INFO, LOG_TAG, "file: %s", file); } void __bt_opp_client_push_finished_cb(int result, -                                 const char *remote_address, -                                 void *user_data) + const char *remote_address, + void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "result: %d", result); -    dlog_print(DLOG_INFO, LOG_TAG, "remote_address: %s", remote_address); + dlog_print(DLOG_INFO, LOG_TAG, "result: %d", result); + dlog_print(DLOG_INFO, LOG_TAG, "remote_address: %s", remote_address); } ret = bt_opp_client_push_files(remote_addr, __bt_opp_client_push_responded_cb, -                               __bt_opp_client_push_progress_cb, -                               __bt_opp_client_push_finished_cb, NULL); + __bt_opp_client_push_progress_cb, + __bt_opp_client_push_finished_cb, NULL); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_opp_client_push_files] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_opp_client_push_files] failed."); else -    dlog_print(DLOG_INFO, LOG_TAG, "[bt_opp_client_push_files] succeeded."); + dlog_print(DLOG_INFO, LOG_TAG, "[bt_opp_client_push_files] succeeded.");
    • @@ -1723,17 +1723,17 @@ bt_error_e ret; /* Delete file info */ ret = bt_opp_client_clear_files(); if (ret != BLUETOOTH_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_clear_files() failed"); + dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_clear_files() failed"); -    return -1; + return -1; } ret = bt_opp_client_deinitialize(); if (ret != BLUETOOTH_ERROR_NONE) { -    ERR("bt_opp_client_initialize "); -    dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_initialize failed."); + ERR("bt_opp_client_initialize "); + dlog_print(DLOG_ERROR, LOG_TAG, "bt_opp_client_initialize failed."); -    return -1; + return -1; }
      • @@ -1743,143 +1743,143 @@ if (ret != BLUETOOTH_ERROR_NONE) {

      Managing Bluetooth LE Scans

      - +

      To discover nearby LE devices, perform an LE scan operation:

      1. To start the BLE scan:

        - + 
         int
 main()
 {
-    int ret = BT_ERROR_NONE;
-    ret = bt_adapter_le_start_scan(__bt_adapter_le_scan_result_cb, NULL);
+    int ret = BT_ERROR_NONE;
+    ret = bt_adapter_le_start_scan(__bt_adapter_le_scan_result_cb, NULL);
 
-    if (ret != BT_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_start_scan] failed.");
+    if (ret != BT_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_start_scan] failed.");
 
-    /*
-       Wait while the system searches for the LE target you want to connect to
-       When you find the LE target you want, stop the LE scan
+    /*
+       Wait while the system searches for the LE target you want to connect to
+       When you find the LE target you want, stop the LE scan
 
-       bt_adapter_le_start_scan() operates continually
-       until you call bt_adapter_le_stop_scan()
-       If you do not call bt_adapter_le_stop_scan() after calling
-       bt_adapter_le_start_scan(), calling bt_adapter_le_start_scan() again
-       can cause an in-progress error
-    */
+       bt_adapter_le_start_scan() operates continually
+       until you call bt_adapter_le_stop_scan()
+       If you do not call bt_adapter_le_stop_scan() after calling
+       bt_adapter_le_start_scan(), calling bt_adapter_le_start_scan() again
+       can cause an in-progress error
+    */
 
-    ret = bt_adapter_le_stop_scan();
-    if (ret != BT_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_stop_scan] failed.");
+    ret = bt_adapter_le_stop_scan();
+    if (ret != BT_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_stop_scan] failed.");
 
-    return;
+    return;
 }
        2. - -

      2. Use the callback defined in the bt_adapter_le_start_scan() function to retrieve the scan results. The callback contains information of all the LE scanned devices, such as the device names, scanned devices' transmission level, service data list, appearance of the devices, and manufacture data of the devices.

        + +

      3. Use the callback defined in the bt_adapter_le_start_scan() function to retrieve the scan results. The callback contains information of all the LE scanned devices, such as the device names, scanned devices' transmission level, service data list, appearance of the devices, and manufacture data of the devices.

        To handle the scan result:

        - + 
         int ret;
 int i;
 
 void
 __bt_adapter_le_scan_result_cb(int result,
-                               bt_adapter_le_device_scan_result_info_s *info,
-                               void *user_data)
+                               bt_adapter_le_device_scan_result_info_s *info,
+                               void *user_data)
 {
-    bt_adapter_le_packet_type_e pkt_type = BT_ADAPTER_LE_PACKET_ADVERTISING;
-
-    if (info == NULL) {
-        dlog_print(DLOG_INFO, LOG_TAG, "No discovery_info!");
-
-        return;
-    }
-
-    if (info->adv_data_len > 31 || info->scan_data_len > 31) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Data length exceeds 31");
-        bt_adapter_le_stop_scan();
-        dlog_print(DLOG_INFO, LOG_TAG, "Scanning stopped");
-
-        return;
-    }
-
-    for (i = 0; i < 2; i++) {
-        char **uuids;
-        char *device_name;
-        int tx_power_level;
-        bt_adapter_le_service_data_s *data_list;
-        int appearance;
-        int manufacturer_id;
-        char *manufacturer_data;
-        int manufacturer_data_len;
-        int count;
-
-        pkt_type += i;
-        if (pkt_type == BT_ADAPTER_LE_PACKET_ADVERTISING && info->adv_data == NULL)
-            continue;
-        if (pkt_type == BT_ADAPTER_LE_PACKET_SCAN_RESPONSE && info->scan_data == NULL)
-            break;
-
-        if (bt_adapter_le_get_scan_result_service_uuids(info, pkt_type, &uuids,
-                                                        &count) == BT_ERROR_NONE) {
-            int i;
-            for (i = 0; i < count; i++) {
-                dlog_print(DLOG_INFO, LOG_TAG, "UUID[%d] = %s", i + 1, uuids[i]);
-                g_free(uuids[i]);
-            }
-            g_free(uuids);
-        }
-        if (bt_adapter_le_get_scan_result_device_name(info, pkt_type, &device_name)
-            == BT_ERROR_NONE) {
-            dlog_print(DLOG_INFO, LOG_TAG, "Device name = %s", device_name);
-            g_free(device_name);
-        }
-        if (bt_adapter_le_get_scan_result_tx_power_level(info, pkt_type,
-                                                         &tx_power_level)
-            == BT_ERROR_NONE)
-            dlog_print(DLOG_INFO, LOG_TAG, "TX Power level = %d", tx_power_level);
-        if (bt_adapter_le_get_scan_result_service_solicitation_uuids(info, pkt_type,
-                                                                     &uuids, &count)
-            == BT_ERROR_NONE) {
-            int i;
-            for (i = 0; i < count; i++) {
-                dlog_print(DLOG_INFO, LOG_TAG,
-                           "Solicitation UUID[%d] = %s", i + 1, uuids[i]);
-                g_free(uuids[i]);
-            }
-            g_free(uuids);
-        }
-        if (bt_adapter_le_get_scan_result_service_data_list(info, pkt_type,
-                                                            &data_list, &count)
-            == BT_ERROR_NONE) {
-            int i;
-            for (i = 0; i < count; i++) {
-                dlog_print(DLOG_INFO, LOG_TAG,
-                           "Service Data[%d] = [0x%2.2X%2.2X:0x%.2X...]", i + 1,
-                           data_list[i].service_uuid[0], data_list[i].service_uuid[1],
-                           data_list[i].service_data[0]);
-            }
-            bt_adapter_le_free_service_data_list(data_list, count);
-        }
-        if (bt_adapter_le_get_scan_result_appearance(info, pkt_type, &appearance)
-            == BT_ERROR_NONE)
-            dlog_print(DLOG_INFO, LOG_TAG, "Appearance = %d", appearance);
-        if (bt_adapter_le_get_scan_result_manufacturer_data(info, pkt_type,
-                                                            &manufacturer_id,
-                                                            &manufacturer_data,
-                                                            &manufacturer_data_len)
-            == BT_ERROR_NONE) {
-            dlog_print(DLOG_INFO, LOG_TAG,
-                       "Manufacturer data[ID:%.4X, 0x%.2X%.2X...(len:%d)]",
-                       manufacturer_id, manufacturer_data[0], manufacturer_data[1],
-                       manufacturer_data_len);
-            g_free(manufacturer_data);
-        }
-    }
+    bt_adapter_le_packet_type_e pkt_type = BT_ADAPTER_LE_PACKET_ADVERTISING;
+
+    if (info == NULL) {
+        dlog_print(DLOG_INFO, LOG_TAG, "No discovery_info!");
+
+        return;
+    }
+
+    if (info->adv_data_len > 31 || info->scan_data_len > 31) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Data length exceeds 31");
+        bt_adapter_le_stop_scan();
+        dlog_print(DLOG_INFO, LOG_TAG, "Scanning stopped");
+
+        return;
+    }
+
+    for (i = 0; i < 2; i++) {
+        char **uuids;
+        char *device_name;
+        int tx_power_level;
+        bt_adapter_le_service_data_s *data_list;
+        int appearance;
+        int manufacturer_id;
+        char *manufacturer_data;
+        int manufacturer_data_len;
+        int count;
+
+        pkt_type += i;
+        if (pkt_type == BT_ADAPTER_LE_PACKET_ADVERTISING && info->adv_data == NULL)
+            continue;
+        if (pkt_type == BT_ADAPTER_LE_PACKET_SCAN_RESPONSE && info->scan_data == NULL)
+            break;
+
+        if (bt_adapter_le_get_scan_result_service_uuids(info, pkt_type, &uuids,
+                                                        &count) == BT_ERROR_NONE) {
+            int i;
+            for (i = 0; i < count; i++) {
+                dlog_print(DLOG_INFO, LOG_TAG, "UUID[%d] = %s", i + 1, uuids[i]);
+                g_free(uuids[i]);
+            }
+            g_free(uuids);
+        }
+        if (bt_adapter_le_get_scan_result_device_name(info, pkt_type, &device_name)
+            == BT_ERROR_NONE) {
+            dlog_print(DLOG_INFO, LOG_TAG, "Device name = %s", device_name);
+            g_free(device_name);
+        }
+        if (bt_adapter_le_get_scan_result_tx_power_level(info, pkt_type,
+                                                         &tx_power_level)
+            == BT_ERROR_NONE)
+            dlog_print(DLOG_INFO, LOG_TAG, "TX Power level = %d", tx_power_level);
+        if (bt_adapter_le_get_scan_result_service_solicitation_uuids(info, pkt_type,
+                                                                     &uuids, &count)
+            == BT_ERROR_NONE) {
+            int i;
+            for (i = 0; i < count; i++) {
+                dlog_print(DLOG_INFO, LOG_TAG,
+                           "Solicitation UUID[%d] = %s", i + 1, uuids[i]);
+                g_free(uuids[i]);
+            }
+            g_free(uuids);
+        }
+        if (bt_adapter_le_get_scan_result_service_data_list(info, pkt_type,
+                                                            &data_list, &count)
+            == BT_ERROR_NONE) {
+            int i;
+            for (i = 0; i < count; i++) {
+                dlog_print(DLOG_INFO, LOG_TAG,
+                           "Service Data[%d] = [0x%2.2X%2.2X:0x%.2X...]", i + 1,
+                           data_list[i].service_uuid[0], data_list[i].service_uuid[1],
+                           data_list[i].service_data[0]);
+            }
+            bt_adapter_le_free_service_data_list(data_list, count);
+        }
+        if (bt_adapter_le_get_scan_result_appearance(info, pkt_type, &appearance)
+            == BT_ERROR_NONE)
+            dlog_print(DLOG_INFO, LOG_TAG, "Appearance = %d", appearance);
+        if (bt_adapter_le_get_scan_result_manufacturer_data(info, pkt_type,
+                                                            &manufacturer_id,
+                                                            &manufacturer_data,
+                                                            &manufacturer_data_len)
+            == BT_ERROR_NONE) {
+            dlog_print(DLOG_INFO, LOG_TAG,
+                       "Manufacturer data[ID:%.4X, 0x%.2X%.2X...(len:%d)]",
+                       manufacturer_id, manufacturer_data[0], manufacturer_data[1],
+                       manufacturer_data_len);
+            g_free(manufacturer_data);
+        }
+    }
 }
        @@ -1888,8 +1888,8 @@ __bt_adapter_le_scan_result_cb(int result,

        Discovering Bluetooth LE Devices

        -

        Perform the LE discovery operation to discover nearby Bluetooth LE devices. You can register and deregister a callback for the LE discovery operation through the set and unset callback functions. The registered device discovery callback provides details of the discovered devices and the state of the discovery (started, finished, found).

        - +

        Perform the LE discovery operation to discover nearby Bluetooth LE devices. You can register and deregister a callback for the LE discovery operation through the set and unset callback functions. The registered device discovery callback provides details of the discovered devices and the state of the discovery (started, finished, found).

        +
        Note The APIs used in this use case are deprecated since Tizen 2.3.1. For scanning nearby BLE devices in Tizen 2.3.1 and later, see Managing Bluetooth LE Scans. @@ -1900,54 +1900,54 @@ __bt_adapter_le_scan_result_cb(int result, 
         static void
 __bt_adapter_le_device_discovery_state_changed_cb(int result,
-                                                  bt_adapter_le_device_discovery_state_e
-                                                  discovery_state,
-                                                  bt_adapter_le_device_discovery_info_s
-                                                  *discovery_info,
-                                                  void *user_data)
+                                                  bt_adapter_le_device_discovery_state_e
+                                                  discovery_state,
+                                                  bt_adapter_le_device_discovery_info_s
+                                                  *discovery_info,
+                                                  void *user_data)
 {
-    if (discovery_info == NULL && discovery_state == BT_ADAPTER_LE_DEVICE_DISCOVERY_FOUND)
-        dlog_print(DLOG_ERROR, LOG_TAG, "No discovery_info!");
+    if (discovery_info == NULL && discovery_state == BT_ADAPTER_LE_DEVICE_DISCOVERY_FOUND)
+        dlog_print(DLOG_ERROR, LOG_TAG, "No discovery_info!");
 
-    return;
+    return;
 
-    if (discovery_state != BT_ADAPTER_LE_DEVICE_DISCOVERY_FOUND) {
-        dlog_print(DLOG_INFO, LOG_TAG, "LE discovery %s",
-                   discovery_state == BT_ADAPTER_LE_DEVICE_DISCOVERY_STARTED ?
-                   "Started" : "Finished");
-    } else {
-        dlog_print(DLOG_INFO, LOG_TAG, "%s Adv %d Scan resp %d RSSI %d Addr_type %d",
-                   discovery_info->remote_address, discovery_info->adv_data_len,
-                   discovery_info->scan_data_len, discovery_info->rssi,
-                   discovery_info->address_type);
+    if (discovery_state != BT_ADAPTER_LE_DEVICE_DISCOVERY_FOUND) {
+        dlog_print(DLOG_INFO, LOG_TAG, "LE discovery %s",
+                   discovery_state == BT_ADAPTER_LE_DEVICE_DISCOVERY_STARTED ?
+                   "Started" : "Finished");
+    } else {
+        dlog_print(DLOG_INFO, LOG_TAG, "%s Adv %d Scan resp %d RSSI %d Addr_type %d",
+                   discovery_info->remote_address, discovery_info->adv_data_len,
+                   discovery_info->scan_data_len, discovery_info->rssi,
+                   discovery_info->address_type);
 
-        if (discovery_info->adv_data_len > 31 || discovery_info->scan_data_len > 31)
-            bt_adapter_le_stop_device_discovery();
-    }
+        if (discovery_info->adv_data_len > 31 || discovery_info->scan_data_len > 31)
+            bt_adapter_le_stop_device_discovery();
+    }
 }
 
 int
 main()
 {
-    int ret = BT_ERROR_NONE;
+    int ret = BT_ERROR_NONE;
 
-    ret =
-        bt_adapter_le_set_device_discovery_state_changed_cb(__bt_adapter_le_device_discovery_state_changed_cb,
-                                                            NULL);
+    ret =
+        bt_adapter_le_set_device_discovery_state_changed_cb(__bt_adapter_le_device_discovery_state_changed_cb,
+                                                            NULL);
 
-    ret = bt_adapter_le_start_device_discovery();
+    ret = bt_adapter_le_start_device_discovery();
 
-    if (ret != BT_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_start_device_discovery] failed.");
-    /* To unset the LE device discovery state change callback */
-    ret = bt_adapter_le_unset_device_discovery_state_changed_cb();
+    if (ret != BT_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_start_device_discovery] failed.");
+    /* To unset the LE device discovery state change callback */
+    ret = bt_adapter_le_unset_device_discovery_state_changed_cb();
 
-    return;
+    return;
 }
        - -

        Adding Advertising Data to the LE Advertisement

        - + +

        Adding Advertising Data to the LE Advertisement

        +

        LE advertising data can be added to the LE advertisement or the scan response data. You can add various information, such as the device name, service UUID, service solicitation UUID, advertising appearance, advertising transmission power level, device name, and manufacturer data.

        To add the advertising data:

          @@ -1966,91 +1966,91 @@ char manufacture_1[] = {0x01, 0x01, 0x01, 0x01}; char manufacture_2[] = {0x02, 0x02, 0x02, 0x02}; char manufacture_3[] = {0x03, 0x03, 0x03, 0x03}; char service_data[] = {0x01, 0x02, 0x03}; -const char *time_svc_uuid_16 = "1805"; -const char *battery_svc_uuid_16 = "180f"; -const char *heart_rate_svc_uuid_16 = "180d"; -const char *immediate_alert_svc_uuid_16 = "1802"; -const char *ancs_uuid_128 = "7905F431-B5CE-4E99-A40F-4B1E122D00D0"; +const char *time_svc_uuid_16 = "1805"; +const char *battery_svc_uuid_16 = "180f"; +const char *heart_rate_svc_uuid_16 = "180d"; +const char *immediate_alert_svc_uuid_16 = "1802"; +const char *ancs_uuid_128 = "7905F431-B5CE-4E99-A40F-4B1E122D00D0"; int appearance = 192; /* 192 is a generic watch */ advertiser = advertiser_list[advertiser_index]; if (advertiser == NULL) { -    ret = bt_adapter_le_create_advertiser(&advertiser); -    dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret); -    advertiser_list[advertiser_index] = advertiser; + ret = bt_adapter_le_create_advertiser(&advertiser); + dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret); + advertiser_list[advertiser_index] = advertiser; } else { -    ret = bt_adapter_le_clear_advertising_data(advertiser, -                                               BT_ADAPTER_LE_PACKET_ADVERTISING); -    if (ret != BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "clear advertising data [0x%04x]", ret); -    ret = bt_adapter_le_clear_advertising_data(advertiser, -                                               BT_ADAPTER_LE_PACKET_SCAN_RESPONSE); -    if (ret != BT_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "clear scan response data [0x%04x]", ret); + ret = bt_adapter_le_clear_advertising_data(advertiser, + BT_ADAPTER_LE_PACKET_ADVERTISING); + if (ret != BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "clear advertising data [0x%04x]", ret); + ret = bt_adapter_le_clear_advertising_data(advertiser, + BT_ADAPTER_LE_PACKET_SCAN_RESPONSE); + if (ret != BT_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "clear scan response data [0x%04x]", ret); } ret = bt_adapter_le_add_advertising_service_uuid(advertiser, -                                                 BT_ADAPTER_LE_PACKET_ADVERTISING, -                                                 time_svc_uuid_16); + BT_ADAPTER_LE_PACKET_ADVERTISING, + time_svc_uuid_16); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add service_uuid [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add service_uuid [0x%04x]", ret); ret = bt_adapter_le_add_advertising_service_uuid(advertiser, -                                                 BT_ADAPTER_LE_PACKET_ADVERTISING, -                                                 battery_svc_uuid_16); + BT_ADAPTER_LE_PACKET_ADVERTISING, + battery_svc_uuid_16); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add service_uuid [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add service_uuid [0x%04x]", ret); ret = -    bt_adapter_le_add_advertising_service_solicitation_uuid(advertiser, -                                                            BT_ADAPTER_LE_PACKET_ADVERTISING, -                                                            heart_rate_svc_uuid_16); + bt_adapter_le_add_advertising_service_solicitation_uuid(advertiser, + BT_ADAPTER_LE_PACKET_ADVERTISING, + heart_rate_svc_uuid_16); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add service_solicitation_uuid [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add service_solicitation_uuid [0x%04x]", ret); ret = -    bt_adapter_le_add_advertising_service_solicitation_uuid(advertiser, -                                                            BT_ADAPTER_LE_PACKET_ADVERTISING, -                                                            immediate_alert_svc_uuid_16); + bt_adapter_le_add_advertising_service_solicitation_uuid(advertiser, + BT_ADAPTER_LE_PACKET_ADVERTISING, + immediate_alert_svc_uuid_16); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add service_solicitation_uuid [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add service_solicitation_uuid [0x%04x]", ret); ret = bt_adapter_le_set_advertising_appearance(advertiser, -                                               BT_ADAPTER_LE_PACKET_ADVERTISING, -                                               appearance); + BT_ADAPTER_LE_PACKET_ADVERTISING, + appearance); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add appearance data [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add appearance data [0x%04x]", ret); ret = bt_adapter_le_set_advertising_tx_power_level(advertiser, -                                                   BT_ADAPTER_LE_PACKET_ADVERTISING, -                                                   true); + BT_ADAPTER_LE_PACKET_ADVERTISING, + true); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add tx_power_level [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add tx_power_level [0x%04x]", ret); manufacture = manufacture_3; /* Default scan response data */ ret = bt_adapter_le_add_advertising_service_data(advertiser, -                                                 BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, -                                                 time_svc_uuid_16, service_data, -                                                 sizeof(service_data)); + BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, + time_svc_uuid_16, service_data, + sizeof(service_data)); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add service_data [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add service_data [0x%04x]", ret); ret = bt_adapter_le_set_advertising_device_name(advertiser, -                                                BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, -                                                true); + BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, + true); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "set device name [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "set device name [0x%04x]", ret); ret = -    bt_adapter_le_add_advertising_manufacturer_data(advertiser, -                                                    BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, -                                                    manufacturer_id, manufacture, -                                                    sizeof(manufacture_0)); + bt_adapter_le_add_advertising_manufacturer_data(advertiser, + BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, + manufacturer_id, manufacture, + sizeof(manufacture_0)); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add manufacturer data [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add manufacturer data [0x%04x]", ret);
        1. @@ -2060,13 +2060,13 @@ int ret = BT_ERROR_NONE; ret = bt_adapter_le_destroy_advertiser(advertiser); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_destroy_advertiser] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_adapter_le_destroy_advertiser] failed."); return;
        - +

        Setting the LE Advertising Connectable Mode

        When advertising to a remote device, use the bt_adapter_le_set_advertising_connectable() function to define whether the advertising type is connectable or non-connectable:

        @@ -2080,18 +2080,18 @@ int type = BT_ADAPTER_LE_ADVERTISING_CONNECTABLE; advertiser = advertiser_list[advertiser_index]; if (advertiser == NULL) { -    ret = bt_adapter_le_create_advertiser(&advertiser); -    dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret); -    advertiser_list[advertiser_index] = advertiser; + ret = bt_adapter_le_create_advertiser(&advertiser); + dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret); + advertiser_list[advertiser_index] = advertiser; } ret = bt_adapter_le_set_advertising_connectable(advertiser, type); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add scan response data [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add scan response data [0x%04x]", ret); - +

        Setting the LE Advertising Mode

        - +

        The advertising mode controls the advertising power and latency, and can be set to be balanced, low latency, or low energy.

        To set the advertising mode:

        @@ -2107,16 +2107,16 @@ int mode = BT_ADAPTER_LE_ADVERTISING_MODE_BALANCED; advertiser = advertiser_list[advertiser_index]; if (advertiser == NULL) { -    ret = bt_adapter_le_create_advertiser(&advertiser); -    dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret); -    advertiser_list[advertiser_index] = advertiser; + ret = bt_adapter_le_create_advertiser(&advertiser); + dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret); + advertiser_list[advertiser_index] = advertiser; } ret = bt_adapter_le_set_advertising_mode(advertiser, mode); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "add scan response data [0x%04x]", ret); + dlog_print(DLOG_INFO, LOG_TAG, "add scan response data [0x%04x]", ret); - +

        Starting and Stopping LE Advertising

        To manage advertising:

          @@ -2126,65 +2126,65 @@ if (ret != BT_ERROR_NONE) 
           static void
 __bt_adapter_le_advertising_state_changed_cb(int result, bt_advertiser_h advertiser,
-                                             bt_adapter_le_advertising_state_e
-                                             adv_state,
-                                             void *user_data)
+                                             bt_adapter_le_advertising_state_e
+                                             adv_state,
+                                             void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Result: %d", result);
-    dlog_print(DLOG_INFO, LOG_TAG, "Advertiser: %p", advertiser);
-    dlog_print(DLOG_INFO, LOG_TAG, "Advertising %s [%d]",
-               adv_state == BT_ADAPTER_LE_ADVERTISING_STARTED ? "started" : "stopped",
-               adv_state);
+    dlog_print(DLOG_INFO, LOG_TAG, "Result: %d", result);
+    dlog_print(DLOG_INFO, LOG_TAG, "Advertiser: %p", advertiser);
+    dlog_print(DLOG_INFO, LOG_TAG, "Advertising %s [%d]",
+               adv_state == BT_ADAPTER_LE_ADVERTISING_STARTED ? "started" : "stopped",
+               adv_state);
 }
 
 static void
 __bt_adapter_le_advertising_state_changed_cb_2(int result, bt_advertiser_h advertiser,
-                                               bt_adapter_le_advertising_state_e
-                                               adv_state,
-                                               void *user_data)
+                                               bt_adapter_le_advertising_state_e
+                                               adv_state,
+                                               void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Result: %d", result);
-    dlog_print(DLOG_INFO, LOG_TAG, "Advertiser: %p", advertiser);
-    dlog_print(DLOG_INFO, LOG_TAG, "Advertising %s [%d]",
-               adv_state == BT_ADAPTER_LE_ADVERTISING_STARTED ? "started" : "stopped",
-               adv_state);
+    dlog_print(DLOG_INFO, LOG_TAG, "Result: %d", result);
+    dlog_print(DLOG_INFO, LOG_TAG, "Advertiser: %p", advertiser);
+    dlog_print(DLOG_INFO, LOG_TAG, "Advertising %s [%d]",
+               adv_state == BT_ADAPTER_LE_ADVERTISING_STARTED ? "started" : "stopped",
+               adv_state);
 }
 
 static void
 __bt_adapter_le_advertising_state_changed_cb_3(int result, bt_advertiser_h advertiser,
-                                               bt_adapter_le_advertising_state_e
-                                               adv_state,
-                                               void *user_data)
+                                               bt_adapter_le_advertising_state_e
+                                               adv_state,
+                                               void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Result: %d", result);
-    dlog_print(DLOG_INFO, LOG_TAG, "Advertiser: %p", advertiser);
-    dlog_print(DLOG_INFO, LOG_TAG, "Advertising %s [%d]",
-               adv_state == BT_ADAPTER_LE_ADVERTISING_STARTED ? "started" : "stopped",
-               adv_state);
+    dlog_print(DLOG_INFO, LOG_TAG, "Result: %d", result);
+    dlog_print(DLOG_INFO, LOG_TAG, "Advertiser: %p", advertiser);
+    dlog_print(DLOG_INFO, LOG_TAG, "Advertising %s [%d]",
+               adv_state == BT_ADAPTER_LE_ADVERTISING_STARTED ? "started" : "stopped",
+               adv_state);
 }
 
 bt_adapter_le_advertising_state_changed_cb cb;
 
 if (advertiser_index == 0)
-    cb = __bt_adapter_le_advertising_state_changed_cb;
+    cb = __bt_adapter_le_advertising_state_changed_cb;
 else if
-    (advertiser_index == 1) cb = __bt_adapter_le_advertising_state_changed_cb_2;
+    (advertiser_index == 1) cb = __bt_adapter_le_advertising_state_changed_cb_2;
 else
-    cb = __bt_adapter_le_advertising_state_changed_cb_3;
+    cb = __bt_adapter_le_advertising_state_changed_cb_3;
 
 advertiser = advertiser_list[advertiser_index];
 advertiser_index++;
 advertiser_index %= 3;
 
 if (advertiser == NULL) {
-    ret = bt_adapter_le_create_advertiser(&advertiser);
-    dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret);
-    advertiser_list[advertiser_index] = advertiser;
+    ret = bt_adapter_le_create_advertiser(&advertiser);
+    dlog_print(DLOG_INFO, LOG_TAG, "created le advertiser(%d)", ret);
+    advertiser_list[advertiser_index] = advertiser;
 }
 
 ret = bt_adapter_le_start_advertising_new(advertiser, cb, NULL);
 if (ret < BT_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "failed with [0x%04x]", ret);
+    dlog_print(DLOG_INFO, LOG_TAG, "failed with [0x%04x]", ret);
        1. @@ -2192,13 +2192,13 @@ if (ret < BT_ERROR_NONE) 
           if (advertiser != NULL) {
-    ret = bt_adapter_le_stop_advertising(advertiser);
-    if (ret < BT_ERROR_NONE)
-        dlog_print(DLOG_INFO, LOG_TAG, "failed with [0x%04x]", ret);
+    ret = bt_adapter_le_stop_advertising(advertiser);
+    if (ret < BT_ERROR_NONE)
+        dlog_print(DLOG_INFO, LOG_TAG, "failed with [0x%04x]", ret);
 }
        - +

        Releasing All Resources

        @@ -2216,7 +2216,7 @@ bt_socket_unset_connection_state_changed_cb(); /* Deinitialize Bluetooth */ ret = bt_deinitialize(); if (ret != BT_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "[bt_deinitialize] failed."); + dlog_print(DLOG_ERROR, LOG_TAG, "[bt_deinitialize] failed."); diff --git a/org.tizen.guides/html/native/connectivity/connection_n.htm b/org.tizen.guides/html/native/connectivity/connection_n.htm index aa7f136..4cdbdec 100644 --- a/org.tizen.guides/html/native/connectivity/connection_n.htm +++ b/org.tizen.guides/html/native/connectivity/connection_n.htm @@ -29,7 +29,7 @@
        4. -
    + +

    Related Info

    • Connection API for Mobile Native
      • @@ -101,155 +101,155 @@

      The following table defines the available profile information, which you can get using the connection_profile_get_XXX() function.

      -

      Table: Common information

      - - - +

      Table: Common information

      +
      + + - + - - - - - - + + - - - - - - - - - - - + + + + + + + + + + + + + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + - + - - - - - - + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - -
      InformationDescriptionDescription
      CommonDNS addressDNS address; you can get the first and second DNS address
      Gateway addressGateway addressDNS addressDNS address; you can get the first and second DNS address
      IP addressIP address
      IP configuration typeIP address configuration type, such as static, dynamic, auto, or fixed
      Network interface nameName of the network interface, such as eth0 or pdp0
      Gateway addressGateway address
      IP addressIP address
      IP configuration typeIP address configuration type, such as static, dynamic, auto, or fixed
      Network interface nameName of the network interface, such as eth0 or pdp0
      Profile IDUnique profile ID; when you create a new profile, this value is determined
      Profile IDUnique profile ID; when you create a new profile, this value is determined
      Profile nameProfile name associated with the profile ID
      Profile nameProfile name associated with the profile ID
      Profile stateProfile state, such as disconnected, association, configuration, or connected
      Profile stateProfile state, such as disconnected, association, configuration, or connected
      Profile typeProfile type indicating the network connection type
      Profile typeProfile type indicating the network connection type
      Proxy addressProxy address
      Proxy addressProxy address
      Proxy typeProxy method, such as direct or auto
      Proxy typeProxy method, such as direct or auto
      Subnet maskSubnet mask
      Subnet maskSubnet mask
      Wi-Fi-specificBSSIDBasic service set identifierBSSIDBasic service set identifier
      ESSIDExtended service set identifier
      ESSIDExtended service set identifier
      Encryption typeType for encryption modes, such as WEP, TKIP, AES or TKIP/AES mixed
      FrequencyFrequency (in MHz)
      Max speedMaximum speed (in Mbps)
      Passphrase requiredPassphrase compulsion
      RSSIReceived signal strength indication
      Security typeWi-Fi security type; supports WEP, WPA-PSK, WPA2-PSK, and EAP
      Encryption typeType for encryption modes, such as WEP, TKIP, AES or TKIP/AES mixed
      FrequencyFrequency (in MHz)
      Max speedMaximum speed (in Mbps)
      Passphrase requiredPassphrase compulsion
      RSSIReceived signal strength indication
      Security typeWi-Fi security type; supports WEP, WPA-PSK, WPA2-PSK, and EAP
      WPS supported Whether WPS (Wi-Fi Protected Setup) is supported
      Cellular-specificAPNAccess Point Name
      Cellular authentication infoAuthentication information, including user name and passwordAPNAccess Point Name
      Cellular home URLHome URL
      Cellular authentication infoAuthentication information, including user name and password
      DefaultWhether the profile is default
      Cellular home URLHome URL
      EditableWhether the profile is editable
      DefaultWhether the profile is default
      HiddenWhether the profile is hidden
      EditableWhether the profile is editable
      PDN typeCellular PDN type
      HiddenWhether the profile is hidden
      Roaming PDN typeCellular roaming PDN type
      PDN typeCellular PDN type
      RoamingRoaming state
      Roaming PDN typeCellular roaming PDN type
      Service typeCellular service type
      RoamingRoaming state
      - + + Service type + Cellular service type + + + +

      Connection Statistics

      You can use the Connection Statistics API (in mobile and wearable applications) to gather statistics on the network usage, such as the amount of sent or received data. You can also retrieve the cumulative size of packets sent or received since the last reset based on the operation mode, such as packet switching (PS). To define the specific type of statistics information you want, use the connection_statistics_type_e enumerator (in mobile and wearable applications).

      - +
      Note Statistics are supported for Wi-Fi and cellular connections only.
      - -

      You can re-initialize the statistics with the connection_reset_statistics() function.

      + +

      You can re-initialize the statistics with the connection_reset_statistics() function.

      Prerequisites

      @@ -259,13 +259,13 @@

      To use the Connection API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

       <privileges>
-   <privilege>http://tizen.org/privilege/network.get</privilege>
-   <privilege>http://tizen.org/privilege/network.set</privilege>
-   <privilege>http://tizen.org/privilege/network.profile</privilege>
+   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/network.set</privilege>
+   <privilege>http://tizen.org/privilege/network.profile</privilege>
 </privileges>
-
      + -
    • +

    • To use the functions and data types of the Connection API, include the <net_connection.h> header file in your application:

       #include <net_connection.h>
@@ -283,7 +283,7 @@ int error_code;
 
 error_code = connection_create(&connection);
 if (error_code != CONNECTION_ERROR_NONE)
-    return;
+    return;
    • @@ -305,7 +305,7 @@ int error_code; connection_type_e net_state; error_code = connection_get_type(connection, &net_state); if (error_code == CONNECTION_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "Network connection type: %d", net_state); + dlog_print(DLOG_INFO, LOG_TAG, "Network connection type: %d", net_state);

      To monitor changes in the connection type, register and define a callback:

      @@ -315,7 +315,7 @@ connection_set_type_changed_cb(connection, __connection_changed_cb, NULL); static void __connection_changed_cb(connection_type_e type, void* user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "Type changed callback, connection type: %d", type); + dlog_print(DLOG_INFO, LOG_TAG, "Type changed callback, connection type: %d", type); }
      • @@ -325,21 +325,21 @@ __connection_changed_cb(connection_type_e type, void* user_data) 
       char *ip_addr = NULL;
 error_code = connection_get_ip_address(connection, CONNECTION_ADDRESS_FAMILY_IPV4,
-                                       &ip_addr);
+                                       &ip_addr);
 if (error_code == CONNECTION_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "IP address: %s", ip_addr);
-    free(ip_addr);
+    dlog_print(DLOG_INFO, LOG_TAG, "IP address: %s", ip_addr);
+    free(ip_addr);
 }
      -
    • To get the connection proxy information, use the connection_get_proxy() function. The following example prints the proxy address using the dlog util tool. +
    • To get the connection proxy information, use the connection_get_proxy() function. The following example prints the proxy address using the dlog util tool.

      Free the memory allocated for the proxy_addr variable.

       error_code = connection_get_proxy(connection, address_family, &proxy_addr);
 if (error_code == CONNECTION_ERROR_NONE) {
-    dlog_print(DLOG_INFO, LOG_TAG, "Proxy address: %s", proxy_addr);
-    free(proxy_addr);
+    dlog_print(DLOG_INFO, LOG_TAG, "Proxy address: %s", proxy_addr);
+    free(proxy_addr);
 }
      • @@ -356,26 +356,26 @@ connection_cellular_state_e cellular_state; connection_get_cellular_state(connection, &cellular_state); switch (cellular_state) { case CONNECTION_CELLULAR_STATE_OUT_OF_SERVICE: -    dlog_print(DLOG_INFO, LOG_TAG, "Out of service"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Out of service"); + break; case CONNECTION_CELLULAR_STATE_FLIGHT_MODE: -    dlog_print(DLOG_INFO, LOG_TAG, "Flight mode"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Flight mode"); + break; case CONNECTION_CELLULAR_STATE_ROAMING_OFF: -    dlog_print(DLOG_INFO, LOG_TAG, "Roaming is turned off"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Roaming is turned off"); + break; case CONNECTION_CELLULAR_STATE_CALL_ONLY_AVAILABLE: -    dlog_print(DLOG_INFO, LOG_TAG, "Call only"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Call only"); + break; case CONNECTION_CELLULAR_STATE_AVAILABLE: -    dlog_print(DLOG_INFO, LOG_TAG, "Available"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Available"); + break; case CONNECTION_CELLULAR_STATE_CONNECTED: -    dlog_print(DLOG_INFO, LOG_TAG, "Connected"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Connected"); + break; default: -    dlog_print(DLOG_INFO, LOG_TAG, "error"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "error"); + break; } @@ -388,17 +388,17 @@ connection_wifi_state_e wifi_state; connection_get_wifi_state(connection, &wifi_state); switch (wifi_state) { case CONNECTION_WIFI_STATE_DEACTIVATED: -    dlog_print(DLOG_INFO, LOG_TAG, "Deactivated state"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Deactivated state"); + break; case CONNECTION_WIFI_STATE_DISCONNECTED: -    dlog_print(DLOG_INFO, LOG_TAG, "Disconnected state"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Disconnected state"); + break; case CONNECTION_WIFI_STATE_CONNECTED: -    dlog_print(DLOG_INFO, LOG_TAG, "Connected state"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Connected state"); + break; default: -    dlog_print(DLOG_INFO, LOG_TAG, "error"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "error"); + break; } @@ -415,46 +415,46 @@ default: 
       long long last_received_size;
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_CELLULAR,
-                                       CONNECTION_STATISTICS_TYPE_LAST_RECEIVED_DATA,
-                                       &last_received_size);
+                                       CONNECTION_STATISTICS_TYPE_LAST_RECEIVED_DATA,
+                                       &last_received_size);
 /* Handle statistics */
 
 long long last_sent_size;
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_CELLULAR,
-                                       CONNECTION_STATISTICS_TYPE_LAST_SENT_DATA,
-                                       &last_sent_size);
+                                       CONNECTION_STATISTICS_TYPE_LAST_SENT_DATA,
+                                       &last_sent_size);
 /* Handle statistics */
 
 long long total_received_size;
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_CELLULAR,
-                                       CONNECTION_STATISTICS_TYPE_TOTAL_RECEIVED_DATA,
-                                       &total_received_size);
+                                       CONNECTION_STATISTICS_TYPE_TOTAL_RECEIVED_DATA,
+                                       &total_received_size);
 /* Handle statistics */
 
 long long total_sent_size;
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_CELLULAR,
-                                       CONNECTION_STATISTICS_TYPE_TOTAL_SENT_DATA,
-                                       &total_sent_size);
+                                       CONNECTION_STATISTICS_TYPE_TOTAL_SENT_DATA,
+                                       &total_sent_size);
 /* Handle statistics */
 
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_WIFI,
-                                       CONNECTION_STATISTICS_TYPE_LAST_RECEIVED_DATA,
-                                       &last_received_size);
+                                       CONNECTION_STATISTICS_TYPE_LAST_RECEIVED_DATA,
+                                       &last_received_size);
 /* Handle statistics */
 
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_WIFI,
-                                       CONNECTION_STATISTICS_TYPE_LAST_SENT_DATA,
-                                       &last_sent_size);
+                                       CONNECTION_STATISTICS_TYPE_LAST_SENT_DATA,
+                                       &last_sent_size);
 /* Handle statistics */
 
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_WIFI,
-                                       CONNECTION_STATISTICS_TYPE_TOTAL_RECEIVED_DATA,
-                                       &total_received_size);
+                                       CONNECTION_STATISTICS_TYPE_TOTAL_RECEIVED_DATA,
+                                       &total_received_size);
 /* Handle statistics */
 
 error_code = connection_get_statistics(connection, CONNECTION_TYPE_WIFI,
-                                       CONNECTION_STATISTICS_TYPE_TOTAL_SENT_DATA,
-                                       &total_sent_size);
+                                       CONNECTION_STATISTICS_TYPE_TOTAL_SENT_DATA,
+                                       &total_sent_size);
 /* Handle statistics */
      @@ -470,15 +470,15 @@ error_code = connection_get_statistics(connection, CONNECTION_TYPE_WIFI, static void __ip_changed_cb(const char* ipv4_address, const char* ipv6_address, void* user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "%s callback, IPv4 address: %s, IPv6 address: %s", -               (char *)user_data, ipv4_address, (ipv6_address ? ipv6_address : "NULL")); + dlog_print(DLOG_INFO, LOG_TAG, "%s callback, IPv4 address: %s, IPv6 address: %s", + (char *)user_data, ipv4_address, (ipv6_address ? ipv6_address : "NULL")); } static void __proxy_changed_cb(const char* ipv4_address, const char* ipv6_address, void* user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "%s callback, IPv4 address: %s, IPv6 address: %s", -               (char *)user_data, ipv4_address, (ipv6_address ? ipv6_address : "NULL")); + dlog_print(DLOG_INFO, LOG_TAG, "%s callback, IPv4 address: %s, IPv6 address: %s", + (char *)user_data, ipv4_address, (ipv6_address ? ipv6_address : "NULL")); } @@ -488,13 +488,13 @@ __proxy_changed_cb(const char* ipv4_address, const char* ipv6_address, void* use 
       error_code = connection_set_ip_address_changed_cb(connection, __ip_changed_cb,
-                                                  "IP addr changed:");
+                                                  "IP addr changed:");
 if (error_code != CONNECTION_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
 error_code = connection_set_proxy_address_changed_cb(connection, __proxy_changed_cb,
-                                                     "Proxy IP addr changed:");
+                                                     "Proxy IP addr changed:");
 if (error_code != CONNECTION_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    • Deregister the callback functions. @@ -504,11 +504,11 @@ if (error_code != CONNECTION_ERROR_NONE) 
       error_code = connection_unset_ip_address_changed_cb(connection);
 if (error_code != CONNECTION_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
 
 error_code = connection_unset_proxy_address_changed_cb(connection);
 if (error_code != CONNECTION_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */

      • Initializing a Socket

      @@ -529,73 +529,73 @@ if (error_code != CONNECTION_ERROR_NONE) int main(int argc, char **argv) { -    int rv = 0; -    int ip_type = -1; -    char user_url[100] = {0,}; -    char user_port[10] = {0,}; -    char user_msg[200] = {0,}; -    char *local_ipv4 = NULL; -    char *local_ipv6 = NULL; -    char *interface_name = NULL; - -    connection_type_e net_state; -    connection_h connection = NULL; -    connection_profile_h profile_h = NULL; + int rv = 0; + int ip_type = -1; + char user_url[100] = {0,}; + char user_port[10] = {0,}; + char user_msg[200] = {0,}; + char *local_ipv4 = NULL; + char *local_ipv6 = NULL; + char *interface_name = NULL; + + connection_type_e net_state; + connection_h connection = NULL; + connection_profile_h profile_h = NULL;
    • Include the required header file and create a connection handle.
    • Check whether the default connection is available: 
      -    connection_type_e net_state;
+    connection_type_e net_state;
 
-    rv = connection_get_type(connection, &net_state);
-    if (rv != CONNECTION_ERROR_NONE || net_state == CONNECTION_TYPE_DISCONNECTED) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Not connected %d\n", rv);
-        connection_destroy(connection);
+    rv = connection_get_type(connection, &net_state);
+    if (rv != CONNECTION_ERROR_NONE || net_state == CONNECTION_TYPE_DISCONNECTED) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Not connected %d\n", rv);
+        connection_destroy(connection);
 
-        return -1;
-    }
+        return -1;
+    }
    • Check the address type of the default connection.

      The address type can be IPv4 or IPv6.

      -    int ip_type = -1;
-    char *local_ipv4 = NULL;
-    char *local_ipv6 = NULL;
-    connection_profile_h profile_h = NULL;
-
-    rv = connection_get_current_profile(connection, &profile_h);
-    if (rv != CONNECTION_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to get profile handle %d\n", rv);
-        connection_destroy(connection);
-
-        return -1;
-    }
-
-    rv = connection_profile_get_ip_address(profile_h, CONNECTION_ADDRESS_FAMILY_IPV6,
-                                           &local_ipv6);
-    if (rv == CONNECTION_ERROR_NONE && g_strcmp0(local_ipv6, "::") != 0) {
-        ip_type = CONNECTION_ADDRESS_FAMILY_IPV6;
-        dlog_print(DLOG_INFO, LOG_TAG, "IPv6 address: %s\n", local_ipv6);
-    }
-
-    /* If both IPv4 and IPv6 types are set, the IPv4 type is used as default here */
-    rv = connection_profile_get_ip_address(profile_h, CONNECTION_ADDRESS_FAMILY_IPV4,
-                                           &local_ipv4);
-    if (rv == CONNECTION_ERROR_NONE && g_strcmp0(local_ipv4, &0.0.0.0&) != 0) {
-        ip_type = CONNECTION_ADDRESS_FAMILY_IPV4;
-        dlog_print(DLOG_INFO, LOG_TAG, "IPv4 address: %s\n", local_ipv4);
-    }
-
-    if (ip_type != CONNECTION_ADDRESS_FAMILY_IPV6
-        && ip_type != CONNECTION_ADDRESS_FAMILY_IPV4) {
-        dlog_print(DLOG_INFO, LOG_TAG, "No IP address!\n");
-        /* Error handling */
-    }
-
-    connection_profile_get_network_interface_name(profile_h, &interface_name);
-    dlog_print(DLOG_INFO, LOG_TAG, "Interface Name: %s\n", interface_name);
+    int ip_type = -1;
+    char *local_ipv4 = NULL;
+    char *local_ipv6 = NULL;
+    connection_profile_h profile_h = NULL;
+
+    rv = connection_get_current_profile(connection, &profile_h);
+    if (rv != CONNECTION_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to get profile handle %d\n", rv);
+        connection_destroy(connection);
+
+        return -1;
+    }
+
+    rv = connection_profile_get_ip_address(profile_h, CONNECTION_ADDRESS_FAMILY_IPV6,
+                                           &local_ipv6);
+    if (rv == CONNECTION_ERROR_NONE && g_strcmp0(local_ipv6, "::") != 0) {
+        ip_type = CONNECTION_ADDRESS_FAMILY_IPV6;
+        dlog_print(DLOG_INFO, LOG_TAG, "IPv6 address: %s\n", local_ipv6);
+    }
+
+    /* If both IPv4 and IPv6 types are set, the IPv4 type is used as default here */
+    rv = connection_profile_get_ip_address(profile_h, CONNECTION_ADDRESS_FAMILY_IPV4,
+                                           &local_ipv4);
+    if (rv == CONNECTION_ERROR_NONE && g_strcmp0(local_ipv4, &0.0.0.0&) != 0) {
+        ip_type = CONNECTION_ADDRESS_FAMILY_IPV4;
+        dlog_print(DLOG_INFO, LOG_TAG, "IPv4 address: %s\n", local_ipv4);
+    }
+
+    if (ip_type != CONNECTION_ADDRESS_FAMILY_IPV6
+        && ip_type != CONNECTION_ADDRESS_FAMILY_IPV4) {
+        dlog_print(DLOG_INFO, LOG_TAG, "No IP address!\n");
+        /* Error handling */
+    }
+
+    connection_profile_get_network_interface_name(profile_h, &interface_name);
+    dlog_print(DLOG_INFO, LOG_TAG, "Interface Name: %s\n", interface_name);
 }
      • @@ -620,10 +620,10 @@ main(int argc, char **argv) 
       int rv;
 rv = connection_get_default_cellular_service_profile(connection,
-                                                     CONNECTION_CELLULAR_SERVICE_TYPE_INTERNET,
-                                                     &profile);
+                                                     CONNECTION_CELLULAR_SERVICE_TYPE_INTERNET,
+                                                     &profile);
 if (ret != CONNECTION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to get default cellular service profile\n");
+    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to get default cellular service profile\n");
      @@ -631,7 +631,7 @@ if (ret != CONNECTION_ERROR_NONE) 
       rv = connection_open_profile(connection, profile, test_connection_opened_callback, NULL);
 if (rv != CONNECTION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to open profile\n");
+    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to open profile\n");
    • If the callback function is invoked with a success result, refresh the profile and get the interface name of the opened profile. @@ -642,46 +642,46 @@ if (rv != CONNECTION_ERROR_NONE) static void test_connection_opened_callback(connection_error_e result, void* user_data) { -    int rv; -    char *interface_name; -    CURL *curl; -    CURLcode res; - -    if (result == CONNECTION_ERROR_NONE) { -        /* Refresh the profile */ -        rv = connection_profile_refresh(profile); -        if (rv != CONNECTION_ERROR_NONE) { -            dlog_print(DLOG_ERROR, LOG_TAG, "Failed to refresh profile\n"); - -            return; -        } - -        /* Get the interface name */ -        rv = connection_profile_get_network_interface_name(profile, &interface_name); -        if (rv != CONNECTION_ERROR_NONE) { -            dlog_print(DLOG_ERROR, LOG_TAG, "Fail to get interface name!\n"); - -            return; -        } - -        dlog_print(DLOG_ERROR, LOG_TAG, "Interface name(%s)\n", interface_name); -        curl = curl_easy_init(); -        if (curl) { -            curl_easy_setopt(curl, CURLOPT_URL, "https://www.tizen.org"); -            /* Bind the interface name with the socket */ -            curl_easy_setopt(curl, CURLOPT_INTERFACE, interface_name); - -            res = curl_easy_perform(curl); -            if (res != CURLE_OK) -                dlog_print(DLOG_ERROR, LOG_TAG, "curl_easy_perform() failed"); - -            curl_easy_cleanup(curl); -        } -    } - -    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to open profile"); - -    return; + int rv; + char *interface_name; + CURL *curl; + CURLcode res; + + if (result == CONNECTION_ERROR_NONE) { + /* Refresh the profile */ + rv = connection_profile_refresh(profile); + if (rv != CONNECTION_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to refresh profile\n"); + + return; + } + + /* Get the interface name */ + rv = connection_profile_get_network_interface_name(profile, &interface_name); + if (rv != CONNECTION_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, "Fail to get interface name!\n"); + + return; + } + + dlog_print(DLOG_ERROR, LOG_TAG, "Interface name(%s)\n", interface_name); + curl = curl_easy_init(); + if (curl) { + curl_easy_setopt(curl, CURLOPT_URL, "https://www.tizen.org"); + /* Bind the interface name with the socket */ + curl_easy_setopt(curl, CURLOPT_INTERFACE, interface_name); + + res = curl_easy_perform(curl); + if (res != CURLE_OK) + dlog_print(DLOG_ERROR, LOG_TAG, "curl_easy_perform() failed"); + + curl_easy_cleanup(curl); + } + } + + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to open profile"); + + return; }
      • @@ -694,22 +694,22 @@ test_connection_opened_callback(connection_error_e result, void* user_data)
    • Retrieve the IP addresses: 
       {
-    struct sockaddr_in6 *addr6;
-    struct addrinfo hints;
-    struct addrinfo *result;
-    char user_url[100] = {0,};
-    char user_port[10] = {0,};
-
-    memset(&hints, 0x00, sizeof(struct addrinfo));
-
-    hints.ai_family = PF_UNSPEC;
-    hints.ai_socktype = SOCK_STREAM;
-    hints.ai_protocol = IPPROTO_TCP;
-
-    if (getaddrinfo(user_url, user_port, &hints, &result) != 0) {
-        dlog_print(DLOG_INFO, LOG_TAG, "getaddrinfo() error\n");
-        /* Error handling */
-    }
+    struct sockaddr_in6 *addr6;
+    struct addrinfo hints;
+    struct addrinfo *result;
+    char user_url[100] = {0,};
+    char user_port[10] = {0,};
+
+    memset(&hints, 0x00, sizeof(struct addrinfo));
+
+    hints.ai_family = PF_UNSPEC;
+    hints.ai_socktype = SOCK_STREAM;
+    hints.ai_protocol = IPPROTO_TCP;
+
+    if (getaddrinfo(user_url, user_port, &hints, &result) != 0) {
+        dlog_print(DLOG_INFO, LOG_TAG, "getaddrinfo() error\n");
+        /* Error handling */
+    }
 }
      • @@ -736,8 +736,8 @@ hints.ai_family = PF_UNSPEC; hints.ai_socktype = SOCK_STREAM; if (getaddrinfo(default_ip, argv[1], &hints, &result) != 0) { -    printf("getaddrinfo() error\n"); -    goto done; + printf("getaddrinfo() error\n"); + goto done; } @@ -745,7 +745,7 @@ if (getaddrinfo(default_ip, argv[1], &hints, &result) != 0) {

      To create the socket and connect to a remote host:

        -
      1. Find the proper address family and create the socket: +
      2. Find the proper address family and create the socket: 
         int sockfd = -1;
 struct addrinfo *rp;
@@ -753,30 +753,30 @@ struct addrinfo *rp;
 rp = result;
 
 for (rp = result; rp != NULL; rp = rp->ai_next) {
-    if (rp->ai_family == AF_INET && ip_type == CONNECTION_ADDRESS_FAMILY_IPV4) {
-        if ((sockfd = socket(AF_INET, SOCK_STREAM, 0)) < 0) {
-            dlog_print(DLOG_INFO, LOG_TAG, "socket error\n");
-            freeaddrinfo(result);
-        }
-        dlog_print(DLOG_INFO, LOG_TAG, "IPv4\n");
-    } else if (rp->ai_family == AF_INET6 && ip_type == CONNECTION_ADDRESS_FAMILY_IPV6) {
-        if ((sockfd = socket(AF_INET6, SOCK_STREAM, 0)) < 0) {
-            dlog_print(DLOG_INFO, LOG_TAG, "socket error\n");
-            freeaddrinfo(result);
-        }
-        dlog_print(DLOG_INFO, LOG_TAG, "IPv6\n");
-    }
+    if (rp->ai_family == AF_INET && ip_type == CONNECTION_ADDRESS_FAMILY_IPV4) {
+        if ((sockfd = socket(AF_INET, SOCK_STREAM, 0)) < 0) {
+            dlog_print(DLOG_INFO, LOG_TAG, "socket error\n");
+            freeaddrinfo(result);
+        }
+        dlog_print(DLOG_INFO, LOG_TAG, "IPv4\n");
+    } else if (rp->ai_family == AF_INET6 && ip_type == CONNECTION_ADDRESS_FAMILY_IPV6) {
+        if ((sockfd = socket(AF_INET6, SOCK_STREAM, 0)) < 0) {
+            dlog_print(DLOG_INFO, LOG_TAG, "socket error\n");
+            freeaddrinfo(result);
+        }
+        dlog_print(DLOG_INFO, LOG_TAG, "IPv6\n");
+    }
 }
      3. Connect to the remote host:
          -
        • Use the IPv4 socket: +
        • Use the IPv4 socket: 
           if (connect(sockfd, rp->ai_addr, rp->ai_addrlen) < 0) {
-    dlog_print(DLOG_INFO, LOG_TAG, "connect() error: %s\n", strerror(errno));
-    freeaddrinfo(result);
-    close(sockfd);
+    dlog_print(DLOG_INFO, LOG_TAG, "connect() error: %s\n", strerror(errno));
+    freeaddrinfo(result);
+    close(sockfd);
 }
          • @@ -786,15 +786,15 @@ if (connect(sockfd, rp->ai_addr, rp->ai_addrlen) < 0) { char *interface_name = NULL; connection_profile_get_network_interface_name(profile_h, &interface_name); -dlog_print(DLOG_INFO, LOG_TAG, "Interface Name: %s\n", interface_name); +dlog_print(DLOG_INFO, LOG_TAG, "Interface Name: %s\n", interface_name); addr6 = (struct sockaddr_in6 *)rp->ai_addr; addr6->sin6_scope_id = if_nametoindex(interface_name); if ((sockfd = connect(sockfd, (struct sockaddr *)addr6, rp->ai_addrlen)) < 0) { -    dlog_print(DLOG_INFO, LOG_TAG, "connect() error: %s\n", strerror(errno)); -    freeaddrinfo(result); -    close(sockfd); + dlog_print(DLOG_INFO, LOG_TAG, "connect() error: %s\n", strerror(errno)); + freeaddrinfo(result); + close(sockfd); } @@ -804,12 +804,12 @@ if ((sockfd = connect(sockfd, (struct sockaddr *)addr6, rp->ai_addrlen)) <
          • Send a message to the remote host: 
             if ((count = write(sockfd, user_msg, 200)) < 0) {
-    dlog_print(DLOG_INFO, LOG_TAG, "write() error: %s\n", strerror(errno));
+    dlog_print(DLOG_INFO, LOG_TAG, "write() error: %s\n", strerror(errno));
 
-    freeaddrinfo(result);
-    close(sockfd);
+    freeaddrinfo(result);
+    close(sockfd);
 }
-dlog_print(DLOG_INFO, LOG_TAG, "Sent count: %d, msg: %s\n", count, user_msg);
+dlog_print(DLOG_INFO, LOG_TAG, "Sent count: %d, msg: %s\n", count, user_msg);
          • Read a message from the remote host: @@ -818,13 +818,13 @@ char buf[257]; memset(buf, 0x00, 257); if ((count = read(sockfd, buf, 256)) < 0) { -    dlog_print(DLOG_INFO, LOG_TAG, "read() error: %s\n", strerror(errno)); + dlog_print(DLOG_INFO, LOG_TAG, "read() error: %s\n", strerror(errno)); -    freeaddrinfo(result); -    close(sockfd); + freeaddrinfo(result); + close(sockfd); } -buf[count] = '\0'; -dlog_print(DLOG_INFO, LOG_TAG, "\nRead: %s\n", buf); +buf[count] = '\0'; +dlog_print(DLOG_INFO, LOG_TAG, "\nRead: %s\n", buf);
      @@ -832,7 +832,7 @@ dlog_print(DLOG_INFO, LOG_TAG, "\nRead: %s\n", buf);

      To create the socket and manage the connection to a client:

        -
      1. Find the proper address family and create the socket: +
      2. Find the proper address family and create the socket: 
         int sockfd = -1;
 struct addrinfo *rp;
@@ -840,35 +840,35 @@ struct addrinfo *rp;
 rp = result;
 
 for (rp = result; rp != NULL; rp = rp->ai_next) {
-    if (rp->ai_family == AF_INET &&
-        ip_type == CONNECTION_ADDRESS_FAMILY_IPV4) {
-        if ((sockfd = socket(AF_INET, SOCK_STREAM, 0)) < 0) {
-            printf("socket error\n");
-            freeaddrinfo(result);
-            goto done;
-        }
-        printf("IPv4\n");
-    } else if (rp->ai_family == AF_INET6 &&
-             ip_type == CONNECTION_ADDRESS_FAMILY_IPV6) {
-        if ((sockfd = socket(AF_INET6, SOCK_STREAM, 0)) < 0) {
-            printf("socket error\n");
-            freeaddrinfo(result);
-            goto done;
-        }
-        printf("IPv6\n");
-    }
+    if (rp->ai_family == AF_INET &&
+        ip_type == CONNECTION_ADDRESS_FAMILY_IPV4) {
+        if ((sockfd = socket(AF_INET, SOCK_STREAM, 0)) < 0) {
+            printf("socket error\n");
+            freeaddrinfo(result);
+            goto done;
+        }
+        printf("IPv4\n");
+    } else if (rp->ai_family == AF_INET6 &&
+             ip_type == CONNECTION_ADDRESS_FAMILY_IPV6) {
+        if ((sockfd = socket(AF_INET6, SOCK_STREAM, 0)) < 0) {
+            printf("socket error\n");
+            freeaddrinfo(result);
+            goto done;
+        }
+        printf("IPv6\n");
+    }
 }
      3. Bind the found address: 
         if (bind(sockfd, rp->ai_addr, rp->ai_addrlen) != 0) {
-    printf("bind() error: %s\n", strerror(errno));
+    printf("bind() error: %s\n", strerror(errno));
 
-    freeaddrinfo(result);
-    close(sockfd);
+    freeaddrinfo(result);
+    close(sockfd);
 
-    goto done;
+    goto done;
 }
        4. @@ -876,12 +876,12 @@ if (bind(sockfd, rp->ai_addr, rp->ai_addrlen) != 0) {

        Mark the sockfd socket as a passive socket.

         if (listen(sockfd, 5) != 0) {
-    printf("listen() error: %s\n", strerror(errno));
+    printf("listen() error: %s\n", strerror(errno));
 
-    freeaddrinfo(result);
-    close(sockfd);
+    freeaddrinfo(result);
+    close(sockfd);
 
-    goto done;
+    goto done;
 }
        @@ -893,30 +893,30 @@ char buf[257]; memset(buf, 0x00, 257); if ((count = read(csockfd, buf, 256)) < 0) { -    printf("read() error: %s\n", strerror(errno)); + printf("read() error: %s\n", strerror(errno)); -    freeaddrinfo(result); -    close(sockfd); -    close(csockfd); -    goto done; + freeaddrinfo(result); + close(sockfd); + close(csockfd); + goto done; } -buf[count] = '\0'; -printf("\nRead: %s\n", buf); +buf[count] = '\0'; +printf("\nRead: %s\n", buf);
      4. Echo the received message back to the client: 
         if ((count = write(csockfd, buf, 256)) < 0) {
-    printf("write() error: %s\n", strerror(errno));
+    printf("write() error: %s\n", strerror(errno));
 
-    freeaddrinfo(result);
-    close(sockfd);
-    close(csockfd);
+    freeaddrinfo(result);
+    close(sockfd);
+    close(csockfd);
 
-    goto done;
+    goto done;
 }
 
-printf("sent count: %d, msg: %s\n", count, buf);
+printf("sent count: %d, msg: %s\n", count, buf);
 close(csockfd);
        5. @@ -924,20 +924,20 @@ close(csockfd);

        Closing the Socket

        -

        To close the client or server-side socket and release the resources:

        +

        To close the client or server-side socket and release the resources:

         freeaddrinfo(result);
 close(sockfd);
 
 done:
-    connection_profile_destroy(profile_h);
-    connection_destroy(connection);
+    connection_profile_destroy(profile_h);
+    connection_destroy(connection);
 
-    free(local_ipv6);
-    free(local_ipv4);
-    free(interface_name);
+    free(local_ipv6);
+    free(local_ipv4);
+    free(interface_name);
 
-    return 0;
+    return 0;
        diff --git a/org.tizen.guides/html/native/connectivity/connectivity_cover_n.htm b/org.tizen.guides/html/native/connectivity/connectivity_cover_n.htm index ee82ce2..656e20d 100644 --- a/org.tizen.guides/html/native/connectivity/connectivity_cover_n.htm +++ b/org.tizen.guides/html/native/connectivity/connectivity_cover_n.htm @@ -5,13 +5,13 @@ - + - Connectivity and Wireless + Connectivity and Wireless @@ -32,7 +32,7 @@
      5. Creating Applications with Content Sharing
    -
    +

    Connectivity and Wireless

    @@ -94,7 +94,7 @@

    You can open logical channels for exchanging messages across devices, and start and control applications on a remote device. Convergence services allow applications and devices in the network to discover, connect, and communicate to each other.

    - +
    diff --git a/org.tizen.guides/html/native/connectivity/curl_n.htm b/org.tizen.guides/html/native/connectivity/curl_n.htm index 20c5671..28bce9c 100644 --- a/org.tizen.guides/html/native/connectivity/curl_n.htm +++ b/org.tizen.guides/html/native/connectivity/curl_n.htm @@ -30,7 +30,7 @@
  • Prerequisites
  • Managing the Proxy Address
  • Transferring HTTP Requests
    • - +

    Related Info

    • Curl API for Mobile Native
      • @@ -42,7 +42,7 @@

      Curl

      -

      You can implement URL-related transfer activities in Tizen without a Web browser using the open source libcurl library, version 7.40. libcurl is a client-side URL transfer library that supports, among other protocols, HTTP, HTTPS, FTP, and file URIs.

      +

      You can implement URL-related transfer activities in Tizen without a Web browser using the open source libcurl library, version 7.40. libcurl is a client-side URL transfer library that supports, among other protocols, HTTP, HTTPS, FTP, and file URIs.

      The main features of the Curl API include:

        @@ -54,15 +54,15 @@ In some cases, such as with Internet access, your application requires some privileges. For more information on which privileges to set in the application manifest file, see Non-API Bound Privileges.
      - +
    • Managing the proxy address

      You can get and set the proxy address in multiple ways.

      - +
      Note In a proxy environment, the libcurl library does not know the proxy address. To handle HTTP and HTTPS requests in a proxy environment, first get the proxy address using the connection manager, and then set the proxy address using the Curl API.
      - +
    • Transferring HTTP requests

      You can transfer HTTP requests using the curl_easy_setopt() function.

      • @@ -75,7 +75,7 @@

      To use the Curl API (in mobile and wearable applications) and the libcurl library, the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

       <privileges>
-   <privilege>http://tizen.org/privilege/internet</privilege>
+   <privilege>http://tizen.org/privilege/internet</privilege>
 </privileges>
      @@ -101,9 +101,9 @@ connection_h connection; int conn_err; conn_err = connection_create(&connection); if (conn_err != CONNECTION_ERROR_NONE) { -    /* Error handling */ + /* Error handling */ -    return; + return; } @@ -124,31 +124,31 @@ connection_destroy(connection); 
       char *proxy_address;
 conn_err = connection_get_proxy(connection, CONNECTION_ADDRESS_FAMILY_IPV4,
-                                &proxy_address);
+                                &proxy_address);

      To set the proxy address, use the curl_easy_setopt() function with the CURLOPT_PROXY parameter:

       if (conn_err == CONNECTION_ERROR_NONE && proxy_address)
-    curl_easy_setopt(curl, CURLOPT_PROXY, proxy_address);
+    curl_easy_setopt(curl, CURLOPT_PROXY, proxy_address);
    • To be notified whenever the proxy address changes, register a callback with the connection_set_proxy_address_changed_cb() function of the Connection Manager API: 
       conn_err = connection_set_proxy_address_changed_cb(connection,
-                                                   __proxy_address_changed_cb, NULL);
+                                                   __proxy_address_changed_cb, NULL);
 if (conn_err != CONNECTION_ERROR_NONE) {
-    /* Error handling */
+    /* Error handling */
 
-    return;
+    return;
 }

      The new proxy address is passed in the callback parameters. To set the proxy address, use the curl_easy_setopt() function with the CURLOPT_PROXY parameter:

       static void
 __proxy_address_changed_cb(const char *ipv4_address,
-                           const char *ipv6_address, void *user_data)
+                           const char *ipv6_address, void *user_data)
 {
-    curl_easy_setopt(curl, CURLOPT_PROXY, ipv4_address);
+    curl_easy_setopt(curl, CURLOPT_PROXY, ipv4_address);
 }
      • @@ -158,10 +158,10 @@ __proxy_address_changed_cb(const char *ipv4_address,

      To transfer HTTP requests, set the URL with the curl_easy_setopt() function and start the transfer with the curl_easy_perform() function:

      -curl_easy_setopt(curl, CURLOPT_URL, "https://www.tizen.org/");
+curl_easy_setopt(curl, CURLOPT_URL, "https://www.tizen.org/");
 curl_err = curl_easy_perform(curl);
 if (curl_err != CURLE_OK)
-    /* Error handling */
+    /* Error handling */
      diff --git a/org.tizen.guides/html/native/connectivity/d2d_connectivity_n.htm b/org.tizen.guides/html/native/connectivity/d2d_connectivity_n.htm index 73b0ec1..b4ee2bc 100644 --- a/org.tizen.guides/html/native/connectivity/d2d_connectivity_n.htm +++ b/org.tizen.guides/html/native/connectivity/d2d_connectivity_n.htm @@ -38,7 +38,7 @@
    • Sending Messages to the Server Application
  • Remote App Control Service -
      +
    • Predefined Payload Fields
      • @@ -63,7 +63,7 @@ The D2D connectivity framework supports only Wi-Fi networks. More connectivity types, such as Bluetooth, Bluetooth Low Energy, and Wi-Fi Direct™, are going to be added in future versions.

      Only 2 services, app communication and remote app control, are currently supported. More services are going to be introduced in the future versions of Tizen. All convergence services are predefined in the platform, which means that you cannot add new ones on your own.

    • - +

    The main features of the Convergence API include:

    • Discovering and connecting to devices @@ -83,7 +83,7 @@ -

      App Communication Service

      +

      App Communication Service

      The convergence architecture allows the app communication service to launch an application on a device equipped with the remote server, and communicate with the server application by sending a payload. The remote server application can also use the app communication service to send responses to the local (client-side) application. In this way, a sophisticated data exchange protocol can be established. Before using the app communication service, set up the listener callbacks and initialize the application.

      @@ -109,8 +109,8 @@

      The app communication service channel specifies the server application the client wants to connect with. The channel data is composed of a URI and channel ID, which are assigned to the channel handle:

      -conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test");
-conv_channel_set_string(channel_handle, "channel_id", "test");
+conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test");
+conv_channel_set_string(channel_handle, "channel_id", "test");

      The channel URI is the URI of the server side application, while the channel ID is a developer-defined value. Note that both URI and ID fields are mandatory for using the app communication service. If not provided, the CONV_ERROR_INVALID_PARAMETER error occurs. You must know the server side application URI: you either develop both the client and server application yourself, or acquire the server application URI from other sources.

      @@ -143,15 +143,15 @@ conv_channel_set_string(channel_handle, "channel_id", "test"

      Tizen Connect

      Prerequisites

      - +

      To enable your application to use the D2D connectivity functionality:

      1. To use the Convergence API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file: 
         <privileges>
-   <privilege>http://tizen.org/privilege/internet</privilege>
-   <privilege>http://tizen.org/privilege/bluetooth</privilege>
-   <privilege>http://tizen.org/privilege/d2d.datasharing</privilege>
+   <privilege>http://tizen.org/privilege/internet</privilege>
+   <privilege>http://tizen.org/privilege/bluetooth</privilege>
+   <privilege>http://tizen.org/privilege/d2d.datasharing</privilege>
 </privileges>
        2. @@ -171,21 +171,21 @@ conv_channel_set_string(channel_handle, "channel_id", "test"

        During the discovery process, the framework returns handles of found devices (JSON objects with basic device information and lists of available services). The following example shows the conceptual structure of device handle:

         {
-    "device_id": "DEVICE_ID", /* Unique device ID */
-    "device_name": "DEVICE_NAME", /* Unique device name */
-    "device_type": "DEVICE_TYPE", /* Device profile, such as mobile or wearable */
-    [
-        /* Handle for service A */
-        {
-            service_type: TYPE_A,
-            jservice: JSON auxiliary data of service A
-        },
-        /* Handle for service B */
-        {
-            service_type: TYPE_B,
-            jservice: JSON auxiliary of service B
-        },
-    ]
+    "device_id": "DEVICE_ID", /* Unique device ID */
+    "device_name": "DEVICE_NAME", /* Unique device name */
+    "device_type": "DEVICE_TYPE", /* Device profile, such as mobile or wearable */
+    [
+        /* Handle for service A */
+        {
+            service_type: TYPE_A,
+            jservice: JSON auxiliary data of service A
+        },
+        /* Handle for service B */
+        {
+            service_type: TYPE_B,
+            jservice: JSON auxiliary of service B
+        },
+    ]
 }
        @@ -205,77 +205,77 @@ conv_channel_set_string(channel_handle, "channel_id", "test"
      2. Start the discovery by calling the conv_discovery_start() function. The discovered device handles are retrieved in the conv_discovery_cb() callback.

        In the following example, the conv_discovery_start() function runs a 30 seconds long discovery procedure. Each time a nearby device is discovered, the framework invokes the discovery_cb() callback with the device handle and the CONV_DISCOVERY_RESULT_SUCCESS result code. At the end of discovery procedure, the callback is invoked with the CONV_DISCOVERY_RESULT_FINISHED result code and an empty device handle.

        The result codes are defined in the conv_discovery_result_e enumeration (in mobile and wearable applications).

        -

        The device ID, name, and type can be read from the device handle by passing the CONV_DEVICE_ID, CONV_DEVICE_NAME, and CONV_DEVICE_TYPE keys to the conv_device_get_property_string() function. To use the discovered device handle outside the callback, it must be cloned with the conv_device_clone() function.

        +

        The device ID, name, and type can be read from the device handle by passing the CONV_DEVICE_ID, CONV_DEVICE_NAME, and CONV_DEVICE_TYPE keys to the conv_device_get_property_string() function. To use the discovered device handle outside the callback, it must be cloned with the conv_device_clone() function.

         static void
 discovery_cb(conv_device_h device, int result, void *user_data)
 {
-    if (result == CONV_DISCOVERY_RESULT_SUCCESS) {
-        /* Discovered device */
-        char* device_id = NULL;
-        char* device_name = NULL;
-        char* device_type = NULL;
-
-        conv_device_get_property_string(device, CONV_DEVICE_ID, &device_id);
-        printf("device id = %s\n", device_id);
-        free(device_id);
-
-        conv_device_get_property_string(device, CONV_DEVICE_NAME, &device_name);
-        printf("device name = %s\n", device_name);
-        free(device_name);
-
-        conv_device_get_property_string(device, CONV_DEVICE_TYPE, &device_type);
-        printf("device TYPE = %s\n", device_type);
-        free(device_type);
-
-        /* Clone the device handle for use outside this callback */
-        conv_device_h clone_device;
-        conv_device_clone(device, &clone_device);
-    } else if (result == CONV_DISCOVERY_RESULT_FINISHED) {
-        /* Discovery has finished */
-        /* Do something */
-    } else if (result == CONV_DISCOVERY_RESULT_ERROR) {
-        /* Discovery has triggered an error */
-        /* Error handling */
-    }
+    if (result == CONV_DISCOVERY_RESULT_SUCCESS) {
+        /* Discovered device */
+        char* device_id = NULL;
+        char* device_name = NULL;
+        char* device_type = NULL;
+
+        conv_device_get_property_string(device, CONV_DEVICE_ID, &device_id);
+        printf("device id = %s\n", device_id);
+        free(device_id);
+
+        conv_device_get_property_string(device, CONV_DEVICE_NAME, &device_name);
+        printf("device name = %s\n", device_name);
+        free(device_name);
+
+        conv_device_get_property_string(device, CONV_DEVICE_TYPE, &device_type);
+        printf("device TYPE = %s\n", device_type);
+        free(device_type);
+
+        /* Clone the device handle for use outside this callback */
+        conv_device_h clone_device;
+        conv_device_clone(device, &clone_device);
+    } else if (result == CONV_DISCOVERY_RESULT_FINISHED) {
+        /* Discovery has finished */
+        /* Do something */
+    } else if (result == CONV_DISCOVERY_RESULT_ERROR) {
+        /* Discovery has triggered an error */
+        /* Error handling */
+    }
 }
 
 static void
 start_discovery_example()
 {
-    /* Create a convergence manager */
-    int error = conv_create(&conv_h);
-    if (error != CONV_ERROR_NONE)
-        /* Error handling */
-
-    /* Start discovery */
-    error = conv_discovery_start(conv_h, 30, discovery_cb, NULL);
-    if (error != CONV_ERROR_NONE)
-        /* Error handling */
+    /* Create a convergence manager */
+    int error = conv_create(&conv_h);
+    if (error != CONV_ERROR_NONE)
+        /* Error handling */
+
+    /* Start discovery */
+    error = conv_discovery_start(conv_h, 30, discovery_cb, NULL);
+    if (error != CONV_ERROR_NONE)
+        /* Error handling */
 }

        To stop the ongoing discovery process, call the conv_discovery_stop() function.

        3. -
      3. Get the list of services. +
      4. Get the list of services.

        The remaining part of the device handle is a list of services. Pull this information by using the conv_device_foreach_service() function:

         static void
 service_foreach_cb(conv_service_h service_handle, void *user_data)
 {
-    conv_service_e e = CONV_SERVICE_NONE;
+    conv_service_e e = CONV_SERVICE_NONE;
 
-    conv_service_get_type(service_handle, &e);
-    printf("service_get_type = %d\n", (int)e);
+    conv_service_get_type(service_handle, &e);
+    printf("service_get_type = %d\n", (int)e);
 
-    conv_service_h clone_service_handle;
-    conv_service_clone(service_handle, &clone_service_handle);
+    conv_service_h clone_service_handle;
+    conv_service_clone(service_handle, &clone_service_handle);
 }
 
 static void
 foreach_service_example()
 {
-    conv_device_h device = data;
-    conv_device_foreach_service(device, service_foreach_cb, NULL);
+    conv_device_h device = data;
+    conv_device_foreach_service(device, service_foreach_cb, NULL);
 }

        While iterating through the available services, the framework generates a new handle for each service and passes it to the conv_service_foreach_cb() type callback. To use the service handle outside the callback, clone it with the conv_service_clone() function.

        @@ -291,7 +291,7 @@ foreach_service_example() conv_service_connection_state_e state = CONV_SERVICE_CONNECTION_STATE_NONE; conv_service_get_connection_state(service_handle, &state); if (state == CONV_SERVICE_CONNECTION_STATE_NOT_CONNECTED) -    conv_service_connect(service_handle, callback, NULL); + conv_service_connect(service_handle, callback, NULL);

        You can check the connection state with the conv_service_get_connection() function, which returns one of values defined in the conv_service_connection_state_e enumeration (in mobile and wearable applications). If the service is not connected yet, the connection state is CONV_SERVICE_CONNECTION_STATE_NOT_CONNECTED and the service must be connected using the conv_service_connect() function.

        @@ -299,14 +299,14 @@ if (state == CONV_SERVICE_CONNECTION_STATE_NOT_CONNECTED) Note Repeated attempts to connect to an already connected service result in the invalid state error. Attempts to start, publish, read, or stop a disconnected service also result in the invalid state error.
    - +

    Technically, in case of the Wi-Fi network, when the framework runs the discovery procedure, all devices are already connected to the Access Point (AP), which means that the conv_service_get_connection_state() function always returns the Connected state and the conv_service_connect() function can be omitted. It is especially applied for the Tizen 3.0 convergence framework, which supports only Wi-Fi networks. In future versions with support for Bluetooth, Bluetooth Low Energy, or Wi-Fi Direct™, the connection procedure is mandatory. For the sake of future extensibility and compatibility, use the conv_service_connect() function even in Tizen 3.0.

    Initializing the App Communication Service

    To initialize the app communication service:

      -
    1. Register the listener callback with the conv_service_set_listener_cb() function. This function must be called only once, regardless of the number of used service channels. In the runtime, all payloads from all channels are delivered there. +
    2. Register the listener callback with the conv_service_set_listener_cb() function. This function must be called only once, regardless of the number of used service channels. In the runtime, all payloads from all channels are delivered there.
      Note @@ -319,61 +319,61 @@ if (state == CONV_SERVICE_CONNECTION_STATE_NOT_CONNECTED) /* Client side callback */ void listener_example(conv_service_h handle, conv_channel_h channel, int error, -                 conv_payload_h result, void *user_data) + conv_payload_h result, void *user_data) { -    char *result_type = NULL; -    char *payload_type = NULL; /* User-defined payload key */ - -    conv_payload_get_string(result, "result_type", &result_type); - -    if (!strcmp(result_type, "onConnect")) -        /* Do something for onConnect */ -    else if (!strcmp(result_type, "onStart")) -        /* Do something for onStart */ -    else if (!strcmp(result_type, "onPublish")) -        /* Do something for onPublish */ -    else if (!strcmp(result_type, "onStop")) -        /* Do something for onStop */ -    else if (!strcmp(result_type, "onDisconnect")) -        /* Do something for onDisconnect */ -    else if (!strcmp(result_type, "onClientDisconnect")) -        /* Do something for onClientDisconnect */ -    else if (!strcmp(result_type, "onRead")) -        /* Do something for onRead */ -    else -        /* Parsing user-defined portion of the payload */ + char *result_type = NULL; + char *payload_type = NULL; /* User-defined payload key */ + + conv_payload_get_string(result, "result_type", &result_type); + + if (!strcmp(result_type, "onConnect")) + /* Do something for onConnect */ + else if (!strcmp(result_type, "onStart")) + /* Do something for onStart */ + else if (!strcmp(result_type, "onPublish")) + /* Do something for onPublish */ + else if (!strcmp(result_type, "onStop")) + /* Do something for onStop */ + else if (!strcmp(result_type, "onDisconnect")) + /* Do something for onDisconnect */ + else if (!strcmp(result_type, "onClientDisconnect")) + /* Do something for onClientDisconnect */ + else if (!strcmp(result_type, "onRead")) + /* Do something for onRead */ + else + /* Parsing user-defined portion of the payload */ }

      The structure of the listener is the same for both server and client sides.

    3. If the application sends a payload using the conv_service_publish() function, the listener callback in the receiver side gets the following packet: 
      -"result_type": "onMessage"
-"from": unique ID of a client which sends the message
-"user_defined_key": custom user-defined key in the payload
+"result_type": "onMessage"
+"from": unique ID of a client which sends the message
+"user_defined_key": custom user-defined key in the payload

      The following example demonstrates how to process a custom payload:

       void
 custom_listener_example(conv_service_h handle, conv_channel_h channel,
-                        int error, conv_payload_h result, void *user_data)
+                        int error, conv_payload_h result, void *user_data)
 {
-    char *result_type = NULL;
-    char *payload_type = NULL; /* User-defined payload key */
-
-    conv_payload_get_string(result, "result_type", &result_type);
-
-    if (!strcmp(result_type, "onMessage")) {
-        /* Parsing user-defined portion of the payload */
-        conv_payload_get_string(result, "payload_type", &payload_type);
-        if (!strcmp(payload_type, "Good_News"))
-            /* Do something for the payload of the "Good News" type */
-        else if (!strcmp(payload_type, "Bad_News"))
-            /* Do something for the payload of the "Bad News" type */
-    }
+    char *result_type = NULL;
+    char *payload_type = NULL; /* User-defined payload key */
+
+    conv_payload_get_string(result, "result_type", &result_type);
+
+    if (!strcmp(result_type, "onMessage")) {
+        /* Parsing user-defined portion of the payload */
+        conv_payload_get_string(result, "payload_type", &payload_type);
+        if (!strcmp(payload_type, "Good_News"))
+            /* Do something for the payload of the "Good News" type */
+        else if (!strcmp(payload_type, "Bad_News"))
+            /* Do something for the payload of the "Bad News" type */
+    }
 }
      -

      The example assumes that the message has a custom payload_type key and a string value that takes 1 of 2 variants: "Good_News" and "Bad_News".

      +

      The example assumes that the message has a custom payload_type key and a string value that takes 1 of 2 variants: "Good_News" and "Bad_News".

      In addition to strings, you can use a raw byte array payload. The conv_payload_set_string(), conv_payload_get_string(), conv_payload_set_byte(), and conv_payload_get_byte() functions are useful for working with payload types.

      4. @@ -386,20 +386,20 @@ custom_listener_example(conv_service_h handle, conv_channel_h channel, static void server_application_initialization_example() { -    /* Creating an instance of the app communication service */ -    conv_service_create(&service_handle); -    conv_service_set_type(service_handle, CONV_SERVICE_APP_TO_APP_COMMUNICATION); - -    /* Specifying service channel */ -    /* Note, the URI value corresponds to URI of your server-side app */ -    conv_channel_create(&channel_handle); -    conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); -    conv_channel_set_string(channel_handle, "channel_id", "test"); - -    /* Starting the service */ -    /* Note that the listener must be set before starting the service */ -    conv_service_set_listener_cb(service_handle, server_message_listener, NULL); -    conv_service_start(service_handle, channel_handle, NULL); + /* Creating an instance of the app communication service */ + conv_service_create(&service_handle); + conv_service_set_type(service_handle, CONV_SERVICE_APP_TO_APP_COMMUNICATION); + + /* Specifying service channel */ + /* Note, the URI value corresponds to URI of your server-side app */ + conv_channel_create(&channel_handle); + conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); + conv_channel_set_string(channel_handle, "channel_id", "test"); + + /* Starting the service */ + /* Note that the listener must be set before starting the service */ + conv_service_set_listener_cb(service_handle, server_message_listener, NULL); + conv_service_start(service_handle, channel_handle, NULL); } @@ -411,17 +411,17 @@ server_application_initialization_example() int app_communication_start_client_example() { -    conv_service_connect(service_handle, connect_cb, NULL); + conv_service_connect(service_handle, connect_cb, NULL); -    conv_channel_h channel_handle = NULL; -    conv_channel_create(&channel_handle); -    conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); -    conv_channel_set_string(channel_handle, "channel_id", "test"); + conv_channel_h channel_handle = NULL; + conv_channel_create(&channel_handle); + conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); + conv_channel_set_string(channel_handle, "channel_id", "test"); -    conv_service_set_listener_cb(service_handle, message_listener, NULL); -    conv_service_start(service_handle, channel_handle, NULL); + conv_service_set_listener_cb(service_handle, message_listener, NULL); + conv_service_start(service_handle, channel_handle, NULL); -    conv_channel_destroy(channel_handle); + conv_channel_destroy(channel_handle); }

      The service must be connected to the remote device using the conv_service_connect() function. The service_handle in this example is the one that the client application discovered earlier. The connection callback is omitted in this example for simplicity. However, it is meaningful to carefully implement it and observe that the connection result is CONV_ERROR_NONE. The payload retrieved to the callback is typically empty.

      @@ -434,14 +434,14 @@ app_communication_start_client_example() int app_communication_stop_client_example() { -    conv_channel_h channel_handle = NULL; -    conv_channel_create(&channel_handle); -    conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); -    conv_channel_set_string(channel_handle, "channel_id", "test"); + conv_channel_h channel_handle = NULL; + conv_channel_create(&channel_handle); + conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); + conv_channel_set_string(channel_handle, "channel_id", "test"); -    conv_service_stop(service_handle, channel_handle, NULL); + conv_service_stop(service_handle, channel_handle, NULL); -    conv_channel_destroy(channel_handle); + conv_channel_destroy(channel_handle); } @@ -457,22 +457,22 @@ app_communication_stop_client_example() int publish_example() { -    conv_service_h service_handle = (conv_service_h)data; -    conv_channel_h channel_handle; -    conv_payload_h payload_handle; + conv_service_h service_handle = (conv_service_h)data; + conv_channel_h channel_handle; + conv_payload_h payload_handle; -    conv_channel_create(&channel_handle); -    conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); -    conv_channel_set_string(channel_handle, "channel_id", "test"); + conv_channel_create(&channel_handle); + conv_channel_set_string(channel_handle, "uri", "org.example.d2d_test"); + conv_channel_set_string(channel_handle, "channel_id", "test"); -    conv_payload_create(&payload_handle); -    conv_payload_set_string(payload_handle, "user_defined_key", "user_defined_value"); + conv_payload_create(&payload_handle); + conv_payload_set_string(payload_handle, "user_defined_key", "user_defined_value"); -    conv_service_publish(service_handle, channel_handle, payload_handle); -    /* or conv_service_read(service_handle, channel_handle, NULL); */ + conv_service_publish(service_handle, channel_handle, payload_handle); + /* or conv_service_read(service_handle, channel_handle, NULL); */ } -

      The channel used in this example is the same as described before. The conv_service_publish() function delivers the payload, composed of the "user_defined_key" and "user_defined_value" pairs, through the network to the remote server application where it is passed in the listener callback.

      +

      The channel used in this example is the same as described before. The conv_service_publish() function delivers the payload, composed of the "user_defined_key" and "user_defined_value" pairs, through the network to the remote server application where it is passed in the listener callback.

      In the app communication service, the conv_service_read() function is only a command to get the information about the clients connected to the same channel. The conv_service_read() is called with NULL payload and it does not require additional parameters. You can receive various information in the conv_service_read() function.

      @@ -485,64 +485,64 @@ publish_example()
    4. Register a listener callback.

      In the remote app control service, the application control, delivered to a remote device, is directly processed just like a local application control. It means that there is no need for a receiver to implement a special receiving routine in the remote device, and no need to register a listener callback on the receiver side. Instead, the listener callback is useful in the sender side to check whether the function is delivered to the remote device and processed correctly.

      -

      The following example shows a listener callback, which handled the result of the access control process related to the remote app control service. After the user of the remote device has decided to allow or deny access with the passcode, the user choice is delivered to the remote device with the "onStart" result type and predefined error types:

      -
      • If the passcode is entered correctly, the "onStart" returns with the CONV_ERROR_NONE value.
        • -
      • Otherwise, the "onStart" comes with the CONV_ERROR_INVALID_OPERATION value.
      +

      The following example shows a listener callback, which handled the result of the access control process related to the remote app control service. After the user of the remote device has decided to allow or deny access with the passcode, the user choice is delivered to the remote device with the "onStart" result type and predefined error types:

      +
      • If the passcode is entered correctly, the "onStart" returns with the CONV_ERROR_NONE value.
        • +
      • Otherwise, the "onStart" comes with the CONV_ERROR_INVALID_OPERATION value.
       static void
 service_result_callback(conv_service_h service_handle, conv_channel_h channel_handle,
-                        conv_error_e error, conv_payload_h result, void* user_data)
+                        conv_error_e error, conv_payload_h result, void* user_data)
 {
-    char *reply_result = NULL;
-    conv_payload_get_string(result, "result_type", &reply_result);
-    if (!strcmp(reply_result, "onStart")) {
-        if (error == CONV_ERROR_NONE) { 
-            /* Allowed */
-            conv_service_publish(service_handle, NULL, payload_handle);
-            conv_service_stop(service_handle, NULL, payload_handle);
-            conv_payload_destroy(payload_handle);
-            payload_handle = NULL;
-        } else if (error == CONV_ERROR_INVALID_OPERATION) {
-            /* Denied */
-            conv_service_stop(service_handle, NULL, payload_handle);
-            conv_payload_destroy(payload_handle);
-            payload_handle = NULL;
-        }
-    }
-    free(reply_result);
+    char *reply_result = NULL;
+    conv_payload_get_string(result, "result_type", &reply_result);
+    if (!strcmp(reply_result, "onStart")) {
+        if (error == CONV_ERROR_NONE) {
+            /* Allowed */
+            conv_service_publish(service_handle, NULL, payload_handle);
+            conv_service_stop(service_handle, NULL, payload_handle);
+            conv_payload_destroy(payload_handle);
+            payload_handle = NULL;
+        } else if (error == CONV_ERROR_INVALID_OPERATION) {
+            /* Denied */
+            conv_service_stop(service_handle, NULL, payload_handle);
+            conv_payload_destroy(payload_handle);
+            payload_handle = NULL;
+        }
+    }
+    free(reply_result);
 }
      5. -
    5. Start the remote app control service. +
    6. Start the remote app control service.

      After registering the listener callback, start the service with the service handle, obtained from the near-by device discovery previously. Build an application control handle in a payload to launch an application in a remote device.

      -

      The following example launches the "org.example.d2d_test" application:

      +

      The following example launches the "org.example.d2d_test" application:

       int
 app_control_service()
 {
-    conv_service_set_listener_cb(service_handle, message_listener, NULL);
-    conv_service_start(service_handle, NULL, NULL);
+    conv_service_set_listener_cb(service_handle, message_listener, NULL);
+    conv_service_start(service_handle, NULL, NULL);
 
-    conv_payload_h payload_handle;
-    conv_payload_create(&payload_handle);
+    conv_payload_h payload_handle;
+    conv_payload_create(&payload_handle);
 
-    app_control_h app_control = NULL;
-    app_control_create(&app_control);
-    app_control_set_app_id(app_control, "org.example.d2d_test");
-    app_control_set_operation(app_control, APP_CONTROL_OPERATION_MAIN);
+    app_control_h app_control = NULL;
+    app_control_create(&app_control);
+    app_control_set_app_id(app_control, "org.example.d2d_test");
+    app_control_set_operation(app_control, APP_CONTROL_OPERATION_MAIN);
 
-    conv_payload_set_app_control(payload_handle, "app_control", app_control);
-    conv_payload_set_string(payload_handle, "reply", "1");
+    conv_payload_set_app_control(payload_handle, "app_control", app_control);
+    conv_payload_set_string(payload_handle, "reply", "1");
 
-    conv_service_publish(service_handle, NULL, payload_handle);
+    conv_service_publish(service_handle, NULL, payload_handle);
 }
      -

      The application control handle can be built using the App Control functions. In the payload, there is a special "reply" string field, which indicates if an application control reply is returned after the sent application control is processed remotely. In other words, if "reply" is "1", the remote device processes the application control and sends the resulting application control to the original device. In this case, the listener callback in the original device waits for an application control reply. This can be useful in designing interactive applications, such as chatting applications, in which bi-directional interplay service is required. If "reply" is "0" or this field is omitted, no response is received in the listener.

      +

      The application control handle can be built using the App Control functions. In the payload, there is a special "reply" string field, which indicates if an application control reply is returned after the sent application control is processed remotely. In other words, if "reply" is "1", the remote device processes the application control and sends the resulting application control to the original device. In this case, the listener callback in the original device waits for an application control reply. This can be useful in designing interactive applications, such as chatting applications, in which bi-directional interplay service is required. If "reply" is "0" or this field is omitted, no response is received in the listener.

    Predefined Payload Fields

    - +

    To send payloads, you can use various functions: use the conv_service_start() function to start a service, the conv_service_read() function to read information of the remote device, the conv_service publish() function to send data or messages, and the conv_service_stop() function to stop the service. The app communication service recognizes several predefined payload fields, including the result_type, which are used to specify the payload type or the quick response of some functions. The service implicitly adds these fields to the payload.

    @@ -555,9 +555,9 @@ app_control_service()

    The success or failure result (including the correctness of the passcode input in the access control popup in the remote app control service) is delivered by the conv_error_e error parameter (in mobile and wearable applications) of the listener callback.

    Table: Predefined fields for the app communication service payloads

    - - - +
    + + @@ -565,59 +565,59 @@ app_control_service() - + @@ -625,12 +625,12 @@ app_control_service() @@ -651,30 +651,30 @@ app_control_service()
    Function Predefined payload field
    conv_service_start() Sent to the device that calls the function when connected to the remote server:
      -
    • "result_type": "onConnect"
      • -
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • -
    • "client_connect_time": Connection time
      • -
    • "client_id": Unique client ID
      • +
    • "result_type": "onConnect"
      • +
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • +
    • "client_connect_time": Connection time
      • +
    • "client_id": Unique client ID
    Sent to the device that calls the function when the application launch succeeds or fails:
      -
    • "result_type": "onStart"
      • +
    • "result_type": "onStart"
    Sent to other clients connected to the remote server:
      -
    • "result_type": "onClientConnect"
      • -
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • -
    • "client_connect_time": Connection time
      • -
    • "client_id": Unique client ID
      • +
    • "result_type": "onClientConnect"
      • +
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • +
    • "client_connect_time": Connection time
      • +
    • "client_id": Unique client ID
    conv_service_publish()"result_type": "onPublish""result_type": "onPublish"
    conv_service_stop() Sent to the device which calls the function when the server application stops:
      -
    • "result_type": "onStop"
      • +
    • "result_type": "onStop"
    Sent to the device which calls the function when disconnected from the remote server:
      -
    • "result_type": "onDisconnect"
      • -
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • -
    • "client_connect_time": Connection time
      • -
    • "client_id": Unique client ID
      • +
    • "result_type": "onDisconnect"
      • +
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • +
    • "client_connect_time": Connection time
      • +
    • "client_id": Unique client ID
    Sent to other clients connected to the remote server:
      -
    • "result_type": "onClientDisconnect"
      • -
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • -
    • "client_connect_time": Connection time
      • -
    • "client_id": Unique client ID
      • +
    • "result_type": "onClientDisconnect"
      • +
    • "client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.
      • +
    • "client_connect_time": Connection time
      • +
    • "client_id": Unique client ID
    conv_service_read()
      -
    • "result_type": "onRead"
      • -
    • "read_type": "getClients"
      • -
    • "client_list": json-array type client lists -

      [ {"client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.

      -

      "client_connect_time": Connection time

      -

      "client_id": Unique client ID

      +
    • "result_type": "onRead"
      • +
    • "read_type": "getClients"
      • +
    • "client_list": json-array type client lists +

      [ {"client_is_host": Whether the device is a server application (remote server). The possible values are 0 and 1.

      +

      "client_connect_time": Connection time

      +

      "client_id": Unique client ID

      }, ... ]

    @@ -642,8 +642,8 @@ app_control_service()     		Sent to other clients and server applications, registered listener callback:
      -
    • "result_type": "onMessage"
      • -
    • "from": Unique client ID which sends the message
      • +
    • "result_type": "onMessage"
      • +
    • "from": Unique client ID which sends the message

    Table: Predefined fields for receiving the remote app control service payloads

    - - - +
    + + - + - +
    Function Predefined fields
    conv_service_start()"result_type": "onStart""result_type": "onStart"
    conv_service_publish()
      -
    • "result_type": "onPublish"
      • -
    • "app_control_reply": Application control data, only valid if the receiver replied with an app_control, which means that the sender sent a payload with a "reply" of "1".
      • -
    • "app_control_request": Requested application control data, only valid if the receiver replied with an app_control value, which means that the sender sent a payload with a "reply" of "1".
      • -
    • "app_control_result": The app_control_result_e value for the request, only valid if the receiver replied with a value, which means that the sender sent a payload with a "reply" of "1".
      • +
    • "result_type": "onPublish"
      • +
    • "app_control_reply": Application control data, only valid if the receiver replied with an app_control, which means that the sender sent a payload with a "reply" of "1".
      • +
    • "app_control_request": Requested application control data, only valid if the receiver replied with an app_control value, which means that the sender sent a payload with a "reply" of "1".
      • +
    • "app_control_result": The app_control_result_e value for the request, only valid if the receiver replied with a value, which means that the sender sent a payload with a "reply" of "1".
    conv_service_stop()"result_type": "onStop""result_type": "onStop"
    diff --git a/org.tizen.guides/html/native/connectivity/download_n.htm b/org.tizen.guides/html/native/connectivity/download_n.htm index 5f2f11d..805d95d 100644 --- a/org.tizen.guides/html/native/connectivity/download_n.htm +++ b/org.tizen.guides/html/native/connectivity/download_n.htm @@ -25,7 +25,7 @@
  • Tizen 2.4 and Higher for Mobile

    • Content

    -
    - +

    Download

    You can create and manage one or more download requests at a time. Each download process goes through a set of states, and you can manage the process though the states with specific functions.

    - +

    This feature is supported in mobile applications only.

    - +

    The following figure illustrates the user scenario for the download:

    1. When the user wants to download a file, you can create a new download process, configure the download URL or destination, and launch the process.
    2. During the download, you can pause, resume, or stop the process programmatically, or as a response to user requests. In addition, you can monitor the progress of the download process.
    - -

    Figure: User scenario

    -

    User scenario

    + +

    Figure: User scenario

    +

    User scenario

    Download States

    - +

    The following figure illustrates the various download states (such as READY and DOWNLOADING), and the functions (such as download_start()) that cause transitions between the states. The download states are defined in the download_state_e enumerator.

    Each function can only be called when the download process is in a specific state. To avoid undefined behavior in the application, make sure that you handle every possible scenario in the code.

    -

    Figure: Download states

    -

    Download states

    +

    Figure: Download states

    +

    Download states

    When you stop the download:

    • Use the download_cancel() function. It changes the download state to DOWNLOAD_STATE_CANCELED. From this state, you can restart the download with the download_start() function.
    • After you stop a download, the download handle ID is stored for 48 hours (even if the device is powered off), allowing you to resume the download later on. If you have no need to resume the process later on, unload all data concerning the download handle from the memory with the download_destroy() function.
      • -
    +

    Prerequisites

    @@ -109,7 +109,7 @@ error = download_set_progress_cb(download_id, progress_cb, &content_size);
  • Set the download URL and destination.

    Before the download can be started, set the URL source path for the download:

    -error = download_set_url(download_id, "http://tizen.org";
+error = download_set_url(download_id, "http://tizen.org";

    You can also set the destination path and file name. If the values are not given, the default storage and an auto-generated file name are used. 

    @@ -117,7 +117,7 @@ char *data_path = app_get_data_path();
 error = download_set_destination(download_id, data_path);
 free(data_path);
 
-error = download_set_file_name(download_id, "downloaded_file.bin");
+error = download_set_file_name(download_id, "downloaded_file.bin");
  • Set the download options: @@ -150,15 +150,15 @@ error_code = download_get_network_type(download_id, &value);
  • When clicking a completed notification message, the proper application for playing the downloaded content is launched. If there is no proper application, an error message is shown at the status tray.
  • When clicking a failed notification message, the client application requesting the download is launched.
    • - + 
     app_control_h app_control = NULL;
 error = app_control_create(&app_control);
-error = app_control_set_app_id(app_control, "org.tizen.tutorialdownload");
+error = app_control_set_app_id(app_control, "org.tizen.tutorialdownload");
 error =
-    download_set_notification_app_control(download_id,
-                                          DOWNLOAD_NOTIFICATION_APP_CONTROL_TYPE_FAILED,
-                                          app_control);
+    download_set_notification_app_control(download_id,
+                                          DOWNLOAD_NOTIFICATION_APP_CONTROL_TYPE_FAILED,
+                                          app_control);
 
 download_notification_type_e noti_type = 0;
 char *title = NULL;
@@ -167,9 +167,9 @@ error = download_get_notification_type(download_id, &noti_type);
 error = download_get_notification_title(download_id, &title);
 error = download_get_notification_description(download_id, &desc);
 error =
-    download_get_notification_app_control(download_id,
-                                          DOWNLOAD_NOTIFICATION_APP_CONTROL_TYPE_FAILED,
-                                          &app_control);
+    download_get_notification_app_control(download_id,
+                                          DOWNLOAD_NOTIFICATION_APP_CONTROL_TYPE_FAILED,
+                                          &app_control);
 error = app_control_destroy(app_control);
    @@ -209,15 +209,15 @@ download_state_e state = 0; content_size = 0; error = download_get_state(download_id, &state); if (state == DOWNLOAD_STATE_DOWNLOADING) -    error = download_get_content_size(download_id, &content_size); + error = download_get_content_size(download_id, &content_size);
  • The received parameter of the progress_cb() callback function contains the size of the data received in bytes. In this example, print out the value and the total download size. 
     static void
 progress_cb(int download_id, unsigned long long received, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "received: %llu of %llu",
-               received, *((unsigned long long*)user_data));
+    dlog_print(DLOG_INFO, LOG_TAG, "received: %llu of %llu",
+               received, *((unsigned long long*)user_data));
 }
    • @@ -229,7 +229,7 @@ download_error_e error_val = 0; error = download_get_error(download_id, &error_val);

    The download_error_e enumeration defines the available error types.

    - +
  • Clean up.

    When the registered download is no longer needed (the downloading is finished or has been canceled), delete it using the download_destroy() function. In addition, unset all callback functions.

    @@ -237,7 +237,7 @@ download_unset_progress_cb(download_id);
 download_unset_state_changed_cb(download_id);
 error = download_destroy(download_id);
    • - +
    diff --git a/org.tizen.guides/html/native/connectivity/http_n.htm b/org.tizen.guides/html/native/connectivity/http_n.htm index 4476c4b..d3e4b40 100644 --- a/org.tizen.guides/html/native/connectivity/http_n.htm +++ b/org.tizen.guides/html/native/connectivity/http_n.htm @@ -30,7 +30,7 @@
  • Prerequisites
  • Managing Sessions
  • Managing Transactions
    • - +

    Related Info

    • HTTP API for Mobile Native
      • @@ -79,7 +79,7 @@ int ret = HTTP_ERROR_NONE; ret = http_init(); if (ret != HTTP_ERROR_NONE) -    printf("http_init failed: %d", ret); + printf("http_init failed: %d", ret);

      When no longer needed, deinitialize the HTTP functionality:

      @@ -88,7 +88,7 @@ int ret = HTTP_ERROR_NONE; ret = http_deinit(); if (ret != HTTP_ERROR_NONE) -    printf("http_deinit failed: %d", ret); + printf("http_deinit failed: %d", ret); @@ -101,7 +101,7 @@ if (ret != HTTP_ERROR_NONE)
    • The pipelining mode (HTTP_SESSION_MODE_PIPELINING) means that multiple transactions can be processed concurrently. This mode can reduce the network latency.

    - +

    To manage HTTP sessions:

    1. Create an HTTP session handle with the http_session_create() function: @@ -111,7 +111,7 @@ http_session_h session = NULL; ret = http_session_create(HTTP_SESSION_MODE_NORMAL, &session); if (ret != HTTP_ERROR_NONE) -    printf("http_session_create failed: %d", ret); + printf("http_session_create failed: %d", ret);
    2. Set the auto redirection for the session with the http_session_set_auto_redirection() function: @@ -121,7 +121,7 @@ bool auto_redirect = true; ret = http_session_set_auto_redirection(session, auto_redirect); if (ret != HTTP_ERROR_NONE) -    printf("http_session_set_auto_redirection failed: %d", ret); + printf("http_session_set_auto_redirection failed: %d", ret);
    3. When no longer needed, destroy all transactions and the session: @@ -130,11 +130,11 @@ int ret = HTTP_ERROR_NONE; ret = http_session_destroy_all_transactions(session); if (ret != HTTP_ERROR_NONE) -    printf("http_session_destroy_all_transactions failed: %d", ret); + printf("http_session_destroy_all_transactions failed: %d", ret); ret = http_session_destroy(&session); if (ret != HTTP_ERROR_NONE) -    printf("http_session_destroy failed: %d", ret); + printf("http_session_destroy failed: %d", ret);
    @@ -159,7 +159,7 @@ int ret = HTTP_ERROR_NONE; http_transaction_h transaction = NULL; ret = http_session_open_transaction(session, HTTP_METHOD_GET, &transaction); if (ret != HTTP_ERROR_NONE) -    printf("http_session_open_transaction failed: %d", ret); + printf("http_session_open_transaction failed: %d", ret);

    The transaction handle is used to manage the request and response.

    @@ -175,21 +175,21 @@ if (ret != HTTP_ERROR_NONE) /* Callback for receiving the response header */ void header_cb(http_transaction_h transaction, char* header, size_t header_len, -          void* user_data) {} + void* user_data) {} http_transaction_set_received_header_cb(transaction, header_cb, NULL); /* Callback for receiving the response body */ void body_cb(http_transaction_h transaction, char* body, size_t size, size_t nmemb, -        void* user_data) {} + void* user_data) {} http_transaction_set_received_body_cb(transaction, body_cb, NULL); /* Callback for monitoring data uploads */ void uploaded_cb(http_transaction_h transaction, char* body, int recommended_chunk, -            void* user_data) {} + void* user_data) {} http_transaction_set_uploaded_cb(transaction, uploaded_cb, NULL); @@ -212,11 +212,11 @@ http_transaction_set_aborted_cb(transaction, aborted_cb, NULL);
  • Set the request URI for the transaction: 
     int ret = HTTP_ERROR_NONE;
-char uri[1024] = "www.example.com";
+char uri[1024] = "www.example.com";
 
 ret = http_transaction_request_set_uri(transaction, uri);
 if (ret != HTTP_ERROR_NONE)
-    printf("http_transaction_request_set_uri failed: %d", ret);
+    printf("http_transaction_request_set_uri failed: %d", ret);
  • Set the request method: @@ -226,7 +226,7 @@ http_method_e method = HTTP_METHOD_GET; ret = http_transaction_request_set_method(transaction, method); if (ret != HTTP_ERROR_NONE) -    printf("http_transaction_request_set_method failed: %d", ret); + printf("http_transaction_request_set_method failed: %d", ret);
  • Set the HTTP version of the transaction: @@ -236,7 +236,7 @@ http_version_e version = HTTP_VERSION_1_1; ret = http_transaction_request_set_version(transaction, version); if (ret != HTTP_ERROR_NONE) -    printf("http_transaction_request_set_version failed: %d", ret); + printf("http_transaction_request_set_version failed: %d", ret);
  • Submit the transaction for the defined request URI: @@ -245,7 +245,7 @@ int ret = HTTP_ERROR_NONE; ret = http_transaction_submit(transaction); if (ret != HTTP_ERROR_NONE) -    printf("http_transaction_submit failed: %d", ret); + printf("http_transaction_submit failed: %d", ret);
    • @@ -260,7 +260,7 @@ http_status_code_e status_code = -1; ret = http_transaction_response_get_status_code(transaction, &status_code); if (ret != HTTP_ERROR_NONE) -    printf("http_transaction_response_get_status_code failed: %d", ret); + printf("http_transaction_response_get_status_code failed: %d", ret);
  • Get the status version of the submitted transaction: @@ -270,7 +270,7 @@ http_version_e version = -1; ret = http_transaction_response_get_version(transaction, &version); if (ret != HTTP_ERROR_NONE) -    printf("http_transaction_response_get_version failed: %d", ret); + printf("http_transaction_response_get_version failed: %d", ret);
    • @@ -281,7 +281,7 @@ int ret = HTTP_ERROR_NONE; ret = http_transaction_destroy(transaction); if (ret != HTTP_ERROR_NONE) -    printf("http_transaction_destroy failed: %d", ret); + printf("http_transaction_destroy failed: %d", ret); @@ -291,18 +291,18 @@ if (ret != HTTP_ERROR_NONE) 
     int ret = HTTP_ERROR_NONE;
 /* Request URI for HTTP GET */
-char uri[1024] = "www.example.com";
+char uri[1024] = "www.example.com";
 /*
    Request URI for HTTPS GET:
-   char uri[1024] = "https://httpbin.org/get";
+   char uri[1024] = "https://httpbin.org/get";
    Request URI and data for HTTP POST:
-   char uri[1024] = "http://posttestserver.com/post.php";
-   const char* post_msg = "name=tizen&project=http";
+   char uri[1024] = "http://posttestserver.com/post.php";
+   const char* post_msg = "name=tizen&project=http";
 */
 
 ret = http_session_create(HTTP_SESSION_MODE_NORMAL, &session);
 if (ret != HTTP_ERROR_NONE)
-    printf("http_session_create failed: %d", ret);
+    printf("http_session_create failed: %d", ret);
 
 /* Transaction for HTTP and HTTPS GET */
 ret = http_session_open_transaction(session, HTTP_METHOD_GET, &transaction);
@@ -311,11 +311,11 @@ ret = http_session_open_transaction(session, HTTP_METHOD_GET, &transaction);
    ret = http_session_open_transaction(session, HTTP_METHOD_POST, &transaction);
 */
 if (ret != HTTP_ERROR_NONE)
-    printf("http_session_open_transaction failed: %d", ret);
+    printf("http_session_open_transaction failed: %d", ret);
 
 ret = http_transaction_request_set_uri(transaction, uri);
 if (ret != HTTP_ERROR_NONE)
-    printf("http_transaction_request_set_uri failed: %d", ret);
+    printf("http_transaction_request_set_uri failed: %d", ret);
 
 /*
    Data management for HTTP POST:
@@ -325,7 +325,7 @@ if (ret != HTTP_ERROR_NONE)
 
 ret = http_transaction_submit(transaction);
 if (ret != HTTP_ERROR_NONE)
-    printf("http_transaction_submit failed: %d", ret);
+    printf("http_transaction_submit failed: %d", ret);
    diff --git a/org.tizen.guides/html/native/connectivity/internet_download_n.htm b/org.tizen.guides/html/native/connectivity/internet_download_n.htm index c657d76..bee8773 100644 --- a/org.tizen.guides/html/native/connectivity/internet_download_n.htm +++ b/org.tizen.guides/html/native/connectivity/internet_download_n.htm @@ -5,13 +5,13 @@ - + - Internet and Content Downloads + Internet and Content Downloads @@ -28,10 +28,10 @@

    Related Info

    -
    +

    Internet and Content Downloads

    @@ -64,7 +64,7 @@

    You can access Web pages and Web content in your application. You can also use various features for Web browsing, such as loading and displaying Web pages and navigating through the browsing history.

    - +
    diff --git a/org.tizen.guides/html/native/connectivity/iotcon_n.htm b/org.tizen.guides/html/native/connectivity/iotcon_n.htm index b6d0a94..94d1947 100644 --- a/org.tizen.guides/html/native/connectivity/iotcon_n.htm +++ b/org.tizen.guides/html/native/connectivity/iotcon_n.htm @@ -47,8 +47,8 @@

    IoTivity offers seamless device-to-device connectivity to address the emerging needs of the Internet of Things (IoT) through the open source reference implementation of the OCF (Open Connectivity Foundation) standard specifications. IoT connectivity (Iotcon) provides the means of using IoTivity in Tizen.

    -

    Figure: IoTivity in Tizen

    -

    IoTivity in Tizen

    +

    Figure: IoTivity in Tizen

    +

    IoTivity in Tizen

    IoT connectivity handles the resources between a server and client. The server is responsible for creating and providing resources, and the client can access and control those resources through requests.

    @@ -76,7 +76,7 @@

    You can use the client to get various information about the resource through the iotcon_remote_resource_h handle and the iotcon_remote_resource_get_XXX() functions. You can retrieve, for example, the resource URI path, host address, type, and interfaces. You can also retrieve the device ID, which defines the device to which the resource belongs. Different resources in the same device have the same device ID.

    -
  • CRUDN request and response +
  • CRUDN request and response

    The client can send various requests to the server resources using the Remote Resource API:

    • GET request: Use the iotcon_remote_resource_get() function to read the resource information and get a representation of the resource from the server.
      • @@ -87,19 +87,19 @@

      The server receives the request, processes it using the iotcon_request_handler_cb() callback, and sends a response to the client using the iotcon_response_send() function of the Response API (in mobile and wearable applications).

      The client can check the result and the response in the iotcon_remote_resource_response_cb() callback. If the result of the request differs from IOTCON_ERROR_NONE, the response information is not reliable.

      - -

      Figure: Requests and responses

      -

      Requests and responses

      + +

      Figure: Requests and responses

      +

      Requests and responses

      If the server resource is observable, the client can register a callback with the iotcon_remote_resource_observe_register() function of the Remote Resource API to observe the resource. When the resource state changes, the server notifies the client through the registered callback. Note that, depending on the network environment, the order in which the notifications are sent can be mixed. If the observe_policy (the second parameter of the registration function) is IOTCON_OBSERVE_IGNORE_OUT_OF_ORDER, the client only receives up-to-date notifications. Otherwise, it receives all notifications, including stale notifications.

      If the resource is not observable, the client cannot receive any notifications.

      -

      Figure: Observe and notify

      -

      Observe and notify

      +

      Figure: Observe and notify

      +

      Observe and notify

    • Resource representation -

      Resource representation is a snapshot of a resource at a particular time, representing the resource information exchanged in the request and response interactions between the server and client. The resource representation contains resource properties and the state of the resource.

      +

      Resource representation is a snapshot of a resource at a particular time, representing the resource information exchanged in the request and response interactions between the server and client. The resource representation contains resource properties and the state of the resource.

      To manage the representation, use the Representation API (in mobile and wearable applications):

        @@ -118,8 +118,8 @@

        To use the IoTCon API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

         <privileges>
-   <privilege>http://tizen.org/privilege/network.get</privilege>
-   <privilege>http://tizen.org/privilege/internet</privilege>
+   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/internet</privilege>
 </privileges>
        @@ -144,7 +144,7 @@ iotcon_deinitialize(); -

        Registering Resources

        +

        Registering Resources

        To create and register resources:

        @@ -152,16 +152,16 @@ iotcon_deinitialize();
      • Create the resource types using the iotcon_resource_types_create() function. The resource type string can be added using the iotcon_resource_types_add() function. 
         int ret;
-const char *res_type = "org.tizen.light";
+const char *res_type = "org.tizen.light";
 iotcon_resource_types_h res_types = NULL;
 
 ret = iotcon_resource_types_create(&res_types);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 ret = iotcon_resource_types_add(res_types, res_type);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
      • Register the resource by calling the iotcon_resource_create() function. @@ -171,13 +171,13 @@ if (IOTCON_ERROR_NONE != ret) 
         int res_interfaces = IOTCON_INTERFACE_DEFAULT;
 int res_properties = IOTCON_RESOURCE_DISCOVERABLE | IOTCON_RESOURCE_OBSERVABLE;
-const char *res_uri = "/light/1";
+const char *res_uri = "/light/1";
 iotcon_resource_h resource = NULL;
 
 ret = iotcon_resource_create(res_uri, res_types, res_interfaces, res_properties,
-                             _request_handler, NULL, &resource);
+                             _request_handler, NULL, &resource);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
      • When no longer needed, destroy the resource types handle using the iotcon_resource_types_destroy() function: @@ -187,31 +187,31 @@ iotcon_resource_types_destroy(resource_types);
        • -

        Finding Resources

        +

        Finding Resources

        To find resources:

          -
        1. To find a resource, call the iotcon_find_resource() function. +
        2. To find a resource, call the iotcon_find_resource() function.

          In the function, set the host address, connectivity type (an iotcon_connectivity_type_e enumeration value in mobile and wearable applications), query, secure flag, and the found callback function called whenever the resource is found during the timeout.

          The host address can be IOTCON_MULTICAST_ADDRESS for multicast.

           int ret;
 iotcon_query_h query;
-const char *res_type = "org.tizen.light";
+const char *res_type = "org.tizen.light";
 
 ret = iotcon_query_create(&query);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 ret = iotcon_query_set_resource_type(query, res_type);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 ret = iotcon_find_resource(IOTCON_MULTICAST_ADDRESS,
-                           IOTCON_CONNECTIVITY_IP | IOTCON_CONNECTIVITY_PREFER_UDP,
-                           res_type, query, _found_cb, NULL);
+                           IOTCON_CONNECTIVITY_IP | IOTCON_CONNECTIVITY_PREFER_UDP,
+                           res_type, query, _found_cb, NULL);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
        3. To get the remote resource handle information, use the found callback registered in the iotcon_find_resource() function: @@ -219,22 +219,22 @@ if (IOTCON_ERROR_NONE != ret) static bool _found_cb(iotcon_remote_resource_h resource, iotcon_error_e err, void *user_data) { -    int ret; -    char *address; -    char *uri_path; - -    if (IOTCON_ERROR_NONE != err) -        /* Error handling */ - -    ret = iotcon_remote_resource_get_host_address(resource, &address); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ -    dlog_print(DLOG_DEBUG, LOG_TAG, "host_address: %s", address); - -    ret = iotcon_remote_resource_get_uri_path(resource, &uri_path); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ -    dlog_print(DLOG_DEBUG, LOG_TAG, "uri_path: %s", uri_path); + int ret; + char *address; + char *uri_path; + + if (IOTCON_ERROR_NONE != err) + /* Error handling */ + + ret = iotcon_remote_resource_get_host_address(resource, &address); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + dlog_print(DLOG_DEBUG, LOG_TAG, "host_address: %s", address); + + ret = iotcon_remote_resource_get_uri_path(resource, &uri_path); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + dlog_print(DLOG_DEBUG, LOG_TAG, "uri_path: %s", uri_path); } @@ -244,13 +244,13 @@ _found_cb(iotcon_remote_resource_h resource, iotcon_error_e err, void *user_data The callback parameters are valid only within the callback function. Use the clone handle, if you want to use a parameter after the callback function.
    • -
  • To set the timeout interval (in seconds) for the asynchronous functions of the Client (in mobile and wearable applications) and Remote Resource (in mobile and wearable applications) APIs, use the iotcon_set_timeout() function: +
  • To set the timeout interval (in seconds) for the asynchronous functions of the Client (in mobile and wearable applications) and Remote Resource (in mobile and wearable applications) APIs, use the iotcon_set_timeout() function: 
     int ret;
 
 ret = iotcon_set_timeout(10);
 if (IOTCON_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
    @@ -269,7 +269,7 @@ if (IOTCON_ERROR_NONE != ret)
    • -

    Sending GET Requests

    +

    Sending GET Requests

    To send GET requests to a server:

    @@ -281,14 +281,14 @@ static iotcon_remote_resource_h _light_resource = NULL; static bool _found_cb(iotcon_remote_resource_h resource, iotcon_error_e err, void *user_data) { -    int ret; + int ret; -    if (IOTCON_ERROR_NONE != err) -        /* Error handling */ + if (IOTCON_ERROR_NONE != err) + /* Error handling */ -    ret = iotcon_remote_resource_clone(resource, &_light_resource); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_remote_resource_clone(resource, &_light_resource); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ } @@ -299,7 +299,7 @@ int ret; ret = iotcon_remote_resource_get(_light_resource, NULL, _on_get, NULL); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */
  • On the server side, the _request_handler() callback function is called when a request arrives from the client. The resource and request handles are passed to the callback. @@ -308,28 +308,28 @@ if (IOTCON_ERROR_NONE != ret) static void _request_handler(iotcon_resource_h resource, iotcon_request_h request, void *data) { -    int ret; -    iotcon_request_type_e req_type; -    iotcon_response_result_e result = IOTCON_RESPONSE_ERROR; -    iotcon_representation_h repr = NULL; - -    ret = iotcon_request_get_type(request, &req_type); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ - -    switch (req_type) { -    case IOTCON_REQUEST_GET: -        ret = _get_repr(resource, &repr); -        if (0 == ret) -            result = IOTCON_RESPONSE_OK; -        break; -    default: -        dlog_print(DLOG_DEBUG, LOG_TAG, "type: %d", req_type); -    } - -    _send_response(request, repr, result); -    if (repr) -        iotcon_representation_destroy(repr); + int ret; + iotcon_request_type_e req_type; + iotcon_response_result_e result = IOTCON_RESPONSE_ERROR; + iotcon_representation_h repr = NULL; + + ret = iotcon_request_get_type(request, &req_type); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + + switch (req_type) { + case IOTCON_REQUEST_GET: + ret = _get_repr(resource, &repr); + if (0 == ret) + result = IOTCON_RESPONSE_OK; + break; + default: + dlog_print(DLOG_DEBUG, LOG_TAG, "type: %d", req_type); + } + + _send_response(request, repr, result); + if (repr) + iotcon_representation_destroy(repr); }
    • @@ -340,73 +340,73 @@ static int _light_brightness; int _get_repr(iotcon_resource_h resource, iotcon_representation_h *representation) { -    int ret; -    char *uri_path; -    int interfaces; -    iotcon_resource_types_h res_types; -    iotcon_attributes_h attr; -    iotcon_representation_h repr; + int ret; + char *uri_path; + int interfaces; + iotcon_resource_types_h res_types; + iotcon_attributes_h attr; + iotcon_representation_h repr; -    ret = iotcon_representation_create(&repr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_representation_create(&repr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_attributes_create(&attr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_attributes_create(&attr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_resource_get_uri_path(resource, &uri_path); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_resource_get_uri_path(resource, &uri_path); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_representation_set_uri_path(repr, uri_path); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_representation_set_uri_path(repr, uri_path); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_attributes_add_int(attr, "brightness", _light_brightness); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_attributes_add_int(attr, "brightness", _light_brightness); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_representation_set_attributes(repr, attr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ -    iotcon_attributes_destroy(attr); + ret = iotcon_representation_set_attributes(repr, attr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + iotcon_attributes_destroy(attr); -    *representation = repr; + *representation = repr; -    return 0; + return 0; }
  • To send a response to the client, use the iotcon_response_send() function. -

    In the function, set the response handle that can include the mandatory response result and optional representation.

    +

    In the function, set the response handle that can include the mandatory response result and optional representation.

     void
 _send_response(iotcon_request_h request, iotcon_representation_h repr,
-               iotcon_response_result_e result)
+               iotcon_response_result_e result)
 {
-    int ret;
-    iotcon_response_h resp;
+    int ret;
+    iotcon_response_h resp;
 
-    ret = iotcon_response_create(request, &resp);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
+    ret = iotcon_response_create(request, &resp);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
 
-    ret = iotcon_response_set_result(resp, result);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
+    ret = iotcon_response_set_result(resp, result);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
 
-    if (repr) {
-        ret = iotcon_response_set_representation(resp, repr);
-        if (IOTCON_ERROR_NONE != ret)
-            /* Error handling */
-    }
+    if (repr) {
+        ret = iotcon_response_set_representation(resp, repr);
+        if (IOTCON_ERROR_NONE != ret)
+            /* Error handling */
+    }
 
-    ret = iotcon_response_send(resp);
-    if (IOTCON_ERROR_NONE != ret) 
-        /* Error handling */
+    ret = iotcon_response_send(resp);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
 
-    iotcon_response_destroy(resp);
+    iotcon_response_destroy(resp);
 }
    • @@ -415,44 +415,44 @@ _send_response(iotcon_request_h request, iotcon_representation_h repr, static void _parse_representation(iotcon_representation_h repr) { -    int ret; -    int brightness; -    iotcon_attributes_h attr = NULL; - -    ret = iotcon_representation_get_attributes(repr, &attr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ - -    ret = iotcon_attributes_get_int(attr, "brightness", &brightness); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ -    dlog_print(DLOG_DEBUG, LOG_TAG, "Brightness: %d", brightness); + int ret; + int brightness; + iotcon_attributes_h attr = NULL; + + ret = iotcon_representation_get_attributes(repr, &attr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + + ret = iotcon_attributes_get_int(attr, "brightness", &brightness); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + dlog_print(DLOG_DEBUG, LOG_TAG, "Brightness: %d", brightness); } static void _on_get(iotcon_remote_resource_h resource, iotcon_error_e err, -        iotcon_request_type_e request_type, -        iotcon_response_h response, void *user_data) + iotcon_request_type_e request_type, + iotcon_response_h response, void *user_data) { -    int ret; -    iotcon_representation_h repr; -    iotcon_response_result_e result; + int ret; + iotcon_representation_h repr; + iotcon_response_result_e result; -    if (IOTCON_ERROR_NONE != err) -        /* Error handling */ + if (IOTCON_ERROR_NONE != err) + /* Error handling */ -    ret = iotcon_response_get_result(response, &result); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_response_get_result(response, &result); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    if (IOTCON_RESPONSE_OK != result) -        /* Error handling */ + if (IOTCON_RESPONSE_OK != result) + /* Error handling */ -    ret = iotcon_response_get_representation(response, &repr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_response_get_representation(response, &repr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    _parse_representation(repr); + _parse_representation(repr); } @@ -471,24 +471,24 @@ iotcon_attributes_h attr; ret = iotcon_representation_create(&repr); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ ret = iotcon_attributes_create(&attr); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ -ret = iotcon_attributes_add_int(attr, "brightness", 20); +ret = iotcon_attributes_add_int(attr, "brightness", 20); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ ret = iotcon_representation_set_attributes(repr, attr); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ iotcon_attributes_destroy(attr); ret = iotcon_remote_resource_put(_light_resource, repr, NULL, _on_put, NULL); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ iotcon_representation_destroy(repr); @@ -499,53 +499,53 @@ iotcon_representation_destroy(repr); static void _handle_put(iotcon_request_h request) { -    int ret; -    int value; -    iotcon_representation_h repr; -    iotcon_attributes_h attr; + int ret; + int value; + iotcon_representation_h repr; + iotcon_attributes_h attr; -    ret = iotcon_request_get_representation(request, &repr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_request_get_representation(request, &repr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_representation_get_attributes(repr, &attr); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_representation_get_attributes(repr, &attr); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    ret = iotcon_attributes_get_bool(attr, "brightness", &value); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ + ret = iotcon_attributes_get_bool(attr, "brightness", &value); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ -    _light_brightness = value; + _light_brightness = value; } static void _request_handler(iotcon_resource_h resource, iotcon_request_h request, void *data) { -    int ret; -    iotcon_request_type_e req_type; -    iotcon_response_result_e result = IOTCON_RESPONSE_ERROR; -    iotcon_representation_h repr = NULL; - -    ret = iotcon_request_get_request_type(request, &req_type); -    if (IOTCON_ERROR_NONE != ret) -        /* Error handling */ - -    switch (req_type) { -    case IOTCON_REQUEST_PUT: -        _handle_put(request); -        ret = _get_repr(resource, &repr); -        if (0 == ret) -            result = IOTCON_RESPONSE_OK; -        break; -    default: -        dlog_print(DLOG_DEBUG, LOG_TAG, "type: %d", req_type); -    } - -    _send_response(request, repr, result); -    if (repr) - -        iotcon_representation_destroy(repr); + int ret; + iotcon_request_type_e req_type; + iotcon_response_result_e result = IOTCON_RESPONSE_ERROR; + iotcon_representation_h repr = NULL; + + ret = iotcon_request_get_request_type(request, &req_type); + if (IOTCON_ERROR_NONE != ret) + /* Error handling */ + + switch (req_type) { + case IOTCON_REQUEST_PUT: + _handle_put(request); + ret = _get_repr(resource, &repr); + if (0 == ret) + result = IOTCON_RESPONSE_OK; + break; + default: + dlog_print(DLOG_DEBUG, LOG_TAG, "type: %d", req_type); + } + + _send_response(request, repr, result); + if (repr) + + iotcon_representation_destroy(repr); } @@ -553,33 +553,33 @@ _request_handler(iotcon_resource_h resource, iotcon_request_h request, void *dat 
     static void
 _on_put(iotcon_remote_resource_h resource, iotcon_error_e err,
-        iotcon_request_type_e request_type, iotcon_response_h response, void *user_data)
+        iotcon_request_type_e request_type, iotcon_response_h response, void *user_data)
 {
-    int ret;
-    iotcon_representation_h repr;
-    iotcon_response_result_e result;
+    int ret;
+    iotcon_representation_h repr;
+    iotcon_response_result_e result;
 
-    if (IOTCON_ERROR_NONE != err)
-        /* Error handling */
+    if (IOTCON_ERROR_NONE != err)
+        /* Error handling */
 
-    ret = iotcon_response_get_result(response, &result);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
+    ret = iotcon_response_get_result(response, &result);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
 
-    if (IOTCON_RESPONSE_OK != result)
-        /* Error handling */
+    if (IOTCON_RESPONSE_OK != result)
+        /* Error handling */
 
-    ret = iotcon_response_get_representation(response, &repr);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
+    ret = iotcon_response_get_representation(response, &repr);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
 
-    _parse_representation(repr);
+    _parse_representation(repr);
 }
    -

    Observing Resources

    +

    Observing Resources

    To monitor the changes in a resource:

      @@ -588,63 +588,63 @@ _on_put(iotcon_remote_resource_h resource, iotcon_error_e err, int ret; ret = iotcon_remote_resource_observe_register(_light_resource, -                                              IOTCON_OBSERVE_IGNORE_OUT_OF_ORDER, -                                              NULL, _observe_cb, NULL); + IOTCON_OBSERVE_IGNORE_OUT_OF_ORDER, + NULL, _observe_cb, NULL); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ -
    1. On the server side, the request handler callback is called when the observe request arrives from the client. To manage the observers, use the iotcon_observers_h handle. +
    2. On the server side, the request handler callback is called when the observe request arrives from the client. To manage the observers, use the iotcon_observers_h handle. 
       static iotcon_observers_h _observers;
 
 static void
 _handle_observe(iotcon_request_h request, bool is_register)
 {
-    int ret;
-    int observe_id;
-
-    ret = iotcon_request_get_observe_id(request, &observe_id);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
-
-    if (is_register) {
-        if (NULL == _observers) {
-            ret = iotcon_observers_create(&_observers);
-            if (IOTCON_ERROR_NONE != ret)
-                /* Error handling */
-        }
-        ret = iotcon_observers_add(_observers, observe_id);
-        if (IOTCON_ERROR_NONE != ret)
-            /* Error handling */
-    } else {
-        ret = iotcon_observers_remove(_observers, observe_id);
-        if (IOTCON_ERROR_NONE != ret)
-            /* Error handling */
-    }
+    int ret;
+    int observe_id;
+
+    ret = iotcon_request_get_observe_id(request, &observe_id);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
+
+    if (is_register) {
+        if (NULL == _observers) {
+            ret = iotcon_observers_create(&_observers);
+            if (IOTCON_ERROR_NONE != ret)
+                /* Error handling */
+        }
+        ret = iotcon_observers_add(_observers, observe_id);
+        if (IOTCON_ERROR_NONE != ret)
+            /* Error handling */
+    } else {
+        ret = iotcon_observers_remove(_observers, observe_id);
+        if (IOTCON_ERROR_NONE != ret)
+            /* Error handling */
+    }
 }
 
 static void
 _request_handler(iotcon_resource_h resource, iotcon_request_h request, void *data)
 {
-    int ret;
-    iotcon_observe_type_e observe_type;
-
-    ret = iotcon_request_get_observe_type(request, &observe_type);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
-
-    switch (observe_type) {
-    case IOTCON_OBSERVE_REGISTER:
-        _handle_observe(request, true);
-        break;
-    case IOTCON_OBSERVE_DEREGISTER:
-        _handle_observe(request, false);
-        break;
-    case IOTCON_OBSERVE_NO_TYPE:
-    default:
-        dlog_print(DLOG_DEBUG, LOG_TAG, "type: %d", observe_type);
-    }
+    int ret;
+    iotcon_observe_type_e observe_type;
+
+    ret = iotcon_request_get_observe_type(request, &observe_type);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
+
+    switch (observe_type) {
+    case IOTCON_OBSERVE_REGISTER:
+        _handle_observe(request, true);
+        break;
+    case IOTCON_OBSERVE_DEREGISTER:
+        _handle_observe(request, false);
+        break;
+    case IOTCON_OBSERVE_NO_TYPE:
+    default:
+        dlog_print(DLOG_DEBUG, LOG_TAG, "type: %d", observe_type);
+    }
 }
      3. @@ -655,33 +655,33 @@ iotcon_representation_h repr = NULL; ret = _get_repr(resource, &repr); if (0 != ret) -    /* Error handling */ + /* Error handling */ ret = iotcon_resource_notify(resource, _observers, repr, IOTCON_QOS_HIGH); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ if (repr) -    iotcon_representation_destroy(repr); + iotcon_representation_destroy(repr);
    3. On the client side, the _observe_cb() callback is called when the notify function is called from the server side. The remote resource handle, sequence number, and response handle are passed to the callback. 
       static void
 _observe_cb(iotcon_remote_resource_h resource, iotcon_error_e err,
-            int sequence_number, iotcon_response_h response, void *user_data)
+            int sequence_number, iotcon_response_h response, void *user_data)
 {
-    int ret;
-    iotcon_representation_h repr;
+    int ret;
+    iotcon_representation_h repr;
 
-    if (IOTCON_ERROR_NONE != err)
-        /* Error handling */
-    dlog_print(DLOG_DEBUG, LOG_TAG, "sequence: %d", sequence_number);
+    if (IOTCON_ERROR_NONE != err)
+        /* Error handling */
+    dlog_print(DLOG_DEBUG, LOG_TAG, "sequence: %d", sequence_number);
 
-    ret = iotcon_response_get_representation(response, &repr);
-    if (IOTCON_ERROR_NONE != ret)
-        /* Error handling */
+    ret = iotcon_response_get_representation(response, &repr);
+    if (IOTCON_ERROR_NONE != ret)
+        /* Error handling */
 
-    _parse_representation(repr);
+    _parse_representation(repr);
 }
      4. @@ -691,7 +691,7 @@ int ret; ret = iotcon_remote_resource_observe_deregister(_light_resource); if (IOTCON_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */
    diff --git a/org.tizen.guides/html/native/connectivity/mtp_n.htm b/org.tizen.guides/html/native/connectivity/mtp_n.htm index c4e2db5..8e98f5d 100644 --- a/org.tizen.guides/html/native/connectivity/mtp_n.htm +++ b/org.tizen.guides/html/native/connectivity/mtp_n.htm @@ -57,7 +57,7 @@ @@ -71,17 +71,17 @@

    The MTP Device Information API allows you to obtain various device details, such as the device manufacturer name, model name, serial number, and version.

  • Retrieving storage information

    The MTP Storage Information API allows you to obtain various storage details, such as the storage free space, description, and type.

    • -
  • Retrieving object information +
  • Retrieving object information

    The MTP Object Information API allows you to obtain various object details, such as the object format, name, and size.

    • The MTP API can be used in other profiles, but it is most popular in the TV profile.

    The internal implementation of the MTP references the MTP specification and uses LIBMTP.

    - +
    Note - Currently, the MTP API has the following limitations in Tizen 3.0: + Currently, the MTP API has the following limitations in Tizen 3.0:
    • Only the PTP subset of the MTP is supported.
    • The transportation layer is possible only through USB.
    @@ -94,11 +94,11 @@

    To use the MTP API, the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/mtp</privilege>
-   <!--To store a file if the input or output path leads to a media storage-->
-   <privilege>http://tizen.org/privilege/mediastorage</privilege>
-   <!--To store a file if the input or output path leads to an external storage-->
-   <privilege>http://tizen.org/privilege/externalstorage</privilege>
+   <privilege>http://tizen.org/privilege/mtp</privilege>
+   <!--To store a file if the input or output path leads to a media storage-->
+   <privilege>http://tizen.org/privilege/mediastorage</privilege>
+   <!--To store a file if the input or output path leads to an external storage-->
+   <privilege>http://tizen.org/privilege/externalstorage</privilege>
 </privileges>
    @@ -115,15 +115,15 @@ int manager_test_initialize(void) { -    int ret = 0; + int ret = 0; -    ret = mtp_initialize(); -    if (ret == MTP_ERROR_NONE) -        dlog_print("Initialize successful"); -    else -        dlog_print("Initialize failed, ret [%d]", ret); + ret = mtp_initialize(); + if (ret == MTP_ERROR_NONE) + dlog_print("Initialize successful"); + else + dlog_print("Initialize failed, ret [%d]", ret); -    return ret; + return ret; } @@ -133,12 +133,12 @@ manager_test_initialize(void) int manager_test_deinitialize(void) { -    int ret = 0; + int ret = 0; -    ret = mtp_deinitialize(); -    dlog_print("ret[%d]: deinitialize", ret); + ret = mtp_deinitialize(); + dlog_print("ret[%d]: deinitialize", ret); -    return ret; + return ret; } @@ -148,52 +148,52 @@ manager_test_deinitialize(void)

    To get the MTP devices connected to the MTP initiator, retrieve the MTP device list with the mtp_get_devices() function.

    -

    To select the device you want, retrieve information about the devices in the device list with the mtp_deviceinfo_get_XXX() functions. The following example retrieves the manufacturer (for example, "Samsung Electronics Co., Ltd.") and model name (for example, "SM-A700L") for each device in the list.

    +

    To select the device you want, retrieve information about the devices in the device list with the mtp_deviceinfo_get_XXX() functions. The following example retrieves the manufacturer (for example, "Samsung Electronics Co., Ltd.") and model name (for example, "SM-A700L") for each device in the list.

     int
 manager_test_get_devices(void)
 {
-    int i;
-    int ret = 0;
-    int bus_location = 0;
-    int device_number = 0;
-    int device_count;
-    mtp_device_h *mtp_devices = NULL;
-    char *name = NULL;
+    int i;
+    int ret = 0;
+    int bus_location = 0;
+    int device_number = 0;
+    int device_count;
+    mtp_device_h *mtp_devices = NULL;
+    char *name = NULL;
 
-    ret = mtp_get_devices(&mtp_devices, &device_count);
+    ret = mtp_get_devices(&mtp_devices, &device_count);
 
-    if (ret != MTP_ERROR_NONE) {
-        dlog_print("mtp_get_devices failed!!!");
+    if (ret != MTP_ERROR_NONE) {
+        dlog_print("mtp_get_devices failed!!!");
 
-        return -1;
-    }
+        return -1;
+    }
 
-    if (device_count == 0) {
-        dlog_print("device does not exist!!!");
-        END();
+    if (device_count == 0) {
+        dlog_print("device does not exist!!!");
+        END();
 
-        return -1;
-    }
+        return -1;
+    }
 
-    for (i = 0; i < device_count; i++) {
-        dlog_print("mtp_device[%d] handle - %d", i, mtp_devices[i]);
-        ret = mtp_deviceinfo_get_manufacturer_name(mtp_devices[i], &name);
-        g_free(name);
-        ret = mtp_deviceinfo_get_model_name(mtp_devices[i], &name);
-        g_free(name);
-    }
+    for (i = 0; i < device_count; i++) {
+        dlog_print("mtp_device[%d] handle - %d", i, mtp_devices[i]);
+        ret = mtp_deviceinfo_get_manufacturer_name(mtp_devices[i], &name);
+        g_free(name);
+        ret = mtp_deviceinfo_get_model_name(mtp_devices[i], &name);
+        g_free(name);
+    }
 
-    dlog_print("Select first device");
+    dlog_print("Select first device");
 
-    mtp_device = mtp_devices[0];
+    mtp_device = mtp_devices[0];
 
-    dlog_print("ret[%d]: 1st mtp device [%d]", ret, mtp_device);
+    dlog_print("ret[%d]: 1st mtp device [%d]", ret, mtp_device);
 
-    END();
+    END();
 
-    return ret;
+    return ret;
 }
    @@ -209,16 +209,16 @@ mtp_device_h mtp_device; /* Get this variable using mtp_get_devices() */ int deviceinfo_test_get_serialnumber(void) { -    int ret = 0; -    char *serial_number = NULL; + int ret = 0; + char *serial_number = NULL; -    ret = mtp_deviceinfo_get_serial_number(mtp_device, &serial_number); -    dlog_print("ret[%d]: serialnumber[%s]", ret, serial_number); + ret = mtp_deviceinfo_get_serial_number(mtp_device, &serial_number); + dlog_print("ret[%d]: serialnumber[%s]", ret, serial_number); -    if (serial_number == NULL) -        free(serial_number); + if (serial_number == NULL) + free(serial_number); -    return ret; + return ret; } @@ -237,24 +237,24 @@ mtp_device_h mtp_device; /* Get this variable using mtp_get_devices() */ int manager_test_get_storages(void) { -    mtp_storage_h *mtp_storages = NULL; + mtp_storage_h *mtp_storages = NULL; -    ret = mtp_get_storages(mtp_device, &mtp_storages, &storage_count); -    dlog_print("ret[%d]: storage_count[%d]", ret, storage_count); + ret = mtp_get_storages(mtp_device, &mtp_storages, &storage_count); + dlog_print("ret[%d]: storage_count[%d]", ret, storage_count); -    if (storage_count == 0) { -        dlog_print("storage does not exist!!!"); + if (storage_count == 0) { + dlog_print("storage does not exist!!!"); -        return -1; -    } + return -1; + } -    for (i = 0; i < storage_count; i++) -        dlog_print("mtp storage %d [%d]", i, mtp_storages[i]); + for (i = 0; i < storage_count; i++) + dlog_print("mtp storage %d [%d]", i, mtp_storages[i]); -    if (mtp_storages != NULL) -        free(mtp_storages); + if (mtp_storages != NULL) + free(mtp_storages); -    return ret; + return ret; } @@ -271,16 +271,16 @@ mtp_storage_h mtp_storage; /* Get this variable using mtp_get_storages() */ int storageinfo_test_get_description(void) { -    int ret = 0; -    char *description = NULL; + int ret = 0; + char *description = NULL; -    ret = mtp_storageinfo_get_description(mtp_device, mtp_storage, &description); -    dlog_print("ret[%d]: description[%s]", ret, description); + ret = mtp_storageinfo_get_description(mtp_device, mtp_storage, &description); + dlog_print("ret[%d]: description[%s]", ret, description); -    if (description != NULL) -        free(description); + if (description != NULL) + free(description); -    return ret; + return ret; } @@ -303,32 +303,32 @@ mtp_storage_h mtp_storage; int manager_test_get_object_handles(void) { -    mtp_object_h *folder_list; -    mtp_object_h *file_list; -    int folder_count; -    int file_count; - -    ret = mtp_get_object_handles(mtp_device, mtp_storage, MTP_FILETYPE_FOLDER, -                                 0, &folder_list, &folder_count); -    dlog_print("ret[%d]: folder_count in root [%d]", ret, folder_count); - -    for (i = 0; i < folder_count; i++) { -        ret = mtp_objectinfo_get_file_name(mtp_device, folder_list[i], &folder_name); -        dlog_print("ret[%d]: object handle [%d], folder name [%s]", -                   ret, folder_list[i], folder_name); -    } - -    ret = mtp_get_object_handles(mtp_device, mtp_storage, MTP_FILETYPE_JPEG, -                                 mtp_object, &file_list, &file_count); -    dlog_print("ret[%d]: file_count in root [%d]", ret, file_count); - -    for (i = 0; i < file_count; i++) { -        ret = mtp_objectinfo_get_file_name(mtp_device, file_list[i], &file_name); -        dlog_print("ret[%d]: object handle [%d] file name [%s]", -                   ret, file_list[i], file_name); -    } - -    return ret; + mtp_object_h *folder_list; + mtp_object_h *file_list; + int folder_count; + int file_count; + + ret = mtp_get_object_handles(mtp_device, mtp_storage, MTP_FILETYPE_FOLDER, + 0, &folder_list, &folder_count); + dlog_print("ret[%d]: folder_count in root [%d]", ret, folder_count); + + for (i = 0; i < folder_count; i++) { + ret = mtp_objectinfo_get_file_name(mtp_device, folder_list[i], &folder_name); + dlog_print("ret[%d]: object handle [%d], folder name [%s]", + ret, folder_list[i], folder_name); + } + + ret = mtp_get_object_handles(mtp_device, mtp_storage, MTP_FILETYPE_JPEG, + mtp_object, &file_list, &file_count); + dlog_print("ret[%d]: file_count in root [%d]", ret, file_count); + + for (i = 0; i < file_count; i++) { + ret = mtp_objectinfo_get_file_name(mtp_device, file_list[i], &file_name); + dlog_print("ret[%d]: object handle [%d] file name [%s]", + ret, file_list[i], file_name); + } + + return ret; } @@ -353,16 +353,16 @@ mtp_object_h mtp_object; /* Get this variable using mtp_get_object_handles() */ int objectinfo_test_get_filename(void) { -    int ret = 0; -    char *name = NULL; + int ret = 0; + char *name = NULL; -    ret = mtp_objectinfo_get_file_name(mtp_device, mtp_object, &name); -    dlog_print("ret[%d]: object id[%d] filename[%s]", ret, mtp_object, name); + ret = mtp_objectinfo_get_file_name(mtp_device, mtp_object, &name); + dlog_print("ret[%d]: object id[%d] filename[%s]", ret, mtp_object, name); -    if (name != NULL) -        free(name); + if (name != NULL) + free(name); -    return ret; + return ret; } @@ -380,14 +380,14 @@ mtp_object_h mtp_object_handle; int manager_test_get_object(void) { -    char filepath[100] = {0,}; -    snprintf(filepath, 100, "/opt/usr/media/Downloads/JpegObject_%d.jpg", -             mtp_object_handle); + char filepath[100] = {0,}; + snprintf(filepath, 100, "/opt/usr/media/Downloads/JpegObject_%d.jpg", + mtp_object_handle); -    ret = mtp_get_object(mtp_device, mtp_object_handle, filepath); -    dlog_print("ret[%d]: input id[%d]", ret, mtp_object_handle); + ret = mtp_get_object(mtp_device, mtp_object_handle, filepath); + dlog_print("ret[%d]: input id[%d]", ret, mtp_object_handle); -    return ret; + return ret; } @@ -400,14 +400,14 @@ mtp_object_h mtp_object_handle; int manager_test_get_object(void) { -    char filepath[100] = {0,}; -    snprintf(filepath, 100, "/opt/usr/media/Downloads/JpegObject_%d.jpg", -             mtp_object_handle); + char filepath[100] = {0,}; + snprintf(filepath, 100, "/opt/usr/media/Downloads/JpegObject_%d.jpg", + mtp_object_handle); -    ret = mtp_get_thumbnail(mtp_device, mtp_object_handle, filepath); -    dlog_print("ret[%d]: input id[%d]", ret, mtp_object_handle); + ret = mtp_get_thumbnail(mtp_device, mtp_object_handle, filepath); + dlog_print("ret[%d]: input id[%d]", ret, mtp_object_handle); -    return ret; + return ret; } @@ -431,36 +431,36 @@ manager_test_get_object(void) void __test_mtp_event_cb(mtp_event_e state, int event_parameter, void *user_data) { -    int ret = 0; -    dlog_print("state [%d]: %d", state, event_parameter); -    if (state == MTP_EVENT_DEVICE_ADDED || state == MTP_EVENT_DEVICE_REMOVED) { -        mtp_device_h mtp_device = (mtp_device_h) event_parameter; -        /* Do something */ -    } else if (state == MTP_EVENT_STORAGE_ADDED || state == MTP_EVENT_STORAGE_REMOVED) { -        mtp_storage_h mtp_storage = (mtp_storage_h) event_parameter; -        /* Do something */ -    } else if (state == MTP_EVENT_OBJECT_ADDED || state == MTP_EVENT_OBJECT_ADDED) { -        mtp_object_h mtp_object = (mtp_object_h) event_parameter; -        /* Do something */ -    } else if (state == MTP_EVENT_TURNED_OFF) { -        ret = mtp_deinitialize(); -        dlog_print("ret[%d]: Terminated daemon", ret); -    } else { -        /* Error handling */ -    } + int ret = 0; + dlog_print("state [%d]: %d", state, event_parameter); + if (state == MTP_EVENT_DEVICE_ADDED || state == MTP_EVENT_DEVICE_REMOVED) { + mtp_device_h mtp_device = (mtp_device_h) event_parameter; + /* Do something */ + } else if (state == MTP_EVENT_STORAGE_ADDED || state == MTP_EVENT_STORAGE_REMOVED) { + mtp_storage_h mtp_storage = (mtp_storage_h) event_parameter; + /* Do something */ + } else if (state == MTP_EVENT_OBJECT_ADDED || state == MTP_EVENT_OBJECT_ADDED) { + mtp_object_h mtp_object = (mtp_object_h) event_parameter; + /* Do something */ + } else if (state == MTP_EVENT_TURNED_OFF) { + ret = mtp_deinitialize(); + dlog_print("ret[%d]: Terminated daemon", ret); + } else { + /* Error handling */ + } } int application_test_event_callback(void) { -    int ret; + int ret; -    ret = mtp_add_mtp_event_cb(__test_mtp_event_cb, NULL); + ret = mtp_add_mtp_event_cb(__test_mtp_event_cb, NULL); -    return ret; + return ret; } - + diff --git a/org.tizen.guides/html/native/connectivity/nfc_n.htm b/org.tizen.guides/html/native/connectivity/nfc_n.htm index b5f8e41..0753df3 100644 --- a/org.tizen.guides/html/native/connectivity/nfc_n.htm +++ b/org.tizen.guides/html/native/connectivity/nfc_n.htm @@ -42,7 +42,7 @@
  • Preparing NFC P2P
  • Sending and Receiving a Message through NFC P2P
    • - +

    Related Info

  • NDEF support - +

    The NFC Data Exchange Format (NDEF) is a packet message format used in the reader/writer and peer-to-peer modes.

    With the NDEF API (in mobile and wearable applications), you can:

    @@ -94,7 +94,7 @@
  • Write an NDEF message to a tag.
  • Format a tag for using NDEF.
  • Handle type-specific tag operations (currently only MIFARE).
    • - +
  • Peer-to-peer mode

    With the Peer to Peer API (in mobile and wearable applications), you can:

    @@ -109,9 +109,9 @@

    The card emulation mode allows an NFC device to function as a smart card. The mode provides access to secure elements (SEs).

    The NFC controller in the device routes all data from the reader directly to the secure element, and an applet handles all of the data in the SE. The user does not participate at all in the operation.

    -

    Figure: Traditional card emulation

    -

    Traditional card emulation

    - +

    Figure: Traditional card emulation

    +

    Traditional card emulation

    +

    With the Card Emulation API (in mobile and wearable applications), you can:

      @@ -129,11 +129,11 @@
    • Security problems can occur in some Card Emulation APIs. The security level can be determined by the manufacturer usage. If a security issue occurs, contact the product manufacturer. For more information on the security levels, see the GSMA specification.
    • -
  • Host-based card emulation (HCE) -

    HCE is on-device technology that permits a phone to perform card emulation on an NFC-enabled device without relying on access to a secure element (SE). The data is routed to the user space on which Tizen applications reside, instead of routing the data to a secure element.

    - -

    Figure: Card emulation with HCE

    -

    Card emulation with HCE

    +
  • Host-based card emulation (HCE) +

    HCE is on-device technology that permits a phone to perform card emulation on an NFC-enabled device without relying on access to a secure element (SE). The data is routed to the user space on which Tizen applications reside, instead of routing the data to a secure element.

    + +

    Figure: Card emulation with HCE

    +

    Card emulation with HCE

    HCE allows you to create your own card emulation system and bypass the SE. This approach brings 2 advantages:

    @@ -160,9 +160,9 @@

    To use the NFC API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/nfc</privilege>
-   <!--To create a host-based card emulation (HCE) application-->
-   <privilege>http://tizen.org/privilege/nfc.cardemulation</privilege>
+   <privilege>http://tizen.org/privilege/nfc</privilege>
+   <!--To create a host-based card emulation (HCE) application-->
+   <privilege>http://tizen.org/privilege/nfc.cardemulation</privilege>
 </privileges>
    • @@ -179,10 +179,10 @@ void Network_NFC_startup(void) { -    gmainloop = g_main_loop_new(NULL, FALSE); -    bool is_nfc_supported = nfc_manager_is_supported(); -    if (!is_nfc_supported) -        dlog_print(DLOG_INFO, LOG_TAG, "is_nfc_supported NOT SUPPORTED"); + gmainloop = g_main_loop_new(NULL, FALSE); + bool is_nfc_supported = nfc_manager_is_supported(); + if (!is_nfc_supported) + dlog_print(DLOG_INFO, LOG_TAG, "is_nfc_supported NOT SUPPORTED"); } @@ -194,7 +194,7 @@ int error_code = NFC_ERROR_NONE; error_code = nfc_manager_initialize(); if (NFC_ERROR_NONE != error_code) -    /* Error occurred */ + /* Error occurred */ g_timeout_add(1000, timeout_func, gmainloop); g_main_loop_run(gmainloop); @@ -208,13 +208,13 @@ g_main_loop_run(gmainloop); void Network_NFC_cleanup(void) { -    g_main_loop_unref(gmainloop); -    nfc_manager_deinitialize(); + g_main_loop_unref(gmainloop); + nfc_manager_deinitialize(); }

    Enabling and Disabling NFC

    - +

    To allow the user to enable or disable NFC, use the application control to display the NFC settings.

    The NFC API does not contain functions for enabling or disabling NFC. You must display the NFC settings application to allow the user to toggle the NFC state.

    Figure: NFC settings application (off screen on the left and on screen on the right)

    @@ -227,29 +227,29 @@ Network_NFC_cleanup(void) int nfc_onoff_operation(void) { -    int ret = 0; -    app_control_h service = NULL; -    app_control_create(&service); -    if (service == NULL) { -        dlog_print(DLOG_INFO, LOG_TAG, "service_create failed!\n"); + int ret = 0; + app_control_h service = NULL; + app_control_create(&service); + if (service == NULL) { + dlog_print(DLOG_INFO, LOG_TAG, "service_create failed!\n"); -        return 0; -    } -    app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_NFC); -    ret = app_control_send_launch_request(service, NULL, NULL); + return 0; + } + app_control_set_operation(service, APP_CONTROL_OPERATION_SETTING_NFC); + ret = app_control_send_launch_request(service, NULL, NULL); -    app_control_destroy(service); -    if (ret == APP_CONTROL_ERROR_NONE) { -        dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to NFC On/Off app!\n"); + app_control_destroy(service); + if (ret == APP_CONTROL_ERROR_NONE) { + dlog_print(DLOG_INFO, LOG_TAG, "Succeeded to NFC On/Off app!\n"); -        return 0; -    } else { -        dlog_print(DLOG_INFO, LOG_TAG, "Failed to relaunch NFC On/Off app!\n"); + return 0; + } else { + dlog_print(DLOG_INFO, LOG_TAG, "Failed to relaunch NFC On/Off app!\n"); -        return -1; -    } + return -1; + } -    return 0; + return 0; } @@ -265,7 +265,7 @@ nfc_onoff_operation(void)

    Call the nfc_manager_set_activation_changed_cb() function to register a callback that is invoked every time the activation state of NFC changes:

     error_code =
-    nfc_manager_set_activation_changed_cb(on_nfc_activation_changed, NULL);
+    nfc_manager_set_activation_changed_cb(on_nfc_activation_changed, NULL);

    Define the callback. In this example, it only informs the user that the activation state has changed.

    @@ -273,10 +273,10 @@ error_code = static void on_nfc_activation_changed(bool activated, void *user_data) { -    if (activated) -        dlog_print(DLOG_INFO, LOG_TAG, "NFC activated"); -    else -        dlog_print(DLOG_INFO, LOG_TAG, "NFC deactivated"); + if (activated) + dlog_print(DLOG_INFO, LOG_TAG, "NFC activated"); + else + dlog_print(DLOG_INFO, LOG_TAG, "NFC deactivated"); } @@ -292,54 +292,54 @@ nfc_manager_set_tag_filter(NFC_TAG_FILTER_ALL_ENABLE); 
     error_code = nfc_manager_set_tag_discovered_cb(on_nfc_tag_discovered, NULL);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
    -
  • Use the nfc_manager_set_ndef_discovered_cb() function to register an NDEF event callback: +
  • Use the nfc_manager_set_ndef_discovered_cb() function to register an NDEF event callback: 
     error_code =
-    nfc_manager_set_ndef_discovered_cb(on_nfc_ndef_discovered, NULL);
+    nfc_manager_set_ndef_discovered_cb(on_nfc_ndef_discovered, NULL);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
    • -
  • Use the nfc_manager_set_p2p_target_discovered_cb() function to register a peer-to-peer event callback: +
  • Use the nfc_manager_set_p2p_target_discovered_cb() function to register a peer-to-peer event callback: 
     error_code =
-    nfc_manager_set_p2p_target_discovered_cb(on_nfc_p2p_target_discovered,
-                                             NULL);
+    nfc_manager_set_p2p_target_discovered_cb(on_nfc_p2p_target_discovered,
+                                             NULL);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
  • Use the nfc_manager_set_se_event_cb() function to register a secure element event callback: 
     error_code = nfc_manager_set_se_event_cb(on_nfc_se_event, NULL);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
    • -
  • Use the nfc_manager_set_se_transaction_event_cb() function to register a secure element transaction event callback: +
  • Use the nfc_manager_set_se_transaction_event_cb() function to register a secure element transaction event callback: 
     error_code =
-    nfc_manager_set_se_transaction_event_cb(NFC_SE_TYPE_ESE,
-                                            on_nfc_se_transaction_event,
-                                            NULL);
+    nfc_manager_set_se_transaction_event_cb(NFC_SE_TYPE_ESE,
+                                            on_nfc_se_transaction_event,
+                                            NULL);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
    • -

  • Use the nfc_manager_is_system_handler_enabled() function to check whether system handling for tag and target discovery is enabled.

    +

  • Use the nfc_manager_is_system_handler_enabled() function to check whether system handling for tag and target discovery is enabled.

    By default, the system handling is enabled. If the function returns FALSE, enable system handling using the nfc_manager_set_system_handler_enable() function and pass TRUE as an input parameter.

     if (nfc_manager_is_system_handler_enabled() != true)
-    nfc_manager_set_system_handler_enable(true);
+    nfc_manager_set_system_handler_enable(true);

    • After registering the callbacks, you can start using NFC on the device. You can connect to other devices, resulting in launching the code from the registered callbacks.

  • Handling NFC tags and related events:
      -
    1. Get basic tag information. +
    2. Get basic tag information.

      When a tag is discovered, the on_nfc_tag_discovered() callback registered earlier is called. In the callback, you can check the NFC discovered type from the first callback parameter. The nfc_discovered_type_e enumerator (in mobile and wearable applications) defines the possible values. If the value is NFC_DISCOVERED_TYPE_ATTACHED, the tag has connected to the device, and you can read and print out information from the tag:

      1. @@ -364,20 +364,20 @@ nfc_tag_get_maximum_ndef_size(tag, &maximum_ndef_bytes_size);

        Retrieve all remaining tag information by calling the nfc_tag_foreach_information() function. The parameters are the tag that is operated on, the callback that is called for each found key and value pair in the tag, and the user data that can be passed to the callback. If there is no need to pass any data, NULL is passed as the last parameter.

         error_code = nfc_tag_foreach_information(tag, on_nfc_tag_information_event,
-                                         NULL);
+                                         NULL);
 
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */

        The on_nfc_tag_information_event() callback prints out the found keys and their values.

         on_nfc_tag_information_event(const char *key, const unsigned char *value,
-                             int value_size, void *user_data)
+                             int value_size, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Title: %s, Value: %s", key, (char*)value);
+    dlog_print(DLOG_INFO, LOG_TAG, "Title: %s, Value: %s", key, (char*)value);
 
-    return true;
+    return true;
 }

        The iteration over the key and value pairs continues while the callback returns true.

        @@ -395,16 +395,16 @@ filter = nfc_manager_get_tag_filter(); 
         error_code = nfc_tag_read_ndef(tag, on_nfc_tag_read_completed, NULL);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */

        After the tag message has been read, the on_nfc_tag_read_completed() callback is called. The parameters are the status of reading the message, the message read from the tag, and data passed to the callback. The last one can be NULL if no data need to be passed.

         static void
 on_nfc_tag_read_completed(int error_code, nfc_ndef_message_h message,
-                          void *user_data)
+                          void *user_data)
 {
-    nfc_ndef_message_read_cb(clone_message(message));
+    nfc_ndef_message_read_cb(clone_message(message));
 }
      2. @@ -424,26 +424,26 @@ nfc_ndef_message_read_cb(clone_message(message)); static nfc_ndef_message_h clone_message(nfc_ndef_message_h msg) { -    unsigned char *rawdata; -    unsigned int rawdata_size; -    nfc_ndef_message_h msg_cp; + unsigned char *rawdata; + unsigned int rawdata_size; + nfc_ndef_message_h msg_cp;

      3. Get the copy of the bytes array of the NDEF message with the nfc_ndef_message_get_rawdata() function. The parameters are the handle to the NDEF message, the 2-dimensional bytes array, and the size of the bytes array.

        The parameters are variables that must be passed to be fulfilled inside the called function. 

        -    nfc_ndef_message_get_rawdata(msg, &rawdata, &rawdata_size);
+    nfc_ndef_message_get_rawdata(msg, &rawdata, &rawdata_size);

      4. Create an NDEF handle from raw serial bytes with the nfc_ndef_message_create_from_rawdata() function. Use it to create a copy of the message retrieved from the tag to make it possible to read information from the copy. The parameters are the message handle, rawdata, and rawdata_size.

        In the end, rawdata must be released with the free() function.

        -    nfc_ndef_message_create_from_rawdata(&msg_cp, rawdata, rawdata_size);
-    free(rawdata);
+    nfc_ndef_message_create_from_rawdata(&msg_cp, rawdata, rawdata_size);
+    free(rawdata);
 
-    return msg_cp;
+    return msg_cp;
 }
        5. @@ -454,7 +454,7 @@ nfc_ndef_message_h clone_message(nfc_ndef_message_h msg) 
         error_code = nfc_ndef_message_get_record_count(message, &count);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
      5. @@ -462,7 +462,7 @@ if (NFC_ERROR_NONE != error_code) 
         error_code = nfc_ndef_message_get_record(message, i, &rec);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */

        Now, when the pointer to the specific record exists, get the record data:

        @@ -471,58 +471,58 @@ if (NFC_ERROR_NONE != error_code) 
         error_code = nfc_ndef_record_get_id(rec, &id, &id_len);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
      6. Get the record type using the nfc_ndef_record_get_type() function: 
         error_code = nfc_ndef_record_get_type(rec, &type_str, &type_len);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
      7. Get the record TNF (Type Name Format) with the nfc_ndef_record_get_tnf() function: 
         error_code = nfc_ndef_record_get_tnf(rec, &tnf);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
      8. Get the record payload by calling the nfc_ndef_record_get_payload() function: 
         error_code = nfc_ndef_record_get_payload(record, &payload, &payload_len);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */

      9. To get more information from the tag, specify what type of a tag message you are dealing with:

          -
        • If there is a message with Type = "T" and the TNF is NFC_RECORD_TNF_WELL_KNOWN, it is possible to get the following data: +
        • If there is a message with Type = "T" and the TNF is NFC_RECORD_TNF_WELL_KNOWN, it is possible to get the following data: 
           /* Get the record text */
 error_code = nfc_ndef_record_get_text(record, &text);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
 
 /* Get the record text language code */
 error_code = nfc_ndef_record_get_langcode(record, &language);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
 
 /* Get the record text encoding type */
 error_code = nfc_ndef_record_get_encode_type(record, &encode);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
        • -

          If there is a message with Type="U" and TNF is also NFC_RECORD_TNF_WELL_KNOWN, you can get the URI using the nfc_ndef_record_get_uri() function:

          +

          If there is a message with Type="U" and TNF is also NFC_RECORD_TNF_WELL_KNOWN, you can get the URI using the nfc_ndef_record_get_uri() function:

           error_code = nfc_ndef_record_get_uri(record, &uri);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
        • @@ -530,7 +530,7 @@ if (NFC_ERROR_NONE != error_code) 
           error_code = nfc_ndef_record_get_mime_type(record, &mime);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */
        @@ -541,7 +541,7 @@ if (NFC_ERROR_NONE != error_code)
        10. -
      10. Handling NFC NDEF messages and related events: +
      11. Handling NFC NDEF messages and related events:

        NFC NDEF messages are handled in the same way as NFC tag NDEF messages, described above.

        @@ -551,20 +551,20 @@ if (NFC_ERROR_NONE != error_code) static void on_nfc_ndef_discovered(nfc_ndef_message_h message, void *user_data) { -    int count; -    int i; -    unsigned int size; -    unsigned char * payload; -    nfc_ndef_record_h record; - -    nfc_ndef_message_get_record_count(message, &count); -    dlog_print(DLOG_INFO, LOG_TAG, "on_nfc_ndef_discovered %d", count); - -    for (i = 0; i < count; i++) { -        nfc_ndef_message_get_record(message, i, &record); -        nfc_ndef_record_get_payload(record, &payload, &size); -        dlog_print(DLOG_INFO, LOG_TAG, "Record Number: %d, Payload: %s", i, payload); -    } + int count; + int i; + unsigned int size; + unsigned char * payload; + nfc_ndef_record_h record; + + nfc_ndef_message_get_record_count(message, &count); + dlog_print(DLOG_INFO, LOG_TAG, "on_nfc_ndef_discovered %d", count); + + for (i = 0; i < count; i++) { + nfc_ndef_message_get_record(message, i, &record); + nfc_ndef_record_get_payload(record, &payload, &size); + dlog_print(DLOG_INFO, LOG_TAG, "Record Number: %d, Payload: %s", i, payload); + } }
        12. @@ -576,7 +576,7 @@ on_nfc_ndef_discovered(nfc_ndef_message_h message, void *user_data)

        In the registered on_nfc_p2p_target_discovered() callback, check the value of the first parameter, which defines the type of the NFC discovery using the nfc_discovered_type_e enumerator (in mobile and wearable applications). If the type is NFC_DISCOVERED_TYPE_ATTACHED, the remote device is attached to the device:

         if (type == NFC_DISCOVERED_TYPE_ATTACHED)
-    /* Remote device is attached; execute code */
+    /* Remote device is attached; execute code */
      12. @@ -584,20 +584,20 @@ if (type == NFC_DISCOVERED_TYPE_ATTACHED) 
         error_code = nfc_p2p_set_data_received_cb(target, on_nfc_p2p_read_completed, 0);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */

        Use the callback to read the received message. You can check its number of records using the nfc_ndef_message_get_record_count() function and get more detailed info about the message itself by calling the nfc_ndef_message_read_cb() function, similarly as with the NFC tag messages described earlier.

         static void
 on_nfc_p2p_read_completed(nfc_p2p_target_h target, nfc_ndef_message_h message,
-                          void *user_data)
+                          void *user_data)
 {
-    int count;
-    dlog_print(DLOG_INFO, LOG_TAG, "on_nfc_p2p_read_completed");
+    int count;
+    dlog_print(DLOG_INFO, LOG_TAG, "on_nfc_p2p_read_completed");
 
-    nfc_ndef_message_get_record_count(message, &count);
-    nfc_ndef_message_read_cb(clone_message(message));
+    nfc_ndef_message_get_record_count(message, &count);
+    nfc_ndef_message_read_cb(clone_message(message));
 }
        13. @@ -612,63 +612,63 @@ on_nfc_p2p_read_completed(nfc_p2p_target_h target, nfc_ndef_message_h message, static void on_nfc_se_event(nfc_se_event_e event, void *user_data) { -    switch (event) { -    case NFC_SE_EVENT_START_TRANSACTION: -        /* -         This event notifies the terminal host that it launches -         an application associated with an NFC application in a -         UICC (Universal Integrated Circuit Card) host -        */ -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Start Transaction"); -        break; -    case NFC_SE_EVENT_END_TRANSACTION: -        /* -         This event notifies the terminal host that the current transaction -         in process was ended -        */ -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: End Transaction"); -        break; -    case NFC_SE_EVENT_CONNECTIVITY: -        /* -         This event is a ready signal for UICC (Universal Integrated Circuit -         Card) to communicate with terminal host. UICC -         creates a pipe and opens the pipe channel. Then it sends the signal -         to terminal host or host controller -        */ -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Connectivity"); -        break; -    case NFC_SE_EVENT_FIELD_ON: -        /* -         When the CLF (Contactless Front-end) detects a 5ra RF field, the card -         RF gate sends the event #NFC_SE_EVENT_FIELD_ON to the card -         application gate. When there are multiple open card RF gates, -         the CLF sends the #NFC_SE_EVENT_FIELD_ON on all open pipes -         to these gates. Next the CLF starts the initialization -         and anti-collision process as defined in ISO/IEC 14443-3 [6] -        */ -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Field ON"); -        break; -    case NFC_SE_EVENT_FIELD_OFF: -        /* -         When the CLF (Contactless Front-end) detects that the RF field -         is off, the card RF gate sends the event #NFC_SE_EVENT_FIELD_OFF to -         the card application gate. When there are multiple open card RF -         gates the CLF sends the #NFC_SE_EVENT_FIELD_OFF to one gate -         only -        */ -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Field OFF"); -        break; -    case NFC_SE_EVENT_TRANSACTION: -        /* -         This event signals that an external reader is trying to access a secure -         element -        */ -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Remote Start Transaction"); -        break; -    default: -        dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: DEFAULT:OTHER"); -        break; -    } + switch (event) { + case NFC_SE_EVENT_START_TRANSACTION: + /* + This event notifies the terminal host that it launches + an application associated with an NFC application in a + UICC (Universal Integrated Circuit Card) host + */ + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Start Transaction"); + break; + case NFC_SE_EVENT_END_TRANSACTION: + /* + This event notifies the terminal host that the current transaction + in process was ended + */ + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: End Transaction"); + break; + case NFC_SE_EVENT_CONNECTIVITY: + /* + This event is a ready signal for UICC (Universal Integrated Circuit + Card) to communicate with terminal host. UICC + creates a pipe and opens the pipe channel. Then it sends the signal + to terminal host or host controller + */ + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Connectivity"); + break; + case NFC_SE_EVENT_FIELD_ON: + /* + When the CLF (Contactless Front-end) detects a 5ra RF field, the card + RF gate sends the event #NFC_SE_EVENT_FIELD_ON to the card + application gate. When there are multiple open card RF gates, + the CLF sends the #NFC_SE_EVENT_FIELD_ON on all open pipes + to these gates. Next the CLF starts the initialization + and anti-collision process as defined in ISO/IEC 14443-3 [6] + */ + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Field ON"); + break; + case NFC_SE_EVENT_FIELD_OFF: + /* + When the CLF (Contactless Front-end) detects that the RF field + is off, the card RF gate sends the event #NFC_SE_EVENT_FIELD_OFF to + the card application gate. When there are multiple open card RF + gates the CLF sends the #NFC_SE_EVENT_FIELD_OFF to one gate + only + */ + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Field OFF"); + break; + case NFC_SE_EVENT_TRANSACTION: + /* + This event signals that an external reader is trying to access a secure + element + */ + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: Remote Start Transaction"); + break; + default: + dlog_print(DLOG_INFO, LOG_TAG, "NFC EVENT: DEFAULT:OTHER"); + break; + } } @@ -677,11 +677,11 @@ on_nfc_se_event(nfc_se_event_e event, void *user_data) 
         static void
 on_nfc_se_transaction_event(nfc_se_type_e se_type, unsigned char *aid, int aid_size,
-                            unsigned char *param, int param_size, void *user_data)
+                            unsigned char *param, int param_size, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "Secure Element(SIM/UICC(Universal Integrated Circuit Card))
-                transaction event data");
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "Secure Element(SIM/UICC(Universal Integrated Circuit Card))
+                transaction event data");
 }
        @@ -701,7 +701,7 @@ nfc_manager_set_tag_filter(NFC_TAG_FILTER_ALL_ENABLE);
      13. Enable the NFC system handler: 
         if (nfc_manager_is_system_handler_enabled() != true)
-    nfc_manager_set_system_handler_enable(true);
+    nfc_manager_set_system_handler_enable(true);
      14. Get the cached message by calling the nfc_manager_get_cached_message() function. Pass a variable of the nfc_ndef_message_h type, which is fulfilled with the cached message by the function. 
        @@ -709,12 +709,12 @@ nfc_ndef_message_h message = NULL;
 
 error_code = nfc_manager_get_cached_message(&message);
 if (NFC_ERROR_NONE != error_code)
-    /* Error occurred */
+    /* Error occurred */

        After getting the message, get the detailed information from the message as described in Working with NFC Connections and Messages. First check whether there are any errors and that the message is not NULL:

         if (message != NULL)
-    on_nfc_ndef_discovered(clone_message(message), NULL);
+    on_nfc_ndef_discovered(clone_message(message), NULL);
      15. Clean up at the application end.
      @@ -733,9 +733,9 @@ int ret = NFC_ERROR_NONE; ret = nfc_manager_initialize(); if (ret != NFC_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_initialize failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_initialize failed: %d", ret); -    return false; + return false; }
      3. @@ -747,18 +747,18 @@ nfc_se_card_emulation_mode_type_e ce_type; ret = nfc_se_get_card_emulation_mode(&ce_type); if (ret == NFC_ERROR_NONE && ce_type != true) { -    ret = nfc_se_enable_card_emulation(); -    if (ret != NFC_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "nfc_se_enable_card_emulation failed: %d", ret); + ret = nfc_se_enable_card_emulation(); + if (ret != NFC_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_se_enable_card_emulation failed: %d", ret); -        return false; -    } + return false; + } } else { -    dlog_print(DLOG_ERROR, LOG_TAG, -               "nfc_se_get_card_emulation_mode failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_se_get_card_emulation_mode failed: %d", ret); -    return false; + return false; }

    3. Specify an AID value for the application:

      @@ -766,19 +766,19 @@ if (ret == NFC_ERROR_NONE && ce_type != true) {

    4. To tell the platform which AID groups are requested by the application, a metadata element must be included in the manifest file:

      -<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1"
-          package="org.tizen.basicuiapplication" version="1.0.0">
-   <profile name="wearable"/>
-   <ui-application appid="org.tizen.basicuiapplication"
-                   exec="basicuiapplication"
-                   type="capp" multiple="false" taskmanage="true"
-                   nodisplay="false">
-      <icon>basicuiapplication.png</icon>
-      <label>basicuiapplication</label>
-      <metadata key="http://tizen.org/metadata/nfc_cardemulation"
-                value="/shared/res/wallet.xml"/>
-   </ui-application>
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1"
+          package="org.tizen.basicuiapplication" version="1.0.0">
+   <profile name="wearable"/>
+   <ui-application appid="org.tizen.basicuiapplication"
+                   exec="basicuiapplication"
+                   type="capp" multiple="false" taskmanage="true"
+                   nodisplay="false">
+      <icon>basicuiapplication.png</icon>
+      <label>basicuiapplication</label>
+      <metadata key="http://tizen.org/metadata/nfc_cardemulation"
+                value="/shared/res/wallet.xml"/>
+   </ui-application>
 </manifest>
      • The metadata element must contain the key and value attributes.
        • @@ -789,14 +789,14 @@ if (ret == NFC_ERROR_NONE && ce_type != true) {

      • The metadata element points to an AID XML file. The following is an example of the file with an AID declaration:

        -<?xml version="1.0" encoding="utf-8"?>
-<application name="org.tizen.basicuiapplication">
-   <wallet>
-      <aid-group category="payment">
-         <aid aid="325041592E5359532E4444463031"
-              se_type="hce" unlock="false" power="sleep"/>
-      </aid-group>
-   </wallet>
+<?xml version="1.0" encoding="utf-8"?>
+<application name="org.tizen.basicuiapplication">
+   <wallet>
+      <aid-group category="payment">
+         <aid aid="325041592E5359532E4444463031"
+              se_type="hce" unlock="false" power="sleep"/>
+      </aid-group>
+   </wallet>
 </application>
        • The application element must contain a name attribute with an application name.
          • @@ -826,45 +826,45 @@ if (ret == NFC_ERROR_NONE && ce_type != true) { 
           static void
 _hce_event_cb(nfc_se_h handle, nfc_hce_event_type_e event,
-              unsigned char *apdu, unsigned int apdu_len, void *user_data)
+              unsigned char *apdu, unsigned int apdu_len, void *user_data)
 {
-    switch (event) {
-    case NFC_HCE_EVENT_DEACTIVATED:
-        /*
-           Do something when NFC_HCE_EVENT_DEACTIVATED event arrives
-           When the event arrives, apdu and apdu len is NULL and 0
-        */
-        break;
-    case NFC_HCE_EVENT_ACTIVATED:
-        /*
-           Do something when NFC_HCE_EVENT_ACTIVATED event arrives
-           When the event arrives, apdu and apdu len is NULL and 0
-        */
-        break;
-    case NFC_HCE_EVENT_APDU_RECEIVED:
-        unsigned char resp[] = {0x00, 0x01, 0x02, 0x03};
-
-        /*
-           Do something when NFC_HCE_EVENT_APDU_RECEIVED event arrives
-           You can use the arrival apdu and apdu_len
-           and send a response to the NFC reader
-        */
-
-        nfc_hce_send_apdu_response(handle, NULL, 4);
-        break;
-    default:
-        /* Error handling */
-        break;
-    }
+    switch (event) {
+    case NFC_HCE_EVENT_DEACTIVATED:
+        /*
+           Do something when NFC_HCE_EVENT_DEACTIVATED event arrives
+           When the event arrives, apdu and apdu len is NULL and 0
+        */
+        break;
+    case NFC_HCE_EVENT_ACTIVATED:
+        /*
+           Do something when NFC_HCE_EVENT_ACTIVATED event arrives
+           When the event arrives, apdu and apdu len is NULL and 0
+        */
+        break;
+    case NFC_HCE_EVENT_APDU_RECEIVED:
+        unsigned char resp[] = {0x00, 0x01, 0x02, 0x03};
+
+        /*
+           Do something when NFC_HCE_EVENT_APDU_RECEIVED event arrives
+           You can use the arrival apdu and apdu_len
+           and send a response to the NFC reader
+        */
+
+        nfc_hce_send_apdu_response(handle, NULL, 4);
+        break;
+    default:
+        /* Error handling */
+        break;
+    }
 }
 
 ret = nfc_manager_set_hce_event_cb(_hce_event_cb, NULL);
 
 if (ret != NFC_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "nfc_manager_set_hce_event_cb failed: %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "nfc_manager_set_hce_event_cb failed: %d", ret);
 
-    return false;
+    return false;
 }
          @@ -877,37 +877,37 @@ const char aid[] = {0x00, 0x01, 0x02, 0x03}; bool is_activated_handler = false; ret = nfc_se_is_activated_handler_for_aid(NFC_SE_TYPE_HCE, aid, -                                          &is_activated_handler); + &is_activated_handler); if (ret != NFC_ERROR_NONE) { -    if (is_activated_handler == true) { -        dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is true"); -        /* Do something */ -    } else { -        dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is false"); -        /* Do something */ -    } + if (is_activated_handler == true) { + dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is true"); + /* Do something */ + } else { + dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is false"); + /* Do something */ + } } else { -    dlog_print(DLOG_ERROR, LOG_TAG, -               "nfc_se_is_activated_handler_for_aid failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_se_is_activated_handler_for_aid failed: %d", ret); } ret = -    nfc_se_is_activated_handler_for_category(NFC_SE_TYPE_HCE, -                                             NFC_CARD_EMULATION_CATEGORY_PAYMENT, -                                             &is_activated_handler); + nfc_se_is_activated_handler_for_category(NFC_SE_TYPE_HCE, + NFC_CARD_EMULATION_CATEGORY_PAYMENT, + &is_activated_handler); if (ret != NFC_ERROR_NONE) { -    if (is_activated_handler == true) { -        dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is true"); -        /* Do something */ -    } else { -        dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is false"); -        /* Do something */ -    } + if (is_activated_handler == true) { + dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is true"); + /* Do something */ + } else { + dlog_print(DLOG_INFO, LOG_TAG, "is_activate_handler is false"); + /* Do something */ + } } else { -    dlog_print(DLOG_ERROR, LOG_TAG, -               "nfc_se_is_activated_handler_for_category failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_se_is_activated_handler_for_category failed: %d", ret); }
        • To register or deregister the AID at application runtime, use the nfc_se_register_aid() and nfc_se_unregister_aid() functions: @@ -916,44 +916,44 @@ int ret = NFC_ERROR_NONE; const char aid[] = {0x0A, 0x0B, 0x0C, 0x0D}; ret = -    nfc_se_register_aid(NFC_SE_TYPE_HCE, NFC_CARD_EMULATION_CATEGORY_OTHER, -                        aid); + nfc_se_register_aid(NFC_SE_TYPE_HCE, NFC_CARD_EMULATION_CATEGORY_OTHER, + aid); if (ret != NFC_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "nfc_se_register_aid failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "nfc_se_register_aid failed: %d", ret); -    return false; + return false; } ret = -    nfc_se_unregister_aid(NFC_SE_TYPE_HCE, NFC_CARD_EMULATION_CATEGORY_OTHER, -                          aid); + nfc_se_unregister_aid(NFC_SE_TYPE_HCE, NFC_CARD_EMULATION_CATEGORY_OTHER, + aid); if (ret != NFC_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "nfc_se_unregister_aid failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "nfc_se_unregister_aid failed: %d", ret); -    return false; + return false; }
        • To check whether the application has a registered AID (including a registered AID at the install time), use the nfc_se_foreach_registered_aids() function (the callback is called for each AID value separately): 
           static void
 _registered_aid_cb(nfc_se_type_e se_type, const char *aid,
-                   bool read_only, void *user_data)
+                   bool read_only, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "registered_aids callback is called");
-    /* Do something */
+    dlog_print(DLOG_INFO, LOG_TAG, "registered_aids callback is called");
+    /* Do something */
 }
 
 ret = nfc_se_foreach_registered_aids(NFC_SE_TYPE_HCE,
-                                     NFC_CARD_EMULATION_CATEGORY_OTHER,
-                                     _registered_aid_cb, NULL);
+                                     NFC_CARD_EMULATION_CATEGORY_OTHER,
+                                     _registered_aid_cb, NULL);
 
 if (ret != NFC_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "nfc_se_foreach_registered_aids failed: %d", ret);
- 
-    return false;
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "nfc_se_foreach_registered_aids failed: %d", ret);
+
+    return false;
 }

          When an application receives an app control event, the application can receive the AID value using the data app control extra key.

          • @@ -966,7 +966,7 @@ nfc_manager_unset_hce_event_cb(); ret = nfc_manager_deinitialize(); if (ret != NFC_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_deinitialize failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_deinitialize failed: %d", ret); @@ -980,186 +980,186 @@ if (ret != NFC_ERROR_NONE) static void _hce_event_cb(nfc_se_h handle, nfc_hce_event_type_e event, -              unsigned char *apdu, unsigned int apdu_len, void *user_data) + unsigned char *apdu, unsigned int apdu_len, void *user_data) { -    switch (event) { -    case NFC_HCE_EVENT_DEACTIVATED: -        /* -         Do something when NFC_HCE_EVENT_DEACTIVATED event arrives -         When the event arrives, apdu and apdu len is NULL and 0 -        */ -        break; -    case NFC_HCE_EVENT_ACTIVATED: -        /* -         Do something when NFC_HCE_EVENT_ACTIVATED event arrives -         When the event arrives, apdu and apdu len is NULL and 0 -        */ -        break; -    case NFC_HCE_EVENT_APDU_RECEIVED: -        unsigned char resp[] = {0x00, 0x01, 0x02, 0x03}; - -        /* -         Do something when NFC_HCE_EVENT_APDU_RECEIVED event arrives -         You can use the arrival apdu and apdu_len -         and send a response to the NFC reader -        */ - -        nfc_hce_send_apdu_response(handle, resp, 4); -        break; -    default: -        /* Error handling */ -        break; -    } + switch (event) { + case NFC_HCE_EVENT_DEACTIVATED: + /* + Do something when NFC_HCE_EVENT_DEACTIVATED event arrives + When the event arrives, apdu and apdu len is NULL and 0 + */ + break; + case NFC_HCE_EVENT_ACTIVATED: + /* + Do something when NFC_HCE_EVENT_ACTIVATED event arrives + When the event arrives, apdu and apdu len is NULL and 0 + */ + break; + case NFC_HCE_EVENT_APDU_RECEIVED: + unsigned char resp[] = {0x00, 0x01, 0x02, 0x03}; + + /* + Do something when NFC_HCE_EVENT_APDU_RECEIVED event arrives + You can use the arrival apdu and apdu_len + and send a response to the NFC reader + */ + + nfc_hce_send_apdu_response(handle, resp, 4); + break; + default: + /* Error handling */ + break; + } } bool service_app_create(void *data) { -    int ret = NFC_ERROR_NONE; -    nfc_se_card_emulation_mode_type_e ce_type; + int ret = NFC_ERROR_NONE; + nfc_se_card_emulation_mode_type_e ce_type; -    ret = nfc_manager_initialize(); + ret = nfc_manager_initialize(); -    if (ret != NFC_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_initialize failed: %d", ret); + if (ret != NFC_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_initialize failed: %d", ret); -        return false; -    } + return false; + } -    /* App control */ + /* App control */ -    ret = nfc_se_get_card_emulation_mode(&ce_type); + ret = nfc_se_get_card_emulation_mode(&ce_type); -    if (ret == NFC_ERROR_NONE && ce_type != true) { -        nfc_se_enable_card_emulation(); -        if (ret != NFC_ERROR_NONE) { -            dlog_print(DLOG_ERROR, LOG_TAG, -                       "nfc_se_enable_card_emulation failed: %d", ret); + if (ret == NFC_ERROR_NONE && ce_type != true) { + nfc_se_enable_card_emulation(); + if (ret != NFC_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_se_enable_card_emulation failed: %d", ret); -            return false; -        } -    } else { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "nfc_se_get_card_emulation_mode failed: %d", ret); + return false; + } + } else { + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_se_get_card_emulation_mode failed: %d", ret); -        return false; -    } + return false; + } -    ret = nfc_manager_set_hce_event_cb(_hce_event_cb, NULL); + ret = nfc_manager_set_hce_event_cb(_hce_event_cb, NULL); -    if (ret != NFC_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "nfc_manager_set_hce_event_cb failed: %d", ret); + if (ret != NFC_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "nfc_manager_set_hce_event_cb failed: %d", ret); -        return false; -    } + return false; + } -    return true; + return true; } void service_app_terminate(void *data) { -    int ret = NFC_ERROR_NONE; + int ret = NFC_ERROR_NONE; -    nfc_manager_unset_hce_event_cb(); + nfc_manager_unset_hce_event_cb(); -    ret = nfc_manager_deinitialize(); -    if (ret != NFC_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_deinitialize failed: %d", ret); + ret = nfc_manager_deinitialize(); + if (ret != NFC_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "nfc_manager_deinitialize failed: %d", ret); -    return; + return; } void service_app_control(app_control_h app_control, void *data) { -    /* Todo: add your code here */ + /* Todo: add your code here */ -    return; + return; } void service_app_low_memory_callback(void *data) { -    /* Todo: add your code here */ -    service_app_exit(); + /* Todo: add your code here */ + service_app_exit(); -    return; + return; } void service_app_low_battery_callback(void *data) { -    /* Todo: add your code here */ -    service_app_exit(); + /* Todo: add your code here */ + service_app_exit(); -    return; + return; } int main(int argc, char* argv[]) { -    char ad[50] = {0,}; -    service_app_event_callback_s event_callback; + char ad[50] = {0,}; + service_app_event_callback_s event_callback; -    event_callback.create = service_app_create; -    event_callback.terminate = service_app_terminate; -    event_callback.app_control = service_app_control; -    event_callback.low_memory = service_app_low_memory_callback; -    event_callback.low_battery = service_app_low_battery_callback; + event_callback.create = service_app_create; + event_callback.terminate = service_app_terminate; + event_callback.app_control = service_app_control; + event_callback.low_memory = service_app_low_memory_callback; + event_callback.low_battery = service_app_low_battery_callback; -    return service_app_main(argc, argv, &event_callback, ad); + return service_app_main(argc, argv, &event_callback, ad); }
        • To create a preferred application: -

          You can register your application as a preferred handler through the "preferred" functions. Instead of the default handler selected in the NFC settings (the wallet application), the preferred handler receives a card emulation event.

          +

          You can register your application as a preferred handler through the "preferred" functions. Instead of the default handler selected in the NFC settings (the wallet application), the preferred handler receives a card emulation event.

          -

          The "preferred" functions can be called when the application is on the foreground:

          +

          The "preferred" functions can be called when the application is on the foreground:

          • Call the nfc_se_set_preferred_handler() function when the application is resumed from the paused state.
          • Call the nfc_se_unset_preferred_handler() function when the application is paused.
          - +
          Note - The "preferred" functions are available since Tizen 3.0. -

          Because of security issues, the API usage policy is different for each Tizen device. For example, if the application is in the payment category, using the "preferred" functions can be prohibited depending on the device.

          + The "preferred" functions are available since Tizen 3.0. +

          Because of security issues, the API usage policy is different for each Tizen device. For example, if the application is in the payment category, using the "preferred" functions can be prohibited depending on the device.

          The following example shows the entire preferred application sample code:

           static void
 _on_resume_cb(void *user_data)
 {
-    int ret;
-    ret = nfc_se_set_preferred_handler();
-    if (ret != NFC_ERROR_NONE)
-        dlog_print("Set preferred handler failed! %s", get_error_message(ret));
+    int ret;
+    ret = nfc_se_set_preferred_handler();
+    if (ret != NFC_ERROR_NONE)
+        dlog_print("Set preferred handler failed! %s", get_error_message(ret));
 }
 
 static void
 _on_pause_cb(void *user_data)
 {
-    int ret;
-    ret = nfc_se_unset_preferred_handler();
-    if (ret != NFC_ERROR_NONE)
-        dlog_print("Unset preferred handler failed! %s", get_error_message(ret));
+    int ret;
+    ret = nfc_se_unset_preferred_handler();
+    if (ret != NFC_ERROR_NONE)
+        dlog_print("Unset preferred handler failed! %s", get_error_message(ret));
 }
 
 int
 app_run(app_data *user_data, int argc, char **argv)
 {
-    ui_app_lifecycle_callback_s cbs = {
-        .create = _on_create_cb,
-        .terminate = _on_terminate_cb,
-        .pause = _on_pause_cb,
-        .resume = _on_resume_cb,
-        .app_control = _on_app_control_cb,
-    };
-
-    return ui_app_main(argc, argv, &cbs, user_data);
+    ui_app_lifecycle_callback_s cbs = {
+        .create = _on_create_cb,
+        .terminate = _on_terminate_cb,
+        .pause = _on_pause_cb,
+        .resume = _on_resume_cb,
+        .app_control = _on_app_control_cb,
+    };
+
+    return ui_app_main(argc, argv, &cbs, user_data);
 }
          @@ -1196,59 +1196,59 @@ app_run(app_data *user_data, int argc, char **argv)

        • To tell the platform that your application is registered for the operation, add the applicable operations to the manifest file:

          -<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1"
-          package="org.tizen.basicuiapplication" version="1.0.0">
-   <profile name="wearable"/>
-   <ui-application appid="org.tizen.basicuiapplication" exec="basicuiapplication"
-                   type="capp" multiple="false" taskmanage="true" nodisplay="false">
-      <icon>basicuiapplication.png</icon>
-      <label>basicuiapplication</label>
-      <app-control>
-         <operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/default_changed"/>
-         <operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/host_apdu_service"/>
-         <operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/off_host_apdu_service"/>
-      </app-control>
-   </ui-application>
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1"
+          package="org.tizen.basicuiapplication" version="1.0.0">
+   <profile name="wearable"/>
+   <ui-application appid="org.tizen.basicuiapplication" exec="basicuiapplication"
+                   type="capp" multiple="false" taskmanage="true" nodisplay="false">
+      <icon>basicuiapplication.png</icon>
+      <label>basicuiapplication</label>
+      <app-control>
+         <operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/default_changed"/>
+         <operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/host_apdu_service"/>
+         <operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/off_host_apdu_service"/>
+      </app-control>
+   </ui-application>
 </manifest>

        • Define the callback and register it to ui_app_lifecycle_callback::app_control:

          -#define NFC_APPCONTROL_STRING "http://tizen.org/appcontrol/operation/nfc/card_emulation/host_apdu_service"
+#define NFC_APPCONTROL_STRING "http://tizen.org/appcontrol/operation/nfc/card_emulation/host_apdu_service"
 
 bool
 service_app_control(app_control_h service, void *data)
 {
-    struct _appdata *ad = data;
-    char *operation;
-    char *aid;
-    int ret = 0;
-
-    app_control_get_operation(service, &operation);
-    if ((strncmp(operation, NFC_APPCONTROL_STRING,
-                 strlen(NFC_APPCONTROL_STRING)) == 0)) {
-        dlog_print(DLOG_INFO, "HCETESTAPP",
-                   "nfc appcontrol operation: [%s]", operation);
-        app_control_get_extra_data(service, "data", &aid);
-        dlog_print(DLOG_INFO, "HCETESTAPP", "nfc appcontrol uri: [%s]", aid);
-    }
+    struct _appdata *ad = data;
+    char *operation;
+    char *aid;
+    int ret = 0;
+
+    app_control_get_operation(service, &operation);
+    if ((strncmp(operation, NFC_APPCONTROL_STRING,
+                 strlen(NFC_APPCONTROL_STRING)) == 0)) {
+        dlog_print(DLOG_INFO, "HCETESTAPP",
+                   "nfc appcontrol operation: [%s]", operation);
+        app_control_get_extra_data(service, "data", &aid);
+        dlog_print(DLOG_INFO, "HCETESTAPP", "nfc appcontrol uri: [%s]", aid);
+    }
 }
 
 int
 main(int argc, char* argv[])
 {
-    char ad[50] = {0,};
-    service_app_event_callback_s event_callback;
+    char ad[50] = {0,};
+    service_app_event_callback_s event_callback;
 
-    event_callback.create = service_app_create;
-    event_callback.terminate = service_app_terminate;
-    event_callback.app_control = service_app_control;
-    event_callback.low_memory = service_app_low_memory_callback;
-    event_callback.low_battery = service_app_low_battery_callback;
+    event_callback.create = service_app_create;
+    event_callback.terminate = service_app_terminate;
+    event_callback.app_control = service_app_control;
+    event_callback.low_memory = service_app_low_memory_callback;
+    event_callback.low_battery = service_app_low_battery_callback;
 
-    return service_app_main(argc, argv, &event_callback, ad);
+    return service_app_main(argc, argv, &event_callback, ad);
 }
          • @@ -1273,9 +1273,9 @@ nfc_manager_initialize();

        • After the initialization of the NFC manager, ensure that NFC is supported and activated on the device. The nfc_manager_is_supported() function checks whether NFC is supported. The nfc_manager_is_activated() function gets the NFC activation state. 

           if (!nfc_manager_is_supported())
-    /* Report error, end the application */
+    /* Report error, end the application */
 if (!nfc_manager_is_activated())
-    /* Report error, ask the user to switch on NFC */
+    /* Report error, ask the user to switch on NFC */

        • At the end of the application life-cycle, call the nfc_manager_deinitialize() function. It releases all resources of the NFC manager and disconnects the session between it and your application.

          @@ -1300,13 +1300,13 @@ nfc_ndef_record_h ndef_name_record = NULL; nfc_ndef_record_h ndef_phone_record = NULL; nfc_ndef_record_h ndef_email_record = NULL; -const char *name = "John Doe"; -const char *phone = "+82556666888"; -const char *email = "john.doe@tizen.org"; +const char *name = "John Doe"; +const char *phone = "+82556666888"; +const char *email = "john.doe@tizen.org"; -nfc_ndef_record_create_text(&ndef_name_record, name, "en-US", NFC_ENCODE_UTF_8); -nfc_ndef_record_create_text(&ndef_phone_record, phone, "en-US", NFC_ENCODE_UTF_8); -nfc_ndef_record_create_text(&ndef_email_record, email, "en-US", NFC_ENCODE_UTF_8); +nfc_ndef_record_create_text(&ndef_name_record, name, "en-US", NFC_ENCODE_UTF_8); +nfc_ndef_record_create_text(&ndef_phone_record, phone, "en-US", NFC_ENCODE_UTF_8); +nfc_ndef_record_create_text(&ndef_email_record, email, "en-US", NFC_ENCODE_UTF_8);
        • @@ -1326,7 +1326,7 @@ nfc_ndef_message_append_record(ndef_message, ndef_email_record);
    • -
  • Register a callback to receive notifications about discovered P2P targets. +
  • Register a callback to receive notifications about discovered P2P targets.

    To exchange messages using P2P, register a callback for receiving notifications about discovered P2P targets using the nfc_manager_set_p2p_target_discovered_cb() function. When the P2P target is discovered, the callback provides a handle to that device and information on whether it is attached or detached.

     nfc_manager_set_p2p_target_discovered_cb(on_target_discovered, NULL);
diff --git a/org.tizen.guides/html/native/connectivity/nsd_n.htm b/org.tizen.guides/html/native/connectivity/nsd_n.htm
index 09db4f0..ade7bd6 100644
--- a/org.tizen.guides/html/native/connectivity/nsd_n.htm
+++ b/org.tizen.guides/html/native/connectivity/nsd_n.htm
@@ -33,14 +33,14 @@
 			
  • Managing a Local Service with DNSSD
    • 
 			
  • Browsing Remote Services with DNSSD
    • 
 			
-
    • +
  • SSDP
    • - +

    Related Info

    Managing a Local Service with DNSSD

    - +

    To announce a local service, create a local service handle using the dnssd_create_local_service() function, and set the service information using the handle. Afterwards, you can register the local service using the dnssd_register_local_service() function.

    To manage a local service, you must create and register the service:

    @@ -150,46 +150,46 @@ ssdp_deinitialize(); 
     dnssd_service_h service_handle;
-char *service_type = "_http._tcp";
+char *service_type = "_http._tcp";
 int error_code;
 
 error_code = dnssd_create_local_service(service_type, &service_handle);
 if (error_code == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in creating a service handle.");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in creating a service handle.");
  • Set a unique service name and a port number for the created service: 
    -char* service_name = "SamsungTest";
+char* service_name = "SamsungTest";
 int port = 80;
 
 if (dnssd_service_set_name(service_handle, service_name) == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting service name");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting service name");
 if (dnssd_service_set_port(service_handle, port) == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting port");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting port");
  • You can add a TXT record, which gives additional information about the created service. The TXT record is stored in a structured form using key-value pairs.

    For more information, see section 6 of http://files.dns-sd.org/draft-cheshire-dnsext-dns-sd.txt. The TXT record of the known service types can be found at http://www.dns-sd.org/ServiceTypes.html.

    -char* key = "path";
-char* value = "http://www.samsung.com";
+char* key = "path";
+char* value = "http://www.samsung.com";
 int length = 30;
 
 if (dnssd_service_add_txt_record_value(service_handle, key, length, value)
-    == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting service TXT");
+    == DNSSD_ERROR_NONE)
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting service TXT");
    -

    When no longer needed, you can remove the TXT record from the created service:

    +

    When no longer needed, you can remove the TXT record from the created service:

    -char* key = "path";
+char* key = "path";
 
 if (dnssd_service_remove_txt_record_value(service_handle, key) == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in removing service TXT");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in removing service TXT");
    • @@ -201,28 +201,28 @@ if (dnssd_service_remove_txt_record_value(service_handle, key) == DNSSD_ERROR_NO 
     error_code = dnssd_register_local_service(service_handle, __registered_cb, NULL);
 if (error_code == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in registering a local service.");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in registering a local service.");
  • The callback defined in the dnssd_register_local_service() function is called when the service registration is finished: 
     void
 __registered_cb(dnssd_error_e result, dnssd_service_h dnssd_service,
-                void* user_data)
+                void* user_data)
 {
-    if (result == DNSSD_ERROR_NONE) {
-        /* Service is registered successfully */
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Registered");
-    } else if (result == DNSSD_NAME_CONFLICT) {
-        /* Name conflict exists */
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Name conflict");
-    } else if (result == DNSSD_ALREADY_REGISTERED) {
-        /* Service is already registered */
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Already registered");
-    } else {
-        /* Result is unknown */
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Unknown result");
-    }
+    if (result == DNSSD_ERROR_NONE) {
+        /* Service is registered successfully */
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Registered");
+    } else if (result == DNSSD_NAME_CONFLICT) {
+        /* Name conflict exists */
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Name conflict");
+    } else if (result == DNSSD_ALREADY_REGISTERED) {
+        /* Service is already registered */
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Already registered");
+    } else {
+        /* Result is unknown */
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Unknown result");
+    }
 }
    • @@ -238,7 +238,7 @@ dnssd_destroy_local_service(service_handle); - +

    To search for available services on a network, use a service type or target information:

      @@ -247,13 +247,13 @@ dnssd_destroy_local_service(service_handle); 
       dnssd_browser_h browser_handle;
-char *service_type = "_ftp._tcp";
+char *service_type = "_ftp._tcp";
 int error_code;
 
 error_code = dnssd_start_browsing_service(service_type, &browser_handle,
-                                          __found_cb, NULL);
+                                          __found_cb, NULL);
 if (error_code == DNSSD_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Start browsing");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Start browsing");
    1. The callback defined in the dnssd_start_browsing_service() function is called when the remote service becomes available or unavailable: @@ -261,85 +261,85 @@ if (error_code == DNSSD_ERROR_NONE) void __dnssd_print_found(dnssd_service_h dnssd_remote_service) { -    /* Handling the found service */ -    char *service_name = NULL; -    char *service_type = NULL; -    char *ip_v4_address = NULL -    char *ip_v6_address = NULL; -    char *txt_record_value = NULL; -    int length = 0; -    int port = 0; -    error_code = dnssd_service_get_name(dnssd_remote_service, &service_name); -    if (error_code == DNSSD_ERROR_NONE && service_ name!= NULL) -        dlog_print(DLOG_DEBUG, LOG_TAG, "Service name [%s]", service_ name); - -    error_code = dnssd_service_get_type(dnssd_remote_service, &service_type); -    if (error_code == DNSSD_ERROR_NONE && service_type != NULL) -        dlog_print(DLOG_DEBUG, LOG_TAG, "Service type [%s]", service_type); - -    error_code = dnssd_service_get_ip(dnssd_remote_service, &ip_v4_address, -                                      &ip_v6_address) -    if (error_code == DNSSD_ERROR_NONE) { -        if (ip_v4_address) -            dlog_print(DLOG_DEBUG, LOG_TAG, "IPV4 address [%s]", ip_v4_address); -        if (ip_v6_address) -            dlog_print(DLOG_DEBUG, LOG_TAG, "IPV6 address [%s]", ip_v6_address); -    } - -    error_code = dnssd_service_get_port(dnssd_remote_service, &port) -    if (error_code == DNSSD_ERROR_NONE) -        dlog_print(DLOG_DEBUG, LOG_TAG, "Service port [%d]", port); -    error_code = dnssd_service_get_txt_record_value(dnssd_remote_service, -                                                    &txt_record_value, -                                                    &value); -    if (error_code == DNSSD_ERROR_NONE && txt_record_value!= NULL) -        dlog_print(DLOG_DEBUG, LOG_TAG, "Service TXT [%s]", txt_record_value); - -    if (service_name) -        free(service_name); -    if (service_type) -        free(service_type); -    if (ip_v4_address) -        free(ip_v4_address); -    if (ip_v6_address) -        free(ip_v6_address); -    if (txt_record_value) -        free(txt_record_value); + /* Handling the found service */ + char *service_name = NULL; + char *service_type = NULL; + char *ip_v4_address = NULL + char *ip_v6_address = NULL; + char *txt_record_value = NULL; + int length = 0; + int port = 0; + error_code = dnssd_service_get_name(dnssd_remote_service, &service_name); + if (error_code == DNSSD_ERROR_NONE && service_ name!= NULL) + dlog_print(DLOG_DEBUG, LOG_TAG, "Service name [%s]", service_ name); + + error_code = dnssd_service_get_type(dnssd_remote_service, &service_type); + if (error_code == DNSSD_ERROR_NONE && service_type != NULL) + dlog_print(DLOG_DEBUG, LOG_TAG, "Service type [%s]", service_type); + + error_code = dnssd_service_get_ip(dnssd_remote_service, &ip_v4_address, + &ip_v6_address) + if (error_code == DNSSD_ERROR_NONE) { + if (ip_v4_address) + dlog_print(DLOG_DEBUG, LOG_TAG, "IPV4 address [%s]", ip_v4_address); + if (ip_v6_address) + dlog_print(DLOG_DEBUG, LOG_TAG, "IPV6 address [%s]", ip_v6_address); + } + + error_code = dnssd_service_get_port(dnssd_remote_service, &port) + if (error_code == DNSSD_ERROR_NONE) + dlog_print(DLOG_DEBUG, LOG_TAG, "Service port [%d]", port); + error_code = dnssd_service_get_txt_record_value(dnssd_remote_service, + &txt_record_value, + &value); + if (error_code == DNSSD_ERROR_NONE && txt_record_value!= NULL) + dlog_print(DLOG_DEBUG, LOG_TAG, "Service TXT [%s]", txt_record_value); + + if (service_name) + free(service_name); + if (service_type) + free(service_type); + if (ip_v4_address) + free(ip_v4_address); + if (ip_v6_address) + free(ip_v6_address); + if (txt_record_value) + free(txt_record_value); } void __found_cb(dnssd_service_h dnssd_remote_service, dnssd_service_state_e state, -           void *user_data) + void *user_data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "Browse Service Callback\n"); -    dlog_print(DLOG_DEBUG, LOG_TAG, "Handler: %u\n", dnssd_remote_service); -    dlog_print(DLOG_DEBUG, LOG_TAG, "State: "); -    switch (browse_state) { -    case DNSSD_SERVICE_STATE_AVAILABLE: -        /* DNS-SD service found */ -        __dnssd_print_found(dnssd_remote_service); -        dlog_print(DLOG_DEBUG, LOG_TAG, "Available\n"); -        break; -    case DNSSD_SERVICE_STATE_UNAVAILABLE: -        /* DNS-SD service becomes unavailable */ -        dlog_print(DLOG_DEBUG, LOG_TAG, "Un-Available\n"); -        break; -    case DNSSD_SERVICE_STATE_NAME_LOOKUP_FAILED: -        /* Browsing failed */ -        dlog_print(DLOG_DEBUG, LOG_TAG, "Browse Failure\n"); -        break; -    case DNSSD_SERVICE_STATE_HOST_NAME_LOOKUP_FAILED: -        /* Resolving service name failed */ -        dlog_print(DLOG_DEBUG, LOG_TAG, "Resolve Service Name Failure\n"); -        break; -    case DNSSD_SERVICE_STATE_ADDRESS_LOOKUP_FAILED: -        /* Resolving service address failed */ -        dlog_print(DLOG_DEBUG, LOG_TAG, "Resolve Service Address\n"); -        break; -    default: -        dlog_print(DLOG_DEBUG, LOG_TAG, "Unknown Browse State\n"); -        break; -    } + dlog_print(DLOG_DEBUG, LOG_TAG, "Browse Service Callback\n"); + dlog_print(DLOG_DEBUG, LOG_TAG, "Handler: %u\n", dnssd_remote_service); + dlog_print(DLOG_DEBUG, LOG_TAG, "State: "); + switch (browse_state) { + case DNSSD_SERVICE_STATE_AVAILABLE: + /* DNS-SD service found */ + __dnssd_print_found(dnssd_remote_service); + dlog_print(DLOG_DEBUG, LOG_TAG, "Available\n"); + break; + case DNSSD_SERVICE_STATE_UNAVAILABLE: + /* DNS-SD service becomes unavailable */ + dlog_print(DLOG_DEBUG, LOG_TAG, "Un-Available\n"); + break; + case DNSSD_SERVICE_STATE_NAME_LOOKUP_FAILED: + /* Browsing failed */ + dlog_print(DLOG_DEBUG, LOG_TAG, "Browse Failure\n"); + break; + case DNSSD_SERVICE_STATE_HOST_NAME_LOOKUP_FAILED: + /* Resolving service name failed */ + dlog_print(DLOG_DEBUG, LOG_TAG, "Resolve Service Name Failure\n"); + break; + case DNSSD_SERVICE_STATE_ADDRESS_LOOKUP_FAILED: + /* Resolving service address failed */ + dlog_print(DLOG_DEBUG, LOG_TAG, "Resolve Service Address\n"); + break; + default: + dlog_print(DLOG_DEBUG, LOG_TAG, "Unknown Browse State\n"); + break; + } }
      2. @@ -352,7 +352,7 @@ dnssd_stop_browsing_service(browser_handle);

      Managing a Local Service with SSDP

      - +

      To announce a local service, create a local service handle using the ssdp_create_local_service() function, and set the service information using the handle. Afterwards, you can register the local service using the ssdp_register_local_service() function.

      To manage a local service, you must create and register the service:

      @@ -365,25 +365,25 @@ dnssd_stop_browsing_service(browser_handle); 
       ssdp_service_h service_handle;
-char *target = "upnp:rootdevice";
+char *target = "upnp:rootdevice";
 int error_code;
 
 error_code = ssdp_create_local_service(target, &service_handle);
 if (error_code == SSDP_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in creating a service handle.");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in creating a service handle.");
    2. Set a USN (Unique Service Name) and a URL (Uniform Resource Locator) for the created service.

      The USN format is also specified in the UPnP forum. For the URL, see the RFC 3986.

      -char* usn = "uuid:1234abcd-12ab-12ab-12ab-1234567abc12::upnp:rootdevice";
-char* url = "192.168.0.2:1234";
+char* usn = "uuid:1234abcd-12ab-12ab-12ab-1234567abc12::upnp:rootdevice";
+char* url = "192.168.0.2:1234";
 
 if (ssdp_service_set_usn(service_handle, usn) == SSDP_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting USN");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting USN");
 if (ssdp_service_set_url(service_handle, url) == SSDP_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting URL");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in setting URL");
    @@ -396,7 +396,7 @@ if (ssdp_service_set_url(service_handle, url) == SSDP_ERROR_NONE) 
     error_code = ssdp_register_local_service(service_handle, __registered_cb, NULL);
 if (error_code == SSDP_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in registering a local service.");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Success in registering a local service.");
  • The callback defined in the ssdp_register_local_service() function is called when the service registration is finished: @@ -404,7 +404,7 @@ if (error_code == SSDP_ERROR_NONE) void __registered_cb(ssdp_error_e result, ssdp_service_h ssdp_service, void *user_data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "Register result: %d\n", result); + dlog_print(DLOG_DEBUG, LOG_TAG, "Register result: %d\n", result); }
    • @@ -429,28 +429,28 @@ ssdp_destroy_local_service(service_handle); 
     ssdp_browser_h browser_handle;
-char *target = "upnp:rootdevice";
+char *target = "upnp:rootdevice";
 int error_code;
 
 error_code = ssdp_start_browsing_service(target, &browser_handle, __found_cb, NULL);
 if (error_code == SSDP_ERROR_NONE)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Start browsing");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Start browsing");
  • The callback defined in the ssdp_start_browsing_service() function is called when the remote service becomes available or unavailable: 
     void
 __found_cb(ssdp_service_h ssdp_remote_service, ssdp_service_state_e state,
-           void *user_data)
+           void *user_data)
 {
-    char *usn;
-    char *url;
-    ssdp_service_get_usn(ssdp_remote_service, &usn);
-    ssdp_service_get_url(ssdp_remote_service, &url);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "state: %s\n",
-               state==SSDP_SERVICE_STATE_AVAILABLE ? "AVAILABLE" : "UNAVAILABLE");
-    dlog_print(DLOG_DEBUG, LOG_TAG, "usn: %s\n", usn);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "url: %s\n", url);
+    char *usn;
+    char *url;
+    ssdp_service_get_usn(ssdp_remote_service, &usn);
+    ssdp_service_get_url(ssdp_remote_service, &url);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "state: %s\n",
+               state==SSDP_SERVICE_STATE_AVAILABLE ? "AVAILABLE" : "UNAVAILABLE");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "usn: %s\n", usn);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "url: %s\n", url);
 }
    • diff --git a/org.tizen.guides/html/native/connectivity/plugins_n.htm b/org.tizen.guides/html/native/connectivity/plugins_n.htm index c9efd87..dcf2b74 100644 --- a/org.tizen.guides/html/native/connectivity/plugins_n.htm +++ b/org.tizen.guides/html/native/connectivity/plugins_n.htm @@ -35,7 +35,7 @@
  • Uploading Files
  • Downloading Files
  • Removing Files
    • - +

    Related Info

    Related Info

    Prerequisites

    @@ -353,23 +353,23 @@

    To use the Telephony Information API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/telephony</privilege>
-   <privilege>http://tizen.org/privilege/location.coarse</privilege>
+   <privilege>http://tizen.org/privilege/telephony</privilege>
+   <privilege>http://tizen.org/privilege/location.coarse</privilege>
 </privileges>
    -
  • +

  • To use the functions and data types of the Telephony Information API, include the <telephony.h> header file in your application:

     #include <telephony.h>
-
    • +

  • To create a telephony handle, use the telephony_handle_list_s structure that holds the handles for all the subscriptions defined in the telephony_common.h header file:

     struct _telephony_handle_list_s {
-    unsigned int count;
-    telephony_h *handle;
+    unsigned int count;
+    telephony_h *handle;
 };
 typedef struct _telephony_handle_list_s telephony_handle_list_s;
    @@ -383,21 +383,21 @@ telephony_handle_list_s handle_list; int main() { -    int i; + int i; -    /* In case of single SIM, you get only one handle */ -    ret = telephony_init(&handle_list); -    if (ret != TELEPHONY_ERROR_NONE) { -        /* Error handling */ + /* In case of single SIM, you get only one handle */ + ret = telephony_init(&handle_list); + if (ret != TELEPHONY_ERROR_NONE) { + /* Error handling */ -        return -1; -    } -    for (i = 0; i < handle_list.count; i++) { -        dlog_print(DLOG_INFO, LOG_TAG, "telephony handle[%p] for subscription[%d]", -                   handle_list.handle[i], i); -    } + return -1; + } + for (i = 0; i < handle_list.count; i++) { + dlog_print(DLOG_INFO, LOG_TAG, "telephony handle[%p] for subscription[%d]", + handle_list.handle[i], i); + } -    return 0; + return 0; }
    • @@ -406,19 +406,19 @@ main() void tutorial_telephony_deinit() { -    ret = telephony_deinit(&handle_list); + ret = telephony_deinit(&handle_list); }

    Getting Call Information

    - +

    To get the voice and video call state and be notified when the user makes a voice or video call or hangs up the phone, use the Call API (in mobile and wearable applications).

    Getting call information involves:

    - +

    Getting the Current Call List

    @@ -434,52 +434,52 @@ telephony_call_h *call_list; void tutorial_telephony_call_get_call_list() { -    telephony_error_e ret; - -    ret = telephony_call_get_call_list(handle_list.handle[0], &count, &call_list); -    if (ret != TELEPHONY_ERROR_NONE) { -        /* Error handling */ -    } else { -        int i; -        unsigned int handle_id = 0; -        char *number = NULL; -        telephony_call_type_e type = 0; -        telephony_call_status_e status = 0; -        telephony_call_direction_e direction = 0; -        bool conf_status = 0; - -        if (count == 0) { -            dlog_print(DLOG_INFO, LOG_TAG, "count[%d], No calls", count); - -            return; -        } - -        for (i = 0; i < count; i++) { -            telephony_call_get_handle_id(call_list[i], &handle_id); -            telephony_call_get_number(call_list[i], &number); -            telephony_call_get_type(call_list[i], &type); -            telephony_call_get_status(call_list[i], &status); -            telephony_call_get_direction(call_list[i], &direction); -            telephony_call_get_conference_status(call_list[i], &conf_status); - -            dlog_print(DLOG_INFO, LOG_TAG, -                       "id[%d] number[%s] type[%s] status[%s] -                        direction[%s] conference_status[%s]", -                       handle_id, number, -                       type == TELEPHONY_CALL_TYPE_VOICE ? "VOICE" : -                       type == TELEPHONY_CALL_TYPE_VIDEO ? "VIDEO" : "E911", -                       status == TELEPHONY_CALL_STATUS_IDLE ? "IDLE" : -                       status == TELEPHONY_CALL_STATUS_ACTIVE ? "ACTIVE" : -                       status == TELEPHONY_CALL_STATUS_HELD ? "HELD" : -                       status == TELEPHONY_CALL_STATUS_DIALING ? "DIALING" : -                       status == TELEPHONY_CALL_STATUS_ALERTING ? "ALERTING" : -                       status == TELEPHONY_CALL_STATUS_INCOMING ? "INCOMING" : "UNKNOWN", -                       direction == TELEPHONY_CALL_DIRECTION_MO ? "MO" : "MT", -                       conf_status ? "TRUE" : "FALSE"); -            free(number); -        } -        telephony_call_release_call_list(count, &call_list); -    } + telephony_error_e ret; + + ret = telephony_call_get_call_list(handle_list.handle[0], &count, &call_list); + if (ret != TELEPHONY_ERROR_NONE) { + /* Error handling */ + } else { + int i; + unsigned int handle_id = 0; + char *number = NULL; + telephony_call_type_e type = 0; + telephony_call_status_e status = 0; + telephony_call_direction_e direction = 0; + bool conf_status = 0; + + if (count == 0) { + dlog_print(DLOG_INFO, LOG_TAG, "count[%d], No calls", count); + + return; + } + + for (i = 0; i < count; i++) { + telephony_call_get_handle_id(call_list[i], &handle_id); + telephony_call_get_number(call_list[i], &number); + telephony_call_get_type(call_list[i], &type); + telephony_call_get_status(call_list[i], &status); + telephony_call_get_direction(call_list[i], &direction); + telephony_call_get_conference_status(call_list[i], &conf_status); + + dlog_print(DLOG_INFO, LOG_TAG, + "id[%d] number[%s] type[%s] status[%s] + direction[%s] conference_status[%s]", + handle_id, number, + type == TELEPHONY_CALL_TYPE_VOICE ? "VOICE" : + type == TELEPHONY_CALL_TYPE_VIDEO ? "VIDEO" : "E911", + status == TELEPHONY_CALL_STATUS_IDLE ? "IDLE" : + status == TELEPHONY_CALL_STATUS_ACTIVE ? "ACTIVE" : + status == TELEPHONY_CALL_STATUS_HELD ? "HELD" : + status == TELEPHONY_CALL_STATUS_DIALING ? "DIALING" : + status == TELEPHONY_CALL_STATUS_ALERTING ? "ALERTING" : + status == TELEPHONY_CALL_STATUS_INCOMING ? "INCOMING" : "UNKNOWN", + direction == TELEPHONY_CALL_DIRECTION_MO ? "MO" : "MT", + conf_status ? "TRUE" : "FALSE"); + free(number); + } + telephony_call_release_call_list(count, &call_list); + } } @@ -489,7 +489,7 @@ tutorial_telephony_call_get_call_list() void tutorial_telephony_call_release_call_list() { -    telephony_call_release_call_list(count, &call_list); + telephony_call_release_call_list(count, &call_list); } @@ -505,112 +505,112 @@ tutorial_telephony_call_release_call_list() static int voice_call_noti_tbl[] = { -    TELEPHONY_NOTI_VOICE_CALL_STATUS_IDLE, -    TELEPHONY_NOTI_VOICE_CALL_STATUS_ACTIVE, -    TELEPHONY_NOTI_VOICE_CALL_STATUS_HELD, -    TELEPHONY_NOTI_VOICE_CALL_STATUS_DIALING, -    TELEPHONY_NOTI_VOICE_CALL_STATUS_ALERTING, -    TELEPHONY_NOTI_VOICE_CALL_STATUS_INCOMING, + TELEPHONY_NOTI_VOICE_CALL_STATUS_IDLE, + TELEPHONY_NOTI_VOICE_CALL_STATUS_ACTIVE, + TELEPHONY_NOTI_VOICE_CALL_STATUS_HELD, + TELEPHONY_NOTI_VOICE_CALL_STATUS_DIALING, + TELEPHONY_NOTI_VOICE_CALL_STATUS_ALERTING, + TELEPHONY_NOTI_VOICE_CALL_STATUS_INCOMING, }; void voice_call_status_noti_cb(telephony_h handle, telephony_noti_e noti_id, void *data, -                          void* user_data) + void* user_data) { -    int ret_value; -    telephony_call_h *call_list; -    unsigned int count = 0; - -    switch (noti_id) { -    case TELEPHONY_NOTI_VOICE_CALL_STATUS_IDLE: -        dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Idle!!! [%d]", -                   *(int *)data); -        break; -    case TELEPHONY_NOTI_VOICE_CALL_STATUS_ACTIVE: -        dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Active!!! [%d]", -                   *(int *)data); -        break; -    case TELEPHONY_NOTI_VOICE_CALL_STATUS_HELD: -        dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Held!!! [%d]", -                   *(int *)data); -        break; -    case TELEPHONY_NOTI_VOICE_CALL_STATUS_DIALING: -        dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Dialing!!! [%d]", -                   *(int *)data); -        break; -    case TELEPHONY_NOTI_VOICE_CALL_STATUS_ALERTING: -        dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Alerting!!! [%d]", -                   *(int *)data); -        break; -    case TELEPHONY_NOTI_VOICE_CALL_STATUS_INCOMING: -        dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Incoming!!! [%d]", -                   *(int *)data); -        break; -    default: -        dlog_print(DLOG_INFO, LOG_TAG, "Unknown noti"); -        break; -    } - -    ret_value = telephony_call_get_call_list(handle_list.handle[0], &count, &call_list); -    if (ret_value != TELEPHONY_ERROR_NONE) { -        dlog_print(DLOG_INFO, LOG_TAG, -                   "telephony_call_get_call_list() failed!!! [0x%x]", ret_value); -    } else { -        int i; -        unsigned int handle_id = 0; -        char *number = NULL; -        telephony_call_type_e type = 0; -        telephony_call_status_e status = 0; -        telephony_call_direction_e direction = 0; -        bool conf_status = 0; - -        for (i = 0; i < count; i++) { -            telephony_call_get_handle_id(call_list[i], &handle_id); -            telephony_call_get_number(call_list[i], &number); -            telephony_call_get_type(call_list[i], &type); -            telephony_call_get_status(call_list[i], &status); -            telephony_call_get_direction(call_list[i], &direction); -            telephony_call_get_conference_status(call_list[i], &conf_status); - -            dlog_print(DLOG_INFO, LOG_TAG, -                       "id[%d] number[%s] type[%s] status[%s] -                        direction[%s] conference_status[%s]", -                       handle_id, number, -                       type == TELEPHONY_CALL_TYPE_VOICE ? "VOICE" : -                       type == TELEPHONY_CALL_TYPE_VIDEO ? "VIDEO" : "E911", -                       status == TELEPHONY_CALL_STATUS_IDLE ? "IDLE" : -                       status == TELEPHONY_CALL_STATUS_ACTIVE ? "ACTIVE" : -                       status == TELEPHONY_CALL_STATUS_HELD ? "HELD" : -                       status == TELEPHONY_CALL_STATUS_DIALING ? "DIALING" : -                       status == TELEPHONY_CALL_STATUS_ALERTING ? "ALERTING" : -                       status == TELEPHONY_CALL_STATUS_INCOMING ? "INCOMING" : "UNKNOWN", -                       direction == TELEPHONY_CALL_DIRECTION_MO ? "MO" : "MT", -                       conf_status ? "TRUE" : "FALSE"); -            free(number); -        } -        telephony_call_release_call_list(count, &call_list); -    } + int ret_value; + telephony_call_h *call_list; + unsigned int count = 0; + + switch (noti_id) { + case TELEPHONY_NOTI_VOICE_CALL_STATUS_IDLE: + dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Idle!!! [%d]", + *(int *)data); + break; + case TELEPHONY_NOTI_VOICE_CALL_STATUS_ACTIVE: + dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Active!!! [%d]", + *(int *)data); + break; + case TELEPHONY_NOTI_VOICE_CALL_STATUS_HELD: + dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Held!!! [%d]", + *(int *)data); + break; + case TELEPHONY_NOTI_VOICE_CALL_STATUS_DIALING: + dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Dialing!!! [%d]", + *(int *)data); + break; + case TELEPHONY_NOTI_VOICE_CALL_STATUS_ALERTING: + dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Alerting!!! [%d]", + *(int *)data); + break; + case TELEPHONY_NOTI_VOICE_CALL_STATUS_INCOMING: + dlog_print(DLOG_INFO, LOG_TAG, "Noti!!! Voice Call Status Incoming!!! [%d]", + *(int *)data); + break; + default: + dlog_print(DLOG_INFO, LOG_TAG, "Unknown noti"); + break; + } + + ret_value = telephony_call_get_call_list(handle_list.handle[0], &count, &call_list); + if (ret_value != TELEPHONY_ERROR_NONE) { + dlog_print(DLOG_INFO, LOG_TAG, + "telephony_call_get_call_list() failed!!! [0x%x]", ret_value); + } else { + int i; + unsigned int handle_id = 0; + char *number = NULL; + telephony_call_type_e type = 0; + telephony_call_status_e status = 0; + telephony_call_direction_e direction = 0; + bool conf_status = 0; + + for (i = 0; i < count; i++) { + telephony_call_get_handle_id(call_list[i], &handle_id); + telephony_call_get_number(call_list[i], &number); + telephony_call_get_type(call_list[i], &type); + telephony_call_get_status(call_list[i], &status); + telephony_call_get_direction(call_list[i], &direction); + telephony_call_get_conference_status(call_list[i], &conf_status); + + dlog_print(DLOG_INFO, LOG_TAG, + "id[%d] number[%s] type[%s] status[%s] + direction[%s] conference_status[%s]", + handle_id, number, + type == TELEPHONY_CALL_TYPE_VOICE ? "VOICE" : + type == TELEPHONY_CALL_TYPE_VIDEO ? "VIDEO" : "E911", + status == TELEPHONY_CALL_STATUS_IDLE ? "IDLE" : + status == TELEPHONY_CALL_STATUS_ACTIVE ? "ACTIVE" : + status == TELEPHONY_CALL_STATUS_HELD ? "HELD" : + status == TELEPHONY_CALL_STATUS_DIALING ? "DIALING" : + status == TELEPHONY_CALL_STATUS_ALERTING ? "ALERTING" : + status == TELEPHONY_CALL_STATUS_INCOMING ? "INCOMING" : "UNKNOWN", + direction == TELEPHONY_CALL_DIRECTION_MO ? "MO" : "MT", + conf_status ? "TRUE" : "FALSE"); + free(number); + } + telephony_call_release_call_list(count, &call_list); + } } void tutorial_telephony_set_noti_cb_voice() { -    telephony_error_e ret; -    int i; - -    for (i = 0; i < (sizeof(voice_call_noti_tbl) / sizeof(int)); i++) { -        ret = telephony_set_noti_cb(handle_list.handle[0], voice_call_noti_tbl[i], -                                    voice_call_status_noti_cb, NULL); -        if (ret != TELEPHONY_ERROR_NONE) -            /* Error handling */ -    } + telephony_error_e ret; + int i; + + for (i = 0; i < (sizeof(voice_call_noti_tbl) / sizeof(int)); i++) { + ret = telephony_set_noti_cb(handle_list.handle[0], voice_call_noti_tbl[i], + voice_call_status_noti_cb, NULL); + if (ret != TELEPHONY_ERROR_NONE) + /* Error handling */ + } }

    Getting SIM Card Information

    - +

    To extract information stored on a SIM card, use the SIM API (in mobile and wearable applications).

    Getting SIM information involves:

    -

    Access Point

    +

    Access Point

    The Access Point API (in mobile and wearable applications) provides functions for managing access points (AP). You need to create an AP handle (wifi_manager_ap_h) for using the API functions.

    @@ -89,129 +89,129 @@
  • Getting the security information

    • The following table lists the network information details you can access with the Network Information API (in mobile and wearable applications).

    - +

    Table: Network information details

    - - - - - - - - - - - - - +
    InformationDescription
    BssidBasic service set identifier
    Connection stateConnection state
    + + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - -
    InformationDescription
    DNS addressDNS address
    BssidBasic service set identifier
    EssidExtended service set identifier
    Connection stateConnection state
    FrequencyFrequency (in MHz)
    DNS addressDNS address
    IP addressIP address
    EssidExtended service set identifier
    IP config typeNet IP configuration type
    FrequencyFrequency (in MHz)
    Max speedMaximum speed (in Mbps)
    IP addressIP address
    Proxy addressProxy address
    IP config typeNet IP configuration type
    Proxy typeProxy method type
    Max speedMaximum speed (in Mbps)
    RssiReceived signal strength indication
    Proxy addressProxy address
    Subnet maskSubnet mask
    Proxy typeProxy method type
    + + Rssi + Received signal strength indication + + + Subnet mask + Subnet mask + + +

    The following table lists the security information details you can access with the Security Information API (in mobile and wearable applications).

    Table: Security information details

    - - - - - - - - - +
    InformationDescription
    Encryption typeWi-Fi encryption type, used in the infrastructure and ad-hoc mode
    + + + + + + + + - - - + + + - - - + + + - - - + + + - -
    InformationDescription
    Encryption typeWi-Fi encryption type, used in the infrastructure and ad-hoc mode
    Security typeWi-Fi security type
    Security typeWi-Fi security type
    Passphrase requiredWhether the passphrase is required
    Passphrase requiredWhether the passphrase is required
    WPS supportedWhether the WPS (Wi-Fi Protected Setup) is supported
    WPS supportedWhether the WPS (Wi-Fi Protected Setup) is supported
    + +

    You can also obtain the EAP information listed in the following table.

    Table: EAP information details

    - - - - - - - - - +
    InformationDescription
    Authentication typeType of EAP phase2 authentication of Wi-Fi
    + + + + - - - + + + - - - + + + - - + + + + + + - - - + + + + + + + - - - - - -
    InformationDescription
    CA certificateEAP CA certificate (valid only if the EAP type is TLS)
    Authentication typeType of EAP phase2 authentication of Wi-Fi
    Client CertificateEAP client certificate (valid only if the EAP type is TLS)
    CA certificateEAP CA certificate (valid only if the EAP type is TLS)
    Passphrase
    Client CertificateEAP client certificate (valid only if the EAP type is TLS)
    Passphrase EAP passphrase (valid if the EAP type is PEAP or TTLS)
    Private key fileEAP private key file (valid only if the EAP type is TLS)
    Private key fileEAP private key file (valid only if the EAP type is TLS)
    EAP typeEAP type of Wi-Fi
    EAP typeEAP type of Wi-Fi
    + + -

    Wi-Fi Monitor

    +

    Wi-Fi Monitor

    The Wi-Fi Monitor API (in mobile and wearable applications) provides functions for monitoring the Wi-Fi connection state.

    @@ -230,27 +230,27 @@

    The Wi-Fi Monitor also allows monitoring the changes in Wi-Fi. With the Wi-Fi Monitor, you can register callback functions, which notify you when Wi-Fi properties change. The property changes resulting in notifications are listed in the following table.

    -

    Table: Property changes

    - - - - - - - - - +

    Table: Property changes

    +
    Change inDescription
    Connection stateThe callback is called when the connection state is changed.
    + + + + + + + + + + + + - - - + + + - - - - - -
    Change inDescription
    Connection stateThe callback is called when the connection state is changed.
    Device stateThe callback is called when the device state changes.
    Device stateThe callback is called when the device state changes.
    RSSI levelThe callback is called when the RSSI of the connected Wi-Fi changes.
    RSSI levelThe callback is called when the RSSI of the connected Wi-Fi changes.
    + +

    Prerequisites

    @@ -260,11 +260,11 @@

    To use the Wi-Fi Manager API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/network.get</privilege>
-   <privilege>http://tizen.org/privilege/network.set</privilege>
-   <privilege>http://tizen.org/privilege/network.profile</privilege>
+   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/network.set</privilege>
+   <privilege>http://tizen.org/privilege/network.profile</privilege>
 </privileges>
-
    +

  • To use the functions and data types of the Wi-Fi Manager API, include the <wifi-manager.h> header file in your application:

    @@ -280,7 +280,7 @@ int error_code; error_code = wifi_manager_initialize(wifi); if (error_code != WIFI_ERROR_NONE) -    return; + return;
  • @@ -313,8 +313,8 @@ error_code = wifi_manager_activate(wifi, __wifi_manager_activated_cb, NULL); static void __wifi_manager_activated_cb(wifi_error_e result, void *user_data) { -    if (result == WIFI_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Success to activate Wi-Fi device!"); + if (result == WIFI_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Success to activate Wi-Fi device!"); }
    • @@ -324,9 +324,9 @@ __wifi_manager_activated_cb(wifi_error_e result, void *user_data) bool wifi_manager_activated = false; wifi_manager_is_activated(wifi, &wifi_manager_activated); if (wifi_manager_activated) -    dlog_print(DLOG_INFO, LOG_TAG, "Success to get Wi-Fi device state."); + dlog_print(DLOG_INFO, LOG_TAG, "Success to get Wi-Fi device state."); else -    dlog_print(DLOG_INFO, LOG_TAG, "Failed to get Wi-Fi device state."); + dlog_print(DLOG_INFO, LOG_TAG, "Failed to get Wi-Fi device state.");

  • To deactivate the Wi-Fi device when Wi-Fi is no longer needed (or the application is exiting), use the wifi_manager_deactivate() function:

    @@ -341,21 +341,21 @@ wifi_manager_deactivate(wifi, NULL, NULL);

    To scan nearby access points and print the scanning result, such as the AP name and state:

    1. Scan nearby access points asynchronously: - + 
       wifi_manager_scan(wifi, __scan_request_cb, NULL);
    2. Define a callback, which is invoked when the scan is finished.

      In the following example, the callback calls the wifi_manager_foreach_found_ap() function for getting information on the found AP. The wifi_manager_foreach_found_ap() function gets the result of the scan, and the __wifi_manager_found_ap_cb() callback is called for each found access point.

      - + 
       void
 __scan_request_cb(wifi_error_e error_code, void *user_data)
 {
-    error_code = wifi_manager_foreach_found_ap(wifi, __wifi_manager_found_ap_cb, NULL);
-    if (error_code != WIFI_ERROR_NONE)
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to scan");
+    error_code = wifi_manager_foreach_found_ap(wifi, __wifi_manager_found_ap_cb, NULL);
+    if (error_code != WIFI_ERROR_NONE)
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to scan");
 }
      3. @@ -366,40 +366,40 @@ __scan_request_cb(wifi_error_e error_code, void *user_data) bool __wifi_manager_found_ap_cb(wifi_ap_h ap, void *user_data) { -    int error_code = 0; -    char *ap_name = NULL; -    wifi_connection_state_e state; + int error_code = 0; + char *ap_name = NULL; + wifi_connection_state_e state; -    error_code = wifi_manager_ap_get_essid(ap, &ap_name); -    if (error_code != WIFI_ERROR_NONE) { -        dlog_print(DLOG_INFO, LOG_TAG, "Failed to get AP name."); + error_code = wifi_manager_ap_get_essid(ap, &ap_name); + if (error_code != WIFI_ERROR_NONE) { + dlog_print(DLOG_INFO, LOG_TAG, "Failed to get AP name."); -        return false; -    } -    error_code = wifi_manager_ap_get_connection_state(ap, &state); -    if (error_code != WIFI_ERROR_NONE) { -        dlog_print(DLOG_INFO, LOG_TAG, "Failed to get state."); + return false; + } + error_code = wifi_manager_ap_get_connection_state(ap, &state); + if (error_code != WIFI_ERROR_NONE) { + dlog_print(DLOG_INFO, LOG_TAG, "Failed to get state."); -        return false; -    } -    dlog_print(DLOG_INFO, LOG_TAG, "AP name: %s, state: %s", ap_name, print_state(state)); + return false; + } + dlog_print(DLOG_INFO, LOG_TAG, "AP name: %s, state: %s", ap_name, print_state(state)); -    return true; + return true; } static const char* print_state(wifi_connection_state_e state) { -    switch (state) { -    case WIFI_CONNECTION_STATE_DISCONNECTED: -        return "Disconnected"; -    case WIFI_CONNECTION_STATE_ASSOCIATION: -        return "Association"; -    case WIFI_CONNECTION_STATE_CONNECTED: -        return "Connected"; -    case WIFI_CONNECTION_STATE_CONFIGURATION: -        return "Configuration"; -    } + switch (state) { + case WIFI_CONNECTION_STATE_DISCONNECTED: + return "Disconnected"; + case WIFI_CONNECTION_STATE_ASSOCIATION: + return "Association"; + case WIFI_CONNECTION_STATE_CONNECTED: + return "Connected"; + case WIFI_CONNECTION_STATE_CONFIGURATION: + return "Configuration"; + } } @@ -418,77 +418,77 @@ bool state = false; wifi_manager_is_activated(wifi, &state); if (state == false) -    return -1; + return -1; -dlog_print(DLOG_INFO, LOG_TAG, "Input a part of AP name to connect: "); -error_code = scanf("%32s", ap_name); +dlog_print(DLOG_INFO, LOG_TAG, "Input a part of AP name to connect: "); +error_code = scanf("%32s", ap_name); error_code = wifi_manager_foreach_found_ap(wifi, __found_connect_ap_cb, ap_name); if (error_code != WIFI_ERROR_NONE) { -    dlog_print(DLOG_INFO, LOG_TAG, "Failed to connect (can't get AP list)"); + dlog_print(DLOG_INFO, LOG_TAG, "Failed to connect (can't get AP list)"); -    return -1; + return -1; } -dlog_print(DLOG_INFO, LOG_TAG, "Connection step finished"); +dlog_print(DLOG_INFO, LOG_TAG, "Connection step finished");
    3. Make a connection with an access point.

      Define the __found_connect_ap_cb() callback invoked by the wifi_manager_foreach_found_ap() function.

      -

      The callback compares user_data (the AP name from the user input) with the name of the found AP. If it is correct, the function checks whether the AP requires a passphrase. Set the passphrase using the wifi_manager_ap_set_passphrase() function.

      +

      The callback compares user_data (the AP name from the user input) with the name of the found AP. If it is correct, the function checks whether the AP requires a passphrase. Set the passphrase using the wifi_manager_ap_set_passphrase() function.

      Finally, connect to a specific AP using the wifi_manager_connect() function.

       static bool
 __found_connect_ap_cb(wifi_ap_h ap, void *user_data)
 {
-    int error_code = 0;
-    char *ap_name = NULL;
-    char *ap_name_part = (char*)user_data;
+    int error_code = 0;
+    char *ap_name = NULL;
+    char *ap_name_part = (char*)user_data;
 
-    error_code = wifi_manager_ap_get_essid(ap, &ap_name);
-    if (error_code != WIFI_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Failed to get AP name");
+    error_code = wifi_manager_ap_get_essid(ap, &ap_name);
+    if (error_code != WIFI_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Failed to get AP name");
 
-        return false;
-    }
+        return false;
+    }
 
-    if (strstr(ap_name, ap_name_part) != NULL) {
-        bool required = false;
+    if (strstr(ap_name, ap_name_part) != NULL) {
+        bool required = false;
 
-        if (wifi_manager_ap_is_passphrase_required(ap, &required) == WIFI_ERROR_NONE)
-            dlog_print(DLOG_INFO, LOG_TAG, "Passphrase required: %s",
-                       required ? "True" : "False");
-        else
-            dlog_print(DLOG_INFO, LOG_TAG, "Failed to get Passphrase required");
+        if (wifi_manager_ap_is_passphrase_required(ap, &required) == WIFI_ERROR_NONE)
+            dlog_print(DLOG_INFO, LOG_TAG, "Passphrase required: %s",
+                       required ? "True" : "False");
+        else
+            dlog_print(DLOG_INFO, LOG_TAG, "Failed to get Passphrase required");
 
-        if (required) {
-            char passphrase[100];
-            dlog_print(DLOG_INFO, LOG_TAG, "Input passphrase for %s: ", passphrase);
-            error_code = scanf("99%s", passphrase);
+        if (required) {
+            char passphrase[100];
+            dlog_print(DLOG_INFO, LOG_TAG, "Input passphrase for %s: ", passphrase);
+            error_code = scanf("99%s", passphrase);
 
-            error_code = wifi_manager_ap_set_passphrase(ap, passphrase);
-            if (error_code != WIFI_ERROR_NONE) {
-                dlog_print(DLOG_INFO, LOG_TAG, "Failed to set passphrase");
+            error_code = wifi_manager_ap_set_passphrase(ap, passphrase);
+            if (error_code != WIFI_ERROR_NONE) {
+                dlog_print(DLOG_INFO, LOG_TAG, "Failed to set passphrase");
 
-                return false;
-            }
-        }
+                return false;
+            }
+        }
 
-        error_code = wifi_manager_connect(wifi, ap, __connected_cb, NULL);
-        if (error_code != WIFI_ERROR_NONE)
-            dlog_print(DLOG_INFO, LOG_TAG, "Failed in connection request");
-        else
-            dlog_print(DLOG_INFO, LOG_TAG, "Success in connection request");
+        error_code = wifi_manager_connect(wifi, ap, __connected_cb, NULL);
+        if (error_code != WIFI_ERROR_NONE)
+            dlog_print(DLOG_INFO, LOG_TAG, "Failed in connection request");
+        else
+            dlog_print(DLOG_INFO, LOG_TAG, "Success in connection request");
 
-        free(ap_name);
+        free(ap_name);
 
-        return false;
-    }
+        return false;
+    }
 
-    free(ap_name);
+    free(ap_name);
 
-    return true;
+    return true;
 }
      4. @@ -499,10 +499,10 @@ __found_connect_ap_cb(wifi_ap_h ap, void *user_data) static void __connected_cb(wifi_error_e result, void* user_data) { -    if (result == WIFI_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Wi-Fi Connection Succeeded"); -    else -        dlog_print(DLOG_INFO, LOG_TAG, "Wi-Fi Connection Failed!"); + if (result == WIFI_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Wi-Fi Connection Succeeded"); + else + dlog_print(DLOG_INFO, LOG_TAG, "Wi-Fi Connection Failed!"); }
    diff --git a/org.tizen.guides/html/native/data/data_cover_n.htm b/org.tizen.guides/html/native/data/data_cover_n.htm index 857fe85..2589291 100644 --- a/org.tizen.guides/html/native/data/data_cover_n.htm +++ b/org.tizen.guides/html/native/data/data_cover_n.htm @@ -5,13 +5,13 @@ - + - Data Storage and Management + Data Storage and Management @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • - +

    Data Storage and Management

    @@ -45,7 +45,7 @@

    You can access SQLite and OpenSSL open source modules. They enable you to store application data in a database, and encrypt it for protection.

    - +
    diff --git a/org.tizen.guides/html/native/data/data_storages_n.htm b/org.tizen.guides/html/native/data/data_storages_n.htm index 0f2eb61..04e695b 100644 --- a/org.tizen.guides/html/native/data/data_storages_n.htm +++ b/org.tizen.guides/html/native/data/data_storages_n.htm @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - +

    Dependencies

      @@ -29,11 +29,11 @@

    Content

    Related Info

      @@ -46,7 +46,7 @@

      Data Storages

      -

      Tizen enables you to get storage information and manage directories.

      +

      Tizen enables you to get storage information and manage directories.

      The Storage API provides access to accessible parts of the file system, which are represented as virtual root locations. The virtual roots form a collection of locations that function as a single virtual device file system. The following table lists the supported virtual roots.

      Table: Filesystem virtual roots

      @@ -147,15 +147,15 @@ error = storage_get_external_memory_size(&s); static int internal_storage_id; static bool storage_cb(int storage_id, storage_type_e type, storage_state_e state, -           const char *path, void *user_data) + const char *path, void *user_data) { -    if (type == STORAGE_TYPE_INTERNAL) { -        internal_storage_id = storage_id; + if (type == STORAGE_TYPE_INTERNAL) { + internal_storage_id = storage_id; -        return false; -    } + return false; + } -    return true; + return true; } int error; @@ -220,9 +220,9 @@ error = storage_get_state(internal_storage_id, &state); static void storage_changed_cb(int storage_id, storage_state_e state, void *user_data) { -    if (storage_id != internal_storage_id) -        return; -    dlog_print(DLOG_DEBUG, LOG_TAG, "state changed to %d", state); + if (storage_id != internal_storage_id) + return; + dlog_print(DLOG_DEBUG, LOG_TAG, "state changed to %d", state); } @@ -243,7 +243,7 @@ error = storage_unset_state_changed_cb(internal_storage_id, storage_changed_cb);

      Retrieving Storage Space Information

      -

      To get the available and total space size of the storage, use the storage_get_total_space() and storage_get_available_space() functions. They return the storage size, excluding the minimum memory size to launch the low memory pop-up in case of a low memory situation. Consequently, the available size must be less than the original available size, and you must use these functions to get the memory size. For the same reason, you cannot use the statvfs function directly in Tizen. Instead, use storage_get_internal_memory_size() and storage_get_external_memory_size(). The Statvfs structure has a different structure size defined by "__USE_FILE_OFFSET64". However, you can ignore this, since the Storage API uses a proper function automatically.

      +

      To get the available and total space size of the storage, use the storage_get_total_space() and storage_get_available_space() functions. They return the storage size, excluding the minimum memory size to launch the low memory pop-up in case of a low memory situation. Consequently, the available size must be less than the original available size, and you must use these functions to get the memory size. For the same reason, you cannot use the statvfs function directly in Tizen. Instead, use storage_get_internal_memory_size() and storage_get_external_memory_size(). The Statvfs structure has a different structure size defined by "__USE_FILE_OFFSET64". However, you can ignore this, since the Storage API uses a proper function automatically.

      To retrieve storage space information:

        diff --git a/org.tizen.guides/html/native/data/sql_n.htm b/org.tizen.guides/html/native/data/sql_n.htm index 5f8e9ac..dbbcb23 100644 --- a/org.tizen.guides/html/native/data/sql_n.htm +++ b/org.tizen.guides/html/native/data/sql_n.htm @@ -42,7 +42,7 @@

        SQL Database Engine, Sqlite

        - +

        You can use the open source modules, whose functions provide access to SQLite and OpenSSL and demonstrate how to encrypt and store application data. The open source modules supported by Tizen are listed in the API modules.

        The main features of the Sqlite API include:

        @@ -57,12 +57,12 @@

        Preparing the Database

        This guide only covers the basics of encryption and database usage. For more information, see OpenSSL and SQLite Web pages.

        - +
        Note While operating with real data, make sure that you fulfill all security requirements. This guide demonstrates how to use the library APIs on Tizen, but does not show how to perform fully secure encryption.
        - +

        To prepare the database:

        1. Define the needed variables: @@ -71,7 +71,7 @@ const int key_len = 256; /* AES key length */ /* Password to generate key */ -static const unsigned char password[] = {"DummyPassword"}; +static const unsigned char password[] = {"DummyPassword"}; sqlite3 *db; /* Database handle */ @@ -103,8 +103,8 @@ char *document_path; */ int internal_storage_id = 0; storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_DOCUMENTS, -                      &document_path); -snprintf(file_path, size, "%s/test.db", document_path); + &document_path); +snprintf(file_path, size, "%s/test.db", document_path); free(document_path); sqlite3_open(file_path, &db); @@ -122,20 +122,20 @@ CreateTable(); static int CreateTable() { -    int ret; -    char *ErrMsg; -    char *sql = -        "CREATE TABLE IF NOT EXISTS EncryptedData(" \ -                                                  "DATA TEXT NOT NULL," \ -                                                  "ENCRYPTED INT NOT NULL,"\ -                                                  "SALT TEXT NOT NULL," \ -                                                  "IV TEXT NOT NULL," \ -                                                  "PART INTEGER," \ -                                                  "KEY INTEGER PRIMARY KEY);"; - -    sqlite3_exec(db, sql, callback, 0, &ErrMsg); - -    return 0; + int ret; + char *ErrMsg; + char *sql = + "CREATE TABLE IF NOT EXISTS EncryptedData(" \ + "DATA TEXT NOT NULL," \ + "ENCRYPTED INT NOT NULL,"\ + "SALT TEXT NOT NULL," \ + "IV TEXT NOT NULL," \ + "PART INTEGER," \ + "KEY INTEGER PRIMARY KEY);"; + + sqlite3_exec(db, sql, callback, 0, &ErrMsg); + + return 0; }
          2. @@ -162,14 +162,14 @@ PrepareToSQL(iv); void PrepareToSQL(unsigned char* msg) { -    int i = 0; -    while (msg[i] != 0x00) { -        if (msg[i] == '\'') -            msg[i] = 'a'; -        if (msg[i] == '\"') -            msg[i] = 'b'; -        ++i; -    } + int i = 0; + while (msg[i] != 0x00) { + if (msg[i] == '\'') + msg[i] = 'a'; + if (msg[i] == '\"') + msg[i] = 'b'; + ++i; + } }
        2. @@ -188,7 +188,7 @@ PrepareToSQL(unsigned char* msg)

          The time.h is obtained to create an example message to encrypt and store.

        Storing Encrypted Data

        - +

        This use case shows how to:

        1. Encrypt a message with OpenSSL, prepare it, and store it in the SQLite database with the Base64 encoding.
          2. @@ -200,7 +200,7 @@ PrepareToSQL(unsigned char* msg)
          1. Store a short message. 
            -char *ShortMsg = "Short Msg.";
+char *ShortMsg = "Short Msg.";
 EncryptMsg(ShortMsg, decrypted_out, password, salt, iv);
 InsertRecord(decrypted_out, 1, 0, strlen(ShortMsg));
            @@ -208,52 +208,52 @@ InsertRecord(decrypted_out, 1, 0, strlen(ShortMsg));
            1. Encrypt plain text with the EncryptMsg() function:
                -
              1. Generate a string for key generation from a password and salt using PKCS5_PBKDF2_HMAC_SHA1(). +
              2. Generate a string for key generation from a password and salt using PKCS5_PBKDF2_HMAC_SHA1().

                An initial vector can be used in different hash functions. In this example, only the first byte of the initial vector is used as an iteration variable for a hash algorithm.

                3. -
              3. Generate the encryption key using the AES_set_encrypt_key() function. +
              4. Generate the encryption key using the AES_set_encrypt_key() function.

                The second parameter defines the AES key length. Check the actual recommended length and encoding type before use. This example uses AES 256 (defined in Preparing the Database).

              5. Encrypt the data with the AES_encrypt() function.
                6. -
              6. Encode Base64 with the base64_encode() function. +
              7. Encode Base64 with the base64_encode() function.

                The data is encoded to make it safe to insert it to the database. Base 64 does not contain any special characters. For the encoding and decoding function details, see Base64 functions.

              8. Add a delimiting 0x00 character at the end of the byte array.
               static int
 EncryptMsg(char* in, unsigned char* out, const unsigned char* password,
-           unsigned char *localsalt, unsigned char *vector)
+           unsigned char *localsalt, unsigned char *vector)
 {
-    AES_KEY encryption_key;
-    int iter = (int)vector[0];
-    unsigned char key[key_len + 1];
-    char *msgbuff;
-    unsigned char buf[BUFLEN];
-    unsigned int retlen;
-    int x;
+    AES_KEY encryption_key;
+    int iter = (int)vector[0];
+    unsigned char key[key_len + 1];
+    char *msgbuff;
+    unsigned char buf[BUFLEN];
+    unsigned int retlen;
+    int x;
 
-    memset(buf, 0x00, BUFLEN);
+    memset(buf, 0x00, BUFLEN);
 
-    PKCS5_PBKDF2_HMAC_SHA1((char *)password,
-                           sizeof(password)/sizeof(unsigned char),
-                           localsalt,
-                           sizeof(localsalt)/sizeof(unsigned char),
-                           iter,
-                           key_len,
-                           key);
+    PKCS5_PBKDF2_HMAC_SHA1((char *)password,
+                           sizeof(password)/sizeof(unsigned char),
+                           localsalt,
+                           sizeof(localsalt)/sizeof(unsigned char),
+                           iter,
+                           key_len,
+                           key);
 
-    AES_set_encrypt_key(key, key_len, &encryption_key);
-    AES_encrypt((unsigned char *)in, (unsigned char *)buf, &encryption_key);
+    AES_set_encrypt_key(key, key_len, &encryption_key);
+    AES_encrypt((unsigned char *)in, (unsigned char *)buf, &encryption_key);
 
-    msgbuff = base64_encode(buf, 16, &retlen);
+    msgbuff = base64_encode(buf, 16, &retlen);
 
-    memcpy(buf, msgbuff, retlen);
-    buf[retlen + 1] = 0x00;
-    free(msgbuff);
+    memcpy(buf, msgbuff, retlen);
+    buf[retlen + 1] = 0x00;
+    free(msgbuff);
 
-    memcpy(out, buf, retlen + 1);
+    memcpy(out, buf, retlen + 1);
 
-    for (x = 0; buf[x] != 0x00; x++);
+    for (x = 0; buf[x] != 0x00; x++);
 
-    return x;
+    return x;
 }
              2. @@ -263,21 +263,21 @@ EncryptMsg(char* in, unsigned char* out, const unsigned char* password, 
               static int
 InsertRecord(unsigned char *msg, int encrypted,
-             int part, int len)
+             int part, int len)
 {
-    char sqlbuff[BUFLEN];
-    char *ErrMsg;
-    snprintf(sqlbuff, BUFLEN, "INSERT INTO EncryptedData
-             VALUES(\'%s\', %d, \'%s\', \'%s\', %d, NULL);",
-             msg, encrypted, salt, iv, part);
-
-    ret = sqlite3_exec(db, sqlbuff, callback, 0, &ErrMsg);
-    if (ret) {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Error: %s\n", ErrMsg);
-        sqlite3_free(ErrMsg);
-    }
-
-    return 0;
+    char sqlbuff[BUFLEN];
+    char *ErrMsg;
+    snprintf(sqlbuff, BUFLEN, "INSERT INTO EncryptedData
+             VALUES(\'%s\', %d, \'%s\', \'%s\', %d, NULL);",
+             msg, encrypted, salt, iv, part);
+
+    ret = sqlite3_exec(db, sqlbuff, callback, 0, &ErrMsg);
+    if (ret) {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Error: %s\n", ErrMsg);
+        sqlite3_free(ErrMsg);
+    }
+
+    return 0;
 }
              @@ -290,41 +290,41 @@ ret = InsertMessage((unsigned char *)text); static int InsertMessage(unsigned char* text) { -    unsigned char encrypted_out[BUFLEN]; -    int ret = 0; -    int x; -    int len; -    int retlen; -    int parts = 0; -    int pos; -    char membuf[17]; + unsigned char encrypted_out[BUFLEN]; + int ret = 0; + int x; + int len; + int retlen; + int parts = 0; + int pos; + char membuf[17]; -    for (len = 0; text[len] != 0x00; len++); + for (len = 0; text[len] != 0x00; len++); -    for (pos = 0; (len - pos) > 16; pos += 16) { -        memcpy(membuf, &text[pos], 16); -        membuf[16] = 0x00; + for (pos = 0; (len - pos) > 16; pos += 16) { + memcpy(membuf, &text[pos], 16); + membuf[16] = 0x00; -        EncryptMsg((char *)membuf, encrypted_out, password, salt, iv); + EncryptMsg((char *)membuf, encrypted_out, password, salt, iv); -        for (x = 0; encrypted_out[x] != 0x00; x++); + for (x = 0; encrypted_out[x] != 0x00; x++); -        InsertRecord(encrypted_out, 1, parts, x); + InsertRecord(encrypted_out, 1, parts, x); -        parts++; -    } + parts++; + } -    if (len - pos > 0) { -        retlen = EncryptMsg((char *)&text[pos], -                            encrypted_out, password, salt, iv); -        InsertRecord(encrypted_out, 1, parts, retlen); -    } + if (len - pos > 0) { + retlen = EncryptMsg((char *)&text[pos], + encrypted_out, password, salt, iv); + InsertRecord(encrypted_out, 1, parts, retlen); + } -    return 0; + return 0; } - +
            2. List the database content.

              After the previous step, the database contains AES-encrypted content, stored in a Base64 notation. For example:

              @@ -333,9 +333,9 @@ InsertMessage(unsigned char* text)

              To list the records in the database, use the ShowRecords() function:

                -
              • To list all records, use the SELECT * FROM EncryptedData query. +
              • To list all records, use the SELECT * FROM EncryptedData query.

                The callback function is invoked for each record returned by SQLite. To pass user data to the callback, use the fourth parameter of the sqlite3_exec() function.

                • -
              • The callback simply prints the obtained record. +
              • The callback simply prints the obtained record.

                The record is passed in the form of a few arrays of strings: the argv array contains the column content and azColName the column name. The argc parameter is the number of columns.

                The first parameter, counter, is the user data, which in this example is used to indicate the record number in a row (not a SQL primary key) while listing.

                If the content of any column is empty, the NULL string is printed.

                @@ -345,33 +345,33 @@ InsertMessage(unsigned char* text) static void ShowRecords() { -    char *sql = "select * from EncryptedData"; -    int counter = 0; -    int ret = 0; -    char *ErrMsg; + char *sql = "select * from EncryptedData"; + int counter = 0; + int ret = 0; + char *ErrMsg; -    sqlite3_exec(db, sql, callback, &counter, &ErrMsg); + sqlite3_exec(db, sql, callback, &counter, &ErrMsg); -    return; + return; } static int callback(void *counter, int argc, char **argv, char **azColName) { -    int *localcounter = (int *)counter; -    int i; + int *localcounter = (int *)counter; + int i; -    dlog_print(DLOG_DEBUG, LOG_TAG, "-%d: ", *localcounter); + dlog_print(DLOG_DEBUG, LOG_TAG, "-%d: ", *localcounter); -    for (i = 0; i < argc; i++) -        dlog_print(DLOG_DEBUG, LOG_TAG, -                   "%s = %s | ", -                   azColName[i], argv[i] ? argv[i] : "NULL"); + for (i = 0; i < argc; i++) + dlog_print(DLOG_DEBUG, LOG_TAG, + "%s = %s | ", + azColName[i], argv[i] ? argv[i] : "NULL"); -    (*localcounter)++; -    dlog_print(DLOG_DEBUG, LOG_TAG, "\n"); + (*localcounter)++; + dlog_print(DLOG_DEBUG, LOG_TAG, "\n"); -    return 0; + return 0; }
                • @@ -379,9 +379,9 @@ callback(void *counter, int argc, char **argv, char **azColName)
              • Decrypt the database records.

                Use the DecryptRecords() function to select all encrypted records from the database, and decrypt and list them:

                  -
                • Use the SELECT * FROM EncryptedData query where ENCRYPTED='1' query to retrieve all encrypted records.
                  • +
                • Use the SELECT * FROM EncryptedData query where ENCRYPTED='1' query to retrieve all encrypted records.
                • The callbackdecrypt() callback is invoked for each found record. In case of an error, the SQLite API requires you to release the error message memory with the sqlite3_free() function.
                  • -
                • The callback is similar to the earlier callback used to list the database content. +
                • The callback is similar to the earlier callback used to list the database content.

                  There is an action added for the argv[ i ] && i == 0 case, which includes the encrypted content in columns that are not empty and are DATA.

                  To decrypt the message, decode the data from Base 64, add a delimiting character, perform the actual decryption with the DecryptMsg() function, and list the decrypted data.

                @@ -389,85 +389,85 @@ callback(void *counter, int argc, char **argv, char **azColName) static void DecryptRecords() { -    char *sql = "select * from EncryptedData where ENCRYPTED='1'"; -    int counter = 0; -    int ret = 0; -    char *ErrMsg; - -    ret = sqlite3_exec(db, sql, callbackdecrypt, &counter, &ErrMsg); -    if (ret) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "Error: %s\n", ErrMsg); -        sqlite3_free(ErrMsg); -    } + char *sql = "select * from EncryptedData where ENCRYPTED='1'"; + int counter = 0; + int ret = 0; + char *ErrMsg; + + ret = sqlite3_exec(db, sql, callbackdecrypt, &counter, &ErrMsg); + if (ret) { + dlog_print(DLOG_DEBUG, LOG_TAG, "Error: %s\n", ErrMsg); + sqlite3_free(ErrMsg); + } } static int callbackdecrypt(void *counter, int argc, char **argv, char **azColName) { -    unsigned char decrypted_out[BUFLEN]; -    int *localcounter = (int *)counter; -    int i; -    unsigned int olen; + unsigned char decrypted_out[BUFLEN]; + int *localcounter = (int *)counter; + int i; + unsigned int olen; -    dlog_print(DLOG_DEBUG, LOG_TAG, "-%d: ", *localcounter); + dlog_print(DLOG_DEBUG, LOG_TAG, "-%d: ", *localcounter); -    for (i = 0; i < argc; i++) { -        if (argv[i] && i == 0) { -            unsigned char *basebuffer = base64_decode(argv[i], strlen(argv[i]), &olen); -            unsigned char *decryptbuffer = malloc(sizeof(char)* olen + 1); + for (i = 0; i < argc; i++) { + if (argv[i] && i == 0) { + unsigned char *basebuffer = base64_decode(argv[i], strlen(argv[i]), &olen); + unsigned char *decryptbuffer = malloc(sizeof(char)* olen + 1); -            memset(decryptbuffer, 0x00, olen + 1); -            memcpy(decryptbuffer, basebuffer, olen); -            decryptbuffer[olen] = 0x00; -            free(basebuffer); + memset(decryptbuffer, 0x00, olen + 1); + memcpy(decryptbuffer, basebuffer, olen); + decryptbuffer[olen] = 0x00; + free(basebuffer); -            DecryptMsg((unsigned char *)decryptbuffer, decrypted_out, -                       password, (unsigned char *)argv[2], (unsigned char *)argv[3]); + DecryptMsg((unsigned char *)decryptbuffer, decrypted_out, + password, (unsigned char *)argv[2], (unsigned char *)argv[3]); -            free(decryptbuffer); + free(decryptbuffer); -            dlog_print(DLOG_DEBUG, LOG_TAG, "%s = %s | ", azColName[i], -                       (char*)decrypted_out); + dlog_print(DLOG_DEBUG, LOG_TAG, "%s = %s | ", azColName[i], + (char*)decrypted_out); -        } else { -            dlog_print(DLOG_DEBUG, LOG_TAG, "%s = %s | ", -                       azColName[i], argv[i] ? argv[i] : "NULL"); -        } -    } + } else { + dlog_print(DLOG_DEBUG, LOG_TAG, "%s = %s | ", + azColName[i], argv[i] ? argv[i] : "NULL"); + } + } -    (*localcounter)++; -    dlog_print(DLOG_DEBUG, LOG_TAG, "\n"); + (*localcounter)++; + dlog_print(DLOG_DEBUG, LOG_TAG, "\n"); -    return 0; + return 0; }

                The actual decryption routine is similar to encryption:

                 static int
 DecryptMsg(unsigned char* in, unsigned char* out, const unsigned char* password,
-           unsigned char* localsalt, unsigned char* vector)
+           unsigned char* localsalt, unsigned char* vector)
 {
-    AES_KEY decryption_key;
-    int iter = (int)vector[0];
-    unsigned char key[key_len + 1];
-    int x;
+    AES_KEY decryption_key;
+    int iter = (int)vector[0];
+    unsigned char key[key_len + 1];
+    int x;
 
-    memset(out, 0x00, BUFLEN);
+    memset(out, 0x00, BUFLEN);
 
-    PKCS5_PBKDF2_HMAC_SHA1((char *)password,
-                           sizeof(password)/sizeof(unsigned char),
-                           localsalt,
-                           sizeof(localsalt)/sizeof(unsigned char),
-                           iter,
-                           key_len,
-                           key);
+    PKCS5_PBKDF2_HMAC_SHA1((char *)password,
+                           sizeof(password)/sizeof(unsigned char),
+                           localsalt,
+                           sizeof(localsalt)/sizeof(unsigned char),
+                           iter,
+                           key_len,
+                           key);
 
-    AES_set_decrypt_key(key, key_len, &decryption_key);
-    AES_decrypt((unsigned char *)in, out, &decryption_key);
+    AES_set_decrypt_key(key, key_len, &decryption_key);
+    AES_decrypt((unsigned char *)in, out, &decryption_key);
 
-    for (x = 0; out[x] != 0x00; x++);
+    for (x = 0; out[x] != 0x00; x++);
 
-    return x;
+    return x;
 }
                • @@ -485,102 +485,102 @@ sqlite3_shutdown();
              • Base64 functions: 
                 static char
-encoding_table[] = {'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H',
-                    'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P',
-                    'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X',
-                    'Y', 'Z', 'a', 'b', 'c', 'd', 'e', 'f',
-                    'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n',
-                    'o', 'p', 'q', 'r', 's', 't', 'u', 'v',
-                    'w', 'x', 'y', 'z', '0', '1', '2', '3',
-                    '4', '5', '6', '7', '8', '9', '+', '/'};
+encoding_table[] = {'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H',
+                    'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P',
+                    'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X',
+                    'Y', 'Z', 'a', 'b', 'c', 'd', 'e', 'f',
+                    'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n',
+                    'o', 'p', 'q', 'r', 's', 't', 'u', 'v',
+                    'w', 'x', 'y', 'z', '0', '1', '2', '3',
+                    '4', '5', '6', '7', '8', '9', '+', '/'};
 static char *decoding_table = NULL;
 static int mod_table[] = {0, 2, 1};
 
 void
 build_decoding_table()
 {
-    decoding_table = malloc(256);
-    int i;
-    for (i = 0; i < 64; i++)
-        decoding_table[(unsigned char)encoding_table[i]] = i;
+    decoding_table = malloc(256);
+    int i;
+    for (i = 0; i < 64; i++)
+        decoding_table[(unsigned char)encoding_table[i]] = i;
 }
 
 char
 *base64_encode(const unsigned char *data, size_t input_length, size_t *output_length)
 {
-    *output_length = 4 * ((input_length + 2) / 3);
-
-    char *encoded_data = malloc(*output_length);
-    if (encoded_data == NULL)
-        return NULL;
-
-    int i;
-    int j;
-    for (i = 0, j = 0; i < input_length;) {
-        uint32_t octet_a = i < input_length ? (unsigned char)data[i++] : 0;
-        uint32_t octet_b = i < input_length ? (unsigned char)data[i++] : 0;
-        uint32_t octet_c = i < input_length ? (unsigned char)data[i++] : 0;
-        uint32_t triple = (octet_a << 0x10) + (octet_b << 0x08) + octet_c;
-
-        encoded_data[j++] = encoding_table[(triple >> 3 * 6) & 0x3F];
-        encoded_data[j++] = encoding_table[(triple >> 2 * 6) & 0x3F];
-        encoded_data[j++] = encoding_table[(triple >> 1 * 6) & 0x3F];
-        encoded_data[j++] = encoding_table[(triple >> 0 * 6) & 0x3F];
-    }
-
-    for (i = 0; i < mod_table[input_length % 3]; i++)
-        encoded_data[*output_length - 1 - i] = '=';
-
-    return encoded_data;
+    *output_length = 4 * ((input_length + 2) / 3);
+
+    char *encoded_data = malloc(*output_length);
+    if (encoded_data == NULL)
+        return NULL;
+
+    int i;
+    int j;
+    for (i = 0, j = 0; i < input_length;) {
+        uint32_t octet_a = i < input_length ? (unsigned char)data[i++] : 0;
+        uint32_t octet_b = i < input_length ? (unsigned char)data[i++] : 0;
+        uint32_t octet_c = i < input_length ? (unsigned char)data[i++] : 0;
+        uint32_t triple = (octet_a << 0x10) + (octet_b << 0x08) + octet_c;
+
+        encoded_data[j++] = encoding_table[(triple >> 3 * 6) & 0x3F];
+        encoded_data[j++] = encoding_table[(triple >> 2 * 6) & 0x3F];
+        encoded_data[j++] = encoding_table[(triple >> 1 * 6) & 0x3F];
+        encoded_data[j++] = encoding_table[(triple >> 0 * 6) & 0x3F];
+    }
+
+    for (i = 0; i < mod_table[input_length % 3]; i++)
+        encoded_data[*output_length - 1 - i] = '=';
+
+    return encoded_data;
 }
 
 unsigned char
 *base64_decode(const char *data, size_t input_length, size_t *output_length)
 {
-    if (decoding_table == NULL)
-        build_decoding_table();
-
-    if (input_length % 4 != 0)
-        return NULL;
-
-    *output_length = input_length / 4 * 3;
-    if (data[input_length - 1] == '=')
-        (*output_length)--;
-    if (data[input_length - 2] == '=')
-        (*output_length)--;
-
-    unsigned char *decoded_data = malloc(*output_length);
-    if (decoded_data == NULL)
-        return NULL;
-
-    int i;
-    int j;
-
-    for (i = 0, j = 0; i < input_length;) {
-        uint32_t sextet_a = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
-        uint32_t sextet_b = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
-        uint32_t sextet_c = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
-        uint32_t sextet_d = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
-
-        uint32_t triple = (sextet_a << 3 * 6) + (sextet_b << 2 * 6)
-                          + (sextet_c << 1 * 6) + (sextet_d << 0 * 6);
-
-        if (j < *output_length)
-            decoded_data[j++] = (triple >> 2 * 8) & 0xFF;
-        if (j < *output_length)
-            decoded_data[j++] = (triple >> 1 * 8) & 0xFF;
-        if (j < *output_length)
-            decoded_data[j++] = (triple >> 0 * 8) & 0xFF;
-    }
-
-    return decoded_data;
+    if (decoding_table == NULL)
+        build_decoding_table();
+
+    if (input_length % 4 != 0)
+        return NULL;
+
+    *output_length = input_length / 4 * 3;
+    if (data[input_length - 1] == '=')
+        (*output_length)--;
+    if (data[input_length - 2] == '=')
+        (*output_length)--;
+
+    unsigned char *decoded_data = malloc(*output_length);
+    if (decoded_data == NULL)
+        return NULL;
+
+    int i;
+    int j;
+
+    for (i = 0, j = 0; i < input_length;) {
+        uint32_t sextet_a = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
+        uint32_t sextet_b = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
+        uint32_t sextet_c = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
+        uint32_t sextet_d = data[i] == '=' ? 0 & i++ : decoding_table[(int)data[i++]];
+
+        uint32_t triple = (sextet_a << 3 * 6) + (sextet_b << 2 * 6)
+                          + (sextet_c << 1 * 6) + (sextet_d << 0 * 6);
+
+        if (j < *output_length)
+            decoded_data[j++] = (triple >> 2 * 8) & 0xFF;
+        if (j < *output_length)
+            decoded_data[j++] = (triple >> 1 * 8) & 0xFF;
+        if (j < *output_length)
+            decoded_data[j++] = (triple >> 0 * 8) & 0xFF;
+    }
+
+    return decoded_data;
 }
 
 void
 base64_cleanup()
 {
-    free(decoding_table);
-    decoding_table = NULL;
+    free(decoding_table);
+    decoding_table = NULL;
 }
                • @@ -590,48 +590,48 @@ base64_cleanup() int OpenSQL_AES_example_1(void) { -    unsigned char decrypted_out[BUFLEN]; -    int ret; -    char *hellomsg = {"Hello Tizen! SQLite OpenSSL"}; -    char text[BUFLEN]; -    time_t rawtime; -    struct tm *timeinfo; + unsigned char decrypted_out[BUFLEN]; + int ret; + char *hellomsg = {"Hello Tizen! SQLite OpenSSL"}; + char text[BUFLEN]; + time_t rawtime; + struct tm *timeinfo; -    if (init_err) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "Initial error\n"); + if (init_err) { + dlog_print(DLOG_DEBUG, LOG_TAG, "Initial error\n"); -        return 1; -    } + return 1; + } -    time(&rawtime); -    timeinfo = localtime(&rawtime); -    sprintf(text, "%s %s", hellomsg, asctime(timeinfo)); + time(&rawtime); + timeinfo = localtime(&rawtime); + sprintf(text, "%s %s", hellomsg, asctime(timeinfo)); -    /* Insert long message */ -    ret = InsertMessage((unsigned char *)text); -    if (ret) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "Insert ENCRYPTED MessageError\n"); + /* Insert long message */ + ret = InsertMessage((unsigned char *)text); + if (ret) { + dlog_print(DLOG_DEBUG, LOG_TAG, "Insert ENCRYPTED MessageError\n"); -        return 1; -    } + return 1; + } -    /* Insert message up to 16 characters */ -    char *ShortMsg = "Short Msg."; -    EncryptMsg(ShortMsg, decrypted_out, password, salt, iv); -    ret = InsertRecord(decrypted_out, 1, 0, strlen(ShortMsg)); -    if (ret) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "Insert ENCRYPTED MessageError\n"); + /* Insert message up to 16 characters */ + char *ShortMsg = "Short Msg."; + EncryptMsg(ShortMsg, decrypted_out, password, salt, iv); + ret = InsertRecord(decrypted_out, 1, 0, strlen(ShortMsg)); + if (ret) { + dlog_print(DLOG_DEBUG, LOG_TAG, "Insert ENCRYPTED MessageError\n"); -        return 1; -    } + return 1; + } -    /* Show raw database */ -    ShowRecords(); + /* Show raw database */ + ShowRecords(); -    /* Show decrypted database */ -    DecryptRecords(); + /* Show decrypted database */ + DecryptRecords(); -    return 0; + return 0; } diff --git a/org.tizen.guides/html/native/device/attached_devices_n.htm b/org.tizen.guides/html/native/device/attached_devices_n.htm index aefcbeb..06e5227 100644 --- a/org.tizen.guides/html/native/device/attached_devices_n.htm +++ b/org.tizen.guides/html/native/device/attached_devices_n.htm @@ -5,13 +5,13 @@ - + - Attached Devices + Attached Devices @@ -20,7 +20,7 @@

                Mobile native Wearable native

                - +

                Dependencies

                -
        +

        Attached Devices

        The attached device features provide functions to control attached devices and monitor device changes.

        - +

        The main features of the Device API include:

        • Battery information

          You can get battery details, such as the current percentage, the charging state, and the current level state, using the Battery API (in mobile and wearable applications).

          • @@ -83,12 +83,12 @@

          To use the Device API submodules (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

           <privileges>
-   <!--To use the Display API-->
-   <privilege>http://tizen.org/privilege/display</privilege>
-   <!--To use the Haptic API-->
-   <privilege>http://tizen.org/privilege/haptic</privilege>
-   <!--To use the Led API-->
-   <privilege>http://tizen.org/privilege/led</privilege>
+   <!--To use the Display API-->
+   <privilege>http://tizen.org/privilege/display</privilege>
+   <!--To use the Haptic API-->
+   <privilege>http://tizen.org/privilege/haptic</privilege>
+   <!--To use the Led API-->
+   <privilege>http://tizen.org/privilege/led</privilege>
 </privileges>
          @@ -103,7 +103,7 @@
        • For the Power API (in mobile and wearable applications), include <device/power.h>.
        • For the Callback API (in mobile and wearable applications), include <device/callback.h>.
        - + 
         /* To retrieve battery information */
 #include <device/battery.h>
@@ -122,10 +122,10 @@
        - +

        Retrieving Battery Information

        -

        To retrieve battery information:

        +

        To retrieve battery information:

        • Get the battery percentage with the device_battery_get_percent() function.

          The function returns the current battery percentage as an integer value from 0 to 100 that indicates the remaining battery charge as a percentage of the maximum level.

          @@ -166,7 +166,7 @@ int num; error = device_display_get_numbers(&num);
          • - +
        • Get the maximum brightness with the device_display_get_max_brightness() function.

          The function returns the maximum brightness value that can be set.

          @@ -176,7 +176,7 @@ int max; error = device_display_get_max_brightness(0, &max);
          • - +
        • Get and set the display brightness with the device_display_get_brightness() and device_display_set_brightness() functions: 
          @@ -201,7 +201,7 @@ error = device_display_change_state(DISPLAY_STATE_NORMAL);
        - +

        Controlling Haptic Devices

        To control haptic devices:

        @@ -344,11 +344,11 @@ error = device_power_release_lock(POWER_LOCK_CPU); static void changed_cb(device_callback_e type, void *value, void *user_data) { -    int val; -    if (type != DEVICE_CALLBACK_DISPLAY_STATE) -        return; -    val = (int)value; -    dlog_print(DLOG_DEBUG, LOG_TAG, "current display state: %d", val); + int val; + if (type != DEVICE_CALLBACK_DISPLAY_STATE) + return; + val = (int)value; + dlog_print(DLOG_DEBUG, LOG_TAG, "current display state: %d", val); } diff --git a/org.tizen.guides/html/native/device/device_cover_n.htm b/org.tizen.guides/html/native/device/device_cover_n.htm index 767f3b2..1145540 100644 --- a/org.tizen.guides/html/native/device/device_cover_n.htm +++ b/org.tizen.guides/html/native/device/device_cover_n.htm @@ -5,13 +5,13 @@ - + - Device Settings and Systems + Device Settings and Systems @@ -27,7 +27,7 @@
      • Tizen 2.3.1 and Higher for Wearable
      - +

      Device Settings and Systems

      @@ -61,7 +61,7 @@

      You can play a feedback pattern using sound or vibration. You can use specific patterns, or specific type and pattern. You can also check whether a specific pattern is supported.

      - +
      diff --git a/org.tizen.guides/html/native/device/ext_output_n.htm b/org.tizen.guides/html/native/device/ext_output_n.htm index ed7b55b..2f56f93 100644 --- a/org.tizen.guides/html/native/device/ext_output_n.htm +++ b/org.tizen.guides/html/native/device/ext_output_n.htm @@ -32,7 +32,7 @@
    • Setting the Presentation Mode
    • Setting the External Window
    • Getting the Status of the External Output Device
      • - +

      Related Info

      • External Output Manager API for Mobile Native
        • @@ -43,7 +43,7 @@
        - +

        External Output Devices

        The External Output Manager (EOM) is a module for controlling the external output devices.

        @@ -56,12 +56,12 @@

        Figure: Mirror mode

        Mirror mode

        - +
      • The presentation mode can be set by an application. If the application wants to display an image or video only in an external output device, the presentation mode must be used.

        Figure: Presentation mode

        Presentation mode

        - +

        You must use the EOM attributes to set the presentation mode by defining the EOM priority. With these attributes, you can display a fullscreen window on the external output device.

        Table: Presentation mode attributes

      @@ -117,105 +117,105 @@
    • Initialize the application with the eom_init() function.
      • - +

      Getting the Output ID

      - +

      To retrieve the output ID, use the eom_get_eom_output_ids() function. You need the ID to get information about the output device and to control the external window.

       int
 sample_get_output_id(const char *output_name)
 {
-    eom_output_id *output_ids = NULL;
-    eom_output_id output_id = 0;
-    eom_output_type_e output_type = EOM_OUTPUT_TYPE_UNKNOWN;
-    int id_cnt = 0;
-    int i;
-
-    output_ids = eom_get_eom_output_ids(&id_cnt);
-    if (id_cnt == 0) {
-        printf("no external outputs supported\n");
-
-        return 0;
-    }
-
-    for (i = 0; i < id_cnt; i++) {
-        eom_get_output_type(output_ids[i], &output_type);
-        if (!strncmp(output_name, "HDMI", 4)) {
-            if (output_type == EOM_OUTPUT_TYPE_HDMIA
-                || output_type == EOM_OUTPUT_TYPE_HDMIB) {
-                output_id = output_ids[i];
-                break;
-            }
-        } else if (!strncmp(output_name, "Virtual", 7)) {
-            if (output_type == EOM_OUTPUT_TYPE_VIRTUAL) {
-                output_id = output_ids[i];
-                break;
-            }
-        }
-    }
-
-    if (output_ids)
-        free(output_ids);
-
-    return output_id;
+    eom_output_id *output_ids = NULL;
+    eom_output_id output_id = 0;
+    eom_output_type_e output_type = EOM_OUTPUT_TYPE_UNKNOWN;
+    int id_cnt = 0;
+    int i;
+
+    output_ids = eom_get_eom_output_ids(&id_cnt);
+    if (id_cnt == 0) {
+        printf("no external outputs supported\n");
+
+        return 0;
+    }
+
+    for (i = 0; i < id_cnt; i++) {
+        eom_get_output_type(output_ids[i], &output_type);
+        if (!strncmp(output_name, "HDMI", 4)) {
+            if (output_type == EOM_OUTPUT_TYPE_HDMIA
+                || output_type == EOM_OUTPUT_TYPE_HDMIB) {
+                output_id = output_ids[i];
+                break;
+            }
+        } else if (!strncmp(output_name, "Virtual", 7)) {
+            if (output_type == EOM_OUTPUT_TYPE_VIRTUAL) {
+                output_id = output_ids[i];
+                break;
+            }
+        }
+    }
+
+    if (output_ids)
+        free(output_ids);
+
+    return output_id;
 }
      - - + +

      Setting the Presentation Mode

      - +

      To connect to an external output device in the presentation mode, use the eom_set_output_attribute() function to set the presentation mode priority attribute.

      If the setting is successful, the External Output Manager module uses the presentation mode when the external output device connected.

       int
 set_attribute()
 {
-    m_output_id output_id = 0;
-    int ret;
+    m_output_id output_id = 0;
+    int ret;
 
-    output_id = sample_get_output_id("HDMI");
+    output_id = sample_get_output_id("HDMI");
 
-    ret = eom_set_output_attribute(output_id, EOM_OUTPUT_ATTRIBUTE_NORMAL);
-    if (ret != EOM_ERROR_NONE) {
-        /* Attribute setting failed, the external output device cannot be used */
-        /* Deinitializing */
-        eom_deinit();
+    ret = eom_set_output_attribute(output_id, EOM_OUTPUT_ATTRIBUTE_NORMAL);
+    if (ret != EOM_ERROR_NONE) {
+        /* Attribute setting failed, the external output device cannot be used */
+        /* Deinitializing */
+        eom_deinit();
 
-        return -1;
-    }
+        return -1;
+    }
 
-    return 0;
+    return 0;
 }

      If the EOM_ERROR_NONE response is received from the eom_set_output_attribute() function, the application can use the external output device.

      - +

      Setting the External Window

      - +

      To set an external window, use the eom_set_output_window() function. This function moves the window to the external output and automatically resizes it to the best resolution of the external output device.

      Before calling this function, you must receive a success return from the eom_set_output_attribute() function.

       int
 make_external_window()
 {
-    Evas_Object *window;
-    window = elm_win_add(NULL, "external_window", ELM_WIN_BASIC);
-    if (eom_set_output_window(output_id, window) == EOM_ERROR_NONE) {
-        return 0;
-    } else {
-        evas_object_del(window);
-
-        return -1;
-    }
+    Evas_Object *window;
+    window = elm_win_add(NULL, "external_window", ELM_WIN_BASIC);
+    if (eom_set_output_window(output_id, window) == EOM_ERROR_NONE) {
+        return 0;
+    } else {
+        evas_object_del(window);
+
+        return -1;
+    }
 }
      - +

      Getting the Status of the External Output Device

      - +

      To get information about the external output device:

        -
      • You can retrieve information about the external output device details with the following functions: +
      • You can retrieve information about the external output device details with the following functions:
        • eom_get_output_type(): Get the connection type of the external output.
        • eom_get_output_mode(): Get the external output mode. @@ -237,8 +237,8 @@ make_external_window()
        • Define the callbacks for various state changes: 
           struct _SampleInfo {
-    Evas_Object *external_window;
-    int output_id;
+    Evas_Object *external_window;
+    int output_id;
 };
 typedef struct _SampleInfo SampleInfo;
 
@@ -246,60 +246,60 @@ typedef struct _SampleInfo SampleInfo;
 static void
 sample_notify_cb_output_add(eom_output_id output_id, void *user_data)
 {
-    SampleInfo *info = (SampleInfo*)user_data;
-    if (!info->external_window) {
-        /* Create the external window */
-        make_external_window(info->external_window);
-    }
+    SampleInfo *info = (SampleInfo*)user_data;
+    if (!info->external_window) {
+        /* Create the external window */
+        make_external_window(info->external_window);
+    }
 }
 
 /* Triggered when the external output is disconnected */
 static void
 sample_notify_cb_output_remove(eom_output_id output_id, void *user_data)
 {
-    SampleInfo *info = (SampleInfo*)user_data;
-    if (!info->external_window) {
-        evas_object_del(info->external_window)
-        info->external_window = NULL;
-    }
+    SampleInfo *info = (SampleInfo*)user_data;
+    if (!info->external_window) {
+        evas_object_del(info->external_window)
+        info->external_window = NULL;
+    }
 }
 
 /* Triggered when the state of the EOM output attribute changes */
 static void
 sample_notify_cb_attribute_changed(eom_output_id output_id, void *user_data)
 {
-    SampleInfo *info = (SampleInfo*)user_data;
-    eom_output_attribute_e attribute = EOM_OUTPUT_ATTRIBUTE_NONE;
-    eom_output_attribute_state_e state = EOM_OUTPUT_ATTRIBUTE_STATE_NONE;
-
-    eom_get_output_attribute(output_id, &attribute);
-    eom_get_output_attribute_state(output_id, &state);
-
-    if (state == EOM_OUTPUT_ATTRIBUTE_STATE_ACTIVE) {
-        /*
-           Start displaying the image to the external output
-           (info->external_window);
-        */
-    } else if (state == EOM_OUTPUT_ATTRIBUTE_STATE_INACTIVE) {
-        /* Stop displaying the image */
-        /* Destroy the external_window */
-        if (info->external_window) {
-            evas_object_del(info->external_window);
-            info->external_window = NULL;
-        }
-    } else if (state == EOM_OUTPUT_ATTRIBUTE_STATE_LOST) {
-        /* Stop displaying the image */
-        /* Destroy the external_window */
-        if (info->external_window) {
-            evas_object_del(info->external_window);
-            info->external_window = NULL;
-        }
-        /* Remove the callbacks */
-        eom_unset_output_added_cb(sample_notify_cb_output_add);
-        eom_unset_output_removed_cb(sample_notify_cb_output_remove);
-        eom_unset_attribute_changed_cb(sample_notify_cb_attribute_changed);
-        eom_deinit();
-    }
+    SampleInfo *info = (SampleInfo*)user_data;
+    eom_output_attribute_e attribute = EOM_OUTPUT_ATTRIBUTE_NONE;
+    eom_output_attribute_state_e state = EOM_OUTPUT_ATTRIBUTE_STATE_NONE;
+
+    eom_get_output_attribute(output_id, &attribute);
+    eom_get_output_attribute_state(output_id, &state);
+
+    if (state == EOM_OUTPUT_ATTRIBUTE_STATE_ACTIVE) {
+        /*
+           Start displaying the image to the external output
+           (info->external_window);
+        */
+    } else if (state == EOM_OUTPUT_ATTRIBUTE_STATE_INACTIVE) {
+        /* Stop displaying the image */
+        /* Destroy the external_window */
+        if (info->external_window) {
+            evas_object_del(info->external_window);
+            info->external_window = NULL;
+        }
+    } else if (state == EOM_OUTPUT_ATTRIBUTE_STATE_LOST) {
+        /* Stop displaying the image */
+        /* Destroy the external_window */
+        if (info->external_window) {
+            evas_object_del(info->external_window);
+            info->external_window = NULL;
+        }
+        /* Remove the callbacks */
+        eom_unset_output_added_cb(sample_notify_cb_output_add);
+        eom_unset_output_removed_cb(sample_notify_cb_output_remove);
+        eom_unset_attribute_changed_cb(sample_notify_cb_attribute_changed);
+        eom_deinit();
+    }
 }
          @@ -311,47 +311,47 @@ sample_notify_cb_attribute_changed(eom_output_id output_id, void *user_data) int elm_main() { -    SampleInfo *info; -    eom_output_mode_e output_mode = EOM_OUTPUT_MODE_NONE; -    int ret; - -    info = calloc(sizeof(SampleInfo)); - -    eom_init(); -    info->output_id = sample_get_output_id("HDMI"); - -    ret = eom_set_output_attribute(info->hdmi_output_id, -                                   EOM_OUTPUT_ATTRIBUTE_NORMAL); -    if (ret != EOM_ERROR_NONE) { -        /* Cannot use the external output device */ -        eom_deinit(); -    } else { -        eom_get_output_mode(info->output_id, &output_mode); -        if (output_mode != EOM_OUTPUT_MODE_NONE) { -            /* Create the external window */ -            make_external_window(info->external_window); -        } - -        /* Add the callbacks */ -        eom_set_output_added_cb(sample_notify_cb_output_add, info); -        eom_set_output_removed_cb(sample_notify_cb_output_remove, info); -        eom_set_attribute_changed_cb(sample_notify_cb_attribute_changed, info); -    } - -    elm_run(); + SampleInfo *info; + eom_output_mode_e output_mode = EOM_OUTPUT_MODE_NONE; + int ret; + + info = calloc(sizeof(SampleInfo)); + + eom_init(); + info->output_id = sample_get_output_id("HDMI"); + + ret = eom_set_output_attribute(info->hdmi_output_id, + EOM_OUTPUT_ATTRIBUTE_NORMAL); + if (ret != EOM_ERROR_NONE) { + /* Cannot use the external output device */ + eom_deinit(); + } else { + eom_get_output_mode(info->output_id, &output_mode); + if (output_mode != EOM_OUTPUT_MODE_NONE) { + /* Create the external window */ + make_external_window(info->external_window); + } + + /* Add the callbacks */ + eom_set_output_added_cb(sample_notify_cb_output_add, info); + eom_set_output_removed_cb(sample_notify_cb_output_remove, info); + eom_set_attribute_changed_cb(sample_notify_cb_attribute_changed, info); + } + + elm_run();

          To register the eom_mode_change_cb callback, use the eom_set_mode_changed_cb() function.

        • When no longer needed, delete the callbacks: 
          -    eom_unset_output_added_cb(sample_notify_cb_output_add);
-    eom_unset_output_removed_cb(sample_notify_cb_output_remove);
-    eom_unset_attribute_changed_cb(sample_notify_cb_attribute_changed);
-    eom_deinit();
-    elm_shutdown();
+    eom_unset_output_added_cb(sample_notify_cb_output_add);
+    eom_unset_output_removed_cb(sample_notify_cb_output_remove);
+    eom_unset_attribute_changed_cb(sample_notify_cb_attribute_changed);
+    eom_deinit();
+    elm_shutdown();
 
-    return 0;
+    return 0;
 }
          @@ -368,9 +368,9 @@ elm_main() Go to top - + - Runtime Information + Runtime Information @@ -20,7 +20,7 @@

          Mobile native Wearable native

          - + - +

          Runtime Information

          -

          Tizen provides various runtime information and enables your application to access it and monitor changes in it.

          +

          Tizen provides various runtime information and enables your application to access it and monitor changes in it.

          The main features of the Runtime Information API include:

          +

        Prerequisites

        @@ -73,55 +73,55 @@
      • Check whether Bluetooth is enabled.

        Use the RUNTIME_INFO_KEY_BLUETOOTH_ENABLED key with the data type-specific get function.

        The Bluetooth enabled key data type is bool, which means that you need to use the runtime_info_get_value_bool() function.

        - + 
         #include <stdbool.h>
 
 void
 func(void)
 {
-    bool value;
-    int ret;
-
-    ret = runtime_info_get_value_bool(RUNTIME_INFO_KEY_BLUETOOTH_ENABLED, &value);
-    if (ret != RUNTIME_INFO_ERROR_NONE) {
-        /* Error handling */
-        return;
-    }
-    dlog_print(DLOG_INFO, LOG_TAG, "Bluetooth: %s", value ? "Enabled" : "Disabled");
+    bool value;
+    int ret;
+
+    ret = runtime_info_get_value_bool(RUNTIME_INFO_KEY_BLUETOOTH_ENABLED, &value);
+    if (ret != RUNTIME_INFO_ERROR_NONE) {
+        /* Error handling */
+        return;
+    }
+    dlog_print(DLOG_INFO, LOG_TAG, "Bluetooth: %s", value ? "Enabled" : "Disabled");
 }
      • Get the audio jack connection status.

        Use the RUNTIME_INFO_KEY_AUDIO_JACK_STATUS key with the data type-specific get function.

        The audio jack status key data type is integer, which means that you need to use the runtime_info_get_value_int() function.

        - + 
         void
 func(void)
 {
-    int value;
-    int ret;
-
-    ret = runtime_info_get_value_int(RUNTIME_INFO_KEY_AUDIO_JACK_STATUS, &value);
-    if (ret != RUNTIME_INFO_ERROR_NONE) {
-        /* Error handling */
-        return;
-    }
-
-    dlog_print(DLOG_INFO, LOG_TAG, "Audio jack status: %d", value);
-    switch (value) {
-    case RUNTIME_INFO_AUDIO_JACK_STATUS_UNCONNECTED:
-        /* Audio jack is disconnected */
-        break;
-    case RUNTIME_INFO_AUDIO_JACK_STATUS_CONNECTED_3WIRE:
-        /* 3-conductor wire is connected */
-        break;
-    case RUNTIME_INFO_AUDIO_JACK_STATUS_CONNECTED_4WIRE:
-        /* 4-conductor wire is connected */
-        break;
-    }
+    int value;
+    int ret;
+
+    ret = runtime_info_get_value_int(RUNTIME_INFO_KEY_AUDIO_JACK_STATUS, &value);
+    if (ret != RUNTIME_INFO_ERROR_NONE) {
+        /* Error handling */
+        return;
+    }
+
+    dlog_print(DLOG_INFO, LOG_TAG, "Audio jack status: %d", value);
+    switch (value) {
+    case RUNTIME_INFO_AUDIO_JACK_STATUS_UNCONNECTED:
+        /* Audio jack is disconnected */
+        break;
+    case RUNTIME_INFO_AUDIO_JACK_STATUS_CONNECTED_3WIRE:
+        /* 3-conductor wire is connected */
+        break;
+    case RUNTIME_INFO_AUDIO_JACK_STATUS_CONNECTED_4WIRE:
+        /* 4-conductor wire is connected */
+        break;
+    }
 }
-
        • +

        Getting Runtime Information with a Function

        @@ -133,17 +133,17 @@ func(void) void func(void) { -    int core_idx = 0; -    int freq; -    int ret; + int core_idx = 0; + int freq; + int ret; -    ret = runtime_info_get_processor_current_frequency(core_idx, &freq); -    if (ret != RUNTIME_INFO_ERROR_NONE) { -        /* Error handling */ + ret = runtime_info_get_processor_current_frequency(core_idx, &freq); + if (ret != RUNTIME_INFO_ERROR_NONE) { + /* Error handling */ -        return; -    } -    dlog_print(DLOG_INFO, LOG_TAG, "The frequency of CPU core 0: %d", freq); + return; + } + dlog_print(DLOG_INFO, LOG_TAG, "The frequency of CPU core 0: %d", freq); } @@ -162,149 +162,149 @@ func(void) void usb_connection_changed(runtime_info_key_e key, void *user_data) { -    bool value; -    int ret; + bool value; + int ret; -    if (key != RUNTIME_INFO_KEY_USB_CONNECTED) -        return; + if (key != RUNTIME_INFO_KEY_USB_CONNECTED) + return; -    ret = runtime_info_get_value_bool(key, &value); -    if (ret != RUNTIME_INFO_ERROR_NONE) { -        /* Error handling */ -        return; -    } + ret = runtime_info_get_value_bool(key, &value); + if (ret != RUNTIME_INFO_ERROR_NONE) { + /* Error handling */ + return; + } -    dlog_print(DLOG_INFO, LOG_TAG, "USB status: %s", -               value ? "Connected" : "Disconnected"); + dlog_print(DLOG_INFO, LOG_TAG, "USB status: %s", + value ? "Connected" : "Disconnected"); } /* Register and deregister */ void func(void) { -    int ret; -    void *data; - -    ret = runtime_info_set_changed_cb(RUNTIME_INFO_KEY_USB_CONNECTED, -                                      usb_connection_changed, data); -    if (ret != RUNTIME_INFO_ERROR_NONE) { -        /* Error handling */ -        return; -    } + int ret; + void *data; + + ret = runtime_info_set_changed_cb(RUNTIME_INFO_KEY_USB_CONNECTED, + usb_connection_changed, data); + if (ret != RUNTIME_INFO_ERROR_NONE) { + /* Error handling */ + return; + }
      • When no longer needed, deregister the callback with the runtime_info_unset_changed_cb() function: 
        -    ret = runtime_info_unset_changed_cb(RUNTIME_INFO_KEY_USB_CONNECTED);
-    if (ret != RUNTIME_INFO_ERROR_NONE) {
-        /* Error handling */
-        return;
-    }
+    ret = runtime_info_unset_changed_cb(RUNTIME_INFO_KEY_USB_CONNECTED);
+    if (ret != RUNTIME_INFO_ERROR_NONE) {
+        /* Error handling */
+        return;
+    }
 }

        • Runtime Information Keys

        - -

        The following table lists the available runtime information keys.

        - -

        Table: Runtime information keys

        -
      - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + +

      The following table lists the available runtime information keys.

      + +

      Table: Runtime information keys

      +
      KeyTypeDescription
      RUNTIME_INFO_KEY_BLUETOOTH_ENABLEDboolIndicates whether Bluetooth is enabled.
      RUNTIME_INFO_KEY_WIFI_HOTSPOT_ENABLEDboolIndicates whether a Wi-Fi hotspot is enabled.
      RUNTIME_INFO_KEY_BLUETOOTH_TETHERING_ENABLEDboolIndicates whether Bluetooth tethering is enabled.
      RUNTIME_INFO_KEY_USB_TETHERING_ENABLEDboolIndicates whether USB tethering is enabled.
      RUNTIME_INFO_KEY_LOCATION_SERVICE_ENABLEDboolIndicates whether the location service is allowed to use location data from GPS satellites.
      RUNTIME_INFO_KEY_LOCATION_NETWORK_POSITION_ENABLEDboolIndicates whether the location service is allowed to use location data from cellular and Wi-Fi.
      RUNTIME_INFO_KEY_PACKET_DATA_ENABLEDboolIndicates whether the packet data through 3G network is enabled.
      RUNTIME_INFO_KEY_DATA_ROAMING_ENABLEboolIndicates whether data roaming is enabled.
      RUNTIME_INFO_KEY_VIBRATION_ENABLEDboolIndicates whether vibration is enabled.
      RUNTIME_INFO_KEY_AUDIO_JACK_CONNECTEDboolIndicates whether an audio jack is connected.
      + + + + + + + + + + + + + + + + + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - - - -
      KeyTypeDescription
      RUNTIME_INFO_KEY_BLUETOOTH_ENABLEDboolIndicates whether Bluetooth is enabled.
      RUNTIME_INFO_KEY_WIFI_HOTSPOT_ENABLEDboolIndicates whether a Wi-Fi hotspot is enabled.
      RUNTIME_INFO_KEY_BLUETOOTH_TETHERING_ENABLEDboolIndicates whether Bluetooth tethering is enabled.
      RUNTIME_INFO_KEY_GPS_STATUSintIndicates the current status of GPS.
      RUNTIME_INFO_KEY_USB_TETHERING_ENABLEDboolIndicates whether USB tethering is enabled.
      RUNTIME_INFO_KEY_BATTERY_IS_CHARGINGboolIndicates whether the battery is currently charging.
      RUNTIME_INFO_KEY_LOCATION_SERVICE_ENABLEDboolIndicates whether the location service is allowed to use location data from GPS satellites.
      RUNTIME_INFO_KEY_TV_OUT_CONNECTEDboolIndicates whether TV out is connected.
      RUNTIME_INFO_KEY_LOCATION_NETWORK_POSITION_ENABLEDboolIndicates whether the location service is allowed to use location data from cellular and Wi-Fi.
      RUNTIME_INFO_KEY_AUDIO_JACK_STATUSintIndicates the current status of the audio jack.
      RUNTIME_INFO_KEY_PACKET_DATA_ENABLEDboolIndicates whether the packet data through 3G network is enabled.
      RUNTIME_INFO_KEY_USB_CONNECTEDboolIndicates whether USB is connected.
      RUNTIME_INFO_KEY_DATA_ROAMING_ENABLEboolIndicates whether data roaming is enabled.
      RUNTIME_INFO_KEY_CHARGER_CONNECTEDboolIndicates whether a charger is connected.
      RUNTIME_INFO_KEY_VIBRATION_ENABLEDboolIndicates whether vibration is enabled.
      RUNTIME_INFO_KEY_AUTO_ROTATION_ENABLEDboolIndicates whether auto-rotation is enabled.
      - + + RUNTIME_INFO_KEY_AUDIO_JACK_CONNECTED + bool + Indicates whether an audio jack is connected. + + + RUNTIME_INFO_KEY_GPS_STATUS + int + Indicates the current status of GPS. + + + RUNTIME_INFO_KEY_BATTERY_IS_CHARGING + bool + Indicates whether the battery is currently charging. + + + RUNTIME_INFO_KEY_TV_OUT_CONNECTED + bool + Indicates whether TV out is connected. + + + RUNTIME_INFO_KEY_AUDIO_JACK_STATUS + int + Indicates the current status of the audio jack. + + + RUNTIME_INFO_KEY_USB_CONNECTED + bool + Indicates whether USB is connected. + + + RUNTIME_INFO_KEY_CHARGER_CONNECTED + bool + Indicates whether a charger is connected. + + + RUNTIME_INFO_KEY_AUTO_ROTATION_ENABLED + bool + Indicates whether auto-rotation is enabled. + + + +
      diff --git a/org.tizen.guides/html/native/device/settings_n.htm b/org.tizen.guides/html/native/device/settings_n.htm index 738a8c8..57b077a 100644 --- a/org.tizen.guides/html/native/device/settings_n.htm +++ b/org.tizen.guides/html/native/device/settings_n.htm @@ -5,13 +5,13 @@ - + - System Settings + System Settings @@ -20,7 +20,7 @@

      Mobile native Wearable native

      - + -
    +

    System Settings

    @@ -74,11 +74,11 @@

    The following example shows a typical use case. An application sees the name of the current wallpaper and you want to print out a message when the wallpaper changes:

    -void 
+void
 _img_cb(system_settings_key_e key, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "THIS IS CALLED BY USER APPLICATION WHEN THE WALLPAPER CHANGES \n");
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "THIS IS CALLED BY USER APPLICATION WHEN THE WALLPAPER CHANGES \n");
 }
 
 /* NOTIFIER 1 - Registering a callback function */
@@ -87,7 +87,7 @@ char * path;
 
 /* GETTER */
 system_settings_get_value_string(SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN, &path);
-dlog_print(DLOG_INFO, LOG_TAG, "path of the current wallpaper is %s \n", path);
+dlog_print(DLOG_INFO, LOG_TAG, "path of the current wallpaper is %s \n", path);
 
 /* NOTIFIER 2 - Deregistering a callback function */
 system_settings_unset_changed_cb(SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN);
@@ -107,58 +107,58 @@ system_settings_unset_changed_cb(SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN);
 
 
     struct _ret_type_define {
-    system_settings_key_e key;
-    int returns;
+    system_settings_key_e key;
+    int returns;
 };
 
 typedef
 enum {
-    _RET_BOOL = 0,
-    _RET_INT,
-    _RET_STRING
+    _RET_BOOL = 0,
+    _RET_INT,
+    _RET_STRING
 } _SYSTEM_SETTINGS_TYPES;
 
 struct _ret_type_define
 _ret_type[] = {
-    {
-        SYSTEM_SETTINGS_KEY_INCOMING_CALL_RINGTONE, _RET_STRING
-    },
-    {
-        SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN, _RET_STRING
-    },
-    {
-        SYSTEM_SETTINGS_KEY_WALLPAPER_LOCK_SCREEN, _RET_STRING
-    },
-    {
-        SYSTEM_SETTINGS_KEY_FONT_SIZE, _RET_INT
-    },
-    {
-        SYSTEM_SETTINGS_KEY_FONT_TYPE, _RET_STRING
-    },
-    {
-        SYSTEM_SETTINGS_KEY_MOTION_ACTIVATION, _RET_BOOL
-    },
-    {
-        /* Others */
-    }
+    {
+        SYSTEM_SETTINGS_KEY_INCOMING_CALL_RINGTONE, _RET_STRING
+    },
+    {
+        SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN, _RET_STRING
+    },
+    {
+        SYSTEM_SETTINGS_KEY_WALLPAPER_LOCK_SCREEN, _RET_STRING
+    },
+    {
+        SYSTEM_SETTINGS_KEY_FONT_SIZE, _RET_INT
+    },
+    {
+        SYSTEM_SETTINGS_KEY_FONT_TYPE, _RET_STRING
+    },
+    {
+        SYSTEM_SETTINGS_KEY_MOTION_ACTIVATION, _RET_BOOL
+    },
+    {
+        /* Others */
+    }
 };
 
 static const char*
 _info_key[SYS_INFO_COUNT] = {
-    "SYSTEM_SETTINGS_KEY_INCOMING_CALL_RINGTONE",
-    "SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN",
-    "SYSTEM_SETTINGS_KEY_WALLPAPER_LOCK_SCREEN",
-    "SYSTEM_SETTINGS_KEY_FONT_SIZE",
-    "SYSTEM_SETTINGS_KEY_FONT_TYPE",
-    "SYSTEM_SETTINGS_KEY_MOTION_ACTIVATION",
-    /* Others */
+    "SYSTEM_SETTINGS_KEY_INCOMING_CALL_RINGTONE",
+    "SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN",
+    "SYSTEM_SETTINGS_KEY_WALLPAPER_LOCK_SCREEN",
+    "SYSTEM_SETTINGS_KEY_FONT_SIZE",
+    "SYSTEM_SETTINGS_KEY_FONT_TYPE",
+    "SYSTEM_SETTINGS_KEY_MOTION_ACTIVATION",
+    /* Others */
 };
 
    
 
 
 
  • Obtain the setting data.
    
 
    The available settings are defined in the system_settings_key_e enumerator (in mobile and wearable applications).
    
- 
+
 
    Read the data using the following functions, according to the data type of the value you want to read:
    
 
 
    • system_settings_get_value_int()
      • 
@@ -172,25 +172,25 @@ _info_key[SYS_INFO_COUNT] = {
 
 int i;
 for (i = 0; i < SYS_INFO_COUNT; i++) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "%d- System_settings: %s: ",
-               i, _info_key[_ret_type[i].key]);
-
-    if (_ret_type[i].returns==_RET_BOOL) {
-        system_settings_get_value_bool(_ret_type[i].key, &_bool_ret);
-        dlog_print(DLOG_ERROR, LOG_TAG, "%d", _bool_ret);
-    } else if (_ret_type[i].returns==_RET_INT) {
-        system_settings_get_value_int(_ret_type[i].key, &_int_ret);
-        dlog_print(DLOG_ERROR, LOG_TAG, "%d", _int_ret);
-    } else if (_ret_type[i].returns==_RET_STRING) {
-        system_settings_get_value_string(_ret_type[i].key, &_string_ret);
-        dlog_print(DLOG_ERROR, LOG_TAG, "%s", _string_ret);
-        free(_string_ret);
-    } else if (_ret_type[i].returns==_RET_DOUBLE) {
-        system_settings_get_value_double(_ret_type[i].key, &_double_ret);
-        dlog_print(DLOG_ERROR, LOG_TAG, "%f", _double_ret);
-    } else {
-        dlog_print(DLOG_ERROR, LOG_TAG, "Undefined return type");
-    }
+    dlog_print(DLOG_ERROR, LOG_TAG, "%d- System_settings: %s: ",
+               i, _info_key[_ret_type[i].key]);
+
+    if (_ret_type[i].returns==_RET_BOOL) {
+        system_settings_get_value_bool(_ret_type[i].key, &_bool_ret);
+        dlog_print(DLOG_ERROR, LOG_TAG, "%d", _bool_ret);
+    } else if (_ret_type[i].returns==_RET_INT) {
+        system_settings_get_value_int(_ret_type[i].key, &_int_ret);
+        dlog_print(DLOG_ERROR, LOG_TAG, "%d", _int_ret);
+    } else if (_ret_type[i].returns==_RET_STRING) {
+        system_settings_get_value_string(_ret_type[i].key, &_string_ret);
+        dlog_print(DLOG_ERROR, LOG_TAG, "%s", _string_ret);
+        free(_string_ret);
+    } else if (_ret_type[i].returns==_RET_DOUBLE) {
+        system_settings_get_value_double(_ret_type[i].key, &_double_ret);
+        dlog_print(DLOG_ERROR, LOG_TAG, "%f", _double_ret);
+    } else {
+        dlog_print(DLOG_ERROR, LOG_TAG, "Undefined return type");
+    }
 }
    • @@ -201,8 +201,8 @@ for (i = 0; i < SYS_INFO_COUNT; i++) { 
     for (i = 0; i < SYS_INFO_COUNT; i++)
-    system_settings_set_changed_cb(_ret_type[i].key,
-                                   _system_settings_changed_cb, 0);
+    system_settings_set_changed_cb(_ret_type[i].key,
+                                   _system_settings_changed_cb, 0);

  • Define the callback to be invoked after each change.

    @@ -212,7 +212,7 @@ for (i = 0; i < SYS_INFO_COUNT; i++) static void _system_settings_changed_cb(system_settings_key_e key, void *user_data) { -    dlog_print(DLOG_ERROR, LOG_TAG, "Runtime Info changed: %s", _info_key[key]); + dlog_print(DLOG_ERROR, LOG_TAG, "Runtime Info changed: %s", _info_key[key]); }
    • @@ -220,8 +220,8 @@ _system_settings_changed_cb(system_settings_key_e key, void *user_data) 
     for (i = 0; i < SYS_INFO_COUNT; i++)
-    system_settings_unset_changed_cb(_ret_type[i].key,
-                                     _system_settings_changed_cb, 0);
+    system_settings_unset_changed_cb(_ret_type[i].key,
+                                     _system_settings_changed_cb, 0);
    @@ -233,15 +233,15 @@ for (i = 0; i < SYS_INFO_COUNT; i++)

    The system_settings_key_e enumerator (in mobile and wearable applications) defines all enumerations that work as parameters for the System Settings API.

    The following table lists the available system setting keys.

    -

    Table: System settings keys

    +

    Table: System settings keys

    - - + + - - - + + + @@ -256,7 +256,7 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - + @@ -270,7 +270,7 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - + @@ -283,15 +283,15 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - - + + - - + + @@ -326,9 +326,9 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - + - + @@ -342,12 +342,12 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - + - + @@ -363,7 +363,7 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - + @@ -389,7 +389,7 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - + @@ -403,7 +403,7 @@ for (i = 0; i < SYS_INFO_COUNT; i++) - +
    Key TypeSupported function type Description
    Supported function type Description
    SYSTEM_SETTINGS_KEY_DEFAULT_FONT_TYPEGETTER, NOTIFIER Device name.
    SYSTEM_SETTINGS_KEY_DISPLAY_SCREEN_ROTATION_AUTO boolGETTER, NOTIFIER File path of the current email alert ringtone.
    SYSTEM_SETTINGS_KEY_FONT_SIZE intstring GETTER, NOTIFIER Current system font type.
    SYSTEM_SETTINGS_KEY_INCOMING_CALL_RINGTONE string GETTER, NOTIFIER File path of the current ringtone.
    SYSTEM_SETTINGS_KEY_LOCALE_COUNTRY stringGETTER, NOTIFIER Indicates whether the motion service is activated.
    SYSTEM_SETTINGS_KEY_NETWORK_FLIGHT_MODESYSTEM_SETTINGS_KEY_NETWORK_FLIGHT_MODE bool GETTER, NOTIFIER Indicates whether the device is in the flight mode.
    SYSTEM_SETTINGS_KEY_SOUND_LOCKSYSTEM_SETTINGS_KEY_SOUND_LOCK bool GETTER, NOTIFIER Indicates whether the screen lock sound is enabled on the device (for example, whether the LCD on/off sound is enabled).
    SYSTEM_SETTINGS_KEY_SOUND_NOTIFICATION string
    SYSTEM_SETTINGS_KEY_SOUND_SILENT_MODESYSTEM_SETTINGS_KEY_SOUND_SILENT_MODE bool GETTER, NOTIFIER Indicates whether the device is in the silent mode.GETTER, NOTIFIER Indicates whether the USB debugging is enabled.
    SYSTEM_SETTINGS_KEY_WALLPAPER_HOME_SCREEN stringGETTER, NOTIFIER File path of the current lock screen wallpaper.
    diff --git a/org.tizen.guides/html/native/device/system_n.htm b/org.tizen.guides/html/native/device/system_n.htm index 04a82e1..d392063 100644 --- a/org.tizen.guides/html/native/device/system_n.htm +++ b/org.tizen.guides/html/native/device/system_n.htm @@ -5,13 +5,13 @@ - + - System Information + System Information @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - + -
    +
    -

    System Information

    +

    System Information

    + +

    System information features enable your application to retrieve information about fixed platform features or device capabilities by querying system information keys. You can also check for supported features.

    -

    System information features enable your application to retrieve information about fixed platform features or device capabilities by querying system information keys. You can also check for supported features.

    -

    The main features of the System Information API include:

    - -

    Table: Device-specific information categories

    - - - - - + +

    Table: Device-specific information categories

    +
    CategoryDescription
    + + + + + + + + - - - - - - - - - -
    CategoryDescription
    Platform informationPlatform or API version, screen coordination system, and CPU and FPU architecture.
    Platform informationPlatform or API version, screen coordination system, and CPU and FPU architecture.
    Device capabilitiesSensors, networks, connections, and additional components.
    + + Device capabilities + Sensors, networks, connections, and additional components. + + +

    To obtain the information, query a feature or system key.

    - +

    Table: System information keys

    @@ -153,7 +153,7 @@
    - +
    Note Some device-specific information keys look similar to feature keys for application filtering, but their usage differs. Feature keys for device-specific information are used to determine whether the feature is supported in the system. Feature keys for application filtering let the Tizen store filter applications based on features. @@ -168,27 +168,27 @@

    Getting the Device Model Name

    -

    Device-specific information consists of "key, value" pairs. To get the device model name, use the http://tizen.org/system/model_name key with the data type-specific get function.

    +

    Device-specific information consists of "key, value" pairs. To get the device model name, use the http://tizen.org/system/model_name key with the data type-specific get function.

    The model name key data type is string, which means that you need to use the system_info_get_platform_string() function.

    When no longer needed, release the value of the key with the free() function.

    - + 
     void
 func(void)
 {
-    char *value;
-    int ret;
+    char *value;
+    int ret;
 
-    ret = system_info_get_platform_string("http://tizen.org/system/model_name", &value);
-    if (ret != SYSTEM_INFO_ERROR_NONE) {
-        /* Error handling */
+    ret = system_info_get_platform_string("http://tizen.org/system/model_name", &value);
+    if (ret != SYSTEM_INFO_ERROR_NONE) {
+        /* Error handling */
 
-        return;
-    }
+        return;
+    }
 
-    dlog_print(DLOG_INFO, LOG_TAG, "Model name: %s", value);
+    dlog_print(DLOG_INFO, LOG_TAG, "Model name: %s", value);
 
-    free(value); /* Release after use */
+    free(value); /* Release after use */
 }
    @@ -203,237 +203,237 @@ func(void) void func(void) { -    bool value; -    int ret; + bool value; + int ret; -    ret = system_info_get_platform_bool("http://tizen.org/feature/camera", &value); -    if (ret != SYSTEM_INFO_ERROR_NONE) { -        /* Error handling */ + ret = system_info_get_platform_bool("http://tizen.org/feature/camera", &value); + if (ret != SYSTEM_INFO_ERROR_NONE) { + /* Error handling */ -        return; -    } + return; + } -    dlog_print(DLOG_INFO, LOG_TAG, "Camera: %s", value ? "Supported" : "Not supported"); + dlog_print(DLOG_INFO, LOG_TAG, "Camera: %s", value ? "Supported" : "Not supported"); } - +

    Feature Keys

    The following table lists the battery feature keys.

    Table: Battery feature keys

    - - - - + +
    + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/batteryboolbool The platform returns true for this key, if the device has a battery.
    - + + +

    The following table lists the camera feature keys.

    -

    Table: Camera feature keys

    - - - +

    Table: Camera feature keys

    +
    + + - - + + - + - + - + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/cameraboolbool The platform returns true for this key, if the device provides any kind of a camera.
    http://tizen.org/feature/camera.backboolbool The platform returns true for this key and the http://tizen.org/feature/camera key, if the device provides a back-facing camera.
    http://tizen.org/feature/camera.back.flashboolbool The platform returns true for this key and the http://tizen.org/feature/camera.back key, if the device provides a back-facing camera with a flash.
    http://tizen.org/feature/camera.frontboolbool The platform returns true for this key and the http://tizen.org/feature/camera key, if the device provides a front-facing camera.
    http://tizen.org/feature/camera.front.flashboolbool The platform returns true for this key and the http://tizen.org/feature/camera.front key, if the device provides a front-facing camera with a flash.

    The following table lists the consumer IR feature keys.

    -

    Table: Consumer IR feature keys

    - - - +

    Table: Consumer IR feature keys

    +
    + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/consumer_irboolbool The platform returns true for this key, if the device supports the Consumer Infrared (CIR) feature.
    + +

    The following table lists the convergence D2D feature keys.

    -

    Table: Convergence D2D feature keys

    - - - +

    Table: Convergence D2D feature keys

    +
    + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/convergence.d2dboolbool The platform returns true for this key, if the device supports a service for the discovery of near-by devices and the communication with the remote devices. The device must support 1 or more network features.
    + +

    The following table lists the database feature keys.

    Table: Database feature keys

    - - - +
    + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/database.encryptionboolbool The platform returns true for this key, if the device supports database encryption.
    + +

    The following table lists the datasync feature keys.

    Table: Datasync feature keys

    - - + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/datasyncboolbool The platform returns true for this key, if the device supports the DataSynchronization API.
    + +

    The following table lists the download feature keys.

    -

    Table: Download feature keys

    - - - +

    Table: Download feature keys

    +
    + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/downloadboolbool The platform returns true for this key, if the device supports the Download API.

    The following table lists the FIDO feature keys.

    -

    Table: FIDO feature keys

    - - - +

    Table: FIDO feature keys

    +
    + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/fido.uafboolbool The platform returns true for this key, if the device supports the FIDO (Fast Identity Online) UAF (Universal Authentication Framework) client API.
    + +

    The following table lists the FM radio feature keys.

    -

    Table: FM radio feature keys

    - - - +

    Table: FM radio feature keys

    +
    + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/fmradioboolbool The platform returns true for this key, if the device supports an FM radio.
    -

    The following table lists the graphics feature keys.

    -

    Table: Graphics feature keys

    +

    The following table lists the graphics feature keys.

    +

    Table: Graphics feature keys

    - - + + - + - + - +
    Key TypeDescriptionDescription
    http://tizen.org/feature/graphics.accelerationboolbool The platform returns true for this key, if the device supports graphics hardware acceleration.

    The following table lists the human activity monitor feature keys.

    Table: Human activity monitor feature keys

    - - - +
    + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/humanactivitymonitorboolbool The platform returns true for this key, if the device supports any of the human activity monitor sensors.
    + +

    The following table lists the input feature keys.

    -

    Table: Input feature keys

    - - - +

    Table: Input feature keys

    +
    + + - - + + - + - + @@ -442,24 +442,24 @@ func(void) - +
    Key TypeDescription
    Description
    http://tizen.org/feature/input.keyboardboolbool The platform returns true for this key, if the device provides a built-in keyboard supporting any keyboard layout.
    http://tizen.org/feature/input.keyboard.layoutStringString The platform returns the keyboard layout (such as qwerty) supported by the built-in keyboard for this key and returns true for the http://tizen.org/feature/input.keyboard key.

    If the device does not provide a built-in keyboard, the platform returns an empty string for this key and returns false for the http://tizen.org/feature/input.keyboard key.
    bool The platform returns true for this key, if the device supports the rotating bezel feature.

    The following table lists the IOT feature keys.

    Table: IOT feature keys

    - - + + - - + + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/iot.ocfboolbool The platform returns true for this key, if the device supports the Open Connectivity Foundation (OCF) framework.
    + +

    The following table lists the LED feature keys.

    Table: LED feature keys

    @@ -477,61 +477,61 @@ func(void)

    The following table lists the location feature keys.

    -

    Table: Location feature keys

    +

    Table: Location feature keys

    - - + + - + - + - + - + - + - + - + - + - +
    Key TypeDescriptionDescription
    http://tizen.org/feature/locationboolbool The platform returns true for this key, if the device supports location positioning.
    http://tizen.org/feature/location.batchboolbool The platform returns true for this key and the http://tizen.org/feature/location key, if the device supports the GPS batch feature.
    http://tizen.org/feature/location.geofenceboolbool The platform returns true for this key and the http://tizen.org/feature/location key, if the device supports the geofence feature.
    http://tizen.org/feature/location.gpsboolbool The platform returns true for this key and the http://tizen.org/feature/location key, if the device supports the Global Positioning System (GPS).
    http://tizen.org/feature/location.gps.satelliteboolbool The platform returns true for this key and the http://tizen.org/feature/location.gps key, if the device has a GPS chip that supports satellite information.
    http://tizen.org/feature/location.wpsboolbool The platform returns true for this key and the http://tizen.org/feature/location key, if the device supports the Wi-Fi-based Positioning System (WPS).

    The following table lists the maps feature keys.

    Table: Maps feature keys

    - - - +
    + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/mapsboolbool The platform returns true for this key, if the device supports the map service feature.

    The following table lists the media feature keys.

    Table: Media feature keys

    @@ -557,25 +557,25 @@ func(void) bool The platform returns true for this key, if the device supports the video recording feature. - +

    The following table lists the microphone feature keys.

    -

    Table: Microphone feature keys

    - - - +

    Table: Microphone feature keys

    +
    + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/microphoneboolbool The platform returns true for this key, if the device supports a microphone.
    -

    The following table lists the multimedia feature keys.

    +

    The following table lists the multimedia feature keys.

    Table: Multimedia feature keys

    @@ -594,37 +594,37 @@ func(void)

    The following table lists the multi-point touch feature keys.

    Table: Multi-point touch feature keys

    - - + + - - + + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/multi_point_touch.pinch_zoomboolbool The platform returns true for this key, if the device supports pinch zoom gestures.
    http://tizen.org/feature/multi_point_touch.point_countintint The platform returns the maximum number of supported multi-touch points for this key.

    The platform returns a value less than 2 for this key, if the device does not support multi-point touch.

    The following table lists the network feature keys.

    Table: Network feature keys

    - - - +
    + + - - + + - + @@ -676,7 +676,7 @@ func(void) - + @@ -694,7 +694,7 @@ func(void) - + @@ -714,7 +714,7 @@ func(void) - + @@ -724,13 +724,13 @@ func(void) - + - + @@ -743,112 +743,112 @@ the Tizen reference implementation. - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + @@ -863,66 +863,66 @@ the Tizen reference implementation. - +
    Key TypeDescription
    Description
    http://tizen.org/feature/network.bluetoothboolbool The platform returns true for this key, if the device supports Bluetooth.
    http://tizen.org/feature/network.ethernet bool The platform returns true for this key, if the device supports Ethernet.
    http://tizen.org/feature/network.internet bool
    http://tizen.org/feature/network.nfcboolbool The platform returns true for this key, if the device supports Adapter and NDEF APIs which require Near Field Communication (NFC).
    http://tizen.org/feature/network.nfc.reserved_pushboolbool The platform returns true for this key and the http://tizen.org/feature/network.nfc key, if the device supports the NFC reserved push feature.
    http://tizen.org/feature/network.pushboolbool The platform returns true for this key, if the device supports the IP push service provided by the Tizen reference implementation.
    http://tizen.org/feature/network.secure_elementboolbool The platform returns true for this key, if the device supports secure elements.
    http://tizen.org/feature/network.secure_element.ese
    http://tizen.org/feature/network.service_discovery.dnssdboolbool The platform returns true for this key, if the device supports the DNS-based Service Discovery Feature (DNSSD).
    http://tizen.org/feature/network.service_discovery.ssdpboolbool The platform returns true for this key, if the device supports the Simple Service Discovery Protocol feature (SSDP).
    http://tizen.org/feature/network.telephonyboolbool The platform returns true for this key, if the device supports telephony.
    http://tizen.org/feature/network.telephony.mmsboolbool The platform returns true for this key and the http://tizen.org/feature/network.telephony key, if the device supports MMS.
    http://tizen.org/feature/network.telephony.service.cdmaboolbool The platform returns true for this key, if the device supports the CDMA service.
    http://tizen.org/feature/network.telephony.service.edgeboolbool The platform returns true for this key, if the device supports the EDGE service.
    http://tizen.org/feature/network.telephony.service.gprsboolbool The platform returns true for this key, if the device supports the GPRS service.
    http://tizen.org/feature/network.telephony.service.gsmboolbool The platform returns true for this key, if the device supports the GSM service.
    http://tizen.org/feature/network.telephony.service.hsdpaboolbool The platform returns true for this key, if the device supports the HSDPA service.
    http://tizen.org/feature/network.telephony.service.hspaboolbool The platform returns true for this key, if the device supports the HSPA service.
    http://tizen.org/feature/network.telephony.service.hsupaboolbool The platform returns true for this key, if the device supports the HSUPA service.
    http://tizen.org/feature/network.telephony.service.lteboolbool The platform returns true for this key, if the device supports the LTE service.
    http://tizen.org/feature/network.telephony.service.umtsboolbool The platform returns true for this key, if the device supports the UMTS service.
    http://tizen.org/feature/network.telephony.smsboolbool The platform returns true for this key and the http://tizen.org/feature/network.telephony key, if the device supports SMS.
    http://tizen.org/feature/network.telephony.sms.cbsboolbool The platform returns true for this key and the http://tizen.org/feature/network.telephony key, if the device supports the cell broadcast service (CBS) for SMS.
    http://tizen.org/feature/network.tetheringboolbool The platform returns true for this key, if the device supports any kind of tethering.
    http://tizen.org/feature/network.tethering.bluetoothboolbool The platform returns true for this key and the http://tizen.org/feature/network.tethering key, if the device supports tethering over Bluetooth.
    http://tizen.org/feature/network.tethering.usbboolbool The platform returns true for this key and the http://tizen.org/feature/network.tethering key, if the device supports tethering over USB connection.
    http://tizen.org/feature/network.tethering.wifiboolbool The platform returns true for this key and the http://tizen.org/feature/network.tethering key, if the device supports tethering over Wi-Fi.
    http://tizen.org/feature/network.vpnboolbool The platform returns true for this key, if the device supports the Virtual Private Network feature (VPN).
    http://tizen.org/feature/network.wifiboolbool The platform returns true for this key, if the device supports all APIs which require Wi-Fi.
    http://tizen.org/feature/network.wifi.directboolbool The platform returns true for this key and the http://tizen.org/feature/network.wifi key, if the device supports Wi-Fi Direct™.
    http://tizen.org/feature/network.wifi.direct.display bool The platform returns true for this key, if the device supports the Wi-Fi Tunneled Direct Link Setup (TDLS).

    The following table lists the OpenGL® ES feature keys.

    Table: OpenGL® ES feature keys

    - - - +
    + + - - + + - + - + - + - + - + - + - + - + - + - + @@ -930,82 +930,82 @@ the Tizen reference implementation. - +
    Key TypeDescription
    Description
    http://tizen.org/feature/openglesboolbool The platform returns true for this key, if the device supports any OpenGL® ES version and any texture format.
    http://tizen.org/feature/opengles.texture_formatStringString The platform returns true for this key, if the device supports any OpenGL® ES or compressed texture format.

    If the device supports no formats, the platform returns an empty string for this key.
    http://tizen.org/feature/opengles.texture_format.3dcboolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the 3DC texture format for OpenGL® ES.
    http://tizen.org/feature/opengles.texture_format.atcboolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the ATC texture format for OpenGL® ES.
    http://tizen.org/feature/opengles.texture_format.etcboolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the ETC texture format for OpenGL® ES.
    http://tizen.org/feature/opengles.texture_format.ptcboolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the PTC texture format for OpenGL® ES.
    http://tizen.org/feature/opengles.texture_format.pvrtcboolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the PVRTC texture format for OpenGL® ES.
    http://tizen.org/feature/opengles.texture_format.utcboolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the UTC texture format for OpenGL® ES.
    http://tizen.org/feature/opengles.version.1_1boolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the OpenGL® ES version 1.1.
    http://tizen.org/feature/opengles.version.2_0boolbool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the OpenGL® ES version 2.0.
    bool The platform returns true for this key and the http://tizen.org/feature/opengles key, if the device supports the OpenGL® ES version 3.0.

    The following table lists the platform feature keys.

    -

    Table: Platform feature keys

    - - - +

    Table: Platform feature keys

    +
    + + - + - - + - + - + - + - + - + - + - + - + - + - + - + - + @@ -1015,7 +1015,7 @@ the Tizen reference implementation. - + @@ -1025,38 +1025,38 @@ the Tizen reference implementation. - + - +
    Key TypeDescriptionDescription
    http://tizen.org/feature/platform.core.api.versionStringThe platform returns the version of the Tizen Core API in the "[Major].[Minor]" format. + StringThe platform returns the version of the Tizen Core API in the "[Major].[Minor]" format.

    If a device does not provide the Tizen Core API, it returns an empty string for this key.
    http://tizen.org/feature/platform.core.cpu.archStringString The platform returns the CPU architecture.
    http://tizen.org/feature/platform.core.cpu.arch.armv6boolbool The platform returns true for this key, if the device runs on the ARMv6 CPU architecture.
    http://tizen.org/feature/platform.core.cpu.arch.armv7boolbool The platform returns true for this key, if the device runs on the ARMv7 CPU architecture.
    http://tizen.org/feature/platform.core.cpu.arch.x86boolbool The platform returns true for this key, if the device runs on the x86 CPU architecture.
    http://tizen.org/feature/platform.core.cpu.frequencyintint The platform returns the frequency at which a core CPU is running.
    http://tizen.org/feature/platform.core.fpu.archStringString The platform returns the FPU architecture.
    http://tizen.org/feature/platform.core.fpu.arch.sse2boolbool The platform returns true for this key, if the device runs on the SSE2 FPU architecture.
    http://tizen.org/feature/platform.core.fpu.arch.sse3boolbool The platform returns true for this key, if the device runs on the SSE3 FPU architecture.
    http://tizen.org/feature/platform.core.fpu.arch.ssse3boolbool The platform returns true for this key, if the device runs on the SSSE3 FPU architecture.
    http://tizen.org/feature/platform.core.fpu.arch.vfpv2boolbool The platform returns true for this key, if the device runs on the VFPV2 FPU architecture.
    http://tizen.org/feature/platform.core.fpu.arch.vfpv3boolbool The platform returns true for this key, if the device runs on the VFPV3 FPU architecture.
    http://tizen.org/feature/platform.native.api.version StringThe platform returns the version of the native API in the "[Major].[Minor]" format.The platform returns the version of the native API in the "[Major].[Minor]" format.
    http://tizen.org/feature/platform.native.osp_compatible
    http://tizen.org/feature/platform.version StringThe platform returns the version of the platform in the "[Major].[Minor].[Patch Version]" format.The platform returns the version of the platform in the "[Major].[Minor].[Patch Version]" format.
    http://tizen.org/feature/platform.version.name
    http://tizen.org/feature/platform.web.api.version StringThe platform returns the version of the Web API in the "[Major].[Minor]" format.The platform returns the version of the Web API in the "[Major].[Minor]" format.

    The following table lists the profile feature keys.

    Table: Profile feature keys

    - - - +
    + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/profileStringString The platform returns a compliant device profile (such as mobile-full) for this key.

    The following table lists the screen feature keys.

    Table: Screen feature keys

    - - - +
    + + - - + + - + @@ -1071,42 +1071,42 @@ the Tizen reference implementation. - + - + - + - + - + - + - + - + - + @@ -1123,21 +1123,21 @@ the Tizen reference implementation. - + - + - + - - + @@ -1148,8 +1148,8 @@ the Tizen reference implementation. - - + @@ -1166,58 +1166,58 @@ the Tizen reference implementation. - - + - - + - - + - - + - - + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/screenboolbool The platform returns true for this key, if the device has a display screen.
    http://tizen.org/feature/screen.auto_rotationboolbool The platform returns true for this key, if the device supports screen auto-rotation.
    http://tizen.org/feature/screen.bppintint The platform returns the number of bits per pixel supported by the device for this key. The value depends on the screen, and is typically 8, 16, 24, or 32.
    http://tizen.org/feature/screen.coordinate_system.size.largeboolbool The platform returns true for this key, if the device supports the large screen size for the coordinate system.
    http://tizen.org/feature/screen.coordinate_system.size.normalboolbool The platform returns true for this key, if the device supports the normal screen size for the coordinate system.
    http://tizen.org/feature/screen.dpiintint The platform returns the number of dots per inch supported by the device for this key.
    http://tizen.org/feature/screen.heightintint The platform returns the height of the screen in pixels supported by the device for this key.
    http://tizen.org/feature/screen.output.hdmiboolbool The platform returns true for this key, if the device supports HDMI output.
    http://tizen.org/feature/screen.output.rcaboolbool The platform returns true for this key, if the device supports RCA output.
    http://tizen.org/feature/screen.size.all bool The platform always returns true, if the device supports any screen sizes and resolutions.
    http://tizen.org/feature/screen.size.largeboolbool The platform returns true for this key, if the device supports the large screen size.
    http://tizen.org/feature/screen.size.normalboolbool The platform always returns false for this key.
    http://tizen.org/feature/screen.size.normal.240.400boolThe platform returns true for this key, if the device supports the 240 x 400 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 240 x 400 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.
    http://tizen.org/feature/screen.size.normal.320.480boolThe platform returns true for this key, if the device supports the 320 x 480 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 320 x 480 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.
    http://tizen.org/feature/screen.size.normal.480.800boolThe platform returns true for this key, if the device supports the 480 x 800 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 480 x 800 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.
    http://tizen.org/feature/screen.size.normal.540.960boolThe platform returns true for this key, if the device supports the 540 x 960 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 540 x 960 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.
    http://tizen.org/feature/screen.size.normal.600.1024boolThe platform returns true for this key, if the device supports the 600 x 1024 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 600 x 1024 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.
    http://tizen.org/feature/screen.size.normal.720.1280boolThe platform returns true for this key, if the device supports the 720 x 1280 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 720 x 1280 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.
    http://tizen.org/feature/screen.size.normal.1080.1920boolThe platform returns true for this key, if the device supports the 1080 x 1290 resolution for the normal screen size. + boolThe platform returns true for this key, if the device supports the 1080 x 1290 resolution for the normal screen size.

    The platform can return true for multiple resolution keys.

    http://tizen.org/feature/screen.widthintint The platform returns the width of the screen in pixels supported by the device for this key.

    The following table lists the sensor feature keys.

    -

    Table: Sensor feature keys

    - - - +

    Table: Sensor feature keys

    +
    + + - - + + - + - + @@ -1227,19 +1227,19 @@ the Tizen reference implementation. - + - + - + @@ -1252,22 +1252,22 @@ the Tizen reference implementation. - + - + - + - + - + @@ -1302,17 +1302,17 @@ the Tizen reference implementation. - + - + - + - + @@ -1322,22 +1322,22 @@ the Tizen reference implementation. - + - + - + - + @@ -1362,12 +1362,12 @@ the Tizen reference implementation. - + - + @@ -1381,190 +1381,190 @@ the Tizen reference implementation. - +
    Key TypeDescription
    Description
    http://tizen.org/feature/sensor.accelerometerboolbool The platform returns true for this key, if the device supports the acceleration sensor.
    http://tizen.org/feature/sensor.accelerometer.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.accelerometer key, if the device supports the wake-up operation by the acceleration sensor.
    http://tizen.org/feature/sensor.barometerboolbool The platform returns true for this key, if the device supports the barometer sensor.
    http://tizen.org/feature/sensor.barometer.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.barometer key, if the device supports the wake-up operation by the barometer sensor.
    http://tizen.org/feature/sensor.geomagnetic_rotation_vector bool The platform returns true for this key, if the device supports the geomagnetic-based rotation vector sensor.
    http://tizen.org/feature/sensor.gesture_recognition bool
    http://tizen.org/feature/sensor.gyroscopeboolbool The platform returns true for this key, if the device supports the gyro sensor.
    http://tizen.org/feature/sensor.gyroscope_rotation_vectorboolbool The platform returns true for this key, if the device supports the gyroscope-based rotation vector sensor.
    http://tizen.org/feature/sensor.gyroscope.uncalibratedboolbool The platform returns true for this key, if the device supports the uncalibrated gyroscope sensor.
    http://tizen.org/feature/sensor.gyroscope.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.gyroscope key, if the device supports the wake-up operation by the gyro sensor.
    http://tizen.org/feature/sensor.magnetometerboolbool The platform returns true for this key, if the device supports the magnetic sensor.
    http://tizen.org/feature/sensor.magnetometer.uncalibratedboolbool The platform returns true for this key, if the device supports the uncalibrated geomagnetic sensor.
    http://tizen.org/feature/sensor.magnetometer.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.magnetometer key, if the device supports the wake-up operation by the magnetic sensor.
    http://tizen.org/feature/sensor.photometerboolbool The platform returns true for this key, if the device supports the photo (light) sensor.
    http://tizen.org/feature/sensor.photometer.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.photometer key, if the device supports the wake-up operation by the photo sensor.
    http://tizen.org/feature/sensor.proximityboolbool The platform returns true for this key, if the device supports the proximity sensor.
    http://tizen.org/feature/sensor.proximity.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.proximity key, if the device supports the wake-up operation by the proximity sensor.
    http://tizen.org/feature/sensor.tiltmeterboolbool The platform returns true for this key, if the device supports the tilt sensor.
    http://tizen.org/feature/sensor.tiltmeter.wakeupboolbool The platform returns true for this key and the http://tizen.org/feature/sensor.tiltmeter key, if the device supports the wake-up operation by the tilt sensor.
    The platform returns true for this key, if the device supports the wrist up action.

    The following table lists the shell feature keys.

    -

    Table: Shell feature keys

    - - - +

    Table: Shell feature keys

    +
    + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/shell.appwidgetboolbool The platform returns true for this key, if the device supports the AppWidget.
    -

    The following table lists the sip feature keys.

    -

    Table: Sip feature keys

    +

    The following table lists the sip feature keys.

    +

    Table: Sip feature keys

    - - + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/sip.voipboolbool The platform returns true for this key, if the device supports the Voice over Internet Protocol (VoIP).

    The following table lists the speech feature keys.

    Table: Speech feature keys

    - - - +
    + + - - + + - + - + - + - -
    Key TypeDescription
    Description
    http://tizen.org/feature/speech.controlboolbool The platform returns true for this key, if the device supports voice control.
    http://tizen.org/feature/speech.recognitionboolbool The platform returns true for this key, if the device supports speech recognition (STT).
    http://tizen.org/feature/speech.synthesisboolbool The platform returns true for this key, if the device supports speech synthesis (TTS).
    + +

    The following table lists the system setting feature keys.

    -

    Table: System setting feature keys

    - - - +

    Table: System setting feature keys

    +
    + + - - + + - + - + - + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/systemsettingboolbool The platform returns true for this key, if the device supports the SystemSetting API.
    http://tizen.org/feature/systemsetting.home_screenboolbool The platform returns true for this key and the http://tizen.org/feature/systemsetting key, if the device supports a way to change or get the picture on the home screen.
    http://tizen.org/feature/systemsetting.incoming_callboolbool The platform returns true for this key and the http://tizen.org/feature/systemsetting key, if the device supports a way to change or get a ringtone for all incoming calls.
    http://tizen.org/feature/systemsetting.lock_screenboolbool The platform returns true for this key and the http://tizen.org/feature/systemsetting key, if the device supports a way to change or get the lock screen wallpaper.
    http://tizen.org/feature/systemsetting.notification_emailboolbool The platform returns true for this key and the http://tizen.org/feature/systemsetting key, if the device supports a way to change or get a ringtone for all email notifications.
    -

    The following table lists the USB feature keys.

    -

    Table: USB feature keys

    +

    The following table lists the USB feature keys.

    +

    Table: USB feature keys

    - - + + - - + + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/usb.accessoryboolbool The platform returns true for this key, if the device supports the USB client or accessory mode.
    http://tizen.org/feature/usb.hostboolbool The platform returns true for this key, if the device supports the USB host mode.

    The following table lists the vision feature keys.

    -

    Table: Vision feature keys

    - - - +

    Table: Vision feature keys

    +
    + + - - + + - + - + - + - + - + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/vision.barcode_detectionboolbool The platform returns true for this key, if the device supports the barcode detection feature.
    http://tizen.org/feature/vision.barcode_generationboolbool The platform returns true for this key, if the device supports the barcode generation feature.
    http://tizen.org/feature/vision.face_recognitionboolbool The platform returns true for this key, if the device supports face recognition.
    http://tizen.org/feature/vision.image_recognitionboolbool The platform returns true for this key, if the device supports image recognition.
    http://tizen.org/feature/vision.qrcode_generationboolbool The platform returns true for this key, if the device supports QR code generation.
    http://tizen.org/feature/vision.qrcode_recognitionboolbool The platform returns true for this key, if the device supports QR code recognition.

    The following table lists the Web feature keys.

    -

    Table: Web feature keys

    - - - +

    Table: Web feature keys

    +
    + + - - + + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/feature/web.imeboolbool The platform returns true for this key, if the device supports Web IME.
    http://tizen.org/feature/web.serviceboolbool The platform returns true for this key, if the device supports the Web service model.

    System Keys

    The following table lists the build system keys.

    -

    Table: Build system keys

    +

    Table: Build system keys

    @@ -1595,7 +1595,7 @@ the Tizen reference implementation. - + @@ -1640,83 +1640,83 @@ the Tizen reference implementation. -
    http://tizen.org/system/build.type StringThe platform returns the build type, such as "user" or "eng". The build type is made when the platform image is created. The platform returns the build type, such as "user" or "eng". The build type is made when the platform image is created.
    http://tizen.org/system/build.variant The platform returns the manufacturer name.
    +

    The following table lists the model name system keys.

    -

    Table: Model name system keys

    +

    Table: Model name system keys

    - - + + - - + + - + - +
    Key TypeDescription
    Description
    http://tizen.org/system/model_nameStringString The platform returns the device model name.

    The following table lists the platform system keys.

    -

    Table: Platform system keys

    - - - +

    Table: Platform system keys

    +
    + + - - + + - + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/system/platform.communication_processorStringString The platform returns the device communication processor name.
    http://tizen.org/system/platform.nameStringString The platform returns the platform name.
    http://tizen.org/system/platform.processorStringString The platform returns the device processor name.
    - +

    The following table lists the sound system keys.

    -

    Table: Sound system keys

    +

    Table: Sound system keys

    - - + + - - + + - + - + - + - + - +
    Key TypeDescription
    Description
    http://tizen.org/system/sound.media.volume.resolution.maxintint The platform returns the maximum sound volume level of the media category.
    http://tizen.org/system/sound.notification.volume.resolution.maxintint The platform returns the maximum sound volume level of the notification category.
    http://tizen.org/system/sound.ringtone.volume.resolution.maxintint The platform returns the maximum sound volume level of the ringtone category.
    http://tizen.org/system/sound.system.volume.resolution.maxintint The platform returns the maximum sound volume level of the system category.
    - +

    The following table lists the TizenID system keys.

    Table: TizenID system keys

    diff --git a/org.tizen.guides/html/native/error/error_cover_n.htm b/org.tizen.guides/html/native/error/error_cover_n.htm index ce53534..6ac00eb 100644 --- a/org.tizen.guides/html/native/error/error_cover_n.htm +++ b/org.tizen.guides/html/native/error/error_cover_n.htm @@ -5,13 +5,13 @@ - + - Error Handling + Error Handling @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • - +

    Error Handling

    @@ -45,7 +45,7 @@

    You can collect log messages with the dlog logging service. You can define the message details, and ensure that the service sends the messages to a log device, from where you can access them to ease troubleshooting.

    - +
    diff --git a/org.tizen.guides/html/native/error/error_handling_n.htm b/org.tizen.guides/html/native/error/error_handling_n.htm index 01df9e1..09fde58 100644 --- a/org.tizen.guides/html/native/error/error_handling_n.htm +++ b/org.tizen.guides/html/native/error/error_handling_n.htm @@ -5,21 +5,21 @@ - + - Error Handling - - + Error Handling + +

    Mobile native Wearable native

    - +

    Dependencies

      @@ -27,10 +27,10 @@
    • Tizen 2.3.1 and Higher for Wearable
    -
    +
    - +

    Error Handling

    How to query error codes for a certain API function is determined by how the function returns error codes. @@ -41,7 +41,7 @@ In this sense, there are 2 kinds of native APIs in Tizen:

    All API functions which return error codes have the following section in their description:

     Returns:
-    0 on success, otherwise a negative error value
+    0 on success, otherwise a negative error value

    To see all of the available error values, see the Return values section in each API function description.

    @@ -49,10 +49,10 @@ Returns: 
     Return values:
-    MESSAGES_ERROR_NONE /* Successful */
-    MESSAGES_ERROR_INVALID_PARAMETER /* Invalid parameter */
-    MESSAGES_ERROR_SERVER_NOT_READY /* Server is not ready */
-    MESSAGES_ERROR_COMMUNICATION_WITH_SERVER_FAILED /* Server communication failed */
+    MESSAGES_ERROR_NONE /* Successful */
+    MESSAGES_ERROR_INVALID_PARAMETER /* Invalid parameter */
+    MESSAGES_ERROR_SERVER_NOT_READY /* Server is not ready */
+    MESSAGES_ERROR_COMMUNICATION_WITH_SERVER_FAILED /* Server communication failed */
  • APIs returning values (indirectly returning error codes) @@ -81,15 +81,15 @@ location_manager_h location_handle; int result = location_manager_create(LOCATION_METHOD_GPS, location_handle); if (LOCATIONS_ERROR_NONE != result) { -    errMsg = get_error_message(result); -    dlog_print(DLOG_INFO, "MyTag", "%s", errMsg); + errMsg = get_error_message(result); + dlog_print(DLOG_INFO, "MyTag", "%s", errMsg); } -

    The get_error_message() function takes an error code as an input and returns its corresponding error messages, such as "Location service is not available".

    +

    The get_error_message() function takes an error code as an input and returns its corresponding error messages, such as "Location service is not available".

    • -

    Every error code in the Tizen native API is represented as an integer value.

    - +

    Every error code in the Tizen native API is represented as an integer value.

    + diff --git a/org.tizen.guides/html/native/error/system_logs_n.htm b/org.tizen.guides/html/native/error/system_logs_n.htm index 5d04ba3..7d4aea8 100644 --- a/org.tizen.guides/html/native/error/system_logs_n.htm +++ b/org.tizen.guides/html/native/error/system_logs_n.htm @@ -5,13 +5,13 @@ - + - System Logs + System Logs @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - +

    Dependencies

    Related Info

    -
    -
    +

    System Logs

    @@ -67,11 +67,11 @@

    Messages in the Log view

    - -

    The following figure illustrates the general architecture of the dlog logging service.

    + +

    The following figure illustrates the general architecture of the dlog logging service.

    Figure: Architecture

    -

    Architecture

    +

    Architecture

    Log Message Content

    @@ -82,30 +82,30 @@

    The priority level indicates the urgency of the log message.

    Table: Priority levels

    -
    - - - - - - - - - - - - - - - - - - - - - - -
    PriorityDescription
    DLOG_DEBUGDebugging message for an unexpected exception that needs to be checked
    DLOG_INFOInformation message describing normal operation
    DLOG_WARNWarning message, which means that an error is likely to occur if no action is taken
    DLOG_ERRORError message describing a problem
    + + + + + + + + + + + + + + + + + + + + + + + +
    PriorityDescription
    DLOG_DEBUGDebugging message for an unexpected exception that needs to be checked
    DLOG_INFOInformation message describing normal operation
    DLOG_WARNWarning message, which means that an error is likely to occur if no action is taken
    DLOG_ERRORError message describing a problem

  • The tag is a short name indicating the system component from which the message originates.

    There are no naming limitations, but do not forget that the tag is an identification of a module, and each tag must be unique.

    @@ -125,10 +125,10 @@ location_manager_h location_handle; int result = location_manager_create(LOCATION_METHOD_GPS, location_handle); /* Return value check */ if (result != LOCATIONS_ERROR_NONE) { -    /* If the function failed, provide information in a log message */ -    dlog_print(DLOG_INFO, "MyTag", "Creation of the location manager failed."); + /* If the function failed, provide information in a log message */ + dlog_print(DLOG_INFO, "MyTag", "Creation of the location manager failed."); -    return false; + return false; } @@ -140,12 +140,12 @@ if (result != LOCATIONS_ERROR_NONE) { int main(void) { -    int integer = 21; -    char string[] = "test dlog"; -    dlog_print(DLOG_INFO, "USR_TAG", "test dlog"); -    dlog_print(DLOG_INFO, "USR_TAG", "%s, %d", string, integer); + int integer = 21; + char string[] = "test dlog"; + dlog_print(DLOG_INFO, "USR_TAG", "test dlog"); + dlog_print(DLOG_INFO, "USR_TAG", "%s, %d", string, integer); -    return 0; + return 0; } /* dlog_vprint */ @@ -153,19 +153,19 @@ main(void) void my_debug_print(char *format, ...) { -    va_list ap; -    va_start(ap, format); -    dlog_vprint(DLOG_INFO, "USR_TAG", format, ap); -    va_end(ap); + va_list ap; + va_start(ap, format); + dlog_vprint(DLOG_INFO, "USR_TAG", format, ap); + va_end(ap); } int main(void) { -    my_debug_print("%s", "test dlog"); -    my_debug_print("%s, %d", "test dlog", 21); + my_debug_print("%s", "test dlog"); + my_debug_print("%s, %d", "test dlog", 21); -    return 0; + return 0; } @@ -175,24 +175,24 @@ main(void)
  • Information message with the DLOG_INFO priority and the MyTag tag: 
     /* Print the info message with the tag to the console */
-dlog_print(DLOG_INFO, "MyTag", "Initialization successful.");
+dlog_print(DLOG_INFO, "MyTag", "Initialization successful.");
  • Debug message with the DLOG_DEBUG priority and the MyTag tag: 
     /* Print the debug message with the tag to the console */
-dlog_print(DLOG_DEBUG, "MyTag", "string:","%s", "Test");
+dlog_print(DLOG_DEBUG, "MyTag", "string:","%s", "Test");
  • Error message with the DLOG_ERROR priority and the MyTag tag: 
     if (something_wrong) {
-    /* Print the error message with the tag to the console */
-    dlog_print(DLOG_ERROR, "MyTag", "An unexpected error occurred");
+    /* Print the error message with the tag to the console */
+    dlog_print(DLOG_ERROR, "MyTag", "An unexpected error occurred");
 }
  • Warning message with the DLOG_WARN priority and the MyTag tag: 
     /* Print the warning message with the tag to the console */
-dlog_print(DLOG_WARN, "MyTag", "warning!");
+dlog_print(DLOG_WARN, "MyTag", "warning!");
    • @@ -208,61 +208,61 @@ dlogutil <option> <filter-spec>

    The following table lists the available options for the dlogutil command.

    Table: Command options

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - + + +
    OptionDescription
    -b <buffer>Alternates the log buffer. The main buffer is used by the default buffer.
    -cClears the entire log and exits.
    -dDumps the log and exits.
    -f <filename>Writes the log to <filename>. The default filename is stdout.
    -gPrints the size of the specified log buffer and exits.
    -n <count>Sets the maximum number of rotated logs to <count>. The default value is 4. Requires the -r option.
    -r <Kbytes>Rotates the log file every <Kbytes> of output. The default value is 16. Requires the -f option.
    -sSets the default filter spec to silent.
    -v <format>Sets the output format for log messages. +
    OptionDescription
    -b <buffer>Alternates the log buffer. The main buffer is used by the default buffer.
    -cClears the entire log and exits.
    -dDumps the log and exits.
    -f <filename>Writes the log to <filename>. The default filename is stdout.
    -gPrints the size of the specified log buffer and exits.
    -n <count>Sets the maximum number of rotated logs to <count>. The default value is 4. Requires the -r option.
    -r <Kbytes>Rotates the log file every <Kbytes> of output. The default value is 16. Requires the -f option.
    -sSets the default filter spec to silent.
    -v <format>Sets the output format for log messages.

    The log messages contain a number of metadata fields in addition to tag and priority. This option modifies the output format for messages so that they display a specific metadata field. The supported output formats are:

    • brief (default): Displays the priority/tag and PID of the originating process.
      • -
    • process: Displays the PID only.
      • +
    • process: Displays the PID only.
    • tag: Displays the priority/tag only.
      • -
    • thread: Displays the process:thread and priority/tag only.
      • -
    • raw: Displays the raw log message, with no other metadata fields.
      • -
    • time: Displays the date, invocation time, priority/tag, and PID of the originating process.
      • +
    • thread: Displays the process:thread and priority/tag only.
      • +
    • raw: Displays the raw log message, with no other metadata fields.
      • +
    • time: Displays the date, invocation time, priority/tag, and PID of the originating process.
    • long: Displays all metadata fields and separates messages with blank lines.
      • -
    - +

    For example, to print out all log messages using a format that only includes the message PID:

     # dlogutil -v <process>
@@ -298,7 +298,7 @@ dlogutil <option> <filter-spec>
 
    1. To use the functions and data types of the dlog API (in mobile and wearable applications), include the <dlog.h> header file in your application:
      
 
       #include <dlog.h>
-
      2. 		
+
  • Make sure you have the necessary tools:
    • dlog library: libdlog.so @@ -313,21 +313,21 @@ dlogutil <option> <filter-spec>

      To send a log message with the MY_APP tag with various priorities, use the dlog_print() function:

      -#define TAG "MY_APP"
+#define TAG "MY_APP"
 
 int
 main(void)
 {
-    int integer = 21;
-    char string[] = "test dlog";
+    int integer = 21;
+    char string[] = "test dlog";
 
-    dlog_print(DLOG_DEBUG, TAG, "debug message");
-    dlog_print(DLOG_INFO, TAG, "info message");
-    dlog_print(DLOG_WARN, TAG, "warning message");
-    dlog_print(DLOG_ERROR, TAG, "error message");
-    dlog_print(DLOG_INFO, TAG, "%s, %d", string, integer);
+    dlog_print(DLOG_DEBUG, TAG, "debug message");
+    dlog_print(DLOG_INFO, TAG, "info message");
+    dlog_print(DLOG_WARN, TAG, "warning message");
+    dlog_print(DLOG_ERROR, TAG, "error message");
+    dlog_print(DLOG_INFO, TAG, "%s, %d", string, integer);
 
-    return 0;
+    return 0;
 }
      @@ -367,7 +367,7 @@ arc = 2, optind = 1, Kb 0, rotate 4 --------- beginning of /dev/log_system --------- beginning of /dev/log_main E/MY_APP (11097): error message -sh-3.2# dlogutil -v time MY_APP +sh-3.2# dlogutil -v time MY_APP arc = 4, optind = 3, Kb 0, rotate 4 --------- beginning of /dev/log_system --------- beginning of /dev/log_main @@ -422,7 +422,7 @@ W/MY_APP (11097): warning message E/MY_APP (11097): error message I/MY_APP (11097): test dlog, 21 - +
    • diff --git a/org.tizen.guides/html/native/graphics/adv_performance_n.htm b/org.tizen.guides/html/native/graphics/adv_performance_n.htm index 59e93e8..3a685e3 100644 --- a/org.tizen.guides/html/native/graphics/adv_performance_n.htm +++ b/org.tizen.guides/html/native/graphics/adv_performance_n.htm @@ -31,7 +31,7 @@

    Advanced Performance

    - +

    The following general principles can help you to resolve performance problems on Tizen devices. (Some principles are valid for general embedded systems.)

    The first 2 principles are very basic, but still quite important, since the CPU-GPU bandwidth and memory capacity of embedded systems are limited in general.

    @@ -43,14 +43,14 @@
  • You are not required to clear every buffer, or to clear them at the same time. Instead, you can obtain the best performance by calling the glClear() function once per frame with all the buffers to be simultaneously cleared.
  • Do not create and destroy the graphic resources (such as textures and FBO) per frame. You can create and store them in the app_data structure in the init_glview() callback and reuse them later.
  • Try to avoid using the if statement in the shader code. Since the vertex and fragment shaders are executed in parallel (in batches) on most GPU architectures, if-then-else statement can block some other batches to determine which one can be run next. It means that parallel processing cannot be fully implemented.
    • -
  • Try to avoid writing a heavy fragment shader. If the same data apply to all fragments, do not compute the data in the fragment shader but compute them at the CPU side and provide them as uniforms. On the other hand, whenever the data can be computed at the vertex shader, use it.
    • +
  • Try to avoid writing a heavy fragment shader. If the same data apply to all fragments, do not compute the data in the fragment shader but compute them at the CPU side and provide them as uniforms. On the other hand, whenever the data can be computed at the vertex shader, use it.
  • In general, the glReadPixels() function is quite slow, because it reinforces CPU-GPU synchronization, drastically decreasing the overall performance. In most cases, it is possible to obtain the desired result with the framebuffer object (FBO), avoiding the use of glReadPixels(). With FBO, you can access the pixels of the framebuffer (the output of GPU processing) through a texture object (render-to-texture). Since it uses texture data from a GPU stage to another GPU stage, CPU does not have to be synchronized. If the application must use the glReadPixels()function, use another thread to avoid blocking the main thread.
  • With FBO, various effects can be made. Consider an application requiring a number of rendering chains for making a complex effect: A framebuffer is mapped to a texture, the texture is used to render another framebuffer, the framebuffer is mapped to another texture, and so on. This enables you to create a very complex scene, but unfortunately the rendering chain cannot be parallelized. Make the rendering chains as small as possible.
    • -
  • According to the application life-cycle, the application gets the app_pause() callback when the application runs at the background. Then, you must stop calling drawcalls during the pause state. +
  • According to the application life-cycle, the application gets the app_pause() callback when the application runs at the background. Then, you must stop calling drawcalls during the pause state.

    As presented in Interactive UI, the application can control the rendering loop by using an animator internally and then stop the animator in the app_pause() callback.

    • - + diff --git a/org.tizen.guides/html/native/graphics/adv_rendering_n.htm b/org.tizen.guides/html/native/graphics/adv_rendering_n.htm index 198e82c..7d5a645 100644 --- a/org.tizen.guides/html/native/graphics/adv_rendering_n.htm +++ b/org.tizen.guides/html/native/graphics/adv_rendering_n.htm @@ -46,40 +46,40 @@

    In order to increase reusability, this section presents a simple OpenGL ES (GL)-based renderer and a sample view architecture based on the renderer. Its class diagram is shown in the following figure. SampleLauncher creates a sample view instance, such as TexturingView. Each sample view inherits from the SampleView class, which creates the GLView and BasicRenderer instances.

    -

    Figure: Class diagram for sample views and renderer

    -

    Class diagram for sample views and renderer

    +

    Figure: Class diagram for sample views and renderer

    +

    Class diagram for sample views and renderer

    The callback functions for GLView are registered as presented in Creating OpenGL ES Applications. At the initialization stage, the sample view uses the FileLoader class to read the resource files, such as shaders, 3D objects, and texture images, from the Tizen application resource file path. These data are passed to BasicRenderer. At the initialization stage when the init_glview() callback is invoked, BasicRenderer uses the shader code and BasicShader to create, compile, and link the program object.

    -

    In addition to BasicShader, BasicRenderer uses, for example, BasicCamera, vertex array, and texture object ID, for rendering a scene. When rendering is requested by the sample view, BasicRenderer initializes color and depth buffers through the glClear() function, and then computes many data needed for rendering, such as world, view, and projection matrices. These are transferred to BasicShader, which invokes the glUniformXXX() function to pass them to the current program object. Finally, the glDrawElements() function is invoked.

    +

    In addition to BasicShader, BasicRenderer uses, for example, BasicCamera, vertex array, and texture object ID, for rendering a scene. When rendering is requested by the sample view, BasicRenderer initializes color and depth buffers through the glClear() function, and then computes many data needed for rendering, such as world, view, and projection matrices. These are transferred to BasicShader, which invokes the glUniformXXX() function to pass them to the current program object. Finally, the glDrawElements() function is invoked.

    For handling texture images, the sample uses the TexData class. The sample application creates a TexData instance and passes it to FileLoader together with the file name of the texture image. Then, FileLoader stores the decoded pixel data into the TexData instance. When the TexData instance is given to BasicRender, GL functions, such as glGenTexture() and glTexImage2D(), are invoked. After the texture object is created and sampler uniforms, such as sampler2D and samplerCube, are passed to the fragment shader, texturing can be done.

    For convenience, use the OpenGL mathematics library, GLM. GLM is a header only C++ mathematics library for graphics software based on the OpenGL shading language (GLSL) specification. GLM provides classes and functions designed and implemented with the same naming conventions and functionalities as in GLSL.

    Framebuffer Object and Render-to-texture

    -

    In Tizen, the drawing surface is created by GLView. To render a scene, GL receives this surface, which is called 'on-screen buffer'. For simple applications, the on-screen-buffer alone is sufficient. However, if the application needs to render to a texture, for example, an 'off-screen-buffer' is helpful as it can be used as a texture. In GL, the Framebuffer Object (FBO) can be an 'off-screen-buffer' and also supports 'render to texture.'

    +

    In Tizen, the drawing surface is created by GLView. To render a scene, GL receives this surface, which is called 'on-screen buffer'. For simple applications, the on-screen-buffer alone is sufficient. However, if the application needs to render to a texture, for example, an 'off-screen-buffer' is helpful as it can be used as a texture. In GL, the Framebuffer Object (FBO) can be an 'off-screen-buffer' and also supports 'render to texture.'

    GL provides functions to generate, bind, and configure an FBO. As shown in the following figure, the FBO consists of color, depth, and stencil attachments. It can be used as a texture by binding a texture object to its color or depth attachment point. On the other hand, GL supports a renderbuffer object, which is a 2D image buffer and can be bound to color, depth or stencil attachment point. FBO is useful for environment mapping, shadow mapping, post-processing and effects, including, for example, motion blur.

    -

    Figure: Framebuffer, renderbuffer, and texture objects

    -

    Framebuffer, renderbuffer, and texture objects

    +

    Figure: Framebuffer, renderbuffer, and texture objects

    +

    Framebuffer, renderbuffer, and texture objects

    -

    FBO is defined as follows:

    +

    FBO is defined as follows:

      -
    1. A texture or renderbuffer object is generated using the glGenTextures() or glGenRenderbuffers() function.
      2. -
    2. Binding is made using the glBindTexture() or glBindRenderbuffer() function before being attached to the FBO.
      3. -
    3. The glTexParameteri() or glRenderbufferStorage() function is called to specify the properties of the object.
      4. +
    4. A texture or renderbuffer object is generated using the glGenTextures() or glGenRenderbuffers() function.
      5. +
    5. Binding is made using the glBindTexture() or glBindRenderbuffer() function before being attached to the FBO.
      6. +
    6. The glTexParameteri() or glRenderbufferStorage() function is called to specify the properties of the object.
    7. The glFramebufferRenderbuffer() or glFramebufferTexture2D() function is invoked to attach the object to the FBO.
    -

    The following code creates an FBO as an 'off-screen-buffer' that enables render-to-texture:

    +

    The following code creates an FBO as an 'off-screen-buffer' that enables render-to-texture:

     /*
    This function shows how to create new framebuffer object
-   with texture color buffer and depth render buffer 
-   To render a texture, bind framebuffer to 'newFbo' using
+   with texture color buffer and depth render buffer
+   To render a texture, bind framebuffer to 'newFbo' using
    glBindeFramebuffer() and make a drawcall. Then, just
-   use 'colorTex' as a general texture
+   use 'colorTex' as a general texture
    This function does not make a stencil buffer
    To use stencil buffer for off-screen-buffer, make another
    renderbuffer object and attach to framebuffer using
@@ -88,49 +88,49 @@
 void
 createFbo()
 {
-    GLuint colorTex, depthRbo, newFbo;
-
-    /* Size of texture and renderbuffer object */
-    /* 
-       Check whether GL_MAX_RENDERBUFFER_SIZE >= width and height
-       using glGetIntegerv(GL_MAX_RENDERBUFFER_SIZE, &maxSize)
-    */
-    GLint  texWidth = 256, texHeight = 256;
-
-    /* Generate texture object */
-    glGenTextures(1, &colorTex);
-    glBindTexture(GL_TEXTURE_2D, colorTex);
-    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA,
-                 texWidth, texHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, NULL);
-
-    /* Set texture wrapping and filtering mode */
-    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
-    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
-    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
-    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
-
-    /* Generate renderbuffer object */
-    glGenRenderbuffers(1, &depthRbo);
-    glBindRenderbuffer(GL_RENDERBUFFER, depthRbo);
-    glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT16,
-                          texWidth, texWidth); /* 16-bit depthbuffer */
-
-    /*
-       Generate framebuffer object and bind texture and
-       renderbuffer object to attachment points
-    */
-    glGenFramebuffers(1, &newFbo);
-    glBindFramebuffer(GL_FRAMEBUFFER, newFbo);
-    glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0,
-                           GL_TEXTURE_2D, colorTex, 0);
-    glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT,
-                              GL_RENDERBUFFER, depthRbo);
-
-    /* Check for framebuffer complete */
-    if (glCheckFramebufferStatus(GL_FRAMEBUFFER) != GL_FRAMEBUFFER_COMPLETE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "FrameBufferObject is not complete!\n");
-
-    glBindFramebuffer(GL_FRAMEBUFFER, 0);
+    GLuint colorTex, depthRbo, newFbo;
+
+    /* Size of texture and renderbuffer object */
+    /*
+       Check whether GL_MAX_RENDERBUFFER_SIZE >= width and height
+       using glGetIntegerv(GL_MAX_RENDERBUFFER_SIZE, &maxSize)
+    */
+    GLint  texWidth = 256, texHeight = 256;
+
+    /* Generate texture object */
+    glGenTextures(1, &colorTex);
+    glBindTexture(GL_TEXTURE_2D, colorTex);
+    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA,
+                 texWidth, texHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, NULL);
+
+    /* Set texture wrapping and filtering mode */
+    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
+    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
+    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
+    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
+
+    /* Generate renderbuffer object */
+    glGenRenderbuffers(1, &depthRbo);
+    glBindRenderbuffer(GL_RENDERBUFFER, depthRbo);
+    glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT16,
+                          texWidth, texWidth); /* 16-bit depthbuffer */
+
+    /*
+       Generate framebuffer object and bind texture and
+       renderbuffer object to attachment points
+    */
+    glGenFramebuffers(1, &newFbo);
+    glBindFramebuffer(GL_FRAMEBUFFER, newFbo);
+    glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0,
+                           GL_TEXTURE_2D, colorTex, 0);
+    glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT,
+                              GL_RENDERBUFFER, depthRbo);
+
+    /* Check for framebuffer complete */
+    if (glCheckFramebufferStatus(GL_FRAMEBUFFER) != GL_FRAMEBUFFER_COMPLETE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "FrameBufferObject is not complete!\n");
+
+    glBindFramebuffer(GL_FRAMEBUFFER, 0);
 }
    @@ -138,59 +138,59 @@ createFbo()

    Environment mapping is a technique to simulate a shiny object reflecting its surrounding environment, as shown in the following figure. Among several implementations of environment mapping, the most popular is cube mapping. It uses a cube map composed of 6 square image textures. The images are textured to the surface of the shiny object.

    -

    Figure: Cube mapping example

    -

    Cube mapping example

    +

    Figure: Cube mapping example

    +

    Cube mapping example

    A cube map is created by positioning a camera at the center of the object and rendering along each positive/negative principal axis directions using a 90-degree field of view. The following figure shows how a cube map texture is composed. For a static environment, this is made at the preprocessing stage.

    -

    Figure: Composition of the cubemap texture

    -

    Composition of the cubemap texture

    +

    Figure: Composition of the cubemap texture

    +

    Composition of the cubemap texture

    -

    The Texturing topic presents how to create texture objects using GL APIs. For using a cube map texture, provide GL_TEXTURE_CUBE_MAP instead of GL_TEXTURE_2D for the glGenTexture() and glBindTexture() functions.

    +

    The Texturing topic presents how to create texture objects using GL APIs. For using a cube map texture, provide GL_TEXTURE_CUBE_MAP instead of GL_TEXTURE_2D for the glGenTexture() and glBindTexture() functions.

    The following code creates a cube map texture for environment mapping:

     void
 ImlRenderer::CreateCubeTex(const TexData *cubeTex, GLuint &target)
 {
-    glPixelStorei(GL_UNPACK_ALIGNMENT, 1);
-    checkGlError("glPixelStorei");
-    glGenTextures(1, &target);
-    checkGlError("glGenTextures");
+    glPixelStorei(GL_UNPACK_ALIGNMENT, 1);
+    checkGlError("glPixelStorei");
+    glGenTextures(1, &target);
+    checkGlError("glGenTextures");
 
-    glBindTexture(GL_TEXTURE_CUBE_MAP, target);
-    checkGlError("glBindTexture");
+    glBindTexture(GL_TEXTURE_CUBE_MAP, target);
+    checkGlError("glBindTexture");
 
-    for (int i = 0; i < 6; ++i)
-        TexBuffer((GLenum)GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, cubeTex[i]);
+    for (int i = 0; i < 6; ++i)
+        TexBuffer((GLenum)GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, cubeTex[i]);
 
-    glGenerateMipmap(GL_TEXTURE_CUBE_MAP);
-    checkGlError("glGenerateMipmap");
+    glGenerateMipmap(GL_TEXTURE_CUBE_MAP);
+    checkGlError("glGenerateMipmap");
 
-    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER,
-                    GL_LINEAR_MIPMAP_LINEAR);
-    checkGlError("glTexParameteri");
-    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
-    checkGlError("glTexParameteri");
+    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER,
+                    GL_LINEAR_MIPMAP_LINEAR);
+    checkGlError("glTexParameteri");
+    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
+    checkGlError("glTexParameteri");
 
-    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_S, GL_REPEAT);
-    checkGlError("glTexParameteri");
-    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_T, GL_REPEAT);
-    checkGlError("glTexParameteri");
+    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_S, GL_REPEAT);
+    checkGlError("glTexParameteri");
+    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_T, GL_REPEAT);
+    checkGlError("glTexParameteri");
 
-    glBindTexture(GL_TEXTURE_CUBE_MAP, 0);
+    glBindTexture(GL_TEXTURE_CUBE_MAP, 0);
 }
 
 void
 ImlRenderer::TexBuffer(GLenum type, const TexData& newTex)
 {
-    LOGI("ImlRenderer::TexBuffer");
+    LOGI("ImlRenderer::TexBuffer");
 
-    glTexImage2D(type, 0, newTex.format, newTex.width, newTex.height, 0,
-                 (GLenum)newTex.format, GL_UNSIGNED_BYTE, (void*)newTex.pixels);
+    glTexImage2D(type, 0, newTex.format, newTex.width, newTex.height, 0,
+                 (GLenum)newTex.format, GL_UNSIGNED_BYTE, (void*)newTex.pixels);
 
-    checkGlError("glTexImage2D");
+    checkGlError("glTexImage2D");
 }

    In the above code, see GL_TEXTURE_CUBE_MAP_POSITIVE_X, a parameter of the TexBuffer() function. It represents which side of the environment is contained in the cube map texture.

    @@ -207,33 +207,33 @@ varying vec2 v_texCoord; void main() { -    vec3 nor = normalize(v_normal); -    vec3 ray = normalize(eyePos); + vec3 nor = normalize(v_normal); + vec3 ray = normalize(eyePos); -    vec3 reflec = 2.0 * nor * dot(nor, ray) - ray; -    vec4 envColor = textureCube(s_texCube, reflec); + vec3 reflec = 2.0 * nor * dot(nor, ray) - ray; + vec4 envColor = textureCube(s_texCube, reflec); -    gl_FragColor = envColor; + gl_FragColor = envColor; }

    Normal Mapping with Multi-texturing

    -

    A normal map is a 2D texture that stores a normal vector at each texel. The red channel represents the x component, the green channel the y component, and the blue channel the z component. This triple is scaled and biased in the shader to map to a normal, each component of which is in [-1, 1].

    -

    The normals of a normal map are defined in the tangent spaces of the object surface. In a tangent space, the Z axis corresponds to the surface normal. The left side of the following figure shows 2 tangent spaces, one defined for a surface point p and the other for another point q. Observe that the tangent spaces vary across the object surface. Assuming that a tangent space is defined for a surface point to be normal-mapped, the normal fetched from the normal map is taken as being defined in the tangent space of the point. In this respect, it is named the tangent-space normal. The tangent-space normals perturb the surface normal.

    +

    A normal map is a 2D texture that stores a normal vector at each texel. The red channel represents the x component, the green channel the y component, and the blue channel the z component. This triple is scaled and biased in the shader to map to a normal, each component of which is in [-1, 1].

    +

    The normals of a normal map are defined in the tangent spaces of the object surface. In a tangent space, the Z axis corresponds to the surface normal. The left side of the following figure shows 2 tangent spaces, one defined for a surface point p and the other for another point q. Observe that the tangent spaces vary across the object surface. Assuming that a tangent space is defined for a surface point to be normal-mapped, the normal fetched from the normal map is taken as being defined in the tangent space of the point. In this respect, it is named the tangent-space normal. The tangent-space normals perturb the surface normal.

    -

    Figure: Tangent spaces

    -

    Tangent spaces Tangent spaces

    +

    Figure: Tangent spaces

    +

    Tangent spaces Tangent spaces

    -

    The surface normal of a polygon mesh is computed per vertex at the modeling stage. It is the vertex normal. The tangent space is constructed per vertex so that its Z axis corresponds to the vertex normal, as shown in the right side of the above figure.

    -

    3 orthonormal vectors define the tangent space:

    +

    The surface normal of a polygon mesh is computed per vertex at the modeling stage. It is the vertex normal. The tangent space is constructed per vertex so that its Z axis corresponds to the vertex normal, as shown in the right side of the above figure.

    +

    3 orthonormal vectors define the tangent space:

    • Vertex normal denoted by N
    • Vector denoted by T (for tangent)
    • Vector denoted by B (for binormal)
    -

    Tangent vectors (T) are computed in BasicRenderer. Then, N and T are passed to the vertex shader, where B is computed by taking the cross product of N and T and then a rotation matrix is constructed from the TBN vectors. This basis-change matrix converts the world space light vector into the tangent space, so that lighting is computed at the tangent space by the fragment shader.

    +

    Tangent vectors (T) are computed in BasicRenderer. Then, N and T are passed to the vertex shader, where B is computed by taking the cross product of N and T and then a rotation matrix is constructed from the TBN vectors. This basis-change matrix converts the world space light vector into the tangent space, so that lighting is computed at the tangent space by the fragment shader.

    The following vertex shader presents how to construct the basis-change matrix from the TBN vectors:

    @@ -256,19 +256,19 @@ varying vec3 v_viewTS;
 void
 main()
 {
-    vec4 world_pos = worldMat * vec4(position, 1.0);
-    gl_Position = projMat * viewMat * world_pos;
-    v_texCoord = texCoord;
-
-    vec3 nor = mat3(worldMat) * normal;
-    vec3 tan = mat3(worldMat) * normalize(tangent);
-    vec3 bin = cross(nor, tan);
-    mat3 worldToTangentSpace = mat3(tan.x, bin.x, nor.x,
-                                    tan.y, bin.y, nor.y,
-                                    tan.z, bin.z, nor.z);
-
-    v_lightDirTS = worldToTangentSpace * (lightPos - world_pos.xyz);
-    v_viewTS = worldToTangentSpace * (eyePos - world_pos.xyz);
+    vec4 world_pos = worldMat * vec4(position, 1.0);
+    gl_Position = projMat * viewMat * world_pos;
+    v_texCoord = texCoord;
+
+    vec3 nor = mat3(worldMat) * normal;
+    vec3 tan = mat3(worldMat) * normalize(tangent);
+    vec3 bin = cross(nor, tan);
+    mat3 worldToTangentSpace = mat3(tan.x, bin.x, nor.x,
+                                    tan.y, bin.y, nor.y,
+                                    tan.z, bin.z, nor.z);
+
+    v_lightDirTS = worldToTangentSpace * (lightPos - world_pos.xyz);
+    v_viewTS = worldToTangentSpace * (eyePos - world_pos.xyz);
 }
    @@ -289,14 +289,14 @@ vec3 phongLightFragNormal(vec3 Md, vec3 normal); void main() { -    vec3 md = texture2D(s_tex0, v_texCoord).xyz; -    vec3 tanNor = normalize(texture2D(s_texNor, v_texCoord).xyz * 2.0 - vec3(1.0)); -    gl_FragColor = vec4(phongLightFragNormal(md, tanNor), 1.0); + vec3 md = texture2D(s_tex0, v_texCoord).xyz; + vec3 tanNor = normalize(texture2D(s_texNor, v_texCoord).xyz * 2.0 - vec3(1.0)); + gl_FragColor = vec4(phongLightFragNormal(md, tanNor), 1.0); } -

    Figure: Normal mapping example

    -

    Normal mapping example

    +

    Figure: Normal mapping example

    +

    Normal mapping example

    diff --git a/org.tizen.guides/html/native/graphics/assembly_n.htm b/org.tizen.guides/html/native/graphics/assembly_n.htm index fd451d7..fad31b7 100644 --- a/org.tizen.guides/html/native/graphics/assembly_n.htm +++ b/org.tizen.guides/html/native/graphics/assembly_n.htm @@ -36,7 +36,7 @@
    -

    Primitive Assembly and Rasterization

    +

    Primitive Assembly and Rasterization

    The vertex shader passes the clip-space vertices to the next stage named primitive assembly and rasterization. The goal of the primitive assembly is to combine the clip-space vertices into a sequence of primitives. The primitives are classified into points, lines, and triangles. Then, various operations are performed on each primitive. The operations include back-face culling, viewport transform, and scan conversion. The last operation, scan conversion, is a key in real-time graphics and is often called rasterization. The stage for primitive assembly and rasterization is hardwired, but to control the behaviors, it is necessary to understand how its substages work.

    @@ -87,7 +87,7 @@

    Figure: Interpolated normals

    Interpolated normals

    - +
    diff --git a/org.tizen.guides/html/native/graphics/cairo_n.htm b/org.tizen.guides/html/native/graphics/cairo_n.htm index b0a67bc..fa43c89 100644 --- a/org.tizen.guides/html/native/graphics/cairo_n.htm +++ b/org.tizen.guides/html/native/graphics/cairo_n.htm @@ -107,7 +107,7 @@

    Creating a Cairo Image Surface in the Evas GL Backend

    -

    To develop an application with Elementary, you create a window by using the elementary utility function, elm_win_util_standard_add(). And, in order to make the GL application use the GPU, you must call the elm_config_accel_preference_set() function before creating the window. You also place an Evas_Object image into your application's main window. For more information about creating and placing an Evas_Object image, see Manipulating Graphical Objects.

    +

    To develop an application with Elementary, you create a window by using the elementary utility function, elm_win_util_standard_add(). And, in order to make the GL application use the GPU, you must call the elm_config_accel_preference_set() function before creating the window. You also place an Evas_Object image into your application's main window. For more information about creating and placing an Evas_Object image, see Manipulating Graphical Objects.

    In the Cairo Image backend, you can create a new Cairo image surface by using the cairo_image_surface_create() or cairo_image_surface_create_for_data() function. The former function requires only the pixel format and dimensions to be specified, while the latter function requires additional data, such as a pointer to an image buffer (supplied by the application) in which to write the content. In order to display a result of Cairo rendering, you must also link an Evas image object to the created Cairo image surface. For this purpose, use the evas_object_image_data_set() function.

    @@ -119,9 +119,9 @@

    Call the cairo_image_surface_get_data() function before calling the evas_object_image_data_set() function. The cairo_image_surface_get_data() function returns a pointer to the raw image data of the created image surface. This pointer is used for the raw data to be linked with an Evas image object in the evas_object_image_data_set() function.

    -elm_config_accel_preference_set("opengl");
-Evas_Object *win = elm_win_util_standard_add("Cairo Image Backend guide",
-                                             " Cairo Image Backend guide");
+elm_config_accel_preference_set("opengl");
+Evas_Object *win = elm_win_util_standard_add("Cairo Image Backend guide",
+                                             " Cairo Image Backend guide");
 Evas_Object *img = evas_object_image_filled_add(evas_object_evas_get(win));
 evas_object_geometry_get(win, NULL, NULL, &WIDTH, &HEIGHT);
 
@@ -133,7 +133,7 @@ evas_object_image_alpha_set(img, 0);
 evas_object_show(img);
 
 cairo_surface_t *cairo_surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32,
-                                                            WIDTH, HEIGHT);
+                                                            WIDTH, HEIGHT);
 cairo_t *cairo = cairo_create(cairo_surface);
 /* Cairo drawing */
 
@@ -153,8 +153,8 @@ evas_object_image_data_update_add(img, 0, 0, WIDTH, HEIGHT);
 
    To update a rectangular region on the screen, the evas_object_image_data_update_add() function can be used. For more information about the image object functions of Evas, see Image Objects.
    
  
 
    -Evas_Object *win = elm_win_util_standard_add("Cairo Image Backend guide",
-                                             " Cairo Image Backend guide");
+Evas_Object *win = elm_win_util_standard_add("Cairo Image Backend guide",
+                                             " Cairo Image Backend guide");
 Evas_Object *img = evas_object_image_filled_add(evas_object_evas_get(win));
 evas_object_geometry_get(win, NULL, NULL, &WIDTH, &HEIGHT);
 
@@ -168,8 +168,8 @@ evas_object_show(img);
 int row_stride = cairo_format_stride_for_width(CAIRO_FORMAT_ARGB32, WIDTH);
 unsigned char *imageData = (unsigned char *)evas_object_image_data_get(img, EINA_TRUE);
 cairo_surface_t *cairo_surface =
-    cairo_image_surface_create_for_data(imageData, CAIRO_FORMAT_ARGB32,
-                                        WIDTH, HEIGHT, row_stride);
+    cairo_image_surface_create_for_data(imageData, CAIRO_FORMAT_ARGB32,
+                                        WIDTH, HEIGHT, row_stride);
 cairo_t *cairo = cairo_create(cairo_surface);
 /* Cairo drawing */
 
@@ -198,8 +198,8 @@ evas_object_image_data_update_add(img, 0, 0, WIDTH, HEIGHT);
 
    Afterwards, the evas_gl_config, evas_gl_surface, and evas_gl_context instances are created in that order. For more information on using Evas GL, see Creating OpenGL ES Applications and the OpenGL ES guide.
    
  
 
    -Evas_Object *win = elm_win_util_standard_add("Cairo GL Backend guide",
-                                             " Cairo GL Backend guide");
+Evas_Object *win = elm_win_util_standard_add("Cairo GL Backend guide",
+                                             " Cairo GL Backend guide");
 Evas_Object *img = evas_object_image_filled_add(evas_object_evas_get(win));
 
 Evas_Native_Surface ns;
@@ -210,7 +210,7 @@ evas_gl_config->stencil_bits = EVAS_GL_STENCIL_BIT_8;
 evas_gl_config->multisample_bits = EVAS_GL_MULTISAMPLE_MED;
 
 Evas_GL_Surface *evas_gl_surface = evas_gl_surface_create(evas_gl, evas_gl_config,
-                                                          WIDTH, HEIGHT);
+                                                          WIDTH, HEIGHT);
 Evas_GL_Context *evas_gl_context = evas_gl_context_create(evas_gl, NULL);
 evas_gl_native_surface_get(evas_gl, evas_gl_surface, &ns);
 evas_object_image_native_surface_set(img, &ns);
@@ -238,15 +238,15 @@ evas_object_image_pixels_get_callback_set(img, cairo_drawing, 0);
 
 
 
    -setenv("CAIRO_GL_COMPOSITOR", "msaa", 1);
+setenv("CAIRO_GL_COMPOSITOR", "msaa", 1);
 cairo_device_t *cairo_device = cairo_evas_gl_device_create(evas_gl, evas_gl_context);
 cairo_boot_t thread_aware = 0;
 cairo_gl_device_set_thread_aware(cairo_device, thread_aware);
 cairo_surface_t *cairo_surface = cairo_gl_surface_create_for_evas_gl(cairo_device,
-                                                                     evas_gl_surface,
-                                                                     evas_gl_config,
-                                                                     WIDTH,
-                                                                     HEIGHT);
+                                                                     evas_gl_surface,
+                                                                     evas_gl_config,
+                                                                     WIDTH,
+                                                                     HEIGHT);
 cairo_t *cairo = cairo_create(cairo_surface);
 /* Cairo drawing */
 
    
@@ -275,22 +275,22 @@ cairo_surface_flush(cairo_surface);
 
     /* Create a surface for destination */
 cairo_surface_t *cairo_surface = cairo_gl_surface_create_for_evas_gl(cr, evas_gl_surface,
-                                                                     evas_gl_config,
-                                                                     WIDTH, HEIGHT);
+                                                                     evas_gl_config,
+                                                                     WIDTH, HEIGHT);
 
 Evas_GL_Config *evas_gl_config_source = evas_gl_config_new();
 evas_gl_config_source->color_format = EVAS_GL_RGBA_8888;
 evas_gl_config_source->stencil_bits = EVAS_GL_STENCIL_BIT_1;
 evas_gl_config_source->multisample_bits = EVAS_GL_MULTISAMPLE_LOW;
 evas_gl_surface_source = evas_gl_surface_create(evas_gl, evas_gl_config_source,
-                                                WIDTH, HEIGHT);
+                                                WIDTH, HEIGHT);
 
 /* Create a surface for source */
 cairo_surface_t *image_surface = cairo_image_surface_create_from_png(image);
 cairo_surface_t *gl_surface = cairo_gl_surface_create(cairo_device,
-                                                      CAIRO_CONTENT_COLOR_ALPHA,
-                                                      image_width,
-                                                      image_height);
+                                                      CAIRO_CONTENT_COLOR_ALPHA,
+                                                      image_width,
+                                                      image_height);
 cairo_t *cairo = cairo_create(gl_surface);
 cairo_set_source_surface(cairo, image_surface, 0, 0);
 cairo_paint(cairo);
@@ -302,7 +302,7 @@ cairo_pattern_create_for_surface(gl_surface);
 
    Cairo does not support a functionality for reading image files in JPEG or SPI format; only PNG is supported. With a PNG file, you can use the cairo_image_surface_create_from_png() function to make a new image surface from the image. However, handle this function with care, because it is experimental and only offers very simple functionality for reading PNG files.
    
  
 
    -cairo_surface_t *image = cairo_image_surface_create_from_png("test_image.png");
+cairo_surface_t *image = cairo_image_surface_create_from_png("test_image.png");
 cairo_set_source_surface(cairo, image, 0, 0);
 cairo_paint(cairo);
 cairo_surface_destroy(image);
@@ -317,13 +317,13 @@ cairo_surface_destroy(image);
 
 
     evas_object_geometry_get(win, NULL, NULL, &surface_w, &surface_h);
-Evas_Object *inline_buffr = elm_win_add(win, "Img Read", ELM_WIN_INLINED_IMAGE);
+Evas_Object *inline_buffr = elm_win_add(win, "Img Read", ELM_WIN_INLINED_IMAGE);
 evas_object_move(inline_buffr, 0, 0);
 evas_object_resize(inline_buffr, surface_w, surface_h);
 
 /* As a temporary buffer */
 Evas_Object *decoded_img = evas_object_image_add(evas_object_evas_get(inline_buffer));
-evas_object_image_file_set(decoded_img, "test_image.jpeg", NULL);
+evas_object_image_file_set(decoded_img, "test_image.jpeg", NULL);
 evas_object_image_size_get(decoded_img, &w, &h);
 evas_object_image_fill_set(decoded_img, 0, 0, w, h);
 evas_object_image_filled_set(decoded_img, EINA_TRUE);
@@ -335,8 +335,8 @@ evas_object_resize(decoded_img, w, h);
 
     src_buffer = (unsigned char *)evas_object_image_data_get(decoded_img, EINA_TRUE);
 cairo_surface_t *source =
-    cairo_image_surface_create_for_data(src_buffer, CAIRO_FORMAT_ARGB32, w, h,
-                                        evas_object_image_stride_get(decoded_img));
+    cairo_image_surface_create_for_data(src_buffer, CAIRO_FORMAT_ARGB32, w, h,
+                                        evas_object_image_stride_get(decoded_img));
 cairo_set_source_surface(cr, source, 0, 0);
 cairo_paint(cr);
 
@@ -365,7 +365,7 @@ cairo_surface_destroy(img);
 cairo_set_source_rgba(cairo, 1.0, 0.0, 0.0, 1.0);
 
    
 
-
  • Gradients describe a progression of colors by setting a start and stop reference location and a series of "stops" along the way. There are linear and radial gradients built from 2 points. Stops are added to the gradient with the cairo_add_color_stop_rgb() and cairo_add_color_stop_rgba() functions which take a color like the cairo_add_color_stop_rgb() or cairo_add_color_stop_rgba() function, as well as an offset to indicate where it lies between the reference locations.
    • 
+
  • Gradients describe a progression of colors by setting a start and stop reference location and a series of "stops" along the way. There are linear and radial gradients built from 2 points. Stops are added to the gradient with the cairo_add_color_stop_rgb() and cairo_add_color_stop_rgba() functions which take a color like the cairo_add_color_stop_rgb() or cairo_add_color_stop_rgba() function, as well as an offset to indicate where it lies between the reference locations.
    • 
 
  • Images include both surfaces loaded from the existing files with the cairo_image_surface_create_from_png() function and surfaces created from within Cairo as an earlier destination. For more information about these Cairo APIs, see the cairo_pattern_t in cairographics.org.
    • 
 
 
@@ -480,12 +480,12 @@ cairo_surface_destroy(surface);
 
    To paint with image files:
    
 
      
 
    1. Get the image resource.
-
      The following code snippet shows how to prepare image data for your application. To get an application's resource image data, use the app_get_resource_path() function. This gets a stored PNG image file path to use as a resource. For more information about the app_get_resource_path() function, see the App Common API (in mobile and wearable applications.
      
+
      The following code snippet shows how to prepare image data for your application. To get an application's resource image data, use the app_get_resource_path() function. This gets a stored PNG image file path to use as a resource. For more information about the app_get_resource_path() function, see the App Common API (in mobile and wearable applications.
      
 
       char image_filepath[256];
-char *source_filename = "image.png";
+char *source_filename = "image.png";
 char *resource_path = app_get_resource_path();
-snprintf(image_filepath, 256, "%s/%s", resource_path, source_filename);
+snprintf(image_filepath, 256, "%s/%s", resource_path, source_filename);
 free(resource_path);
 
      
 
      2. 
@@ -517,14 +517,14 @@ cairo_paint(cairo);
 
        
 
      1. Prepare a text to use as a resource:
 
        -const char *utf8 = "Hello, Tizen!";
+const char *utf8 = "Hello, Tizen!";
 
        
 
        2. 
 
      2. Set text configurations.
-
        In this example, create a font face implicitly using the cairo_select_font_face() function. The text is a kind of "mask" you are about to work with. To use a mask, you need a font type and font size. Set the font type as "Sans", and font size as 52.
        
+
        In this example, create a font face implicitly using the cairo_select_font_face() function. The text is a kind of "mask" you are about to work with. To use a mask, you need a font type and font size. Set the font type as "Sans", and font size as 52.
        
 
        -cairo_select_font_face(cairo, "Sans", CAIRO_FONT_SLANT_NORMAL,
-                       CAIRO_FONT_WEIGHT_NORMAL);
+cairo_select_font_face(cairo, "Sans", CAIRO_FONT_SLANT_NORMAL,
+                       CAIRO_FONT_WEIGHT_NORMAL);
 cairo_set_font_size(cairo, 52.0);
 
        
 
        3. 
diff --git a/org.tizen.guides/html/native/graphics/creating_opengles_n.htm b/org.tizen.guides/html/native/graphics/creating_opengles_n.htm
index e57c3c7..e33ce12 100644
--- a/org.tizen.guides/html/native/graphics/creating_opengles_n.htm
+++ b/org.tizen.guides/html/native/graphics/creating_opengles_n.htm
@@ -30,21 +30,21 @@
 
 
        
 
-
        Creating OpenGL ES Applications
          
+
        Creating OpenGL ES Applications
        
 
 
        The easiest way to use the OpenGL ES API in a Tizen application is to rely on the Elm_GLView component. The Elm_GLView component is one of the Elementary UI components, which creates an OpenGL ES (GL) target surface and a context. The Elm_GLView component can be embedded in any Tizen UI application. It is basically a wrapper of Evas_GL, the GL/EGL abstraction layer of EFL. By using the Elm_GLView component, you avoid having to consider how EGL environment is coupled with the native windowing systems. Some macros provided by EFL also allow you to use GL APIs directly. In addition, the UI framework can access the surface where the GPU outputs the rendering result and make the entire scene as a combination of 2D and 3D components in a single canvas.
        
 
 
        The following example shows the steps to create a GL application. From now on, the Elm_GLView component is shortened to GLView.
        
 
          
 
        1. Create a basic application as presented in the mobile and wearable Tizen first application example.
-
          The UI application's skeleton makes available the window object, which can contain the GLView component.
          2. 
+
          The UI application's skeleton makes available the window object, which can contain the GLView component.
          
 
        2. Enable hardware acceleration.
 
          To develop a GL application, call the elm_config_accel_preference_set() function  before creating the window. It makes an application use the GPU.
          
 
          For developing an application with Elementary, create a window with the elm_win_util_standard_add() Elementary utility function.
          
 
           Evas_Object *win;
-elm_config_accel_preference_set("opengl");
-win = elm_win_util_standard_add(name, "OpenGL example");
+elm_config_accel_preference_set("opengl");
+win = elm_win_util_standard_add(name, "OpenGL example");
 
          
 
          You must also set hardware acceleration in the manifest file. For more information, see Hardware Acceleration.
          3. 
 
        3. Initialize the GLView.
@@ -80,13 +80,13 @@ ELEMENTARY_GLVIEW_GLOBAL_DEFINE();
 static Evas_Object*
 add_glview(Evas_Object* parent, appdata_s *ad)
 {
-    Evas_Object* glview;
+    Evas_Object* glview;
 
-    /* Create and initialize GLView */
-    glview = elm_glview_add(parent);
+    /* Create and initialize GLView */
+    glview = elm_glview_add(parent);
 
-    /* Prepare to use OpenGL ES APIs directly */
-    ELEMENTARY_GLVIEW_GLOBAL_USE(glview);
+    /* Prepare to use OpenGL ES APIs directly */
+    ELEMENTARY_GLVIEW_GLOBAL_USE(glview);
 }
 
    
 
    The ELEMENTARY_GLVIEW_GLOBAL_DEFINE() and ELEMENTARY_GLVIEW_GLOBAL_USE() macros must be in the same source code. If you have a global header file in your application, the ELEMENTARY_GLVIEW_GLOBAL_DECLARE() macro can be in the header file. However, you must be very careful when using these macros. The recommended solution is to use the ELEMENTARY_GLVIEW_USE() macro in every client function. The following are some situations where you must not use the helper macros:
    
@@ -122,12 +122,12 @@ elm_glview_del_func_set(glview, del_glview);
 static void
 init_glview(Evas_Object *glview)
 {
-    /* Set GL state color to pink */
-    glClearColor(1.0, 0.2, 0.6, 1.0);
+    /* Set GL state color to pink */
+    glClearColor(1.0, 0.2, 0.6, 1.0);
 
-    /* Do any form of OpenGL ES initialization here */
-    /* init_shaders(); */
-    /* init_vertices(); */
+    /* Do any form of OpenGL ES initialization here */
+    /* init_shaders(); */
+    /* init_vertices(); */
 }
 
    
 
@@ -138,10 +138,10 @@ init_glview(Evas_Object *glview)
 static void
 resize_glview(Evas_Object *glview)
 {
-    int w;
-    int h;
-    elm_glview_size_get(glview, &w, &h);
-    glViewport(0, 0, w, h);
+    int w;
+    int h;
+    elm_glview_size_get(glview, &w, &h);
+    glViewport(0, 0, w, h);
 }
 
    
 
@@ -152,11 +152,11 @@ resize_glview(Evas_Object *glview)
 static void
 draw_glview(Evas_Object *glview)
 {
-    /* Paint it pink */
-    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
+    /* Paint it pink */
+    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
 
-    /* Usual OpenGL ES draw commands come here */
-    /* draw_scene(); */
+    /* Usual OpenGL ES draw commands come here */
+    /* draw_scene(); */
 }
 
    
 
@@ -167,9 +167,9 @@ draw_glview(Evas_Object *glview)
 static void
 del_glview(Evas_Object *glview)
 {
-    /* Destroy all the OpenGL ES resources here */
-    /* destroy_shaders(); */
-    /* destroy_objects(); */
+    /* Destroy all the OpenGL ES resources here */
+    /* destroy_shaders(); */
+    /* destroy_objects(); */
 }
 
    
 
@@ -184,7 +184,7 @@ del_glview(Evas_Object *glview)
 		  
    If Direct Rendering is enabled, all GL functions must be called from the 4 GLView callback functions only. All other operations can break the rendering order and cause unexpected rendering.
    - +
    diff --git a/org.tizen.guides/html/native/graphics/fragment_shader_n.htm b/org.tizen.guides/html/native/graphics/fragment_shader_n.htm index f2d3e70..e40de2f 100644 --- a/org.tizen.guides/html/native/graphics/fragment_shader_n.htm +++ b/org.tizen.guides/html/native/graphics/fragment_shader_n.htm @@ -39,17 +39,17 @@

    Fragment Shader

    The fragment shader has 2 important tasks: texturing and lighting. The texturing basics are covered in Texturing, and the lighting is handled here.

    -

    The inputs to the fragment shader consist of:

    +

    The inputs to the fragment shader consist of:

    -

    The output of the fragment shader is the fragment color that is passed to the output merger.

    +

    The output of the fragment shader is the fragment color that is passed to the output merger.

    -

    Figure: Vertex and fragment shader outputs

    -

    Vertex and fragment shader outputs

    +

    Figure: Vertex and fragment shader outputs

    +

    Vertex and fragment shader outputs

    The following example is a simplest fragment shader, which performs just texturing. Given an s_tex0 2D image texture and the v_texCoord interpolated texture coordinates, the shader invokes the built-in texture2D() function to determine the color to be output to the built-in gl_FragColor variable:

    @@ -61,31 +61,31 @@ varying vec2 v_texCoord; void main() { -    gl_FragColor = texture2D(s_tex0, v_texCoord); + gl_FragColor = texture2D(s_tex0, v_texCoord); } -

    Phong Lighting Model

    +

    Phong Lighting Model

    Obviously, texturing alone is never enough to make an object look realistic. You need lighting or illumination, which refers to the technique handling the interaction between light sources and objects. The most popular real-time lighting technique is based on the Phong lighting model. It is composed of diffuse, specular, ambient, and emissive terms. For the sake of simplicity, this topic presents only the diffuse term. (For more information, see Phong reflection model in Wikipedia.)

    The diffuse term is for the reflections from ideally diffuse surfaces, which are scattered with equal intensity in all directions (see the left image in the following figure). The amount of reflection perceived by the eye is proportional to the amount of incoming light. Consider a normalized light vector (denoted by l) connecting the surface point and the light source. The amount of incoming light is inversely proportional to the angle between l and the surface normal n (as shown in the middle image), and is described as n⋅l. In order to avoid negative reflection, it is modified into max(n⋅l, 0).

    -

    Figure: Diffuse reflection

    -

    Diffuse reflection

    +

    Figure: Diffuse reflection

    +

    Diffuse reflection

    -

    The reflected color of an object is determined by component-wise multiplication, as shown in the following figure. Suppose a white light source, (1,1,1). If an object lit by the light appears yellow, it means that the object reflects R and G and absorbs B. This kind of filtering can be implemented through the material parameter. For example, if it is (1,1,0), the reflected color is (1,1,1) ⊗ (1,1,0) = (1,1,0) where ⊗ is a component-wise multiplication.

    +

    The reflected color of an object is determined by component-wise multiplication, as shown in the following figure. Suppose a white light source, (1,1,1). If an object lit by the light appears yellow, it means that the object reflects R and G and absorbs B. This kind of filtering can be implemented through the material parameter. For example, if it is (1,1,0), the reflected color is (1,1,1) ⊗ (1,1,0) = (1,1,0) where ⊗ is a component-wise multiplication.

    + +

    Figure: Component-wise multiplication for diffuse color

    +

    Component-wise multiplication for diffuse color

    -

    Figure: Component-wise multiplication for diffuse color

    -

    Component-wise multiplication for diffuse color

    -

    The diffuse term combines the intensity and color: max(n⋅l, 0) sd ⊗ md where sd is the light source color and md is the object material color. The right side of the Diffuse reflection figure shows an object lit with the diffuse term only.

    Fragment Shader for Lighting and Texturing

    -

    The following example shows how to implement Phong lighting (with the diffuse term only) and texturing.

    -

    The vertex shader in the example computes the clip space vertex position and bypasses the texture coordinates, as usual. In addition, it outputs the 'world space' vertex position and normal of each vertex. The v_position, v_normal, and v_texCoord output variables are interpolated for fragments and the per-fragment attributes are provided for the fragment shader.

    +

    The following example shows how to implement Phong lighting (with the diffuse term only) and texturing.

    +

    The vertex shader in the example computes the clip space vertex position and bypasses the texture coordinates, as usual. In addition, it outputs the 'world space' vertex position and normal of each vertex. The v_position, v_normal, and v_texCoord output variables are interpolated for fragments and the per-fragment attributes are provided for the fragment shader.

     uniform mat4 viewProjMat;
@@ -102,14 +102,14 @@ varying vec2 v_texCoord;
 void
 main()
 {
-    gl_Position = viewProjMat * worldMat * vec4(position, 1.0);
-    v_position = (worldMat * vec4(position, 1.0)).xyz;
-    v_normal = mat3(worldMat) * normal;
-    v_texCoord = texCoord;
+    gl_Position = viewProjMat * worldMat * vec4(position, 1.0);
+    v_position = (worldMat * vec4(position, 1.0)).xyz;
+    v_normal = mat3(worldMat) * normal;
+    v_texCoord = texCoord;
 }
    -

    The following fragment shader obtains the object material color (md) by filtering the texture and then asks the user-defined phongDiffuse() function to compute the diffuse term. It uses the uniform vec3 lightPos for calculating the light vector l (lightDirection) and simply implements max(n⋅l, 0) sd ⊗ md presented in Phong Lighting Model.

    +

    The following fragment shader obtains the object material color (md) by filtering the texture and then asks the user-defined phongDiffuse() function to compute the diffuse term. It uses the uniform vec3 lightPos for calculating the light vector l (lightDirection) and simply implements max(n⋅l, 0) sd ⊗ md presented in Phong Lighting Model.

     uniform sampler2D s_tex0;
@@ -125,24 +125,24 @@ vec3 phongDiffuse(vec3 Md); /* Forward declaration */
 void
 main()
 {
-    vec3 Md = texture2D(s_tex0, v_texCoord).xyz;
-    vec3 phongColor = phongDiffuse(Md);
+    vec3 Md = texture2D(s_tex0, v_texCoord).xyz;
+    vec3 phongColor = phongDiffuse(Md);
 
-    gl_FragColor = vec4(phongColor, 1.0);
+    gl_FragColor = vec4(phongColor, 1.0);
 }
 
 vec3
 phongDiffuse(vec3 Md)
 {
-    /* Diffuse term of Phong model per fragment */
-    vec3 lightDirection = normalize(lightPos - v_position);
-    vec3 nor = normalize(v_normal);
+    /* Diffuse term of Phong model per fragment */
+    vec3 lightDirection = normalize(lightPos - v_position);
+    vec3 nor = normalize(v_normal);
 
-    /* Diffuse term */
-    float Diffuse = max(dot(nor, lightDirection), 0.0);
-    vec3 PhongDiffuse = Diffuse * Sd * Md;
+    /* Diffuse term */
+    float Diffuse = max(dot(nor, lightDirection), 0.0);
+    vec3 PhongDiffuse = Diffuse * Sd * Md;
 
-    return PhongDiffuse;
+    return PhongDiffuse;
 }
    diff --git a/org.tizen.guides/html/native/graphics/graphic_buffer_n.htm b/org.tizen.guides/html/native/graphics/graphic_buffer_n.htm index c7ec36c..255ff30 100644 --- a/org.tizen.guides/html/native/graphics/graphic_buffer_n.htm +++ b/org.tizen.guides/html/native/graphics/graphic_buffer_n.htm @@ -42,7 +42,7 @@

    Graphic Buffer and Surface

    - +

    The Tizen Buffer Manager (TBM) surface allows you to manage the graphic buffer in Tizen. The TBM provides an abstraction interface for the graphic buffer and a user interface for the TBM surface. It supports the RGB and YUV graphic formats, as well as multiple plane graphic buffers.

    The TBM surface provides the following main features:

    @@ -76,7 +76,7 @@ tbm_format *formats; uint32_t format_num; if (tbm_surface_query_formats(&formats, &format_num) != TBM_SURFACE_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to get formats supported by the system\n"); + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to get formats supported by the system\n"); @@ -87,15 +87,15 @@ int i; tbm_surface_h surface = NULL; for (i = 0; i < format_num; i++) { -    if (formats[i] == TBM_FORMAT_ARGB8888) { -        surface = tbm_surface_create(128, 128, TBM_FORMAT_ARGB8888); -        if (surface == NULL) -            dlog_print(DLOG_ERROR, LOG_TAG, "Failed to create tbm_surface\n"); -        break; -    } + if (formats[i] == TBM_FORMAT_ARGB8888) { + surface = tbm_surface_create(128, 128, TBM_FORMAT_ARGB8888); + if (surface == NULL) + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to create tbm_surface\n"); + break; + } } if (i == format_num) -    dlog_print(DLOG_ERROR, LOG_TAG, "format not supported\n"); + dlog_print(DLOG_ERROR, LOG_TAG, "format not supported\n"); @@ -105,8 +105,8 @@ if (i == format_num) tbm_surface_info_s surface_info; if (tbm_surface_map(surface, TBM_SURF_OPTION_READ|TBM_SURF_OPTION_WRITE, -                    &surface_info) != TBM_SURFACE_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to map tbm_surface\n"); + &surface_info) != TBM_SURFACE_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to map tbm_surface\n"); @@ -114,16 +114,16 @@ if (tbm_surface_map(surface, TBM_SURF_OPTION_READ|TBM_SURF_OPTION_WRITE,

    Store data at the tbm_surface instance by using a pointer of each plane:

     for (i = 0; i < surface_info.num_planes; i++)
-    memset(surface_info.planes[i].ptr, 0x0, surface_info.planes[i].size);
+    memset(surface_info.planes[i].ptr, 0x0, surface_info.planes[i].size);
  • When no longer needed, unmap and destroy the tbm_surface instance: 
     if (tbm_surface_unmap(surface) != TBM_SURFACE_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to unmap tbm_surface\n");
+    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to unmap tbm_surface\n");
 if (tbm_surface_destroy(surface) != TBM_SURFACE_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to destroy tbm_surface\n");
+    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to destroy tbm_surface\n");
 free(formats);
    • diff --git a/org.tizen.guides/html/native/graphics/graphics_cover_n.htm b/org.tizen.guides/html/native/graphics/graphics_cover_n.htm index dfdff88..acb700d 100644 --- a/org.tizen.guides/html/native/graphics/graphics_cover_n.htm +++ b/org.tizen.guides/html/native/graphics/graphics_cover_n.htm @@ -5,13 +5,13 @@ - + - Graphics + Graphics @@ -31,7 +31,7 @@
  • Creating Applications with Graphics and Animation
    • - +

    Graphics

    @@ -60,7 +60,7 @@
  • SDL Graphics with Vulkan

    You can get high-efficiency access to graphics and computing on modern GPUs with Vulkan. You can use cutting edge 3D programming tools to create high-quality games and real-time graphics in your applications.

    • - +
    diff --git a/org.tizen.guides/html/native/graphics/hw_acceleration_n.htm b/org.tizen.guides/html/native/graphics/hw_acceleration_n.htm index 2b5ca29..dc25038 100644 --- a/org.tizen.guides/html/native/graphics/hw_acceleration_n.htm +++ b/org.tizen.guides/html/native/graphics/hw_acceleration_n.htm @@ -12,7 +12,7 @@ Hardware Acceleration - +
    @@ -29,20 +29,20 @@
    -
    +

    Hardware Acceleration

    - +

    Tizen supports hardware acceleration since Tizen 2.3.1. If hardware acceleration is enabled, it increases rendering performance and allows you to use OpenGL ES.

    -

    You can enable hardware acceleration in the tizen-manifest file, using the manifest editor's Advanced tab.

    +

    You can enable hardware acceleration in the tizen-manifest file, using the manifest editor's Advanced tab.

    + +

    Figure: Hardware acceleration option

    +

    Hardware acceleration option

    -

    Figure: Hardware acceleration option

    -

    Hardware acceleration option

    -

    In the tizen-manifest file, the option is shows as follows:

    -<ui-application appid="example" hw-acceleration="on">
+<ui-application appid="example" hw-acceleration="on">

    The possible values are on (enabled) and off (disabled). If the value is not defined, the default system policy determines whether the hardware acceleration is enabled.

    @@ -54,15 +54,15 @@

    In an indirect rendering mode:

    -elm_config_accel_preference_set("opengl");
-win = elm_win_util_standard_add(name, "OpenGL example");
+elm_config_accel_preference_set("opengl");
+win = elm_win_util_standard_add(name, "OpenGL example");

    This function and option are supported since Tizen 2.3.

    In a direct rendering mode, if you want to use depth and stencil buffers or multisample, you have to specify them in the elm_config_accel_preference_set() function:

    -elm_config_accel_preference_set("opengl:depth24:stencil8:msaa_high");
-win = elm_win_util_standard_add(name, "OpenGL example");
+elm_config_accel_preference_set("opengl:depth24:stencil8:msaa_high");
+win = elm_win_util_standard_add(name, "OpenGL example");

    In the above example, the depth buffer size is 24 bit, stencil buffer size is 8 bit and MSAA is on with a high bit.

    These special options are supported since Tizen 2.3.1. For more information, see the OpenGL ES guide.

    @@ -70,8 +70,8 @@ win = elm_win_util_standard_add(name, "OpenGL example");
  • EFL WebKit (EWK) application

    In addition to enabling hardware acceleration in the manifest file, you must also call the elm_config_accel_preference_set() function before creating an elm window. Because EWK uses a 24-bit depth buffer and a 8-bit stencil buffer, you must also specify them in the elm_config_accel_preference_set() function:

    -elm_config_accel_preference_set("opengl:depth24:stencil8");
-win = elm_win_util_standard_add(name, "EWK example");
+elm_config_accel_preference_set("opengl:depth24:stencil8");
+win = elm_win_util_standard_add(name, "EWK example");

    These special options are supported since Tizen 2.3.1. For more information, see the Web View guide.

    • diff --git a/org.tizen.guides/html/native/graphics/interactive_ui_n.htm b/org.tizen.guides/html/native/graphics/interactive_ui_n.htm index 14482fd..160043e 100644 --- a/org.tizen.guides/html/native/graphics/interactive_ui_n.htm +++ b/org.tizen.guides/html/native/graphics/interactive_ui_n.htm @@ -39,15 +39,15 @@

    Interactive UI

    -

    The 2D canvas in Tizen (the Evas object) has been designed to draw scenes optimally. This means that when drawing a new frame, it does not always read the Evas_Object data. This mechanism can cause a problem for a 3D scene, because the 3D scene is updated by the external module, such as the GPU, and Evas does not know whether the 3D scene is updated.

    +

    The 2D canvas in Tizen (the Evas object) has been designed to draw scenes optimally. This means that when drawing a new frame, it does not always read the Evas_Object data. This mechanism can cause a problem for a 3D scene, because the 3D scene is updated by the external module, such as the GPU, and Evas does not know whether the 3D scene is updated.

    To solve the problem, GLView provides the elm_glview_changed_set() function to notify Evas that the 3D scene must be updated in the next frame. The draw_glview() callback is then invoked while Evas renders the next frame. The application must call the elm_glview_changed_set() function whenever necessary:

    • Touch Event Handling updates the scene by touch event, and you have to invoke the elm_glview_changed_set() function.
    • Automatic Update must be enabled to be used, and also requires calling the elm_glview_changed_set() function.
    -

    Touch Event Handling

    -

    To handle touch events in Tizen, you must connect the event callback functions with Evas_object. The functions are registered by the evas_object_event_callback_add() function for a set of specific events which are already defined in EFL. To learn more about EFL event handling, see the Event Handling.

    +

    Touch Event Handling

    +

    To handle touch events in Tizen, you must connect the event callback functions with Evas_object. The functions are registered by the evas_object_event_callback_add() function for a set of specific events which are already defined in EFL. To learn more about EFL event handling, see the Event Handling.

    The following examples show how to register callback functions for handling touch information and rotating a cube object:

    1. Registering callback functions @@ -57,16 +57,16 @@ static Evas_Object* add_glview(Evas_Object *parent, appdata_s *ad) { -    Evas_Object *glview; + Evas_Object *glview; -    /* Create and initialize GLView */ -    glview = elm_glview_add(parent); + /* Create and initialize GLView */ + glview = elm_glview_add(parent); -    /* Initialize elm_GLView and set the rendering callback functions */ + /* Initialize elm_GLView and set the rendering callback functions */ -    evas_object_event_callback_add(glview, EVAS_CALLBACK_MOUSE_DOWN, mouse_down_cb, ad); -    evas_object_event_callback_add(glview, EVAS_CALLBACK_MOUSE_UP, mouse_up_cb, ad); -    evas_object_event_callback_add(glview, EVAS_CALLBACK_MOUSE_MOVE, mouse_move_cb, ad); + evas_object_event_callback_add(glview, EVAS_CALLBACK_MOUSE_DOWN, mouse_down_cb, ad); + evas_object_event_callback_add(glview, EVAS_CALLBACK_MOUSE_UP, mouse_up_cb, ad); + evas_object_event_callback_add(glview, EVAS_CALLBACK_MOUSE_MOVE, mouse_move_cb, ad); }
      2. @@ -77,45 +77,45 @@ add_glview(Evas_Object *parent, appdata_s *ad) static void mouse_down_cb(void *data, Evas *e, Evas_Object *obj, void *event_info) { -    appdata_s *ad = (appdata_s *)data; -    ad->mouse_down = EINA_TRUE; -    elm_glview_changed_set(obj); + appdata_s *ad = (appdata_s *)data; + ad->mouse_down = EINA_TRUE; + elm_glview_changed_set(obj); } static void mouse_move_cb(void *data, Evas *e, Evas_Object *obj, void *event_info) { -    Evas_Event_Mouse_Move *ev; -    ev = (Evas_Event_Mouse_Move *)event_info; -    appdata_s *ad = (appdata_s *)data; - -    float dx = 0, dy = 0; - -    if (ad->mouse_down) { -        dx = ev->cur.canvas.x - ev->prev.canvas.x; -        dy = ev->cur.canvas.y - ev->prev.canvas.y; -        ad->xangle += dy; -        ad->yangle += dx; -    } -    elm_glview_changed_set(obj); + Evas_Event_Mouse_Move *ev; + ev = (Evas_Event_Mouse_Move *)event_info; + appdata_s *ad = (appdata_s *)data; + + float dx = 0, dy = 0; + + if (ad->mouse_down) { + dx = ev->cur.canvas.x - ev->prev.canvas.x; + dy = ev->cur.canvas.y - ev->prev.canvas.y; + ad->xangle += dy; + ad->yangle += dx; + } + elm_glview_changed_set(obj); } static void mouse_up_cb(void *data, Evas *e, Evas_Object *obj, void *event_info) { -    appdata_s *ad = (appdata_s *)data; + appdata_s *ad = (appdata_s *)data; -    ad->mouse_down = EINA_FALSE; -    elm_glview_changed_set(obj); + ad->mouse_down = EINA_FALSE; + elm_glview_changed_set(obj); } -

      Each callback function has the void *event_info parameter in their signature. However, the parameter works differently depending on the registered events. In the mouse_move_cb() function, the void pointer event_info is cast to the Evas_Event_Mouse_Move type, which is associated with EVAS_CALLBACK_MOUSE_MOVE. Therefore, you can get the information about the screen point when the user touches the screen. Using this information, the angles, xangle and yangle, are accumulated and the accumulated data are used for calculating the rotation matrix in the draw_glview() callback functions.

      +

      Each callback function has the void *event_info parameter in their signature. However, the parameter works differently depending on the registered events. In the mouse_move_cb() function, the void pointer event_info is cast to the Evas_Event_Mouse_Move type, which is associated with EVAS_CALLBACK_MOUSE_MOVE. Therefore, you can get the information about the screen point when the user touches the screen. Using this information, the angles, xangle and yangle, are accumulated and the accumulated data are used for calculating the rotation matrix in the draw_glview() callback functions.

      Notice the elm_glview_changed_set() function. It notifies EFL that there has been a change in GLView. Then, the main loop of EFL invokes the rendering callback functions in GLView.

    -

    Automatic Update

    -

    In order to allow GLView to update scenes continuously, you must trigger the GLView rendering at every frame. The Ecore_Animator represents a method to enable the automatic update. It invokes the registered callback at every N seconds where N is the frametime interval set by the ecore_animator_frametime_set() function. Then you can call the elm_glview_changed_set() function at the animator's callback to keep the 3D scene being rendered while the animator works.

    -

    The Ecore_Animator instance can be replaced by Ecore_Timer, which produces the same result as Ecore_Animator. However, since Ecore_Animator provides more advantages in maintaining the updating loop, prefer Ecore_Animator instead of Ecore_Timer. For more information, see the Ecore Animator API (in mobile and wearable applications).

    +

    Automatic Update

    +

    In order to allow GLView to update scenes continuously, you must trigger the GLView rendering at every frame. The Ecore_Animator represents a method to enable the automatic update. It invokes the registered callback at every N seconds where N is the frametime interval set by the ecore_animator_frametime_set() function. Then you can call the elm_glview_changed_set() function at the animator's callback to keep the 3D scene being rendered while the animator works.

    +

    The Ecore_Animator instance can be replaced by Ecore_Timer, which produces the same result as Ecore_Animator. However, since Ecore_Animator provides more advantages in maintaining the updating loop, prefer Ecore_Animator instead of Ecore_Timer. For more information, see the Ecore Animator API (in mobile and wearable applications).

    The following example adds and deletes an animator with the callback function:

    1. Adding Ecore_Animator 
      @@ -130,7 +130,7 @@ mouse_up_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 */
 
 Ecore_Animator *ani = ecore_animator_add(anim_cb, glview);
-evas_object_data_set(glview, "ani", ani);
+evas_object_data_set(glview, "ani", ani);
 evas_object_event_callback_add(glview, EVAS_CALLBACK_DEL, del_anim_cb, ad);
      2. @@ -139,21 +139,21 @@ evas_object_event_callback_add(glview, EVAS_CALLBACK_DEL, del_anim_cb, ad); static void del_anim_cb(void *data, Evas *evas, Evas_Object *obj, void *event_info) { -    Ecore_Animator *ani = (Ecore_Animator *)evas_object_data_get(obj, "ani"); -    ecore_animator_del(ani); + Ecore_Animator *ani = (Ecore_Animator *)evas_object_data_get(obj, "ani"); + ecore_animator_del(ani); } static Eina_Bool anim_cb(void *data) { -    elm_glview_changed_set((Evas_Object *)data); + elm_glview_changed_set((Evas_Object *)data); -    return EINA_TRUE; + return EINA_TRUE; }

      The animator callback function is also triggered when the display is off. Use the ecore_animator_freeze() and ecore_animator_thaw() functions in the app_pause_cb() and app_resume_cb() callbacks for power saving.

    -

    Integrating 3D Scene and 2D UI Components

    +

    Integrating 3D Scene and 2D UI Components

    GLView can be used together with Elementary UI components. The following example creates a GLView and Elementary button component together in a simple box container. It is also possible to support interactions between 2D components and 3D scene.

     /* Create the box */
@@ -174,35 +174,35 @@ elm_box_pack_end(box, ad->glview);
 Evas_Object *button = elm_button_add(box);
 evas_object_size_hint_weight_set(button, EVAS_HINT_EXPAND, EVAS_HINT_FILL);
 evas_object_size_hint_align_set(button, EVAS_HINT_FILL, 1);
-elm_object_text_set(button, "Reset Animation");
-evas_object_smart_callback_add(button, "clicked", clicked_cb, ad);
+elm_object_text_set(button, "Reset Animation");
+evas_object_smart_callback_add(button, "clicked", clicked_cb, ad);
 evas_object_show(button);
 elm_box_pack_end(box, button);
 
 static void
 clicked_cb(void *user_data, Evas_Object *obj, void *event_info)
 {
-    appdata_s *ad = (appdata_s *)user_data;
-
-    /*
-       It is possible to change the 3D scene
-       For example, start animator to rotate the cube
-    */
-    if (!ad->reset_anim) {
-        ad->reset_anim = EINA_TRUE;
-
-        /* Setting animation angle for 0.75 seconds */
-        ad->tic_xangle = (ad->xangle - 45.0f) / 45.0f;
-        ad->tic_yangle = (ad->yangle - 45.0f) / 45.0f;
-
-        /* 
-           Add animator which calls elm_glview_changed_set() per frame
-           This rotates the object tic_x(y)angle along X(Y)-axis
-           until object reaches the initial angle
-        */
-        ad->ani = ecore_animator_add(anim_cb, ad);
-        evas_object_event_callback_add(ad->glview, EVAS_CALLBACK_DEL, del_anim, ad);
-    }
+    appdata_s *ad = (appdata_s *)user_data;
+
+    /*
+       It is possible to change the 3D scene
+       For example, start animator to rotate the cube
+    */
+    if (!ad->reset_anim) {
+        ad->reset_anim = EINA_TRUE;
+
+        /* Setting animation angle for 0.75 seconds */
+        ad->tic_xangle = (ad->xangle - 45.0f) / 45.0f;
+        ad->tic_yangle = (ad->yangle - 45.0f) / 45.0f;
+
+        /*
+           Add animator which calls elm_glview_changed_set() per frame
+           This rotates the object tic_x(y)angle along X(Y)-axis
+           until object reaches the initial angle
+        */
+        ad->ani = ecore_animator_add(anim_cb, ad);
+        evas_object_event_callback_add(ad->glview, EVAS_CALLBACK_DEL, del_anim, ad);
+    }
 }
    diff --git a/org.tizen.guides/html/native/graphics/opengl_n.htm b/org.tizen.guides/html/native/graphics/opengl_n.htm index 2f497d7..32be2f0 100644 --- a/org.tizen.guides/html/native/graphics/opengl_n.htm +++ b/org.tizen.guides/html/native/graphics/opengl_n.htm @@ -26,7 +26,7 @@
  • Tizen 2.3.1 and Higher for Wearable

    • Content

    -
      +
      • EvasGL

        Related Info

          @@ -54,7 +54,7 @@
          -

          OpenGL ES

          +

          OpenGL ES

          Today, most smart devices are equipped with Graphics Processing Units (GPU). This is the case for Tizen devices, as well. OpenGL ES is an interface to the GPU that consists of well-defined subsets of the desktop OpenGL API.

          Tizen native applications can use OpenGL ES not only for creating a 3D scene but also for a 2D scene that requires fast interaction. OpenGL ES is also good for improving performance and reducing power consumption when the native application performs computation-intensive tasks that can be run in parallel.

          @@ -71,7 +71,7 @@
        • Using callbacks

          You can set the callbacks.

        • Setting a surface into the image object -

          You can set a native surface into the image object.

          • +

          You can set a native surface into the image object.

        • Using OpenGL ES extensions

          You can check whether an extension is available, and call it.

        • Using EvasGL extensions @@ -127,43 +127,43 @@ EVAS_GL_GLOBAL_GLES2_DEFINE(); 
           struct appdata {
-    Evas_Object *win; /* Application window */
-    Evas_Object *img; /* OpenGL ES canvas */
-
-    Evas_GL *evasgl; /* EvasGL object for rendering GL in Evas */
-    Evas_GL_Context *ctx; /* EvasGL context object, a GL rendering context in Evas GL */
-    Evas_GL_Surface *sfc; /* EvasGL surface object, a GL rendering target in Evas GL */
-    Evas_GL_Config *cfg; /* EvasGL surface configuration object for surface creation */
-    Evas_Coord sfc_w;
-    Evas_Coord sfc_h;
-
-    unsigned int program;
-    unsigned int vtx_shader;
-    unsigned int fgmt_shader;
-    unsigned int vbo;
+    Evas_Object *win; /* Application window */
+    Evas_Object *img; /* OpenGL ES canvas */
+
+    Evas_GL *evasgl; /* EvasGL object for rendering GL in Evas */
+    Evas_GL_Context *ctx; /* EvasGL context object, a GL rendering context in Evas GL */
+    Evas_GL_Surface *sfc; /* EvasGL surface object, a GL rendering target in Evas GL */
+    Evas_GL_Config *cfg; /* EvasGL surface configuration object for surface creation */
+    Evas_Coord sfc_w;
+    Evas_Coord sfc_h;
+
+    unsigned int program;
+    unsigned int vtx_shader;
+    unsigned int fgmt_shader;
+    unsigned int vbo;
 };
 typedef struct appdata appdata_s;
          - +

          Creating the Elm Window and EvasGL

          To create the Elm window and EvasGL:

          1. Create a window and EvasGL.

            For developing an application with Elementary, you create a window by using the Elementary utility function, elm_win_util_standard_add(). To develop a GL application and make the application use the GPU, you must call the elm_config_accel_preference_set() function before creating the window.

            - + 
             Evas_Object *win;
 
 /*
    To use OpenGL ES, the application must switch on hardware acceleration
-   To enable that, call elm_config_accel_preference_set() with "opengl"
+   To enable that, call elm_config_accel_preference_set() with "opengl"
    before creating the Elm window
    This function is supported since 2.3.
 */
-elm_config_accel_preference_set("opengl");
+elm_config_accel_preference_set("opengl");
 /* Creating Elm window */
-ad->win = elm_win_util_standard_add("Evas_GL Example", "Evas_GL Example");
+ad->win = elm_win_util_standard_add("Evas_GL Example", "Evas_GL Example");

            You can create the EvasGL handler using the evas_gl_new() function. This initializer takes the Evas canvas on which OpenGL ES is to be used as a parameter. When developing an application with Elementary, use the canvas of your window:

            @@ -241,7 +241,7 @@ ad->img = evas_object_image_filled_add(evas_object_evas_get(ad->win));
          2. -

            Define the "OpenGL ES main loop" function that is called every time the program attempts to get pixels from the image. Put all the OpenGL ES statements in charge of rendering the scene in this callback.

            +

            Define the "OpenGL ES main loop" function that is called every time the program attempts to get pixels from the image. Put all the OpenGL ES statements in charge of rendering the scene in this callback.

             evas_object_image_pixels_get_callback_set(ad->img, img_pixels_get_cb, ad);
@@ -255,23 +255,23 @@ evas_object_image_pixels_get_callback_set(ad->img, img_pixels_get_cb, ad);
 static void
 img_pixels_get_cb(void *data, Evas_Object *obj)
 {
-    appdata_s *ad = data;
-    /* Rendering process */
-    evas_gl_make_current(ad->evasgl, ad->sfc, ad->ctx);
-    /* Because the surface size can be changed, set the viewport in this callback */
-    glViewport(0, 0, ad->sfc_w, ad->sfc_h);
-    /* Paint it blue */
-    glClearColor(0.2, 0.2, 0.6, 1.0);
-    glClear(GL_COLOR_BUFFER_BIT);
-    /* Usual OpenGL ES draw commands come here */
-    /* draw_scene(); */
+    appdata_s *ad = data;
+    /* Rendering process */
+    evas_gl_make_current(ad->evasgl, ad->sfc, ad->ctx);
+    /* Because the surface size can be changed, set the viewport in this callback */
+    glViewport(0, 0, ad->sfc_w, ad->sfc_h);
+    /* Paint it blue */
+    glClearColor(0.2, 0.2, 0.6, 1.0);
+    glClear(GL_COLOR_BUFFER_BIT);
+    /* Usual OpenGL ES draw commands come here */
+    /* draw_scene(); */
 }

            At every tick, set the given context as a current context for the given surface using the evas_gl_make_current() function.

          3. You can use the Ecore_Animator to define the OpenGL ES main loop. -

            To use the Ecore_Animator, create a callback that is called on every animation tick. This animation callback is used only to mark the image as "dirty", meaning that it needs an update next time Evas renders. It calls the pixel get callback that redraws the scene.

            +

            To use the Ecore_Animator, create a callback that is called on every animation tick. This animation callback is used only to mark the image as "dirty", meaning that it needs an update next time Evas renders. It calls the pixel get callback that redraws the scene.

            The animator callback function is also triggered when the display is off. Use the ecore_animator_freeze() and ecore_animator_thaw() functions in the app_pause_cb() and app_resume_cb() callbacks for power saving.

            @@ -279,10 +279,10 @@ img_pixels_get_cb(void *data, Evas_Object *obj) static Eina_Bool animate_cb(void *data) { -    Evas_Object *img = data; -    evas_object_image_pixels_dirty_set(img, EINA_TRUE); + Evas_Object *img = data; + evas_object_image_pixels_dirty_set(img, EINA_TRUE); -    return ECORE_CALLBACK_RENEW; + return ECORE_CALLBACK_RENEW; } ecore_animator_add(animate_cb, ad->img); @@ -300,38 +300,38 @@ evas_object_event_callback_add(ad->win, EVAS_CALLBACK_RESIZE, win_resize_cb,

          4. Because the window size can be changed, set a resize callback for the window. In the callback, you must recreate an Evas_GL_Surface and reset the viewport size with the new window size:

            - + 
             static void
 win_resize_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    appdata_s *ad = data;
-
-    if (ad->sfc) {
-        evas_object_image_native_surface_set(ad->img, NULL);
-        evas_gl_surface_destroy(ad->evasgl, ad->sfc);
-        ad->sfc = NULL;
-    }
-
-    evas_object_geometry_get(obj, NULL, NULL, &ad->sfc_w, &ad->sfc_h);
-    evas_object_image_size_set(ad->img, ad->sfc_w, ad->sfc_h);
-    evas_object_resize(ad->img, ad->sfc_w, ad->sfc_h);
-    evas_object_show(ad->img);
-
-    if (!ad->sfc) {
-        Evas_Native_Surface ns;
-        ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, ad->sfc_w, ad->sfc_h);
-        evas_gl_native_surface_get(ad->evasgl, ad->sfc, &ns);
-        evas_object_image_native_surface_set(ad->img, &ns);
-        evas_object_image_pixels_dirty_set(ad->img, EINA_TRUE);
-    }
+    appdata_s *ad = data;
+
+    if (ad->sfc) {
+        evas_object_image_native_surface_set(ad->img, NULL);
+        evas_gl_surface_destroy(ad->evasgl, ad->sfc);
+        ad->sfc = NULL;
+    }
+
+    evas_object_geometry_get(obj, NULL, NULL, &ad->sfc_w, &ad->sfc_h);
+    evas_object_image_size_set(ad->img, ad->sfc_w, ad->sfc_h);
+    evas_object_resize(ad->img, ad->sfc_w, ad->sfc_h);
+    evas_object_show(ad->img);
+
+    if (!ad->sfc) {
+        Evas_Native_Surface ns;
+        ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, ad->sfc_w, ad->sfc_h);
+        evas_gl_native_surface_get(ad->evasgl, ad->sfc, &ns);
+        evas_object_image_native_surface_set(ad->img, &ns);
+        evas_object_image_pixels_dirty_set(ad->img, EINA_TRUE);
+    }
 }

          Setting a Surface into the Image Object

          -

          You can fill in the native surface information from the given EvasGL surface. For example, to adapt the surface to the target image when the size of the canvas changes:

          +

          You can fill in the native surface information from the given EvasGL surface. For example, to adapt the surface to the target image when the size of the canvas changes:

           Evas_Native_Surface ns;
@@ -356,7 +356,7 @@ Evas_GL_API *gl = elm_glview_api_get(glview);
 
 /* Check for support for the Program Binary OES extension */
 if (gl->glGetProgramBinaryOES)
-    printf("Program binary extension is supported.\n");
+    printf("Program binary extension is supported.\n");
        • Call an extension. @@ -364,10 +364,10 @@ if (gl->glGetProgramBinaryOES) 
           if (gl->glGetProgramBinaryOES) {
-    char buf[4096];
-    size_t len;
-    Glenum fmt;
-    gl->glGetProgramBinaryOES(prgid, sizeof(buf), &len, &fmt, buf);
+    char buf[4096];
+    size_t len;
+    Glenum fmt;
+    gl->glGetProgramBinaryOES(prgid, sizeof(buf), &len, &fmt, buf);
 }
          • @@ -390,7 +390,7 @@ if (gl->glGetProgramBinaryOES) { 
           if (gl->evasglCreateImageForContext && gl->evasglDestroyImage)
-    /* Good... */
+    /* Good... */
        • Create an image. @@ -411,14 +411,14 @@ gl->glGenRenderbuffers(1, &color_rb); gl->glBindRenderbuffer(GL_RENDERBUFFER_EXT, color_rb); gl->glRenderbufferStorage(GL_RENDERBUFFER_EXT, GL_RGBA, width, height); gl->glFramebufferRenderbufferEXT(GL_FRAMEBUFFER_EXT, -                                 GL_COLOR_ATTACHMENT0_EXT, -                                 GL_RENDERBUFFER_EXT, -                                 color_rb); + GL_COLOR_ATTACHMENT0_EXT, + GL_RENDERBUFFER_EXT, + color_rb); evgl = elm_glview_evas_gl_get(glview); ctx = evas_gl_current_context_get(evgl); image = gl->evasglCreateImageForContext(evgl, ctx, EVAS_GL_TEXTURE_2D, -                                        (void *)(intptr_t)color_rb, NULL); + (void *)(intptr_t)color_rb, NULL);

          The EvasGL image is now created and available for use from another context.

          @@ -485,7 +485,7 @@ gl->evasglDestroyImage(image); 
           if (gl->evasglCreateSync)
-    /* fence_sync must be supported */
+    /* fence_sync must be supported */
        @@ -497,33 +497,33 @@ if (gl->evasglCreateSync)

      • To use direct rendering in GLView:

        -

        In GLView, the ELM_GLVIEW_DIRECT option is one of GLView mode's enums and the option can be enabled using the elm_glview_mode_set() function.

        +

        In GLView, the ELM_GLVIEW_DIRECT option is one of GLView mode's enums and the option can be enabled using the elm_glview_mode_set() function.

         /* Tizen 2.3 */
-/* elm_config_accel_preference_set("opengl"); */
+/* elm_config_accel_preference_set("opengl"); */
 
 /* Since Tizen 2.3.1 */
-elm_config_accel_preference_set("opengl:depth24:stencil8:msaa_high");
-Evas_Object *win = elm_win_util_standard_add("sample", "sample");
+elm_config_accel_preference_set("opengl:depth24:stencil8:msaa_high");
+Evas_Object *win = elm_win_util_standard_add("sample", "sample");
 
 Evas_Object *glview = elm_glview_add(win);
 elm_glview_mode_set(glview, ELM_GLVIEW_DEPTH_24 | ELM_GLVIEW_STENCIL_8
-                            | ELM_GLVIEW_MULTISAMPLE_HIGH);
+                            | ELM_GLVIEW_MULTISAMPLE_HIGH);
        -

        To use the Direct Rendering mode since Tizen 2.3.1, set the same option values (depth, stencil, and MSAA) to a rendering engine and a GLView object. You can set the option values to a rendering engine using the elm_config_accel_preference_set() function and to a GLView object using the elm_glview_mode_set() function. If the GLView object option values are bigger or higher than the rendering engine's, the Direct Rendering mode is disabled.

        +

        To use the Direct Rendering mode since Tizen 2.3.1, set the same option values (depth, stencil, and MSAA) to a rendering engine and a GLView object. You can set the option values to a rendering engine using the elm_config_accel_preference_set() function and to a GLView object using the elm_glview_mode_set() function. If the GLView object option values are bigger or higher than the rendering engine's, the Direct Rendering mode is disabled.

      • To use direct rendering in EvasGL:

        -

        In EvasGL, the EVAS_GL_OPTIONS_DIRECT is one of EvasGL's config options and the option can be enabled by setting the Evas_GL_Config option.

        +

        In EvasGL, the EVAS_GL_OPTIONS_DIRECT is one of EvasGL's config options and the option can be enabled by setting the Evas_GL_Config option.

         /* Tizen 2.3 */
-/* elm_config_accel_preference_set("opengl"); */
+/* elm_config_accel_preference_set("opengl"); */
 
 /* Since Tizen 2.3.1 */
-elm_config_accel_preference_set("opengl:depth24:stencil8:msaa_high");
-Evas_Object *win = elm_win_util_standard_add("sample", "sample");
+elm_config_accel_preference_set("opengl:depth24:stencil8:msaa_high");
+Evas_Object *win = elm_win_util_standard_add("sample", "sample");
 
 Evas_GL_Config *cfg = evas_gl_config_new();
 cfg = evas_gl_config_new();
@@ -535,9 +535,9 @@ cfg->options_bits = EVAS_GL_OPTIONS_DIRECT;
 cfg->multisample_bits = EVAS_GL_MULTISAMPLE_HIGH;
        -

        To use the Direct Rendering mode since Tizen 2.3.1, set the same option values (depth, stencil, and MSAA) to a rendering engine and an Evas_GL_Config object. You can set the option values to a rendering engine using the elm_config_accel_preference_set() function. If the Evas_GL_Config object option values are bigger or higher than the rendering engine's, the Direct Rendering mode is disabled.

        +

        To use the Direct Rendering mode since Tizen 2.3.1, set the same option values (depth, stencil, and MSAA) to a rendering engine and an Evas_GL_Config object. You can set the option values to a rendering engine using the elm_config_accel_preference_set() function. If the Evas_GL_Config object option values are bigger or higher than the rendering engine's, the Direct Rendering mode is disabled.

        + -
        Note If direct rendering is enabled, EvasGL renders directly to the back buffer of the window. Otherwise, EvasGL renders to the off screen buffer, then composited to the back buffer of the window. @@ -545,18 +545,18 @@ cfg->multisample_bits = EVAS_GL_MULTISAMPLE_HIGH;

        Although direct rendering is enabled, EvasGL not always renders directly to the back buffer. The following conditions disable direct rendering and force a fallback to indirect rendering in a frame buffer:

          -
        • If the object's color is not 255,255,255,255.
          • +
        • If the object's color is not 255,255,255,255.
        • If the object has an Evas map.
        • If the object size is different from the viewport (RESIZE_POLICY_SCALE).
        • If the window is rotated and CLIENT_SIDE_ROTATION is not set.
        • If the GLView policy is set to ALWAYS render or the EvasGL does not use pixel getter callback.
        - +
        Caution In the render callback function, call only GL functions. -

        In case the GL functions are called outside the render callback function, you must call the evas_gl_make_current() function before the GL function calls. However, this results in a performance degradation due to context switching, and only works if the target surface is not an Evas_GL_Surface with Direct Rendering enabled.

        +

        In case the GL functions are called outside the render callback function, you must call the evas_gl_make_current() function before the GL function calls. However, this results in a performance degradation due to context switching, and only works if the target surface is not an Evas_GL_Surface with Direct Rendering enabled.

        If the target buffer is an Evas_GL_Surface with Direct Rendering enabled, all GL functions must be called from the render callback function only. All other operations can break the rendering order and the unexpected rendering occurs.

        @@ -572,19 +572,19 @@ cfg->multisample_bits = EVAS_GL_MULTISAMPLE_HIGH;
        • To use GLView rotation: -

          In GLView, the ELM_GLVIEW_CLIENT_SIDE_ROTATION option is one of GLView mode's enums and the option can be enabled by using the elm_glview_mode_set() function. This option is needed only when Direct Rendering is enabled.

          +

          In GLView, the ELM_GLVIEW_CLIENT_SIDE_ROTATION option is one of GLView mode's enums and the option can be enabled by using the elm_glview_mode_set() function. This option is needed only when Direct Rendering is enabled.

           Evas_Object *gl;
 gl = elm_glview_add(win);
 
 elm_glview_mode_set(gl, ELM_GLVIEW_DEPTH | ELM_GLVIEW_DIRECT
-                        | ELM_GLVIEW_CLIENT_SIDE_ROTATION);
+                        | ELM_GLVIEW_CLIENT_SIDE_ROTATION);
        • To use EvasGL rotation: -

          In EvasGL, the EVAS_GL_OPTIONS_CLIENT_SIDE_ROTATION is one of EvasGL's config options and this option can be enabled by setting the Evas_GL_Config option.

          +

          In EvasGL, the EVAS_GL_OPTIONS_CLIENT_SIDE_ROTATION is one of EvasGL's config options and this option can be enabled by setting the Evas_GL_Config option.

           Evas_GL_Config *cfg;
 cfg = evas_gl_config_new();
@@ -597,14 +597,14 @@ cfg->options_bits = EVAS_GL_OPTIONS_DIRECT | EVAS_GL_OPTIONS_CLIENT_SIDE_ROTA
 static void
 _draw_gl(Evas_Object *obj)
 {
-    int w;
-    int h;
-    int rotation;
-    elm_glview_size_get(obj, &w, &h);
-    rotation = evas_gl_rotation_get(ad->evasgl);
-
-    if (rotation % 180)
-        /* Adjust gl size */
+    int w;
+    int h;
+    int rotation;
+    elm_glview_size_get(obj, &w, &h);
+    rotation = evas_gl_rotation_get(ad->evasgl);
+
+    if (rotation % 180)
+        /* Adjust gl size */
 }
          @@ -614,7 +614,7 @@ _draw_gl(Evas_Object *obj)

          Figure: OpenGL ES and EFL

          OpenGL ES and EFL

          - +
    diff --git a/org.tizen.guides/html/native/graphics/output_merging_n.htm b/org.tizen.guides/html/native/graphics/output_merging_n.htm index 9500631..c780a75 100644 --- a/org.tizen.guides/html/native/graphics/output_merging_n.htm +++ b/org.tizen.guides/html/native/graphics/output_merging_n.htm @@ -38,20 +38,20 @@

    Output Merging

    -

    The fragment shader returns a colored fragment, often called the RGBAZ fragment. A (for alpha) represents the fragment's opacity whereas Z represents the depth. In the output merger, the fragment competes or combines with the pixel in the color buffer to update the pixel's color. A and Z are used in this process. In addition to the color buffer, OpenGL ES (GL) supports another buffer named depth buffer or z-buffer. It has the same resolution as the color buffer and stores the depth values of the pixels.

    +

    The fragment shader returns a colored fragment, often called the RGBAZ fragment. A (for alpha) represents the fragment's opacity whereas Z represents the depth. In the output merger, the fragment competes or combines with the pixel in the color buffer to update the pixel's color. A and Z are used in this process. In addition to the color buffer, OpenGL ES (GL) supports another buffer named depth buffer or z-buffer. It has the same resolution as the color buffer and stores the depth values of the pixels.

    Depth Buffering

    -

    In the following figure, assume that MinZ of the viewport is 0.0, MaxZ is 1.0, the red triangle's depth is 0.8, and the blue triangle's is 0.5. By calling the glClear() function once per frame, the color and depth buffers are simultaneously cleared with the default values selected by the glClearColor() and glClearDepthf() functions, respectively.

    +

    In the following figure, assume that MinZ of the viewport is 0.0, MaxZ is 1.0, the red triangle's depth is 0.8, and the blue triangle's is 0.5. By calling the glClear() function once per frame, the color and depth buffers are simultaneously cleared with the default values selected by the glClearColor() and glClearDepthf() functions, respectively.

    -

    Figure: Depth buffering visualization: the rendering order is red to blue triangles

    -

    Depth buffering visualization: the rendering order is red to blue triangles Depth buffering visualization: the rendering order is red to blue triangles

    - +

    Figure: Depth buffering visualization: the rendering order is red to blue triangles

    +

    Depth buffering visualization: the rendering order is red to blue triangles Depth buffering visualization: the rendering order is red to blue triangles

    -

    When a fragment at (x,y) is passed from the fragment shader, its depth value is compared with the depth buffer value at (x,y). If the fragment has a smaller depth value, its color and depth update the color buffer and depth buffer at (x,y), respectively. Otherwise, the fragment is discarded. The above figure shows how the depth buffer is used for filling the color buffer. This method is called depth buffering or z-buffering.

    + +

    When a fragment at (x,y) is passed from the fragment shader, its depth value is compared with the depth buffer value at (x,y). If the fragment has a smaller depth value, its color and depth update the color buffer and depth buffer at (x,y), respectively. Otherwise, the fragment is discarded. The above figure shows how the depth buffer is used for filling the color buffer. This method is called depth buffering or z-buffering.

    Alpha Blending

    -

    Suppose that the current fragment has a smaller depth than the pixel in the color buffer and is translucent. Then, the pixel must show through the fragment. This is achieved by blending the fragment color with the pixel color. The process uses the alpha value of the fragment, which is in the range of [0,1]: 0 denotes fully transparent and 1 denotes fully opaque.

    -

    A typical blending equation is αcf + (1-α)cp, where α represents the fragment's opacity, cf is the fragment color, and cp is the pixel color. Assume that, in the Depth buffering visualization figure, all vertices of the blue triangle have the RGBA color, (0,0,1,0.5), and those of the red triangle have (1,0,0,1). The scan conversion algorithm interpolates the RGB channels and the alpha channel in the same manner. Therefore, all fragments of the blue triangle are assigned (0,0,1,0.5), and those of the red triangle are (1,0,0,1). Then, the blue fragment is blended with the red pixel at 3 pixel positions. The blended color is (0.5,0,0.5). This process is named alpha blending.

    +

    Suppose that the current fragment has a smaller depth than the pixel in the color buffer and is translucent. Then, the pixel must show through the fragment. This is achieved by blending the fragment color with the pixel color. The process uses the alpha value of the fragment, which is in the range of [0,1]: 0 denotes fully transparent and 1 denotes fully opaque.

    +

    A typical blending equation is αcf + (1-α)cp, where α represents the fragment's opacity, cf is the fragment color, and cp is the pixel color. Assume that, in the Depth buffering visualization figure, all vertices of the blue triangle have the RGBA color, (0,0,1,0.5), and those of the red triangle have (1,0,0,1). The scan conversion algorithm interpolates the RGB channels and the alpha channel in the same manner. Therefore, all fragments of the blue triangle are assigned (0,0,1,0.5), and those of the red triangle are (1,0,0,1). Then, the blue fragment is blended with the red pixel at 3 pixel positions. The blended color is (0.5,0,0.5). This process is named alpha blending.

    GL supports the glBlendFunc() function, where the first parameter specifies the blending coefficient for the incoming (source) fragment and the second parameter specifies the blending coefficient for the destination pixel. Many values, such as GL_ZERO and GL_ONE, can be assigned to the parameters, but GL_SRC_ALPHA best fits the incoming fragment while GL_ONE_MINUS_SRC_ALPHA best fits the destination pixel.

    diff --git a/org.tizen.guides/html/native/graphics/polygon_mesh_n.htm b/org.tizen.guides/html/native/graphics/polygon_mesh_n.htm index 6a5c8c5..f33d2e9 100644 --- a/org.tizen.guides/html/native/graphics/polygon_mesh_n.htm +++ b/org.tizen.guides/html/native/graphics/polygon_mesh_n.htm @@ -35,7 +35,7 @@
    -

    Polygon Mesh in OpenGL ES

    +

    Polygon Mesh in OpenGL ES

    In real-time applications, such as games, an object is usually represented as a polygon mesh. The only polygon that OpenGL ES (GL) supports is a triangle and because of this, a polygon mesh in GL implies a triangle mesh. Given an object, its polygon mesh can have different resolutions, as shown in the following figure.

    As the resolution is increased or the number of vertices increased, the polygon mesh samples the original smooth surface more accurately. However, rendering the mesh requires more time.

    @@ -65,7 +65,7 @@

    Figure: Computation of the vertex normals

    Computation of the vertex normals

    - +

    Polygon Mesh Export and Import

    @@ -82,7 +82,7 @@

    Figure: Vertex and index arrays of a low-resolution sphere mesh

    Vertex and index arrays of a low-resolution sphere mesh

    - +
    diff --git a/org.tizen.guides/html/native/graphics/texturing_n.htm b/org.tizen.guides/html/native/graphics/texturing_n.htm index 333053b..3166cfb 100644 --- a/org.tizen.guides/html/native/graphics/texturing_n.htm +++ b/org.tizen.guides/html/native/graphics/texturing_n.htm @@ -42,63 +42,63 @@

    Texturing

    While the vertex shader outputs the clip space vertices, the rasterizer outputs a set of fragments at the window space. The per-fragment attributes usually include a normal and a set of texture coordinates. Using these data, the fragment shader determines the final color of each fragment. The most important things to do in the fragment shader are lighting and texturing.

    -

    Before moving on to the fragment shader, consider the basics of texturing. The simplest among the various texturing methods is image texturing. An image texture is a 2D array of texels (texture elements). Each texel has a unique position. In the first of the following figures, for example, the lower-left texel's position is (0.5,0.5). For accessing a texture, you can use 'normalized' texture coordinates (s,t) instead of the texel position (as shown in the second of the following figures).

    +

    Before moving on to the fragment shader, consider the basics of texturing. The simplest among the various texturing methods is image texturing. An image texture is a 2D array of texels (texture elements). Each texel has a unique position. In the first of the following figures, for example, the lower-left texel's position is (0.5,0.5). For accessing a texture, you can use 'normalized' texture coordinates (s,t) instead of the texel position (as shown in the second of the following figures).

    -

    Figure: 2D array of texels

    -

    2D array of texels

    +

    Figure: 2D array of texels

    +

    2D array of texels

    + +

    Figure: Accessing textures using normalized texture coordinates

    +

    Accessing textures using normalized texture coordinates

    -

    Figure: Accessing textures using normalized texture coordinates

    -

    Accessing textures using normalized texture coordinates

    -

    Processing Texture Coordinates

    The texture coordinates are assigned to the vertices of the polygon mesh. (This process is called surface parameterization or simply parameterization, and it is done by graphics packages, such as 3ds Max.) The scan conversion is also done with the texture coordinates. In the following figure, the scan conversion interpolates the per-vertex texture coordinates to determine the per-fragment texture coordinates. For example, the lower-left corner fragment is assigned the texture coordinates, (1/8,1/8). OpenGL ES (GL) simply multiplies the per-fragment texture coordinates by the texture resolution, rx and ry. If the resolution is 4x4, the texture coordinates, (1/8,1/8), are mapped to (0.5,0.5) and the lower-left corner texel is retrieved from the image texture.

    -

    Figure: From the texture coordinates to the texel position

    -

    From the texture coordinates to the texel position From the texture coordinates to the texel position From the texture coordinates to the texel position

    +

    Figure: From the texture coordinates to the texel position

    +

    From the texture coordinates to the texel position From the texture coordinates to the texel position From the texture coordinates to the texel position

    Texture Filtering

    -

    For a fragment located at (x,y) in the window, its texture coordinates (s,t) are mapped to (s',t') as presented above. Basically, the fragment at (x,y) is projected onto (s',t'). In the contrived example given above, (s',t') exactly falls into the center of a texel. In reality, however, this rarely happens. Then, the texels around (s',t') are collected and combined to determine the texture color of the fragment. This process is called texture filtering.

    +

    For a fragment located at (x,y) in the window, its texture coordinates (s,t) are mapped to (s',t') as presented above. Basically, the fragment at (x,y) is projected onto (s',t'). In the contrived example given above, (s',t') exactly falls into the center of a texel. In reality, however, this rarely happens. Then, the texels around (s',t') are collected and combined to determine the texture color of the fragment. This process is called texture filtering.

    Suppose a quad composed of 2 triangles. Depending on the view, view frustum, and viewport parameters, the quad size in the window space may vary. In the following figure, the top row shows a case where the window space quad appears larger than the given image texture. Then, the texture is magnified so as to be pasted onto the quad. In contrast, the window space quad in the bottom row appears smaller than the image texture, and the texture is minified. Note that the fragments are sparsely projected onto the texture space.

    In the figure, the texture is depicted as a grid of dotted lines, where a texel is located in a grid cell. The gold dots represent the window space fragments projected onto the texture space.

    -

    Figure: Magnification (top) vs. minification (bottom)

    -

    Magnification (top) vs. minification (bottom)

    -

    Magnification (top) vs. minification (bottom)

    - +

    Figure: Magnification (top) vs. minification (bottom)

    +

    Magnification (top) vs. minification (bottom)

    +

    Magnification (top) vs. minification (bottom)

    +

    Filtering for Magnification

    In case of magnification, you have 2 options. The first is nearest point sampling. Then, as you can see in the left example below, a block of fragments can be mapped to a single texel. Consequently, a blocky image is often produced. The second option is bilinear interpolation illustrated in the right example below. In general, bilinear interpolation is preferred to nearest point sampling.

    -

    Figure: Nearest point sampling (left) vs. bilinear interpolation (right)

    -

    Nearest point sampling (left) vs. bilinear interpolation (right) Nearest point sampling (left) vs. bilinear interpolation (right)

    +

    Figure: Nearest point sampling (left) vs. bilinear interpolation (right)

    +

    Nearest point sampling (left) vs. bilinear interpolation (right) Nearest point sampling (left) vs. bilinear interpolation (right)

    Filtering for Minification

    Consider the checkerboard image texture in the following figure. If all fragments are surrounded by dark-gray texels, the textured primitive appears dark gray. If all fragments are surrounded by light-gray texels, the textured primitive appears light gray.

    -

    Figure: Minification problem

    -

    Minification problem

    +

    Figure: Minification problem

    +

    Minification problem

    Mipmapping

    -

    The filtering for minification process discussed above has a problem, because the texture is larger than the window space primitive and therefore many texels are not involved in texture filtering. The solution is to make the texture smaller, so that all texels are involved for texture filtering. The best case is that the window space primitive and the texture have the same size.

    -

    To make the texture smaller, it is repeatedly down-sampled to a quarter size, and the colors of 2x2 neighboring texels are averaged to determine the color of a texel in the quarter texture, as shown in the following figure. Given an original texture of 2lx2l resolution, a texture pyramid of (l + 1) levels is constructed, where the original texture is located at level 0. The pyramid is called a mipmap.

    +

    The filtering for minification process discussed above has a problem, because the texture is larger than the window space primitive and therefore many texels are not involved in texture filtering. The solution is to make the texture smaller, so that all texels are involved for texture filtering. The best case is that the window space primitive and the texture have the same size.

    +

    To make the texture smaller, it is repeatedly down-sampled to a quarter size, and the colors of 2x2 neighboring texels are averaged to determine the color of a texel in the quarter texture, as shown in the following figure. Given an original texture of 2lx2l resolution, a texture pyramid of (l + 1) levels is constructed, where the original texture is located at level 0. The pyramid is called a mipmap.

    -

    Figure: Mipmap generation process

    -

    Mipmap generation process Mipmap generation process

    +

    Figure: Mipmap generation process

    +

    Mipmap generation process Mipmap generation process

    Mipmap Generation in GL

    To automatically generate a mipmap, GL invokes the glGenerateMipmap() function, where the parameter can be, for example, GL_TEXTURE_2D or GL_TEXTURE_CUBE_MAP (textures in GL 2.0 come in 2 forms: 2D textures and cube map textures). Use GL_TEXTURE_2D for general image texturing.

    -

    Mipmapping for Minification

    -

    In any given a mipmap, you must decide which level you want to use for texture filtering. Observe that a pixel (fragment) covers an area on the screen. For simplicity, consider the area as a square so that the entire screen is tiled by an array of square pixels. Then, a pixel's projection onto the texture space is not a 'point', but an 'area' centered at (s',t'). The projected area is called the footprint of the pixel.

    +

    Mipmapping for Minification

    +

    In any given a mipmap, you must decide which level you want to use for texture filtering. Observe that a pixel (fragment) covers an area on the screen. For simplicity, consider the area as a square so that the entire screen is tiled by an array of square pixels. Then, a pixel's projection onto the texture space is not a 'point', but an 'area' centered at (s',t'). The projected area is called the footprint of the pixel.

    As a simple example, consider a footprint that covers m x m texels of the level-0 texture. Then, the GPU computes log2m, which is denoted by λ. In the following figure, λ = log23 ≈ 1.585. Consider then ⌊λ⌋ and ⌈λ⌉, which in this example are levels 1 and 2. You have 2 options:

      @@ -108,19 +108,19 @@
    • In contrast, you can do bilinear interpolation.
    -
  • Consider both ⌊λ⌋ and ⌈λ⌉ and then linearly interpolate the filtering results. Of course, each level can be filtered either by nearest point sampling or by bilinear interpolation. +
  • Consider both ⌊λ⌋ and ⌈λ⌉ and then linearly interpolate the filtering results. Of course, each level can be filtered either by nearest point sampling or by bilinear interpolation.

    For example: Take ⌊λ⌋ and ⌈λ⌉ and linearly interpolate the filtering results.

    • At each level, you can take the nearest point.
    • In contrast, you can do bilinear interpolation.

    • Note that the last case performs 3 levels of linear interpolations. It is called trilinear interpolation.

    -

    Figure: Selecting the mipmap levels

    -

    Selecting the mipmap levels

    +

    Figure: Selecting the mipmap levels

    +

    Selecting the mipmap levels

    There is of course a third option: not to do mipmapping but to use the original image (at level 0) instead. It can be filtered either by nearest point sampling or by bilinear interpolation. Therefore, minification has 6 varieties in total.

    -

    Texturing in GL

    +

    Texturing in GL

    When an image file is to be used as a texture, it is first loaded into the GL program. Then, you must take the following steps:

    @@ -129,7 +129,7 @@
  • Use the glBindTexture() function, where the first parameter specifies what the texture is used for as, for example, GL_TEXTURE_2D or GL_TEXTURE_CUBE_MAP.
  • After a texture object is generated and bound, the image data must be loaded using the glTexImage2D() function, where the first parameter is either GL_TEXTURE_2D or one of the cube-map faces, such as GL_TEXTURE_CUBE_MAP_POSITIVE_X, the second parameter specifies the mipmap level, and the eighth parameter can be, for example, GL_UNSIGNED_SHORT_4_4_4_4 or GL_UNSIGNED_SHORT_5_6_5.
  • The GPU itself makes a choice between minification and magnification, but allows you to select what kind of filtering to use in each case. For this purpose, invoke the glTexParameteri() function. If the second parameter (parameter name) is GL_TEXTURE_MAG_FILTER, the third parameter is either GL_NEAREST or GL_LINEAR. If the second parameter is GL_TEXTURE_MIN_FILTER, the third parameter is either GL_NEAREST_MIPMAP_NEAREST, GL_LINEAR_MIPMAP_NEAREST, GL_NEAREST_MIPMAP_LINEAR, GL_LINEAR_MIPMAP_LINEAR, GL_NEAREST, or GL_LINEAR. These 6 options are those presented in Mipmapping for Minification.
    • - +

    Texturing Example

    In order to generate a texture in GL, you usually have to decode the image file stored in the file system. In Tizen, you can use the Evas API (in mobile and wearable applications) to get the decoded bitmap buffer from the image file, as shown in the following example. The code creates an independent Ecore_Evas object, which contains Evas_Object. It provides a method to decode the designated image file and store the bitmap data into its own buffer. You can get the internal buffer pointer and then upload the buffer to the texture.

    @@ -144,56 +144,56 @@ unsigned int create_texture(Evas_Object *parent, const char *filename) { -    unsigned int gltex_object; -    int w; -    int h; -    int surface_w; -    int surface_h; -    evas_object_geometry_get(parent, NULL, NULL, &surface_w, &surface_h); + unsigned int gltex_object; + int w; + int h; + int surface_w; + int surface_h; + evas_object_geometry_get(parent, NULL, NULL, &surface_w, &surface_h); -    Evas_Object *inline_buffer = elm_win_add(parent, "Img Read", ELM_WIN_INLINED_IMAGE); -    evas_object_move(inline_buffer, 0, 0); -    evas_object_resize(inline_buffer, surface_w, surface_h); -    evas_object_show(inline_buffer); + Evas_Object *inline_buffer = elm_win_add(parent, "Img Read", ELM_WIN_INLINED_IMAGE); + evas_object_move(inline_buffer, 0, 0); + evas_object_resize(inline_buffer, surface_w, surface_h); + evas_object_show(inline_buffer); -    Evas *canvas = evas_object_evas_get(inline_buffer); -    Evas_Object *image = evas_object_image_add(canvas); + Evas *canvas = evas_object_evas_get(inline_buffer); + Evas_Object *image = evas_object_image_add(canvas); -    char path[200]; -    sprintf(path, "%s%s", app_get_resource_path(), filename); -    evas_object_image_file_set(image, path, NULL); -    evas_object_image_size_get(image, &w, &h); -    evas_object_image_fill_set(image, 0, 0, w, h); -    evas_object_image_filled_set(image, EINA_TRUE); -    evas_object_resize(image, w, h); -    evas_object_show(image); + char path[200]; + sprintf(path, "%s%s", app_get_resource_path(), filename); + evas_object_image_file_set(image, path, NULL); + evas_object_image_size_get(image, &w, &h); + evas_object_image_fill_set(image, 0, 0, w, h); + evas_object_image_filled_set(image, EINA_TRUE); + evas_object_resize(image, w, h); + evas_object_show(image); -    elm_win_render(inline_buffer); + elm_win_render(inline_buffer); -    GLubyte *pixels; -    pixels = (GLubyte *)evas_object_image_data_get(image, EINA_FALSE); + GLubyte *pixels; + pixels = (GLubyte *)evas_object_image_data_get(image, EINA_FALSE); -    glPixelStorei(GL_UNPACK_ALIGNMENT, 1); -    glGenTextures(1, &gltex_object); + glPixelStorei(GL_UNPACK_ALIGNMENT, 1); + glGenTextures(1, &gltex_object); -    glBindTexture(GL_TEXTURE_2D, gltex_object); + glBindTexture(GL_TEXTURE_2D, gltex_object); -    glTexImage2D(GL_TEXTURE_2D, 0, GL_BGRA_EXT, w, h, 0, GL_BGRA_EXT, -                 GL_UNSIGNED_BYTE, pixels); + glTexImage2D(GL_TEXTURE_2D, 0, GL_BGRA_EXT, w, h, 0, GL_BGRA_EXT, + GL_UNSIGNED_BYTE, pixels); -    glGenerateMipmap(GL_TEXTURE_2D); + glGenerateMipmap(GL_TEXTURE_2D); -    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); -    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR); + glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); + glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR); -    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); -    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); + glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); + glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); -    glBindTexture(GL_TEXTURE_2D, 0); + glBindTexture(GL_TEXTURE_2D, 0); -    evas_object_del(inline_buffer); + evas_object_del(inline_buffer); -    return gltex_object; + return gltex_object; } diff --git a/org.tizen.guides/html/native/graphics/vertex_shader_n.htm b/org.tizen.guides/html/native/graphics/vertex_shader_n.htm index 11b1846..8a95917 100644 --- a/org.tizen.guides/html/native/graphics/vertex_shader_n.htm +++ b/org.tizen.guides/html/native/graphics/vertex_shader_n.htm @@ -41,9 +41,9 @@
    -

    Vertex Shader

    - -

    The GPU rendering pipeline is split into programmable stages (vertex and fragment shaders) and hard-wired stages ("primitive assembler & rasterizer" and "output merger").

    +

    Vertex Shader

    + +

    The GPU rendering pipeline is split into programmable stages (vertex and fragment shaders) and hard-wired stages ("primitive assembler & rasterizer" and "output merger").

    Figure: Stages of the GPU rendering pipeline

    Stages of the GPU rendering pipeline

    @@ -56,7 +56,7 @@

    Object Space, World Space, and World Transform

    Whereas the coordinate system used for creating an object is named object space, the virtual world containing all required objects is associated with the world space. The size, position, and orientation of an object in the world space are determined by what is called world transform. (GL calls this model transform.) Its main components are scaling, translation, and rotation. A distinct object has its own world transform. The following figure shows a world-transform example.

    -

    In the world space, many objects can exist. Among them, consider a teapot. In this example, its world transform is the combination of "rotation about the Y axis by 90 degrees" and "translation along the X axis by 7 units".

    +

    In the world space, many objects can exist. Among them, consider a teapot. In this example, its world transform is the combination of "rotation about the Y axis by 90 degrees" and "translation along the X axis by 7 units".

    Figure: Transformation of a teapot object

    Transformation of a teapot object

    @@ -73,13 +73,13 @@

    Figure: Computing the view space

    Computing the view space

    -

    There are 2 coordinate systems, world space and view space. Note that a point is given different coordinates in different spaces. Suppose that, as shown in the following figure, AT is located at the teapot's mouth end (10,2,0) and EYE is at (18,8,0). Then, the teapot's mouth end has the view-space coordinates (0,0,-10) whereas its world-space coordinates are (10,2,0).

    -

    The red dot is on the end of the teapot's mouth. It has been taken as AT and so its u and v coordinates are 0. If EYE is located at (18,8,0), the distance between EYE and AT is 10 and so the red dot's n coordinate is -10.

    +

    There are 2 coordinate systems, world space and view space. Note that a point is given different coordinates in different spaces. Suppose that, as shown in the following figure, AT is located at the teapot's mouth end (10,2,0) and EYE is at (18,8,0). Then, the teapot's mouth end has the view-space coordinates (0,0,-10) whereas its world-space coordinates are (10,2,0).

    +

    The red dot is on the end of the teapot's mouth. It has been taken as AT and so its u and v coordinates are 0. If EYE is located at (18,8,0), the distance between EYE and AT is 10 and so the red dot's n coordinate is -10.

    Figure: Different coordinates in different spaces

    Different coordinates in different spaces

    -

    It becomes much easier to develop the rendering algorithms if all the world-space objects are newly defined in terms of the view space in the manner of the teapot's mouth end. This is done by the view transform, which is defined as a translation followed by a rotation. The following view matrix applies to all objects in the world space.

    +

    It becomes much easier to develop the rendering algorithms if all the world-space objects are newly defined in terms of the view space in the manner of the teapot's mouth end. This is done by the view transform, which is defined as a translation followed by a rotation. The following view matrix applies to all objects in the world space.

    Figure: View matrix

    View matrix

    @@ -90,9 +90,9 @@

    Because the world space is no longer needed, denote the basis of the view space by {x, y, z} instead of {u, v, n} simply because {x, y, z} is more familiar. In the view space, define how much of the space to see. For this, give 4 parameters:

    • fovy which stands for the field of view along the Y axis
      • -
    • aspect for the field of view's aspect ratio
      • -
    • n for the distance from EYE to the 'near clipping plane'
      • -
    • f for the distance from EYE to the 'far clipping plane'
      • +
    • aspect for the field of view's aspect ratio
      • +
    • n for the distance from EYE to the 'near clipping plane'
      • +
    • f for the distance from EYE to the 'far clipping plane'

    This set of 4 parameters defines a truncated pyramid whose apex is located at EYE, as shown in the following figure. It is called view frustum.

    @@ -119,7 +119,7 @@

    Figure: Input and output of the vertex shader

    Input and output of the vertex shader

    -

    The following code shows an example vertex shader. The shader language is C-like but provides specialized types. For example, mat4 is a 4x4 matrix and vec3 is a 3D vector. The following vertex shader example has 5 input values: viewProjMat and worldMat are 'uniforms' described by the keyword uniform, whereas position, normal, and texCoord are 'attributes' described by the keyword attribute.

    +

    The following code shows an example vertex shader. The shader language is C-like but provides specialized types. For example, mat4 is a 4x4 matrix and vec3 is a 3D vector. The following vertex shader example has 5 input values: viewProjMat and worldMat are 'uniforms' described by the keyword uniform, whereas position, normal, and texCoord are 'attributes' described by the keyword attribute.

     uniform mat4 viewProjMat; /* 4x4 matrix for view+projection transforms */
 uniform mat4 worldMat; /* 4x4 matrix for world transform */
@@ -134,9 +134,9 @@ varying vec2 v_texCoord;
 void
 main()
 {
-    gl_Position = viewProjMat * worldMat * vec4(position, 1.0);
-    v_normal = mat3(worldMat) * normal;
-    v_texCoord = texCoord;
+    gl_Position = viewProjMat * worldMat * vec4(position, 1.0);
+    v_normal = mat3(worldMat) * normal;
+    v_texCoord = texCoord;
 }

    The output of the vertex shader must include the built-in variable, gl_Position, which stores the clip-space vertex position. This is the only required output of the vertex shader. Optional output variables are described with the keyword varying. The output usually includes vertex normal and texture coordinates. In the above example, the object-space vertex normal is transformed to the world space and output to v_normal. On the other hand, the texture coordinates, texCoord, is simply copied to v_texCoord.

    @@ -148,7 +148,7 @@ main()
    1. Load its source code into the GL program.
    2. Create a new shader object using the glCreateShader() function, which takes either the GL_VERTEX_SHADER or GL_FRAGMENT_SHADER attribute and returns the ID of the shader object.
      3. -
    3. Store the source code into the shader object using the glShaderSource() function with the vertex or fragment shader's source code and the shader object ID.
      4. +
    4. Store the source code into the shader object using the glShaderSource() function with the vertex or fragment shader's source code and the shader object ID.
    5. Compile the shader object using the glCompileShader() function.

    Using the shader objects, create the program object:

    @@ -164,12 +164,12 @@ main()

    Consider a dynamic environment, where the scene objects continuously move. In the example vertex shader, worldMat must be updated per frame. On the other hand, viewProjMat must be updated if the eye moves. The GL program must update and provide them for the vertex shader. For this purpose, first find the uniform locations that have been determined during the link phase. Given a uniform name in the shader, the glGetUniformLocation() function returns its location (denoted by an integer) in the program.

     /* mProgram denotes the program object */
-GLint mWHandle = glGetUniformLocation(mProgram, "worldMat")
+GLint mWHandle = glGetUniformLocation(mProgram, "worldMat")

    Then, use the glUniformMatrix4fv() function to load the uniform with the updated matrix, worldMat. A list of functions for loading various uniforms is available and is collectively named glUniformXXX(), representing a set of variations including the glUniform3f() and glUniformMatrix4x3fv() functions.

    Next, consider the attributes.

    -

    The vertex and index arrays for a polygon mesh are stored in the CPU memory, which is often called client memory. For rendering a mesh, make a drawcall. For every drawcall, the arrays have to be 'copied' from the client memory to the GPU memory.

    +

    The vertex and index arrays for a polygon mesh are stored in the CPU memory, which is often called client memory. For rendering a mesh, make a drawcall. For every drawcall, the arrays have to be 'copied' from the client memory to the GPU memory.

    Instead of resending the arrays every time a mesh is drawn, a more efficient way is to cache the data in the GPU memory. The arrays are transferred only once, and the rendering is done from the GPU memory cache. To achieve this, use vertex buffer objects (VBO).

    There are 2 types of buffer objects in GL:

      @@ -187,17 +187,17 @@ GLint mWHandle = glGetUniformLocation(mProgram, "worldMat") 
       glGenBuffers(2, &VBO);
 glBindBuffer(GL_ARRAY_BUFFER, /* Target */
-             VBO[0]); /* Buffer */
+             VBO[0]); /* Buffer */
 glBufferData(GL_ARRAY_BUFFER, /* Target */
-             sizeof(vertices), /* Size */
-             vertices, /* Data */
-             GL_STATIC_DRAW); /* Usage */
+             sizeof(vertices), /* Size */
+             vertices, /* Data */
+             GL_STATIC_DRAW); /* Usage */
 
 glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, VBO[1]);
 glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices),
-             indices, GL_STATIC_DRAW));
+             indices, GL_STATIC_DRAW));
      -

      The vertex array is often described as an "array of structures", where a structure contains a set of attributes: position, normal, and texCoord in the example shader.

      +

      The vertex array is often described as an "array of structures", where a structure contains a set of attributes: position, normal, and texCoord in the example shader.

      Figure: Array of vertex structures

      Array of vertex structures

      @@ -209,9 +209,9 @@ int offset = 0; /* Position attribute */ glEnableVertexAttribArray(0); /* Position index = 0 */ glVertexAttribPointer(0, /* Index */ -                      3, /* Size */ -                      GL_FLOAT, /* Type */ -                      GL_FALSE, stride, (GLvoid*)offset); + 3, /* Size */ + GL_FLOAT, /* Type */ + GL_FALSE, stride, (GLvoid*)offset); offset += sizeof(vec3); /* For accessing normal */ glEnableVertexAttribArray(1); /* Normal index = 1 */ @@ -230,19 +230,19 @@ glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, stride, (GLvoid*)offset);
    • glDrawArrays() for non-indexed mesh representation
    • glDrawElements() for indexed mesh representation
    -

    Assuming that you have only the vertex array for the low-resolution sphere, the glDrawArrays() function is invoked. In the following example, the first parameter specifies what kind of primitives to render. Valid values include, for example, GL_POINTS, GL_LINES, GL_TRIANGLES, and GL_TRIANGLE_FAN. The second parameter specifies the starting index "in the vertex array". The last parameter specifies the number of vertices to be drawn.

    +

    Assuming that you have only the vertex array for the low-resolution sphere, the glDrawArrays() function is invoked. In the following example, the first parameter specifies what kind of primitives to render. Valid values include, for example, GL_POINTS, GL_LINES, GL_TRIANGLES, and GL_TRIANGLE_FAN. The second parameter specifies the starting index "in the vertex array". The last parameter specifies the number of vertices to be drawn.

     glDrawArrays(GL_TRIANGLES, /* Mode */
-             0, /* First */
-             144); /* Count */
+             0, /* First */
+             144); /* Count */
    -

    When you have both the vertex array and index array, the glDrawElements() function is invoked. The first parameter is the same as in the glDrawArrays() function. The second parameter specifies the number of elements "in the index array". The third parameter specifies the type of the values in the indices. It must be GL_UNSIGNED_BYTE or GL_UNSIGNED_SHORT. The last parameter points to the offset in bytes into the storage allocated by the glBufferData() function.

    +

    When you have both the vertex array and index array, the glDrawElements() function is invoked. The first parameter is the same as in the glDrawArrays() function. The second parameter specifies the number of elements "in the index array". The third parameter specifies the type of the values in the indices. It must be GL_UNSIGNED_BYTE or GL_UNSIGNED_SHORT. The last parameter points to the offset in bytes into the storage allocated by the glBufferData() function.

     glDrawElements(GL_TRIANGLES, /* Mode */
-               144, /* Count */
-               GL_UNSIGNED_SHORT, /* Type */
-               0); /* Indices */
+               144, /* Count */
+               GL_UNSIGNED_SHORT, /* Type */
+               0); /* Indices */
    @@ -254,79 +254,79 @@ glDrawElements(GL_TRIANGLES, /* Mode */ static void init_glview(Evas_Object *glview) { -    /* Set GL state color to black */ -    glClearColor(0.0f, 0.0f, 0.0f, 1.0f); + /* Set GL state color to black */ + glClearColor(0.0f, 0.0f, 0.0f, 1.0f); -    appdata_s *ad = (appdata_s *)evas_object_data_get(glview, "ad"); + appdata_s *ad = (appdata_s *)evas_object_data_get(glview, "ad"); -    if (!ad->initialized) { -        init_shader_program(ad); /* Compile and link shader */ -        create_vbo(ad); /* Create vertex buffer object */ -        ad->texture = create_texture(ad->win, "tizen_noalpha.png"); + if (!ad->initialized) { + init_shader_program(ad); /* Compile and link shader */ + create_vbo(ad); /* Create vertex buffer object */ + ad->texture = create_texture(ad->win, "tizen_noalpha.png"); -        glEnable(GL_DEPTH_TEST); -        ad->initialized = EINA_TRUE; -    } + glEnable(GL_DEPTH_TEST); + ad->initialized = EINA_TRUE; + } -    /* Initialize application variables */ + /* Initialize application variables */ } static void init_shader_program(appdata_s *ad) { -    const char *p; + const char *p; -    p = vertex_tex_shader; -    ad->vtx_shader = glCreateShader(GL_VERTEX_SHADER); -    glShaderSource(ad->vtx_shader, 1, &p, NULL); -    glCompileShader(ad->vtx_shader); + p = vertex_tex_shader; + ad->vtx_shader = glCreateShader(GL_VERTEX_SHADER); + glShaderSource(ad->vtx_shader, 1, &p, NULL); + glCompileShader(ad->vtx_shader); -    p = fragment_tex_shader; -    ad->fgmt_shader = glCreateShader(GL_FRAGMENT_SHADER); -    glShaderSource(ad->fgmt_shader, 1, &p, NULL); -    glCompileShader(ad->fgmt_shader); + p = fragment_tex_shader; + ad->fgmt_shader = glCreateShader(GL_FRAGMENT_SHADER); + glShaderSource(ad->fgmt_shader, 1, &p, NULL); + glCompileShader(ad->fgmt_shader); -    ad->program = glCreateProgram(); -    glAttachShader(ad->program, ad->vtx_shader); -    glAttachShader(ad->program, ad->fgmt_shader); + ad->program = glCreateProgram(); + glAttachShader(ad->program, ad->vtx_shader); + glAttachShader(ad->program, ad->fgmt_shader); -    glLinkProgram(ad->program); + glLinkProgram(ad->program); -    ad->idx_a_position = glGetAttribLocation(ad->program, "a_position"); -    ad->idx_a_tex = glGetAttribLocation(ad->program, "a_tex"); + ad->idx_a_position = glGetAttribLocation(ad->program, "a_position"); + ad->idx_a_tex = glGetAttribLocation(ad->program, "a_tex"); -    ad->idx_wvp = glGetUniformLocation(ad->program, "u_wvpMatrix"); -    ad->idx_tex = glGetUniformLocation(ad->program, "u_texSampler"); + ad->idx_wvp = glGetUniformLocation(ad->program, "u_wvpMatrix"); + ad->idx_tex = glGetUniformLocation(ad->program, "u_texSampler"); -    glUseProgram(ad->program); + glUseProgram(ad->program); } static void create_vbo(appdata_s *ad) { -    glGenBuffers(1, &ad->vbo_vertex); -    glGenBuffers(1, &ad->vbo_color); -    glGenBuffers(1, &ad->vbo_texture); - -    glBindBuffer(GL_ARRAY_BUFFER, ad->vbo_vertex); -    glBufferData(GL_ARRAY_BUFFER, sizeof(cube_vertices), cube_vertices, -                 GL_STATIC_DRAW); -    glVertexAttribPointer(ad->idx_a_position, 3, GL_FLOAT, GL_FALSE, -                          3 * sizeof(float), 0); - -    glBindBuffer(GL_ARRAY_BUFFER, ad->vbo_texture); -    glBufferData(GL_ARRAY_BUFFER, sizeof(cube_texs), cube_texs, -                 GL_STATIC_DRAW); -    glVertexAttribPointer(ad->idx_a_tex, 2, GL_FLOAT, GL_FALSE, -                          2 * sizeof(float), 0); - -    glEnableVertexAttribArray(ad->idx_a_position); -    glEnableVertexAttribArray(ad->idx_a_tex); - -    glGenBuffers(1, &ad->vbo_index); -    glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ad->vbo_index); -    glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(cube_indices), -                 cube_indices, GL_STATIC_DRAW); + glGenBuffers(1, &ad->vbo_vertex); + glGenBuffers(1, &ad->vbo_color); + glGenBuffers(1, &ad->vbo_texture); + + glBindBuffer(GL_ARRAY_BUFFER, ad->vbo_vertex); + glBufferData(GL_ARRAY_BUFFER, sizeof(cube_vertices), cube_vertices, + GL_STATIC_DRAW); + glVertexAttribPointer(ad->idx_a_position, 3, GL_FLOAT, GL_FALSE, + 3 * sizeof(float), 0); + + glBindBuffer(GL_ARRAY_BUFFER, ad->vbo_texture); + glBufferData(GL_ARRAY_BUFFER, sizeof(cube_texs), cube_texs, + GL_STATIC_DRAW); + glVertexAttribPointer(ad->idx_a_tex, 2, GL_FLOAT, GL_FALSE, + 2 * sizeof(float), 0); + + glEnableVertexAttribArray(ad->idx_a_position); + glEnableVertexAttribArray(ad->idx_a_tex); + + glGenBuffers(1, &ad->vbo_index); + glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ad->vbo_index); + glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(cube_indices), + cube_indices, GL_STATIC_DRAW); } @@ -336,37 +336,37 @@ create_vbo(appdata_s *ad) static void draw_glview(Evas_Object *glview) { -    appdata_s *ad = (appdata_s *)evas_object_data_get(glview, "ad"); -    float world[16], viewproj[16]; -    float aspect; + appdata_s *ad = (appdata_s *)evas_object_data_get(glview, "ad"); + float world[16], viewproj[16]; + float aspect; -    if (!ad) -        return; + if (!ad) + return; -    init_matrix(world); -    init_matrix(viewproj); + init_matrix(world); + init_matrix(viewproj); -    aspect = (float) ad->glview_w / (float) ad->glview_h; + aspect = (float) ad->glview_w / (float) ad->glview_h; -    /* View matrix is the identity matrix */ -    view_set_perspective(viewproj, 60.0f, aspect, 1.0f, 20.0f); + /* View matrix is the identity matrix */ + view_set_perspective(viewproj, 60.0f, aspect, 1.0f, 20.0f); -    translate_xyz(world, 0.0f, 0.0f, -2.5f); -    rotate_xyz(world, ad->xangle, ad->yangle, 0.0f); + translate_xyz(world, 0.0f, 0.0f, -2.5f); + rotate_xyz(world, ad->xangle, ad->yangle, 0.0f); -    multiply_matrix(ad->wvp, viewproj, world); + multiply_matrix(ad->wvp, viewproj, world); -    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); + glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); -    glUniformMatrix4fv(ad->idx_wvp, 1, GL_FALSE, ad->wvp); + glUniformMatrix4fv(ad->idx_wvp, 1, GL_FALSE, ad->wvp); -    glBindTexture(GL_TEXTURE_2D, ad->texture); -    glActiveTexture(GL_TEXTURE0); -    glUniform1i(ad->idx_tex, 0); + glBindTexture(GL_TEXTURE_2D, ad->texture); + glActiveTexture(GL_TEXTURE0); + glUniform1i(ad->idx_tex, 0); -    glDrawElements(GL_TRIANGLES, cube_indices_count, GL_UNSIGNED_SHORT, 0); + glDrawElements(GL_TRIANGLES, cube_indices_count, GL_UNSIGNED_SHORT, 0); -    glFlush(); + glFlush(); } diff --git a/org.tizen.guides/html/native/graphics/vulkan_n.htm b/org.tizen.guides/html/native/graphics/vulkan_n.htm index 5488f9a..39bbbe4 100644 --- a/org.tizen.guides/html/native/graphics/vulkan_n.htm +++ b/org.tizen.guides/html/native/graphics/vulkan_n.htm @@ -47,7 +47,7 @@

    SDL Graphics with Vulkan

    -

    Vulkan is a generation API for high-efficiency access to graphics and computing on modern GPUs. It is an open-standard, cross-platform API designed from the ground-up by industry experts collaborating under the Khronos consortium. It aims to address the inefficiencies of existing 3D APIs, such as OpenGL, which are designed for single-core processors and lag to map modern hardware. It provides a much lower-level fine-grained control over the GPU to maximize performance and achieve consistent user experience across different operating environments. For general information on Vulkan, and the comparative merits of Vulkan and OpenGL, see the official Khronos's Vulkan Web site and OpenGL vs. Vulkan.

    +

    Vulkan is a generation API for high-efficiency access to graphics and computing on modern GPUs. It is an open-standard, cross-platform API designed from the ground-up by industry experts collaborating under the Khronos consortium. It aims to address the inefficiencies of existing 3D APIs, such as OpenGL, which are designed for single-core processors and lag to map modern hardware. It provides a much lower-level fine-grained control over the GPU to maximize performance and achieve consistent user experience across different operating environments. For general information on Vulkan, and the comparative merits of Vulkan and OpenGL, see the official Khronos's Vulkan Web site and OpenGL vs. Vulkan.

    The Tizen platform supports the Vulkan API in order to provide the most cutting edge 3D programming tools for you to create high-quality games and real-time graphics in applications. Vulkan is especially recommended for performance- or latency-sensitive applications. With Vulkan, you can achieve a much smoother user experience by parallelizing the rendering job across multiple threads which can feed the GPU to the max. Applications demanding explicit control on work submission, synchronization, and less power consumption can seriously consider migrating to Vulkan as well. Tizen allows the use of the Vulkan API through SDL.

    Figure: Vulkan in Tizen

    @@ -57,14 +57,14 @@
    • Cross-platform -

      Vulkan is designed to run on a wide range of platforms and hardware with very different form factors and power envelopes. While OpenGL has the OpenGL ES variant for mobile and embedded systems and OpenGL for desktops, Vulkan provides a unified API that is completely identical across all these platforms. You simply link to the same library, with the same header and the same code on all targeted platforms, and the application runs everywhere. By not limiting itself to a subset of platforms, Vulkan enables you to "write once and run everywhere". This means that by targeting this API, you can achieve a large market share across both mobile and desktop devices.

      • +

      Vulkan is designed to run on a wide range of platforms and hardware with very different form factors and power envelopes. While OpenGL has the OpenGL ES variant for mobile and embedded systems and OpenGL for desktops, Vulkan provides a unified API that is completely identical across all these platforms. You simply link to the same library, with the same header and the same code on all targeted platforms, and the application runs everywhere. By not limiting itself to a subset of platforms, Vulkan enables you to "write once and run everywhere". This means that by targeting this API, you can achieve a large market share across both mobile and desktop devices.

    • Explicit control -

      Vulkan is an explicit API, and wants you to define "exactly what you want", rather than relying on hidden driver heuristics to do the right thing. Vulkan, by design, is a very low-level API that provides applications direct control over the GPU. Older higher-level APIs hide most of the costly operations, such as memory management and resource synchronization, denying you any control over them.

      -

      Vulkan attempts to turn as much of the problematic "implicitness" of older APIs as possible into "explicit" application choices. It provides a number of explicit mechanisms for many operations, such as memory allocation, synchronization, and work submission, allowing applications to be more expressive.

      • +

      Vulkan is an explicit API, and wants you to define "exactly what you want", rather than relying on hidden driver heuristics to do the right thing. Vulkan, by design, is a very low-level API that provides applications direct control over the GPU. Older higher-level APIs hide most of the costly operations, such as memory management and resource synchronization, denying you any control over them.

      +

      Vulkan attempts to turn as much of the problematic "implicitness" of older APIs as possible into "explicit" application choices. It provides a number of explicit mechanisms for many operations, such as memory allocation, synchronization, and work submission, allowing applications to be more expressive.

    • Multi-core friendly -

      Older APIs written in the single-core processor age do not do enough to take advantage of today's multi-core processors and thereby max out the single core by over-burdening the render thread with all heavy tasks, such as error checking, implicit resource tracking, synchronization, and state validation.

      +

      Older APIs written in the single-core processor age do not do enough to take advantage of today's multi-core processors and thereby max out the single core by over-burdening the render thread with all heavy tasks, such as error checking, implicit resource tracking, synchronization, and state validation.

      Vulkan provides tools and design choices to spread its workload across multiple threads. It achieves this by removing from the driver the thread-specific features, such as global data, access synchronization, thread safety, and order guarantee, and handing the responsibility to you. By carefully handling the threads and scaling across multiple threads on a device with more cores, you can distribute your workload across threads much better. This leads to better efficiency and better performance in applications that otherwise find themselves maxing out a single core.

    • High efficiency @@ -222,8 +222,8 @@ 
       bool vulkan_support;
 
-system_info_get_platform_bool("http://tizen.org/feature/vulkan.version.1_0",
-                              &vulkan_support);
+system_info_get_platform_bool("http://tizen.org/feature/vulkan.version.1_0",
+                              &vulkan_support);
    • To use the functions and data types of the Vulkan (in mobile and wearable applications) and SDL (in mobile and wearable applications) APIs, include the <SDL.h> and <vulkan/vulkan.h> header files in your application: @@ -241,8 +241,8 @@ system_info_get_platform_bool("http://tizen.org/feature/vulkan.version.1_0&
      1. Initialize SDL and create an SDL window. -

        Before using any other SDL functions, call the SDL_Init() function to properly initialize the SDL library and start each of its various subsystems. The function accepts as a parameter a set of allowed flags OR'd together.

        -

        After SDL is initialized successfully, create the SDL_Window instance using the SDL_CreateWindow() function. The parameters define the title of the window, the X and Y position coordinates, width, height, and a set of SDL_WindowFlags OR'd together.

        +

        Before using any other SDL functions, call the SDL_Init() function to properly initialize the SDL library and start each of its various subsystems. The function accepts as a parameter a set of allowed flags OR'd together.

        +

        After SDL is initialized successfully, create the SDL_Window instance using the SDL_CreateWindow() function. The parameters define the title of the window, the X and Y position coordinates, width, height, and a set of SDL_WindowFlags OR'd together.

        Note @@ -250,16 +250,16 @@ system_info_get_platform_bool("http://tizen.org/feature/vulkan.version.1_0&

        The SDL_main() function is mandatory for the Tizen framework to initialize the SDL application. You must use the SDL_main() function instead of the usual main() function in your SDL application.

        - + 
         int
 SDL_main(int argc, char *argv[])
 {
-    SDL_Init(SDL_INIT_VIDEO | SDL_INIT_EVENTS);
-    demo.sdl_window = SDL_CreateWindow("SDL Vulkan Sample", 0, 0, demo.sdl_mode.w,
-                                       demo.sdl_mode.h,
-                                       SDL_WINDOW_SHOWN | SDL_WINDOW_FULLSCREEN
-                                       | SDL_WINDOW_RESIZABLE | SDL_WINDOW_VULKAN);
+    SDL_Init(SDL_INIT_VIDEO | SDL_INIT_EVENTS);
+    demo.sdl_window = SDL_CreateWindow("SDL Vulkan Sample", 0, 0, demo.sdl_mode.w,
+                                       demo.sdl_mode.h,
+                                       SDL_WINDOW_SHOWN | SDL_WINDOW_FULLSCREEN
+                                       | SDL_WINDOW_RESIZABLE | SDL_WINDOW_VULKAN);
 }
        2. @@ -281,13 +281,13 @@ SDL_main(int argc, char *argv[]) 
         const VkApplicationInfo app = {
-    .sType = VK_STRUCTURE_TYPE_APPLICATION_INFO,
-    .pNext = NULL,
-    .pApplicationName = APP_SHORT_NAME,
-    .applicationVersion = 0,
-    .pEngineName = APP_SHORT_NAME,
-    .engineVersion = 0,
-    .apiVersion = VK_API_VERSION_1_0,
+    .sType = VK_STRUCTURE_TYPE_APPLICATION_INFO,
+    .pNext = NULL,
+    .pApplicationName = APP_SHORT_NAME,
+    .applicationVersion = 0,
+    .pEngineName = APP_SHORT_NAME,
+    .engineVersion = 0,
+    .apiVersion = VK_API_VERSION_1_0,
 };
        @@ -306,16 +306,16 @@ const VkApplicationInfo app = { 
         SDL_Vulkan_GetInstanceExtensions(demo->sdl_window,
-                                 &(demo->enabled_extension_count),
-                                 demo->extension_names);
+                                 &(demo->enabled_extension_count),
+                                 demo->extension_names);
 VkInstanceCreateInfo inst_info = {
-    .sType = VK_STRUCTURE_TYPE_INSTANCE_CREATE_INFO,
-    .pNext = NULL,
-    .pApplicationInfo = &app,
-    .enabledLayerCount = demo->enabled_layer_count,
-    .ppEnabledLayerNames = (const char *const *)instance_validation_layers,
-    .enabledExtensionCount = demo->enabled_extension_count,
-    .ppEnabledExtensionNames = (const char *const *) demo->extension_names,
+    .sType = VK_STRUCTURE_TYPE_INSTANCE_CREATE_INFO,
+    .pNext = NULL,
+    .pApplicationInfo = &app,
+    .enabledLayerCount = demo->enabled_layer_count,
+    .ppEnabledLayerNames = (const char *const *)instance_validation_layers,
+    .enabledExtensionCount = demo->enabled_extension_count,
+    .ppEnabledExtensionNames = (const char *const *) demo->extension_names,
 };
        @@ -345,13 +345,13 @@ demo->gpu = physical_devices[0];
      2. Check for supported queue families. -

        Almost every operation in Vulkan, from drawing to uploading textures, requires commands to be submitted to a "queue". There are different types of queues that originate from different queue families, and each queue family allows only a subset of commands. You need to check which queue families are supported by the device and which one of them supports the commands that you want to use. The following example looks for a queue that supports graphics commands:

        +

        Almost every operation in Vulkan, from drawing to uploading textures, requires commands to be submitted to a "queue". There are different types of queues that originate from different queue families, and each queue family allows only a subset of commands. You need to check which queue families are supported by the device and which one of them supports the commands that you want to use. The following example looks for a queue that supports graphics commands:

        1. Check which queue families are supported by the device with the vkGetPhysicalDeviceQueueFamilyProperties() function: 
           VkQueueFamilyProperties *queue_props;
 vkGetPhysicalDeviceQueueFamilyProperties(demo->gpu, &demo->queue_count,
-                                         demo->queue_props);
+                                         demo->queue_props);
 assert(demo->queue_count >= 1);
 
 VkPhysicalDeviceFeatures features;
@@ -362,10 +362,10 @@ vkGetPhysicalDeviceFeatures(demo->gpu, &features);
 
           uint32_t graphicsQueueNodeIndex = UINT32_MAX;
 for (i = 0; i < demo->queue_count; i++) {
-    if ((demo->queue_props[i].queueFlags & VK_QUEUE_GRAPHICS_BIT) != 0) {
-        if (graphicsQueueNodeIndex == UINT32_MAX)
-            graphicsQueueNodeIndex = i;
-    }
+    if ((demo->queue_props[i].queueFlags & VK_QUEUE_GRAPHICS_BIT) != 0) {
+        if (graphicsQueueNodeIndex == UINT32_MAX)
+            graphicsQueueNodeIndex = i;
+    }
 }
 demo->graphics_queue_node_index = graphicsQueueNodeIndex;
 
          
@@ -388,11 +388,11 @@ VkDevice device;
 
           float queue_priorities[1] = {0.0};
 const VkDeviceQueueCreateInfo queue = {
-    .sType = VK_STRUCTURE_TYPE_DEVICE_QUEUE_CREATE_INFO,
-    .pNext = NULL,
-    .queueFamilyIndex = demo->graphics_queue_node_index,
-    .queueCount = 1,
-    .pQueuePriorities = queue_priorities
+    .sType = VK_STRUCTURE_TYPE_DEVICE_QUEUE_CREATE_INFO,
+    .pNext = NULL,
+    .queueFamilyIndex = demo->graphics_queue_node_index,
+    .queueCount = 1,
+    .pQueuePriorities = queue_priorities
 };
          2. @@ -400,17 +400,17 @@ const VkDeviceQueueCreateInfo queue = {

          First add pointers to the queue creation info and device features structs. The remainder of the information requires you to specify device-specific extensions and validation layers. An example of a device-specific extension is VK_KHR_swapchain, which allows you to present rendered images from that device to windows. The following example enables the same validation layers for devices as before for the instance. It requires no device-specific extensions.

           VkDeviceCreateInfo device = {
-    .sType = VK_STRUCTURE_TYPE_DEVICE_CREATE_INFO,
-    .pNext = NULL,
-    .queueCreateInfoCount = 1,
-    .pQueueCreateInfos = &queue,
-    .enabledLayerCount = demo->enabled_layer_count,
-    .ppEnabledLayerNames =
-        (const char *const *)((demo->validate) ?
-                              demo->device_validation_layers : NULL),
-    .enabledExtensionCount = demo->enabled_extension_count,
-    .ppEnabledExtensionNames = (const char *const *)demo->extension_names,
-    .pEnabledFeatures = NULL
+    .sType = VK_STRUCTURE_TYPE_DEVICE_CREATE_INFO,
+    .pNext = NULL,
+    .queueCreateInfoCount = 1,
+    .pQueueCreateInfos = &queue,
+    .enabledLayerCount = demo->enabled_layer_count,
+    .ppEnabledLayerNames =
+        (const char *const *)((demo->validate) ?
+                              demo->device_validation_layers : NULL),
+    .enabledExtensionCount = demo->enabled_extension_count,
+    .ppEnabledExtensionNames = (const char *const *)demo->extension_names,
+    .pEnabledFeatures = NULL
 };
          @@ -443,7 +443,7 @@ VkSurfaceKHR surface; It simply passes through the VkResult from the relevant platform call. 

           SDL_Vulkan_CreateSurface(demo->sdl_window, (SDL_vulkanInstance)demo->inst,
-                         (SDL_vulkanSurface*)&demo->surface);
+                         (SDL_vulkanSurface*)&demo->surface);
        3. @@ -454,7 +454,7 @@ SDL_Vulkan_CreateSurface(demo->sdl_window, (SDL_vulkanInstance)demo->inst,
      3. Look for a queue family that has the capability of presenting to your window surface, by using the vkGetPhysicalDeviceSurfaceSupportKHR() function, which takes the physical device, queue family index, and surface as parameters. Then simply check the value of the boolean and store the presentation family queue index. Note that it is very likely that it ends up being the same queue family as previously selected for the physical device, so the example adds logic to explicitly prefer a physical device that supports drawing and presentation in the same queue for improved performance: 
         demo->fpGetPhysicalDeviceSurfaceSupportKHR(demo->gpu, i, demo->surface,
-                                           &supportsPresent[i]);
+                                           &supportsPresent[i]);
 demo->graphics_queue_node_index = graphicsQueueNodeIndex;
        4. @@ -474,20 +474,20 @@ vkGetDeviceQueue(demo->device, demo->graphics_queue_node_index, 0, &de static void demo_prepare(struct demo *demo) { -    demo_prepare_buffers(demo); -    demo_prepare_depth(demo); -    demo_prepare_textures(demo); -    demo_prepare_vertices(demo); -    demo_prepare_descriptor_layout(demo); -    demo_prepare_render_pass(demo); -    demo_prepare_pipeline(demo); + demo_prepare_buffers(demo); + demo_prepare_depth(demo); + demo_prepare_textures(demo); + demo_prepare_vertices(demo); + demo_prepare_descriptor_layout(demo); + demo_prepare_render_pass(demo); + demo_prepare_pipeline(demo); -    demo_prepare_descriptor_pool(demo); -    demo_prepare_descriptor_set(demo); + demo_prepare_descriptor_pool(demo); + demo_prepare_descriptor_set(demo); -    demo_prepare_framebuffers(demo); + demo_prepare_framebuffers(demo); -    demo->prepared = true; + demo->prepared = true; } @@ -495,14 +495,14 @@ demo_prepare(struct demo *demo)

        Now you are set to perform continuous rendering from the application main loop. Initiate the main loop and call the rendering routine as well as start polling for user input events:

         while(1) {
-    while (SDL_PollEvent(&event)) {
-        printf("SDL Event type :: %d\n", event.type);
-        if (event.type == SDL_MOUSEBUTTONDOWN)
-            printf("SDL_MOUSEBUTTONDOWN Event!!\n");
-        if (event.type == SDL_MOUSEMOTION)
-            printf("SDL_MOUSEMOTION Event!!\n");
-    }
-    demo_run(&demo);
+    while (SDL_PollEvent(&event)) {
+        printf("SDL Event type :: %d\n", event.type);
+        if (event.type == SDL_MOUSEBUTTONDOWN)
+            printf("SDL_MOUSEBUTTONDOWN Event!!\n");
+        if (event.type == SDL_MOUSEMOTION)
+            printf("SDL_MOUSEMOTION Event!!\n");
+    }
+    demo_run(&demo);
 }
        @@ -525,13 +525,13 @@ SDL_Quit(); void updateApp(appdata_s* ad) { -    /* SDL_Event is a union containing structures for different event types */ -    SDL_Event event; -    while (SDL_PollEvent(&event)) { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, -                    "[SDL] Event type: %x\n", event.type); -        handleEvent(&ad, &event); -    } + /* SDL_Event is a union containing structures for different event types */ + SDL_Event event; + while (SDL_PollEvent(&event)) { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, + "[SDL] Event type: %x\n", event.type); + handleEvent(&ad, &event); + } } @@ -543,59 +543,59 @@ updateApp(appdata_s* ad) void handleEvent(appdata_s** data, SDL_Event* event) { -    appdata_s* ad = *data; - -    switch (event->type) { -    case SDL_QUIT: -    { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Finish main loop "); -        ad->game_exit = 1; -        break; -    } -    case SDL_KEYUP: -    { -        char* scancodename = (char *)SDL_GetScancodeName(event->key.keysym.scancode); -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, -                    "[SDL] keyboard scancode: %s", scancodename); -        if (event->key.keysym.scancode == SDL_SCANCODE_AC_BACK) { -            SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Finish main loop "); -            ad->game_exit = 1; -        } -        break; -    } -    case SDL_MOUSEBUTTONDOWN: -    { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL]Mouse Down: %d x %d", -                    event->button.x, event->button.y); -        break; -    } -    case SDL_MOUSEBUTTONUP: -    { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL]Mouse Up: %d x %d", -                    event->button.x, event->button.y); -        break; -    } -    case SDL_MOUSEMOTION: -    { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL]Mouse Motion: %d x %d", -                    event->motion.x, event->motion.y); -        break; -    } -    case SDL_ROTATEEVENT: -    { -        ad->window_rotation = (int)event->user.data1; -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Rotation degree: %d", -                    ad->window_rotation); -        break; -    } -    case SDL_WINDOWEVENT: -    { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "SDL_WINDOWEVENT Event!!"); -        if (event->window.event == SDL_WINDOWEVENT_SIZE_CHANGED) -            SDL_Log("SDL_WINDOWEVENT_SIZE_CHANGED!!!"); -        break; -    } -    } /* End switch */ + appdata_s* ad = *data; + + switch (event->type) { + case SDL_QUIT: + { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Finish main loop "); + ad->game_exit = 1; + break; + } + case SDL_KEYUP: + { + char* scancodename = (char *)SDL_GetScancodeName(event->key.keysym.scancode); + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, + "[SDL] keyboard scancode: %s", scancodename); + if (event->key.keysym.scancode == SDL_SCANCODE_AC_BACK) { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Finish main loop "); + ad->game_exit = 1; + } + break; + } + case SDL_MOUSEBUTTONDOWN: + { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL]Mouse Down: %d x %d", + event->button.x, event->button.y); + break; + } + case SDL_MOUSEBUTTONUP: + { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL]Mouse Up: %d x %d", + event->button.x, event->button.y); + break; + } + case SDL_MOUSEMOTION: + { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL]Mouse Motion: %d x %d", + event->motion.x, event->motion.y); + break; + } + case SDL_ROTATEEVENT: + { + ad->window_rotation = (int)event->user.data1; + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Rotation degree: %d", + ad->window_rotation); + break; + } + case SDL_WINDOWEVENT: + { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "SDL_WINDOWEVENT Event!!"); + if (event->window.event == SDL_WINDOWEVENT_SIZE_CHANGED) + SDL_Log("SDL_WINDOWEVENT_SIZE_CHANGED!!!"); + break; + } + } /* End switch */ } @@ -609,7 +609,7 @@ handleEvent(appdata_s** data, SDL_Event* event)
      4. SDL_APP_CONTROL

        This event is invoked when the application is launched with some parameters. In Tizen, this event is called in the _tizen_sdl_control() function.

        -

        The application framework calls the application's application control callback just after the application enters the main loop. This callback is passed to the app_control instance containing the reason why the application was launched. For example, the application can be launched to open a file to handle the request that has been sent by another application. In any case, the application is responsible for checking the app_control content and responding appropriately. The app_control content can be empty, if the application is launched from the launcher.

        +

        The application framework calls the application's application control callback just after the application enters the main loop. This callback is passed to the app_control instance containing the reason why the application was launched. For example, the application can be launched to open a file to handle the request that has been sent by another application. In any case, the application is responsible for checking the app_control content and responding appropriately. The app_control content can be empty, if the application is launched from the launcher.

        In SDL, SDL_APP_CONTROL has been defined as a new SDL_Event event type for the application control. After the application enters the main loop, SDL sends the SDL_APP_CONTROL event to the application. This means that the application can confirm the SDL_Event in the event loop. The event is defined as an SDL_UserEvent, which is in the user member of the SDL_Event union.

        The user structure contains data1 (app_control) and data2 (user_data).

        @@ -619,19 +619,19 @@ handleEvent(appdata_s** data, SDL_Event* event) #include <app.h> case SDL_APP_CONTROL: -    app_control_h app_control = event.user.data1; -    void *user_data = event.user.data2; - -    char *operation; -    char *uri; - -    app_control_get_operation(app_control, &operation); -    if (!strcmp(operation, APP_CONTROL_OPERATION_VIEW)) { -        app_control_get_uri(app_control, &uri); -        app_control_get_extra_data(app_control, "action", &action); -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "Get path: [%s], action: [%s]", -                    uri, action); -    } + app_control_h app_control = event.user.data1; + void *user_data = event.user.data2; + + char *operation; + char *uri; + + app_control_get_operation(app_control, &operation); + if (!strcmp(operation, APP_CONTROL_OPERATION_VIEW)) { + app_control_get_uri(app_control, &uri); + app_control_get_extra_data(app_control, "action", &action); + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "Get path: [%s], action: [%s]", + uri, action); + } break;
        5. @@ -644,22 +644,22 @@ break; case SDL_APP_LOWBATTERY: { -    SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] SDL_APP_LOWBATTERY "); - -    app_event_info_h event_info = event->user.data1; -    void *user_data = event->user.data2; - -    app_event_low_battery_status_e status; -    int ret = app_event_get_low_battery_status(event_info, &status); -    if (ret == APP_ERROR_NONE) { -        if (status == APP_EVENT_LOW_BATTERY_POWER_OFF) -            SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, -                        "[SDL] The battery status is under 1% "); -        else if (status == APP_EVENT_LOW_BATTERY_CRITICAL_LOW) -            SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, -                        "[SDL] The battery status is under 5% "); -    } -    break; + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] SDL_APP_LOWBATTERY "); + + app_event_info_h event_info = event->user.data1; + void *user_data = event->user.data2; + + app_event_low_battery_status_e status; + int ret = app_event_get_low_battery_status(event_info, &status); + if (ret == APP_ERROR_NONE) { + if (status == APP_EVENT_LOW_BATTERY_POWER_OFF) + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, + "[SDL] The battery status is under 1% "); + else if (status == APP_EVENT_LOW_BATTERY_CRITICAL_LOW) + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, + "[SDL] The battery status is under 5% "); + } + break; } @@ -671,22 +671,22 @@ case SDL_APP_LOWBATTERY: case SDL_APP_LANGUAGE_CHANGED: { -    SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] SDL_APP_LANGUAGE_CHANGED "); - -    app_event_info_h event_info = event->user.data1; -    void *user_data = event->user.data2; - -    char *language; -    int ret = app_event_get_language(event_info, &language); -    if (ret != APP_ERROR_NONE) -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, -                    "[SDL] app_event_get_language failed. Err = %d ", ret); - -    if (language != NULL) { -        SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] language: ", language); -        free(language); -    } -    break; + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] SDL_APP_LANGUAGE_CHANGED "); + + app_event_info_h event_info = event->user.data1; + void *user_data = event->user.data2; + + char *language; + int ret = app_event_get_language(event_info, &language); + if (ret != APP_ERROR_NONE) + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, + "[SDL] app_event_get_language failed. Err = %d ", ret); + + if (language != NULL) { + SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] language: ", language); + free(language); + } + break; } @@ -716,14 +716,14 @@ case SDL_APP_LANGUAGE_CHANGED: 
        -SDL_SetHint(SDL_HINT_ORIENTATIONS, "Portrait LandscapeLeft LandscapeRight");
+SDL_SetHint(SDL_HINT_ORIENTATIONS, "Portrait LandscapeLeft LandscapeRight");
 
 case SDL_ROTATEEVENT:
 {
-    ad->window_rotation = (int)event->user.data1;
-    SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Rotation degree: %d",
-                ad->window_rotation);
-    break;
+    ad->window_rotation = (int)event->user.data1;
+    SDL_LogInfo(SDL_LOG_CATEGORY_APPLICATION, "[SDL] Rotation degree: %d",
+                ad->window_rotation);
+    break;
 }
        diff --git a/org.tizen.guides/html/native/guides_n.htm b/org.tizen.guides/html/native/guides_n.htm index 2ec6796..740bcaa 100644 --- a/org.tizen.guides/html/native/guides_n.htm +++ b/org.tizen.guides/html/native/guides_n.htm @@ -5,13 +5,13 @@ - + - Tizen Native Guides + Tizen Native Guides @@ -32,7 +32,7 @@
      5. API Reference for Wearable Native
    -
    +

    Tizen
    @@ -40,7 +40,7 @@

    Tizen native guides introduce various features for native applications. The features are supported in the native API, and you can use them in creating Tizen applications.

    - +
    Note If you have an application based on the Tizen 2.3, use the Migration Guide to make it conform to Tizen 2.4 Application Framework APIs. @@ -117,7 +117,7 @@

    The performance features define how you can use tracepoints. You can generate traces and visualize them to help you to optimize your application performance.

    - +

    diff --git a/org.tizen.guides/html/native/internationalization/i18n_n.htm b/org.tizen.guides/html/native/internationalization/i18n_n.htm index 259d6ab..423f748 100644 --- a/org.tizen.guides/html/native/internationalization/i18n_n.htm +++ b/org.tizen.guides/html/native/internationalization/i18n_n.htm @@ -5,13 +5,13 @@ - + - i18n + i18n @@ -20,13 +20,13 @@

    Mobile native Wearable native

    - +

    Dependencies

    • Tizen 2.4 and Higher for Mobile
    • Tizen 2.3.1 and Higher for Wearable
      • -
    +

    Content

    Related Info

    -
    +
    @@ -74,7 +74,7 @@

    With Unormalization, you can perform standard unicode normalization.

  • Managing the calendar and dates -

    With Udatepg, you can generate date format patterns, such as "yy-MM-dd". You can also handle various conversions: you can convert between a Udate object and a set of integer fields with Ucalendar, and you can convert dates and times from their internal representations to textual form and back with Udate.

    +

    With Udatepg, you can generate date format patterns, such as "yy-MM-dd". You can also handle various conversions: you can convert between a Udate object and a set of integer fields with Ucalendar, and you can convert dates and times from their internal representations to textual form and back with Udate.

  • Managing numbers

    You can format and parse numbers for any locale with Unumber.

    @@ -103,40 +103,40 @@

    The types of Ucalendar interpret a Udate according to the rules of a specific calendar system, such as the gregorian or traditional system.

    A Ucalendar object can produce all the time field values needed to implement the date-time formatting for a particular language and calendar style (for example, Japanese-Gregorian, Japanese-Traditional).

    -

    When computing a Udate from the time fields, 2 special circumstances can arise. The information can be insufficient to compute the Udate (you have only the year and the month, but not the day of the month), or the information can be inconsistent (such as "Tuesday, July 15, 1996" even though July 15, 1996 is actually a Monday).

    +

    When computing a Udate from the time fields, 2 special circumstances can arise. The information can be insufficient to compute the Udate (you have only the year and the month, but not the day of the month), or the information can be inconsistent (such as "Tuesday, July 15, 1996" even though July 15, 1996 is actually a Monday).

    • Insufficient information

      The calendar uses the default information to specify the missing fields. This can vary by calendar: for the Gregorian calendar, the default for a field is the same as that of the start of the epoch, such as I18N_UCALENDAR_YEAR = 1970, I18N_UCALENDAR_MONTH = JANUARY, I18N_UCALENDAR_DATE = 1.

    • Inconsistent information

      If the fields conflict, the calendar prefers the most recently set fields. For example, when determining the day, the calendar looks for one of the following field combinations listed in the following table. The most recent combination, as determined by the most recently set single field, is used.

      • -
    +

    Table: Combinations of the calendar fields to determine the day

    - - - - - + + + + + - - + +
    Combinations of the calendar fields
    Combinations of the calendar fields
    I18N_UCALENDAR_MONTH + I18N_UCALENDAR_DAY_OF_MONTH

    I18N_UCALENDAR_MONTH + I18N_UCALENDAR_WEEK_OF_MONTH + I18N_UCALENDAR_DAY_OF_WEEK

    I18N_UCALENDAR_MONTH + I18N_UCALENDAR_DAY_OF_WEEK_IN_MONTH + I18N_UCALENDAR_DAY_OF_WEEK

    I18N_UCALENDAR_DAY_OF_YEAR

    I18N_UCALENDAR_DAY_OF_WEEK + I18N_UCALENDAR_WEEK_OF_YEAR

    For the time of day:

    -

    Table: Combinations of calendar fields to determine the time of the day

    - - - - - - +

    Table: Combinations of calendar fields to determine the time of the day

    +
    Combinations of the calendar fields
    + + + + + - - -
    Combinations of the calendar fields
    I18N_UCALENDAR_HOUR_OF_DAY

    I18N_UCALENDAR_AM_PM + I18N_UCALENDAR_HOUR

    + + +
    Note @@ -150,8 +150,8 @@

    The following table describes the details of script codes that you can get using the i18n_uchar_get_int_property_value() function. -

    -

    Table: Script codes

    +

    +

    Table: Script codes

    @@ -282,24 +282,24 @@

    Locale-sensitive Operations with Ulocale

    -

    The Ulocale API (in mobile and wearable applications) represents a specific geographical, political, or cultural region. Locale-sensitive operations use the Ulocale functions to tailor information for the user. For example, displaying a number is a locale-sensitive operation. The number must be formatted according to the customs and conventions of the user's native country, region, or culture. +

    The Ulocale API (in mobile and wearable applications) represents a specific geographical, political, or cultural region. Locale-sensitive operations use the Ulocale functions to tailor information for the user. For example, displaying a number is a locale-sensitive operation. The number must be formatted according to the customs and conventions of the user's native country, region, or culture.

    You create a locale with one of the options listed below. Each component is separated by an underscore in the locale string:

    - -

    Table: Options for creating a locale

    -
    - - - - - + +

    Table: Options for creating a locale

    +
    Options for creating a locale
    + + + + +
    Options for creating a locale
    newLanguage

    newLanguage + newCountry

    newLanguage + newCountry + newVariant
    - +

    The first option is a valid ISO Language Code. These codes are the lower-case 2-letter codes as defined by the ISO-639 standard.

    The second option includes an additional ISO Country Code. @@ -331,7 +331,7 @@

    Pattern Syntax

    Patterns are accepted by the i18n_uset_create_pattern(), i18n_uset_create_pattern_options(), and i18n_uset_apply_pattern() functions and returned by the i18n_uset_to_pattern() function. The patterns follow a syntax similar to that employed by version 8 regular expression character classes.

    -

    Table: Examples of simple pattern syntaxes

    +

    Table: Examples of simple pattern syntaxes

    @@ -344,15 +344,15 @@ - + - + - + @@ -360,21 +360,21 @@ - + - +
    [a]Character 'a'Character 'a'
    [ae]Characters 'a' and 'e'Characters 'a' and 'e'
    [a-e]Characters 'a' through 'e' inclusive, in Unicode code point orderCharacters 'a' through 'e' inclusive, in Unicode code point order
    [\u4E01]
    [a{ab}{ac}]Character 'a' and the multicharacter strings 'ab' and 'ac'Character 'a' and the multicharacter strings 'ab' and 'ac'
    [\p{Lu}]All characters in the general category 'uppercase letter'All characters in the general category 'uppercase letter'

    Any character can be preceded by a backslash in order to remove any special meaning. Whitespace characters are ignored, unless they are escaped.

    Property patterns specify a set of characters having a certain property as defined by the Unicode standard. Both the POSIX-like [:Lu:] and the Perl-like syntax \\p{Lu} are recognized.

    -

    Patterns specify individual characters, ranges of characters, and Unicode property sets. When the elements are concatenated, they specify their union. To complement a set, place a '^' immediately after the opening '['. Property patterns are inverted by modifying their delimiters, [:^foo] and \\P{foo}. In any other location, '^' has no special meaning.

    -

    Ranges are indicated by placing a '-' between 2 characters, as in "a-z". This specifies the range of all characters from the left to the right, in Unicode order. If the left character is greater than or equal to the right character, it is a syntax error. If a '-' occurs as the first character after the opening '[' or '[^', or if it occurs as the last character before the closing ']', it is taken as a literal. This means that [a\-b], [-ab], and [ab-] all indicate the same set of 3 characters, 'a', 'b', and '-'.

    -

    Sets can be intersected using the '&' operator or the asymmetric set difference can be taken using the '-' operator. For example, [[:L:]&[\\u0000-\\u0FFF]] indicates the set of all Unicode letters with values less than 4096. Operators ('&' and '|') have equal precedence and bind left-to-right. This means that [[:L:]-[a-z]-[\\u0100-\\u01FF]] is equivalent to [[[:L:]-[a-z]]-[\\u0100-\\u01FF]]. This only really matters for difference; intersection is commutative.

    +

    Patterns specify individual characters, ranges of characters, and Unicode property sets. When the elements are concatenated, they specify their union. To complement a set, place a '^' immediately after the opening '['. Property patterns are inverted by modifying their delimiters, [:^foo] and \\P{foo}. In any other location, '^' has no special meaning.

    +

    Ranges are indicated by placing a '-' between 2 characters, as in "a-z". This specifies the range of all characters from the left to the right, in Unicode order. If the left character is greater than or equal to the right character, it is a syntax error. If a '-' occurs as the first character after the opening '[' or '[^', or if it occurs as the last character before the closing ']', it is taken as a literal. This means that [a\-b], [-ab], and [ab-] all indicate the same set of 3 characters, 'a', 'b', and '-'.

    +

    Sets can be intersected using the '&' operator or the asymmetric set difference can be taken using the '-' operator. For example, [[:L:]&[\\u0000-\\u0FFF]] indicates the set of all Unicode letters with values less than 4096. Operators ('&' and '|') have equal precedence and bind left-to-right. This means that [[:L:]-[a-z]-[\\u0100-\\u01FF]] is equivalent to [[[:L:]-[a-z]]-[\\u0100-\\u01FF]]. This only really matters for difference; intersection is commutative.

    -

    Table: Examples of set syntaxes

    +

    Table: Examples of set syntaxes

    @@ -383,15 +383,15 @@ - + - + - + @@ -415,10 +415,10 @@
    [a]Set containing 'a'Set containing 'a'
    [a-z]Set containing 'a' through 'z' and all letters in between, in Unicode orderSet containing 'a' through 'z' and all letters in between, in Unicode order
    [^a-z]Set containing all characters but 'a' through 'z', that is, U+0000 through 'a'-1 and 'z'+1 through U+10FFFFSet containing all characters but 'a' through 'z', that is, U+0000 through 'a'-1 and 'z'+1 through U+10FFFF
    [[pat1][pat2]]
    - +
    Note - You cannot add an empty string ("") to a set. + You cannot add an empty string ("") to a set.
    @@ -426,7 +426,7 @@

    The following table provide examples of formal syntax patterns.

    -

    Table: Formal syntax patterns

    +

    Table: Formal syntax patterns

    @@ -435,11 +435,11 @@ - + - + @@ -447,15 +447,15 @@ - + - + - + @@ -478,7 +478,7 @@ - + @@ -491,10 +491,10 @@

    The i18n uses 16-bit Unicode (UTF-16) in the form of arrays of i18n_uchar code units. UTF-16 encodes each Unicode code point with either 1 or 2 i18n_uchar code units. This is the default form of Unicode, and a forward-compatible extension of the original, fixed-width form that was known as UCS-2. UTF-16 superseded UCS-2 with Unicode 2.0 in 1996.

    The i18n also handles 16-bit Unicode text with unpaired surrogates. Such text is not well-formed UTF-16. Code-point-related functions treat unpaired surrogates as surrogate code points, such as separate units.

    Although UTF-16 is a variable-width encoding form, such as some legacy multi-byte encodings, it is much more efficient even for random access because the code unit values for single-unit characters versus lead units versus trail units are completely disjoint. This means that it is easy to determine character (code point) boundaries from random offsets in the string.

    -

    Unicode (UTF-16) string processing is optimized for the single-unit case. Although it is important to support supplementary characters, which use pairs of lead/trail code units called "surrogates", their occurrence is rare. Almost all characters in modern use require only a single i18n_uchar code unit (such as their code point values are <=0xffff).

    +

    Unicode (UTF-16) string processing is optimized for the single-unit case. Although it is important to support supplementary characters, which use pairs of lead/trail code units called "surrogates", their occurrence is rare. Almost all characters in modern use require only a single i18n_uchar code unit (such as their code point values are <=0xffff).

    Character Set Mapping Tables

    -

    The i18n API provides a character set conversion with mapping tables for a number of important codepages. The default tables are a subset of IBM's CDRA conversion table repository. ICU's Converter Explorer shows aliases and codepage charts for the default tables that are built into a standard ICU distribution.

    +

    The i18n API provides a character set conversion with mapping tables for a number of important codepages. The default tables are a subset of IBM's CDRA conversion table repository. ICU's Converter Explorer shows aliases and codepage charts for the default tables that are built into a standard ICU distribution.

    Conversions for most codepages are implemented differently on different platforms. We are providing mapping tables here from many different sources, so that the i18n users and others can use these tables to get the same conversion behavior as on the original platforms.

    The mapping tables and some of the source code of the tools that collected these tables are checked into a CVS repository.

    @@ -502,12 +502,12 @@

    Prerequisites

    - +

    To use the functions and data types of the i18n API (in mobile and wearable applications) and its submodules, include the <utils_i18n.h> header file in your application:

     #include <utils_i18n.h>
    - +

    Managing Characters and Strings

    Character and string management tasks include:

    @@ -529,7 +529,7 @@ Note All source and destination buffers must be different. - +

    Comparing Ustrings

    To compare 2 Ustrings for bitwise equality, use the i18n_ustring_compare() function.

    @@ -538,9 +538,9 @@ #define BUF_SIZE 64 i18n_uchar s1[BUF_SIZE]; -i18n_ustring_copy_ua(s1, "Tizen"); +i18n_ustring_copy_ua(s1, "Tizen"); i18n_uchar s2[BUF_SIZE]; -i18n_ustring_copy_ua(s2, "Bada"); +i18n_ustring_copy_ua(s2, "Bada"); int32_t result = i18n_ustring_compare(s1, s2); @@ -555,9 +555,9 @@ i18n_ucollator_create(I18N_ULOCALE_US, &coll);

    The strength influences how the strings are compared. The following strength levels are available:

    • I18N_UCOLLATOR_DEFAULT_STRENGTH: Default
      • -
    • I18N_UCOLLATOR_PRIMARY: Compares the primary differences only, such as different base letters ("a" vs. "b").
      • -
    • I18N_UCOLLATOR_SECONDARY: Compares primary and secondary differences, such as different accented forms of the same base letter ("a" vs. "ä").
      • -
    • I18N_UCOLLATOR_TERTIARY: Compares primary, secondary, and tertiary differences, such as case differences ("a" vs. "A").
      • +
    • I18N_UCOLLATOR_PRIMARY: Compares the primary differences only, such as different base letters ("a" vs. "b").
      • +
    • I18N_UCOLLATOR_SECONDARY: Compares primary and secondary differences, such as different accented forms of the same base letter ("a" vs. "ä").
      • +
    • I18N_UCOLLATOR_TERTIARY: Compares primary, secondary, and tertiary differences, such as case differences ("a" vs. "A").
    @@ -587,20 +587,20 @@ i18n_ucollator_destroy(coll);
 
 
    • To convert a byte string to a Unicode string (Ustring), use the i18n_ustring_copy_ua() function:
      
 
      -const char *src = "Tizen";
+const char *src = "Tizen";
 i18n_uchar dest[BUF_SIZE];
 i18n_ustring_copy_ua(dest, src);
 
      • 
 
    • To convert a byte string to a Ustring while defining a maximum number of characters to be copied, use the i18n_ustring_copy_ua_n() function and set the character limit as the third parameter:
      
 
      -const char *src = "Tizen";
+const char *src = "Tizen";
 i18n_uchar dest[BUF_SIZE];
 i18n_ustring_copy_ua_n(dest, src, BUF_SIZE);
 
      • 
 
    • To convert a UTF-8 string to a UTF-16 string, use the i18n_ustring_from_UTF8() function.
      
 
      The function returns the length of the converted string and an error code variable as out parameters.
      
 
      -const char *src = "Tizen";
+const char *src = "Tizen";
 i18n_uchar dest[BUF_SIZE];
 int dest_len;
 i18n_uerror_code_e error_code = I18N_ERROR_NONE;
@@ -614,14 +614,14 @@ i18n_ustring_from_UTF8(dest, BUF_SIZE, &dest_len, src, -1, &error_code);
 
    • To convert a Ustring to a byte string, use the i18n_ustring_copy_au() function:
      
 
       i18n_uchar src[BUF_SIZE];
-i18n_ustring_copy_ua(src, "Tizen");
+i18n_ustring_copy_ua(src, "Tizen");
 char dest[BUF_SIZE];
 i18n_ustring_copy_au(dest, src);
 
      • 
 
    • To convert a Ustring to a byte string while defining a maximum number of characters to be copied, use the i18n_ustring_copy_au_n() function and set the character limit as the third parameter:
      
 
       i18n_uchar src[BUF_SIZE];
-i18n_ustring_copy_ua(src, "Tizen");
+i18n_ustring_copy_ua(src, "Tizen");
 char dest[BUF_SIZE];
 i18n_ustring_copy_au_n(dest, src, BUF_SIZE);
 
      • 
@@ -632,12 +632,12 @@ i18n_ustring_copy_au_n(dest, src, BUF_SIZE);
 
 
       i18n_uchar src[BUF_SIZE];
-i18n_ustring_copy_ua(src, "Tizen");
+i18n_ustring_copy_ua(src, "Tizen");
 char dest[BUF_SIZE];
 int dest_len;
 i18n_uerror_code_e error_code = I18N_ERROR_NONE;
 i18n_ustring_to_UTF8(dest, BUF_SIZE, &dest_len, src, i18n_ustring_get_length(src),
-                     &error_code);
+                     &error_code);
 
    
 
 
    Getting the Unicode Block of a Character
    
@@ -665,12 +665,12 @@ i18n_uchar_get_int_property_value(character, I18N_UCHAR_EAST_ASIAN_WIDTH, &p
 
    Normalizing Ustrings
    
 
    To normalize a Ustring:
    
 
      
-
    1. Get a Unormalizer instance using the i18n_unormalization_get_instance() function of the Unormalization API (in mobile and wearable applications). 
+
    2. Get a Unormalizer instance using the i18n_unormalization_get_instance() function of the Unormalization API (in mobile and wearable applications).
 
      To use the built-in normalizer, set the first parameter to NULL.
      
 
       i18n_unormalizer_h normalizer;
-i18n_unormalization_get_instance(NULL, "nfc", I18N_UNORMALIZATION_DECOMPOSE,
-                                 &normalizer);
+i18n_unormalization_get_instance(NULL, "nfc", I18N_UNORMALIZATION_DECOMPOSE,
+                                 &normalizer);
 
      
 
      3. 
 
@@ -688,9 +688,9 @@ i18n_unormalization_normalize(normalizer, &src, 1, dest, 4, &dest_str_le
 
    3. Create a search iterator using the i18n_usearch_create_new() function of the Usearch API (in mobile and wearable applications):
 
       i18n_uchar text[BUF_SIZE];
-i18n_ustring_copy_ua(text, "TIZEN");
+i18n_ustring_copy_ua(text, "TIZEN");
 i18n_uchar pattern[BUF_SIZE];
-i18n_ustring_copy_ua(pattern, "ZEN");
+i18n_ustring_copy_ua(pattern, "ZEN");
 i18n_usearch_h usearch;
 i18n_usearch_create_new(pattern, -1, text, -1, I18N_ULOCALE_US, NULL, &usearch);
 
      4. 
@@ -707,11 +707,11 @@ i18n_usearch_destroy(usearch);
 
      Changing the Case in a Ustring
      
 
      To change the case in a Ustring:
      
 
        
-
      1. To change all characters' case in a Ustring, use the i18n_ustring_to_upper() or i18n_ustring_to_lower() function:
+
      2. To change all characters' case in a Ustring, use the i18n_ustring_to_upper() or i18n_ustring_to_lower() function:
 
 
         i18n_uchar src[BUF_SIZE];
-i18n_ustring_copy_ua(src, "Tizen");
+i18n_ustring_copy_ua(src, "Tizen");
 i18n_uchar dest[BUF_SIZE];
 i18n_ustring_to_upper(dest, BUF_SIZE, src, -1, I18N_ULOCALE_US, &error_code);
 i18n_ustring_to_lower(dest, BUF_SIZE, src, -1, I18N_ULOCALE_US, &error_code);
@@ -720,7 +720,7 @@ i18n_ustring_to_lower(dest, BUF_SIZE, src, -1, I18N_ULOCALE_US, &error_code)
 
      3. To change the string case to title case, use the i18n_ustring_to_title_new() function:
 
         i18n_uchar src[BUF_SIZE];
-i18n_ustring_copy_ua(src, "Tizen");
+i18n_ustring_copy_ua(src, "Tizen");
 i18n_uchar dest[BUF_SIZE];
 i18n_ustring_to_title_new(dest, BUF_SIZE, src, BUF_SIZE, NULL, NULL);
 
        
@@ -734,8 +734,8 @@ i18n_ustring_to_title_new(dest, BUF_SIZE, src, BUF_SIZE, NULL, NULL);
 i18n_uchar src[BUF_SIZE];
 i18n_uchar dest[BUF_SIZE];
 
-i18n_ustring_copy_ua(dest, "Destination string");
-i18n_ustring_copy_ua(src, "Appended string");
+i18n_ustring_copy_ua(dest, "Destination string");
+i18n_ustring_copy_ua(src, "Appended string");
 
 i18n_ustring_cat_n(dest, src, BUF_SIZE);
 /* Or */
@@ -753,12 +753,12 @@ i18n_uchar substring[BUF_SIZE];
 i18n_uchar *result = i18n_ustring_string(s, substr);
 
 if (result == NULL)
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Substring not found");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Substring not found");
 else
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Substring index: %d", result - s);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Substring index: %d", result - s);
 
        4. 
 
-	
+
 
        Managing Dates and Calendar
        
 
 
@@ -768,19 +768,19 @@ else
 
          
 	
        • The Ucalendar API is used for converting between an i18n_udate object and a set of integer fields, such as I18N_UCALENDAR_YEAR, I18N_UCALENDAR_MONTH, I18N_UCALENDAR_DAY, and I18N_UCALENDAR_HOUR.
          • 
 	
        • The Udate API is used to convert dates and times from their internal representations to a textual form and back again in a language-independent manner.
          • 
-	
        • The Udatepg API is used to generate date format patterns, such as "yy-MM-dd".
          • 
+	
        • The Udatepg API is used to generate date format patterns, such as "yy-MM-dd".
          • 
 
        
 
 
        4. 
 
      4. To create a Ucalendar, use the i18n_ucalendar_create() function:
 
         i18n_uchar timezone[BUF_SIZE];
-const char *timezone_name = "America/New_York";
+const char *timezone_name = "America/New_York";
 int timezone_name_len = strlen(timezone_name);
 i18n_ustring_copy_ua_n(timezone, timezone_name, timezone_name_len + 1);
 i18n_ucalendar_h ucalendar;
 i18n_ucalendar_create(timezone, -1, I18N_ULOCALE_US,
-                      I18N_UCALENDAR_DEFAULT, &ucalendar);
+                      I18N_UCALENDAR_DEFAULT, &ucalendar);
 
        5. 
 
 
      5. To set a date in the Ucalendar, use the i18n_ucalendar_set_date_time() function.
@@ -839,15 +839,15 @@ i18n_udatepg_h udatepg;
 i18n_udatepg_create(I18N_ULOCALE_UK, &udatepg);
    -
  • To generate a date best pattern with the pattern generator, use the i18n_udatepg_get_best_pattern() function. +
  • To generate a date best pattern with the pattern generator, use the i18n_udatepg_get_best_pattern() function.

    As the second parameter, you need a draft format, which defines the fields to be displayed (for example, E for the day of the week, M for month, y for year, d for the day of the month, and D for day of the year).

     int pattern_len;
 i18n_uchar format[BUF_SIZE];
-i18n_ustring_copy_ua_n(format, "EEEdMMMyyyyHHmmssz", BUF_SIZE);
+i18n_ustring_copy_ua_n(format, "EEEdMMMyyyyHHmmssz", BUF_SIZE);
 i18n_uchar best_pattern[BUF_SIZE];
 i18n_udatepg_get_best_pattern(udatepg, format, BUF_SIZE, best_pattern,
-                              BUF_SIZE, &pattern_len);
+                              BUF_SIZE, &pattern_len);
    • @@ -858,11 +858,11 @@ i18n_udatepg_get_best_pattern(udatepg, format, BUF_SIZE, best_pattern,

    As the first and second parameter, specify the formatting style for time and date using the values of the i18n_udate_format_style_e enumeration (in mobile and wearable applications).

     i18n_udate_format_h date_format;
-const char *timezone_name = "Asia/Seoul";
+const char *timezone_name = "Asia/Seoul";
 int timezone_name_len = strlen(timezone_name);
 i18n_ustring_copy_ua_n(timezone, timezone_name, timezone_name_len + 1);
 i18n_udate_create(I18N_UDATE_FULL, I18N_UDATE_FULL, I18N_ULOCALE_UK,
-                  timezone, -1, best_pattern, -1, &date_format);
+                  timezone, -1, best_pattern, -1, &date_format);
  • To obtain a Ustring with a specified date and the created date format, use the i18n_udate_format_date() function: @@ -870,7 +870,7 @@ i18n_udate_create(I18N_UDATE_FULL, I18N_UDATE_FULL, I18N_ULOCALE_UK, i18n_uchar date_result[BUF_SIZE]; int date_len; i18n_udate_format_date(date_format, now, date_result, -                       BUF_SIZE, NULL, &date_len); + BUF_SIZE, NULL, &date_len);
    • @@ -905,13 +905,13 @@ const char *language_iso = i18n_ulocale_get_iso3_language(I18N_ULOCALE_GERMANY);
  • To get the full name of the language for the specified locale, use the i18n_ulocale_get_display_language() function. -

    In the following example, the name of the "fr_CA" locale is obtained in German:

    +

    In the following example, the name of the "fr_CA" locale is obtained in German:

     char *locale = I18N_ULOCALE_CANADA_FRENCH;
 i18n_uchar language_name[BUF_SIZE];
 int lang_len;
 i18n_ulocale_get_display_language(locale, I18N_ULOCALE_GERMANY, language_name,
-                                  BUF_SIZE, &lang_len);
+                                  BUF_SIZE, &lang_len);
    • @@ -938,13 +938,13 @@ int32_t variant_len = i18n_ulocale_get_variant(locale, variant, BUF_SIZE); -
  • To get a full name for the specified locale, use the i18n_ulocale_get_display_name() function. -

    In the following example, the name of the "fr_CA" locale is obtained in German:

    +
  • To get a full name for the specified locale, use the i18n_ulocale_get_display_name() function. +

    In the following example, the name of the "fr_CA" locale is obtained in German:

     i18n_uchar name[BUF_SIZE];
 int name_len;
 i18n_ulocale_get_display_name(I18N_ULOCALE_CANADA_FRENCH, I18N_ULOCALE_GERMANY,
-                              name, BUF_SIZE, &name_len);
+                              name, BUF_SIZE, &name_len);
    • @@ -965,7 +965,7 @@ i18n_ulocale_set_default(I18N_ULOCALE_KOREA);
    1. To create a number format, use the i18n_unumber_create() function.

      Define the style as the first parameter using the i18n_unumber_format_style_e enumeration (in mobile and wearable applications).

      -

      The fourth parameter sets the locale (NULL for default). Some string shortcuts for specific locales are defined in the utils_i18n_types.h header file. For example, I18N_ULOCALE_US is equal to "en_US".

      +

      The fourth parameter sets the locale (NULL for default). Some string shortcuts for specific locales are defined in the utils_i18n_types.h header file. For example, I18N_ULOCALE_US is equal to "en_US".

       i18n_unumber_format_h num_format;
 i18n_unumber_format_style_e format_style = I18N_UNUMBER_CURRENCY;
@@ -987,7 +987,7 @@ i18n_unumber_format_double(num_format, myNumber, myString, BUF_SIZE, NULL);
 $4.50
      2. -
    2. To get a symbol associated with the created number format, use the i18n_unumber_get_symbol() function. +
    3. To get a symbol associated with the created number format, use the i18n_unumber_get_symbol() function.

      The second parameter uses the values of the i18n_unumber_format_symbol_e enumeration (in mobile and wearable applications) to define the symbol to be retrieved.

      The function returns the symbol used in the given locale. In the following example, it returns the currency $ sign:

      @@ -1010,7 +1010,7 @@ i18n_unumber_destroy(num_format);
 
 
      To manipulate or iterate through strings, you can use the Ubrk library. It helps you to treat strings as a set of characters, words, or sentences:
      
 
        
-
      1. To create an iterator to iterate through a string, use the i18n_ubrk_create() function. 
+
      2. To create an iterator to iterate through a string, use the i18n_ubrk_create() function.
 
        The first parameter defines the type of the iterator:
        
 
          
 
        • I18N_UBRK_WORD for word iteration
          • 
@@ -1020,14 +1020,14 @@ i18n_unumber_destroy(num_format);
 
        
 
         i18n_ubreak_iterator_h boundary;
-const char *str = "Twinkle, twinkle little star";
+const char *str = "Twinkle, twinkle little star";
 int str_len = strlen(str);
 i18n_uchar* stringToExamine = malloc(sizeof(i18n_uchar)*(str_len + 1));
 i18n_ustring_copy_ua(stringToExamine, str);
 i18n_ubrk_create(I18N_UBRK_WORD, I18N_ULOCALE_US, stringToExamine, -1, &boundary);
 
        3. 
 
-
      3. To change the position of the iterator, you can use several functions, such as i18n_ubrk_first(), i18n_ubrk_last(), i18n_ubrk_next(), and i18n_ubrk_previous(). 
+
      4. To change the position of the iterator, you can use several functions, such as i18n_ubrk_first(), i18n_ubrk_last(), i18n_ubrk_next(), and i18n_ubrk_previous().
 
        The following example retrieves the boundaries of the first word in the stringToExamine string. The start and end variables represent the boundaries of the first word, in this example 0 and 7.
        
 
         int32_t start = i18n_ubrk_first(boundary);
@@ -1055,7 +1055,7 @@ i18n_ubrk_destroy(boundary);
 
          
 
        1. Define an array of strings (pointers to char):
 
          -const char* strings[] = {"First", "Second", "Third", "Fourth"};
+const char* strings[] = {"First", "Second", "Third", "Fourth"};
 
 /* Length of the pointers array (the number of strings) */
 int32_t size = sizeof(strings) / sizeof(strings[0]);
@@ -1088,9 +1088,9 @@ int len;
 
 element = i18n_uenumeration_next(strings_enum, &len);
 while (element != NULL) {
-    /* Use the returned string */
+    /* Use the returned string */
 
-    element = i18n_uenumeration_next(strings_enum, &len);
+    element = i18n_uenumeration_next(strings_enum, &len);
 }
 
          
 
@@ -1120,9 +1120,9 @@ int len;
 
 tz = i18n_uenumeration_next(timezones, &len);
 while (tz != NULL) {
-    /* Use the time zone string */
+    /* Use the time zone string */
 
-    tz = i18n_uenumeration_next(timezones, &len);
+    tz = i18n_uenumeration_next(timezones, &len);
 }
 
 i18n_uenumeration_destroy(timezones);
@@ -1146,9 +1146,9 @@ int len;
 
 sk = i18n_uenumeration_next(skeletons, &len);
 while (sk != NULL) {
-    /* Use the skeleton string */
+    /* Use the skeleton string */
 
-    sk = i18n_uenumeration_next(skeletons, &len);
+    sk = i18n_uenumeration_next(skeletons, &len);
 }
 
 i18n_uenumeration_destroy(skeletons);
@@ -1156,7 +1156,7 @@ i18n_uenumeration_destroy(skeletons);
 
          2. 
 
        2. To get an enumeration of keywords for a given locale string and iterate through the keywords, use the i18n_ulocale_keywords_create() function:
 
          -const char *loc_string = "en_US@collation=PHONEBOOK;calendar=GREGORIAN;currency=USD";
+const char *loc_string = "en_US@collation=PHONEBOOK;calendar=GREGORIAN;currency=USD";
 
 i18n_uenumeration_h keywords;
 i18n_ulocale_keywords_create(loc_string, &keywords);
@@ -1168,16 +1168,16 @@ int len;
 
 keyword = i18n_uenumeration_next(keywords, &len);
 while (keyword != NULL) {
-    /* Use the keyword string */
+    /* Use the keyword string */
 
-    keyword = i18n_uenumeration_next(keywords, &len);
+    keyword = i18n_uenumeration_next(keywords, &len);
 }
 
 i18n_uenumeration_destroy(keywords);
 
          
 
          3. 
 
-	
+
 
 
          Managing Time Zones
          
 
          To manage time zone details, such as the time zone offset and daylight savings:
          
@@ -1239,8 +1239,8 @@ i18n_timezone_get_region(timezone_id, region, &region_len, BUF_SIZE);
 
        3. When no longer needed, destroy the time zone instance with the i18n_timezone_destroy() function:
          
 
           i18n_timezone_destroy(tmz);
-
        	
-	
+
      
+
 
      Managing Sets
      
 
      You can create sets, which contain characters and strings. You can iterate through the set elements and carry out various operations on the set.
      
 
      To manage sets:
      
@@ -1258,7 +1258,7 @@ i18n_uset_create_empty(&set);
 
        
 
      • Add characters from a string to the set using the i18n_uset_add_all_code_points() function:
 
        -const char *text = "Example string";
+const char *text = "Example string";
 i18n_uchar u_input_text[BUF_SIZE];
 i18n_ustring_copy_ua(u_input_text, text);
 
@@ -1272,21 +1272,21 @@ int chars_count = i18n_uset_size(set);
 int i;
 
 /* Get all characters in the set */
-for (i = 0; i < chars_count; i++) 
-    i18n_uchar32 uchar = i18n_uset_char_at(set, i);
+for (i = 0; i < chars_count; i++)
+    i18n_uchar32 uchar = i18n_uset_char_at(set, i);
 
        
 
        • 
 
 
      • Check whether the set contains a specific character using the i18n_uset_contains() function:
 
        -i18n_ubool contains_character = i18n_uset_contains(set, 'a');
+i18n_ubool contains_character = i18n_uset_contains(set, 'a');
 
        
 
        • 
 
 
      • Check whether the set contains characters from a specific range using the i18n_uset_contains_range() function.
-
        The following example uses the range "a-c".
        
+
        The following example uses the range "a-c".
        
 
        -i18n_ubool contains_character = i18n_uset_contains_range(set, 'a', 'c');
+i18n_ubool contains_character = i18n_uset_contains_range(set, 'a', 'c');
 
        
 
        • 
 
@@ -1302,12 +1302,12 @@ i18n_ubool contains_character = i18n_uset_contains_all(set, compare_set);
    4. To manage string sets: -

      A string set contains strings as its elements.

      +

      A string set contains strings as its elements.

      • Add a string to the set using the i18n_uset_add_string() function.

        The entire string is a single element.

        -const char *text = "Example string";
+const char *text = "Example string";
 i18n_uchar u_input_text[BUF_SIZE];
 i18n_ustring_copy_ua(u_input_text, text);
 
@@ -1322,17 +1322,17 @@ int strings_count = i18n_uset_get_item_count(set);
 int32_t len = 0;
 int32_t i;
 for (i = 0; i < strings_count; ++i) {
-    i18n_uchar32 start, end;
-    i18n_uchar string[100];
-    len = i18n_uset_get_item(set, i, &start, &end, string, 100);
-    if (len != 0) 
-        /* String was found, use the 'string' variable */
+    i18n_uchar32 start, end;
+    i18n_uchar string[100];
+    len = i18n_uset_get_item(set, i, &start, &end, string, 100);
+    if (len != 0)
+        /* String was found, use the 'string' variable */
 }
      • Check whether the set contains a string using the i18n_uset_contains_string() function: 
        -const char *input_string = "Input string";
+const char *input_string = "Input string";
 int input_string_len = strlen(input_string);
 i18n_uchar *input_ustring = malloc(sizeof(i18n_uchar) * (input_string_len + 1));
 i18n_ustring_copy_ua(input_ustring, input_string);
@@ -1343,7 +1343,7 @@ i18n_ubool contains = i18n_uset_contains_string(set, input_ustring, -1);
    - + diff --git a/org.tizen.guides/html/native/internationalization/internationalization_cover_n.htm b/org.tizen.guides/html/native/internationalization/internationalization_cover_n.htm index 37efcac..67dc20b 100644 --- a/org.tizen.guides/html/native/internationalization/internationalization_cover_n.htm +++ b/org.tizen.guides/html/native/internationalization/internationalization_cover_n.htm @@ -5,13 +5,13 @@ - + - Internationalization + Internationalization @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • - +

    Internationalization

    @@ -49,7 +49,7 @@

    You can parse and format phone numbers to make contact management and telephony easier. You can retrieve location information from a phone number, and format the number according to a specific locale.

    - +
    diff --git a/org.tizen.guides/html/native/internationalization/phonenumber_n.htm b/org.tizen.guides/html/native/internationalization/phonenumber_n.htm index 484cf28..0a7447d 100644 --- a/org.tizen.guides/html/native/internationalization/phonenumber_n.htm +++ b/org.tizen.guides/html/native/internationalization/phonenumber_n.htm @@ -51,7 +51,7 @@

    You can get the location based on the phone number, region, and language using the phone_number_get_location_from_number() function. If the function cannot provide the location with the passed language, it uses English.

  • Formatting the phone number -

    You can format the phone number string based on the region using the dash ("-") and space (" ") characters using the phone_number_get_formatted_number() function.

    • +

    You can format the phone number string based on the region using the dash ("-") and space (" ") characters using the phone_number_get_formatted_number() function.

  • Normalizing the phone number

    You can normalize the phone number using the phone_number_get_normalized_number() function.

    • @@ -81,8 +81,8 @@ error_code = phone_number_connect(); error_code = phone_number_disconnect(); - - + +

    Getting the Location

    To get the location from the phone number, use the phone_number_get_location_from_number() function:

    @@ -91,13 +91,13 @@ error_code = phone_number_disconnect(); int ret; char *location = NULL; -ret = phone_number_get_location_from_number("0222550114", -                                            PHONE_NUMBER_REGION_REPUBLIC_OF_KOREA, -                                            PHONE_NUMBER_LANG_ENGLISH, &location); +ret = phone_number_get_location_from_number("0222550114", + PHONE_NUMBER_REGION_REPUBLIC_OF_KOREA, + PHONE_NUMBER_LANG_ENGLISH, &location); if (PHONE_NUMBER_ERROR_NONE == ret) { -    /* Use location */ -    /* location – "Seoul" */ -    dlog_print(DLOG_DEBUG, LOG_TAG, "location=%s", location); + /* Use location */ + /* location – "Seoul" */ + dlog_print(DLOG_DEBUG, LOG_TAG, "location=%s", location); } free(location); @@ -110,12 +110,12 @@ free(location); int ret; char *formatted_number = NULL; -ret = phone_number_get_formatted_number("0222550114", PHONE_NUMBER_REGION_REPUBLIC_OF_KOREA, -                                        &formatted_number); +ret = phone_number_get_formatted_number("0222550114", PHONE_NUMBER_REGION_REPUBLIC_OF_KOREA, + &formatted_number); if (PHONE_NUMBER_ERROR_NONE == ret) { -    /* Use formatted_number */ -    /* formatted_number - "02-2255-0114" */ -    dlog_print(DLOG_DEBUG, LOG_TAG, "formatted_number=%s", formatted_number); + /* Use formatted_number */ + /* formatted_number - "02-2255-0114" */ + dlog_print(DLOG_DEBUG, LOG_TAG, "formatted_number=%s", formatted_number); } free(formatted_number); @@ -128,11 +128,11 @@ free(formatted_number); int ret; char *normalized_number = NULL; -ret = phone_number_get_normalized_number("0222550114", normalized_number); +ret = phone_number_get_normalized_number("0222550114", normalized_number); if (PHONE_NUMBER_ERROR_NONE == ret) { -    /* Use normalized_number */ -    /* normalized_number - "+821022550114" */ -    dlog_print(DLOG_DEBUG, LOG_TAG, "normalized_number=%s", normalized_number); + /* Use normalized_number */ + /* normalized_number - "+821022550114" */ + dlog_print(DLOG_DEBUG, LOG_TAG, "normalized_number=%s", normalized_number); } free(normalized_number); diff --git a/org.tizen.guides/html/native/internationalization/resource_localization_n.htm b/org.tizen.guides/html/native/internationalization/resource_localization_n.htm index 63e13a1..b25023f 100644 --- a/org.tizen.guides/html/native/internationalization/resource_localization_n.htm +++ b/org.tizen.guides/html/native/internationalization/resource_localization_n.htm @@ -5,26 +5,26 @@ - + - Resource Localization - + Resource Localization + - +
    -

    Resource Localization

    +

    Resource Localization

    -

    Tizen provides localized resources to make your application usable for different countries. The localization is based on the Internationalization API (in mobile and wearable applications), which makes strings translatable and places them in .po (portable object) files.

    +

    Tizen provides localized resources to make your application usable for different countries. The localization is based on the Internationalization API (in mobile and wearable applications), which makes strings translatable and places them in .po (portable object) files.

    @@ -54,23 +54,23 @@

    Be careful if you change the application ID in the Tizen manifest editor later on, because the .mo file name is not automatically changed, and problems can occur when getting the string resources.

    -

    The application must load the proper resource set depending on the current device locale. If no matching resource set is found for the current locale, the default resource set is used.

    +

    The application must load the proper resource set depending on the current device locale. If no matching resource set is found for the current locale, the default resource set is used.

    To get the localized value of a string, use the string KEY shown in the PO file editor (the msgid field in the .po file), with the _() function (for example, _(<msgid>)). The underlying implementation calls the i18n_get_text() function to retrieve the localized value:

    -char *hello_text = i18n_get_text("Hello");
+char *hello_text = i18n_get_text("Hello");
    -

    The hello_text variable is set to the localized text for the "Hello" string key (msgid) for the current device locale.

    +

    The hello_text variable is set to the localized text for the "Hello" string key (msgid) for the current device locale.

    When the user changes the device language setting, the text in the application changes to the new language.

    Marking Text Parts Translatable

    -

    The most common way to use a translation in your application strings involves the elm_object_translatable_text_set() and elm_object_item_translatable_text_set() functions. They set the untranslated string for the "default" part of the given Evas_Object or Elm_Object_Item, and mark the string as translatable.

    +

    The most common way to use a translation in your application strings involves the elm_object_translatable_text_set() and elm_object_item_translatable_text_set() functions. They set the untranslated string for the "default" part of the given Evas_Object or Elm_Object_Item, and mark the string as translatable.

    + +

    To set the text for a "non-default" part as translatable, use the elm_object_translatable_part_text_set() and elm_object_item_translatable_part_text_set() functions.

    -

    To set the text for a "non-default" part as translatable, use the elm_object_translatable_part_text_set() and elm_object_item_translatable_part_text_set() functions.

    -
    Note Always provide the untranslated string as a parameter to the above functions. The EFL triggers the translation itself and re-translates the string automatically, if the system language changes. @@ -92,14 +92,14 @@ char *i18n_get_text(const char *msgid); Do not modify or free the return value of the i18n_get_text() function. It is statically allocated.
    -

    The following example shows how you can define the text translation for a genlist item, when the "Some Text" string is defined as a msgid field in the .po file:

    +

    The following example shows how you can define the text translation for a genlist item, when the "Some Text" string is defined as a msgid field in the .po file:

    -#include "app_i18n.h"
+#include "app_i18n.h"
 static char*
 _genlist_text_get(void *data, Evas_Object *obj, const char *part)
 {
-    return strdup(i18n_get_text("Some Text"));
+    return strdup(i18n_get_text("Some Text"));
 }
    @@ -109,26 +109,26 @@ _genlist_text_get(void *data, Evas_Object *obj, const char *part)

    For example, the .po file for French can contain the following lines (for one plural form):

    -msgid "%d Comment"
-msgid_plural "%d Comments"
-msgstr[0] "%d commentaire"
-msgstr[1] "%d commentaires"
+msgid "%d Comment"
+msgid_plural "%d Comments"
+msgstr[0] "%d commentaire"
+msgstr[1] "%d commentaires"

    The following example shows a situation where a language has several plural forms. For example, the .po file for Polish can contain the following lines:

    -msgid "%d Comment"
-msgid_plural "%d Comments"
-msgstr[0] "%d Komentarz"
-msgstr[1] "%d Komentarze"
-msgstr[2] "%d Komentarzy"
+msgid "%d Comment"
+msgid_plural "%d Comments"
+msgstr[0] "%d Komentarz"
+msgstr[1] "%d Komentarze"
+msgstr[2] "%d Komentarzy"

    The index values in the msgstr field are defined in system-wide settings. The ones for Polish are defined in the following example. They mean that there are 3 forms (including singular). The index is 0 (singular), if the given integer n is 1. If (n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 | | n % 100 >= 20), the index is 1, otherwise it is 2.

    -"Plural-Forms: nplurals = 3; plural = n = = 1 ? 0 : n%10> = 2 && n%10< = 4 && (n%100<10 | | n%100> = 20) ? 1 : 2;\n"
+"Plural-Forms: nplurals = 3; plural = n = = 1 ? 0 : n%10> = 2 && n%10< = 4 && (n%100<10 | | n%100> = 20) ? 1 : 2;\n"

    Language Changes at Runtime

    @@ -141,18 +141,18 @@ msgstr[2] "%d Komentarzy" static void _app_language_changed(void *data) { -    char *language; -    /* Retrieve the current system language */ -    system_settings_get_value_string(SYSTEM_SETTINGS_KEY_LOCALE_LANGUAGE, &language); -    /* Set the language in elementary */ -    elm_language_set(language); -    free(language); + char *language; + /* Retrieve the current system language */ + system_settings_get_value_string(SYSTEM_SETTINGS_KEY_LOCALE_LANGUAGE, &language); + /* Set the language in elementary */ + elm_language_set(language); + free(language); } int main(int argc, char *argv[]) { -    ui_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], -                             APP_EVENT_LANGUAGE_CHANGED, _app_language_changed, &ad); + ui_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], + APP_EVENT_LANGUAGE_CHANGED, _app_language_changed, &ad); } @@ -171,10 +171,10 @@ main(int argc, char *argv[])
  • xgettext: 
    -xgettext --directory = src --output-dir = res/po --keyword = _ --keyword = N_ 
-         --keyword = elm_object_translatable_text_set:2
-         --keyword = elm_object_item_translatable_text_set:2 
-         --add-comments = --from-code = utf-8 --foreign-use
+xgettext --directory = src --output-dir = res/po --keyword = _ --keyword = N_
+         --keyword = elm_object_translatable_text_set:2
+         --keyword = elm_object_item_translatable_text_set:2
+         --add-comments = --from-code = utf-8 --foreign-use

    The above call extracts all strings that are used inside the _() function (optional shorthand for i18n_get_text()), uses UTF-8 as the encoding, and adds comments right before the strings to the output files.

    @@ -193,16 +193,16 @@ msgmerge --width=120 --update res/po/fr.po res/po/ref.pot
    • Make no assumptions about languages -

      Languages vary greatly and even if you know several of them, do not assume there is any common logic to them all. For example, with English typography, no character must appear before colons and semicolons (':' and ';'). However, with French typography, there must be "espace fine insécable", that is, a non-breakable space (HTML's &nbsp;) that is narrower than regular spaces.

      +

      Languages vary greatly and even if you know several of them, do not assume there is any common logic to them all. For example, with English typography, no character must appear before colons and semicolons (':' and ';'). However, with French typography, there must be "espace fine insécable", that is, a non-breakable space (HTML's &nbsp;) that is narrower than regular spaces.

      To prevent problems with typography, avoid breaking your strings into multiple parts, if possible. The following example results in incorrect punctuation:

      -snprintf(buf, some_size, "%s: %s", i18n_get_text(error), i18n_get_text(reason));
+snprintf(buf, some_size, "%s: %s", i18n_get_text(error), i18n_get_text(reason));

      Instead, use a single string and let the translators manage the punctuation:

      -snprintf(buf, some_size, i18n_get_text("%s: %s"), i18n_get_text(error),
-         i18n_get_text(reason));
+snprintf(buf, some_size, i18n_get_text("%s: %s"), i18n_get_text(error),
+         i18n_get_text(reason));
    • Remember that translations have different lengths @@ -214,8 +214,8 @@ snprintf(buf, some_size, i18n_get_text("%s: %s"), i18n_get_text(error) 
       #: some_file.c:43 another_file.c:41
-msgid "Click Here"
-msgstr "Cliquez ici"
+msgid "Click Here"
+msgstr "Cliquez ici"

      In case you insert a new line at the top of the some_file.c file, the line indicator changes to look like this:

      @@ -266,4 +266,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/location_sensors/activity_n.htm b/org.tizen.guides/html/native/location_sensors/activity_n.htm index 7b1fefe..428b861 100644 --- a/org.tizen.guides/html/native/location_sensors/activity_n.htm +++ b/org.tizen.guides/html/native/location_sensors/activity_n.htm @@ -20,16 +20,16 @@

      Mobile native Wearable native

      - +

      Dependencies

      • Tizen 2.4 and Higher for Mobile
      • Tizen 2.3.1 and Higher for Wearable
        • -
      +

    Content

    Related Info

    @@ -44,7 +44,7 @@

    Activity Recognition

    The activity recognizer can monitor user activities. You can detect walking and running activity. You can also recognize the stationary state and activities on a moving vehicle.

    - +
    Note You can test the activity recognition functionality only on a target device. The emulator does not support this feature. @@ -67,7 +67,7 @@ activity_create(&handle);
    • -
  • To subscribe to notifications about specific activity state changes, invoke the activity_start_recognition() function to register a callback function. +
  • To subscribe to notifications about specific activity state changes, invoke the activity_start_recognition() function to register a callback function.

    When specific activity data is received, the registered callback is invoked.

    The following example starts the activity monitor to receive notifications when the ACTIVITY_WALK activity is detected. Any of the activity_type_e enumerators (in mobile and wearable applications) can be used in place of the ACTIVITY_WALK value.

    @@ -80,23 +80,23 @@ activity_start_recognition(handle, ACTIVITY_WALK, example_activity_callback, NUL 
     void
 example_activity_callback(activity_type_e activity, const activity_data_h data,
-                          double timestamp, activity_error_e error, void *user_data)
+                          double timestamp, activity_error_e error, void *user_data)
 {
-    int result;
+    int result;
 
-    activity_accuracy_e accuracy;
-    result = activity_get_accuracy(data, &accuracy);
+    activity_accuracy_e accuracy;
+    result = activity_get_accuracy(data, &accuracy);
 
-    if (result != ACTIVITY_ERROR_NONE)
-        /* Error handling */
+    if (result != ACTIVITY_ERROR_NONE)
+        /* Error handling */
 }
    • -
  • When activity monitoring is no longer needed, unset the callback function and destroy the handle: +
  • When activity monitoring is no longer needed, unset the callback function and destroy the handle: 
     activity_stop_recognition(handle);
 activity_release(handle);
    • - +
    diff --git a/org.tizen.guides/html/native/location_sensors/device_sensors_n.htm b/org.tizen.guides/html/native/location_sensors/device_sensors_n.htm index f496689..df19166 100644 --- a/org.tizen.guides/html/native/location_sensors/device_sensors_n.htm +++ b/org.tizen.guides/html/native/location_sensors/device_sensors_n.htm @@ -20,17 +20,17 @@

    Mobile native Wearable native

    - +

    Dependencies

    • Tizen 2.4 and Higher for Mobile
    • Tizen 2.3.1 and Higher for Wearable
      • -
    +

    Content

    pattern :=('[' '^'? item* ']') | property('[' '^'? item* ']') | property
    item :=char | (char '-' char) | pattern-exprchar | (char '-' char) | pattern-expr
    pattern-expr :=
    op :='&' | '-''&' | '-'
    special :='[' | ']' | '-''[' | ']' | '-'
    char :=Any character that is not special | ('\' any character) | ('\u' hex hex hex hex)Any character that is not special | ('\' any character) | ('\u' hex hex hex hex)
    property :=Either a or b
    'a''a' Literal string between the quotes
    @@ -151,7 +151,7 @@
    - +
    • @@ -165,17 +165,17 @@

    Creating a Sensor Listener

    - +

    If an application wants to observe data from a specific sensor, it must first check whether the sensor is supported. Then, you can create a sensor listener handle on the sensor:

    - +
    1. To observe a specific sensor type, for example, accelerometer, check its availability: 
       bool supported = false;
 
-sensor_is_supported(SENSOR_ACCELEROMETER, &supported); 
+sensor_is_supported(SENSOR_ACCELEROMETER, &supported);
 if (!supported) {
-    /* Accelerometer is not supported in the current device */
+    /* Accelerometer is not supported in the current device */
 }
      2. @@ -191,13 +191,13 @@ sensor_get_default_sensor(SENSOR_ACCELEROMETER, &sensor); sensor_listener_h listener; sensor_create_listener(sensor, &listener); - +
    - +

    Subscribing for Sensor Events

    - +

    If a listener is created successfully, it is able to observe sensor data changes through the listener. In addition, you can set several parameters, including the update interval of the sensor data and the power-save behavior of the listener. The following example shows how to set the parameters and listen to changes of sensor data:

    - +
    1. To listen to sensor events, define a callback function and register it to the listener: 
      @@ -205,20 +205,20 @@ sensor_create_listener(sensor, &listener);
 void
 example_sensor_callback(sensor_h sensor, sensor_event_s *event, void *user_data)
 {
-    /*
-       If a callback is used to listen to different sensor types,
-       it can check the sensor type
-    */
-    sensor_type_e type;
-    sensor_get_type(sensor, &type);
-
-    if (type == SENSOR_ACCELEROMETER) {
-        unsigned long long timestamp = event->timestamp;
-        int accuracy = event->accuracy;
-        float x = event->values[0];
-        float y = event->values[1];
-        float z = event->values[2];
-    }
+    /*
+       If a callback is used to listen to different sensor types,
+       it can check the sensor type
+    */
+    sensor_type_e type;
+    sensor_get_type(sensor, &type);
+
+    if (type == SENSOR_ACCELEROMETER) {
+        unsigned long long timestamp = event->timestamp;
+        int accuracy = event->accuracy;
+        float x = event->values[0];
+        float y = event->values[1];
+        float z = event->values[2];
+    }
 }
 
 /* Register callback */
@@ -248,7 +248,7 @@ sensor_listener_set_interval(listener, 200);
 
      By default, the listener automatically stops listening for the sensor data, if the display is switched off or the device goes to the power-save mode. You can override such behavior:
      
 
       sensor_listener_set_attribute_int(listener, SENSOR_ATTRIBUTE_PAUSE_POLICY,
-                                  SENSOR_PAUSE_NONE);
+                                  SENSOR_PAUSE_NONE);
 
      
 
      The above example makes the listener to listen for the sensor data regardless of the display state and the power-save mode. However, it does not prevent the device from going to the sleep mode. To listen for the sensor data, the device must be awake anyway.
      2. @@ -278,7 +278,7 @@ bool supported = false; sensor_recorder_is_supported(SENSOR_HUMAN_PEDOMETER, &supported); if (!supported) { -    /* Pedometer is not supported or cannot be recorded in the current device */ + /* Pedometer is not supported or cannot be recorded in the current device */ } @@ -291,7 +291,7 @@ sensor_recorder_option_h option; sensor_recorder_create_option(&option); /* 720 hours (30 days) */ sensor_recorder_option_set_int(option, SENSOR_RECORDER_OPTION_RETENTION_PERIOD, -                               30 * 24); + 30 * 24); @@ -301,7 +301,7 @@ sensor_recorder_start(SENSOR_HUMAN_PEDOMETER, option);

      Even if the application terminates or the device reboots, the system automatically continues to record pedometer data. As the retention period is set to 720 hours in the above example, the data older than 720 hours is erased automatically. If multiple applications set different retention periods, the longest one is chosen.

      - +
    2. When you no longer need to record pedometer data, stop the recording: 
       sensor_recorder_stop(SENSOR_HUMAN_PEDOMETER);
@@ -309,11 +309,11 @@ sensor_recorder_stop(SENSOR_HUMAN_PEDOMETER);
 
      However, remember that the recording is not actually stopped, if another application has requested for the same sensor to be recorded.
    - +

    Querying Recorded Sensor Data

    - +

    You can query the recorded sensor data with several query parameters. The query parameters differ between sensor types. In case of the pedometer, for example, you can get the daily step counts for the last 7 days by setting the necessary parameters:

    - +
    1. Create a query.

      In the following example, you get an aggregated data record per day (since SENSOR_RECORDER_QUERY_TIME_INTERVAL is set to 24 hours) and a day starts at 7 AM (not at midnight, since SENSOR_RECORDER_QUERY_ANCHOR_TIME is set to 7 AM).

      @@ -322,20 +322,20 @@ sensor_recorder_query_h query; sensor_recorder_create_query(&query); /* Start 7 days ago */ sensor_recorder_query_set_time(query, SENSOR_RECORDER_QUERY_START_TIME, -                               (time_t)(time(NULL) - (7 * 24 * 3600))); + (time_t)(time(NULL) - (7 * 24 * 3600))); /* End now */ sensor_recorder_query_set_time(query, SENSOR_RECORDER_QUERY_END_TIME, time(NULL)); -/* Aggregate every 24 hours */ +/* Aggregate every 24 hours */ sensor_recorder_query_set_int(query, SENSOR_RECORDER_QUERY_TIME_INTERVAL, 24 * 60); /* Start the aggregation at 7 AM */ sensor_recorder_query_set_time(query, SENSOR_RECORDER_QUERY_ANCHOR_TIME, -                               (time_t)(7 * 3600)); + (time_t)(7 * 3600));
    2. With the query handle, retrieve the actual aggregated data: 
       sensor_recorder_read(SENSOR_HUMAN_PEDOMETER, query,
-                     example_sensor_recorder_callback, NULL);
+                     example_sensor_recorder_callback, NULL);

      The sensor_recorder_read() function is asynchronous. The synchronous variant is sensor_recorder_read_sync().

      3. @@ -343,36 +343,36 @@ sensor_recorder_read(SENSOR_HUMAN_PEDOMETER, query, 
       void
 example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data,
-                                 int remains, sensor_error_e error,
-                                 void *user_data)
+                                 int remains, sensor_error_e error,
+                                 void *user_data)
 {
-    int step;
-    double distance;
-    time_t start;
-    time_t end;
+    int step;
+    double distance;
+    time_t start;
+    time_t end;
 
-    if (error != SENSOR_ERROR_NONE)
-        return;
+    if (error != SENSOR_ERROR_NONE)
+        return;
 
-    sensor_recorder_get_time(data, &start, &end);
-    sensor_recorder_get_int(data, SENSOR_RECORDER_DATA_STEPS, &step);
-    sensor_recorder_get_double(data, SENSOR_RECORDER_DATA_DISTANCE, &distance);
+    sensor_recorder_get_time(data, &start, &end);
+    sensor_recorder_get_int(data, SENSOR_RECORDER_DATA_STEPS, &step);
+    sensor_recorder_get_double(data, SENSOR_RECORDER_DATA_DISTANCE, &distance);
 }
    - - + +

    Accelerometer

    -

    The accelerometer measures changes in the velocity of a device. It is a combination of gravity and linear acceleration components. The accelerometer measures the device's accelerometer vector in 3 axes relative to its body frame.

    +

    The accelerometer measures changes in the velocity of a device. It is a combination of gravity and linear acceleration components. The accelerometer measures the device's accelerometer vector in 3 axes relative to its body frame.

    -

    An acceleration shift of 1g always exists on the axis aligned to Earth's gravity. If the device is at rest, the sensor data reads 1g (the gravity offset) on one of the device axis and tells you which device axis is aligned to the direction of gravity. A falling device which has reached terminal velocity ideally shows the accelerometer value of 0 on all axis. The change in the effect of Earth's gravity is observed on the 3 device axes by rotating the device along any of the 3 axes.

    +

    An acceleration shift of 1g always exists on the axis aligned to Earth's gravity. If the device is at rest, the sensor data reads 1g (the gravity offset) on one of the device axis and tells you which device axis is aligned to the direction of gravity. A falling device which has reached terminal velocity ideally shows the accelerometer value of 0 on all axis. The change in the effect of Earth's gravity is observed on the 3 device axes by rotating the device along any of the 3 axes.

    The linear acceleration components which correspond to the measure of the linear motion subjected on the device can be obtained by removing the gravity components from the accelerometer data.

    The accelerometer provides 3 components of acceleration (X, Y, and Z), as the following figure illustrates.

    Figure: Accelerometer vector and axes

    Accelerometer vector and axes

    -

    The accelerometer outputs 4 values: 3 Cartesian axis values and a timestamp. The accelerometer sensor measures and returns axes values in "m/s2" (meters per second squared). When a device is moved in the ±X, ±Y, or ±Z direction, the corresponding output increases (+) or decreases (-).

    +

    The accelerometer outputs 4 values: 3 Cartesian axis values and a timestamp. The accelerometer sensor measures and returns axes values in "m/s2" (meters per second squared). When a device is moved in the ±X, ±Y, or ±Z direction, the corresponding output increases (+) or decreases (-).

    The following table lists the measurement data that the accelerometer provides.

    Table: Measurement data detected by the accelerometer

    @@ -509,7 +509,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

    Geomagnetic Rotation Vector Sensor

    The geomagnetic rotation vector sensor is the output of a software/hardware-based sensor fusion solution which uses the accelerometer and magnetic sensors to compute the orientation of the device. In this sensor, the computed orientation is free of any drift, but it is inaccurate compared to a sensor fusion solution using the gyroscope sensor. The geomagnetic rotation vector sensor represents the orientation of the device as a combination of an angle and an axis in which the device has rotated through a specific angle around an axis (x, y, or z).

    @@ -561,15 +561,15 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

    Gravity Sensor

    -

    The gravity sensor is a virtual sensor derived from the 3-axis acceleration sensor. The 3-axis gravity components provide a measure of the effect of Earth's gravity observed on the device reference axes. The gravity components measured on a device vary based on the change in the device orientation, and hence they provide a measure of the rotation subjected to the device.

    +

    The gravity sensor is a virtual sensor derived from the 3-axis acceleration sensor. The 3-axis gravity components provide a measure of the effect of Earth's gravity observed on the device reference axes. The gravity components measured on a device vary based on the change in the device orientation, and hence they provide a measure of the rotation subjected to the device.

    Figure: Gravity sensor vector and axes

    Gravity sensor vector and axes

    -

    The gravity sensor outputs 4 values: 3 Cartesian axis values and a timestamp. The gravity sensor measures and returns axes values in "m/s2" (meters per second squared). When a device is rotated in the ±X, ±Y, or ±Z direction, the corresponding output increases (+) or decreases (-).

    +

    The gravity sensor outputs 4 values: 3 Cartesian axis values and a timestamp. The gravity sensor measures and returns axes values in "m/s2" (meters per second squared). When a device is rotated in the ±X, ±Y, or ±Z direction, the corresponding output increases (+) or decreases (-).

    The following table lists the measurement data that the gravity sensor provides.

    -

    Table: Measurement data detected by the gravity sensor

    +

    Table: Measurement data detected by the gravity sensor

    @@ -604,7 +604,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data
    - +

    Gyroscope

    The gyroscope detects angular velocity or angular rates of a device. The 3D gyroscope data is considered to be very sensitive in detecting incremental rotation angles. The rotation angles obtained by integrating the angular rates over longer duration is inaccurate due to the build-up of drift.

    Figure: Gyroscope vector and axes

    @@ -650,7 +650,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

    Gyroscope Rotation Vector Sensor

    The gyroscope rotation vector sensor is the output of a software/hardware-based sensor fusion solution which uses the accelerometer and gyroscope to compute the orientation of the device. In this sensor, the pitch and roll equivalent representations are free of drift while the azimuth equivalent component is allowed to drift due to the absence of the magnetic sensor. The gyroscope rotation vector sensor represents the orientation of the device as a combination of an angle and an axis in which the device has rotated through a specific angle around an axis (x, y, or z).

    @@ -704,10 +704,10 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

    Heart Rate Monitor LED Green Sensor

    -

    The Heart Rate Monitor (HRM) LED green sensor measures the amount of green light that is reflected back from a person's blood vessel.

    +

    The Heart Rate Monitor (HRM) LED green sensor measures the amount of green light that is reflected back from a person's blood vessel.

    The following table lists the measurement data that the HRM LED green sensor provides.

    Table: Measurement data detected by the HRM LED green sensor

    - +
    @@ -736,7 +736,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

    Heart Rate Monitor LED IR Sensor

    -

    The Heart Rate Monitor (HRM) LED infrared (IR) sensor measures the amount of infrared light that is reflected back from a person's blood vessel.

    +

    The Heart Rate Monitor (HRM) LED infrared (IR) sensor measures the amount of infrared light that is reflected back from a person's blood vessel.

    The following table lists the measurement data that the HRM LED IR sensor provides.

    Table: Measurement data detected by the HRM LED IR sensor

    @@ -768,7 +768,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

    Heart Rate Monitor LED Red Sensor

    -

    The Heart Rate Monitor (HRM) LED red sensor measures the amount of red light that is reflected back from a person's blood vessel.

    +

    The Heart Rate Monitor (HRM) LED red sensor measures the amount of red light that is reflected back from a person's blood vessel.

    The following table lists the measurement data that the HRM LED red sensor provides.

    Table: Measurement data detected by the HRM LED red sensor

    @@ -798,10 +798,10 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data
    - - + +

    Heart Rate Monitor Sensor

    -

    The Heart Rate Monitor (HRM) sensor measures a person's heart rate in real time.

    +

    The Heart Rate Monitor (HRM) sensor measures a person's heart rate in real time.

    The following table lists the measurement data that the HRM sensor provides.

    Table: Measurement data detected by the HRM sensor

    @@ -862,8 +862,8 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data -
    %
    - + +

    Light Sensor

    The light sensor detects the brightness of ambient light. It can be used to measure the brightness level.

    As an example use case, the light sensor can be used to control the brightness of the screen. In a dark environment, the light sensor detects the brightness of the environment and can be used to increase the device screen backlight brightness level. In a brighter environment, the backlight brightness level is lowered to save battery power.

    @@ -883,7 +883,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data Unit - Timestamp + Timestamp unsigned long long - Microseconds @@ -896,13 +896,13 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

    Linear Acceleration Sensor

    -

    The linear acceleration sensor is derived from the accelerometer by excluding the gravity value, and it measures the user-driven changes in the velocity. The linear acceleration sensor is used to detect the dynamic movement of the device and analyze the user's motion profile. The 3-axes linear acceleration components provide a measure of the combined linear motion subjected to the device in the euclidean space.

    +

    The linear acceleration sensor is derived from the accelerometer by excluding the gravity value, and it measures the user-driven changes in the velocity. The linear acceleration sensor is used to detect the dynamic movement of the device and analyze the user's motion profile. The 3-axes linear acceleration components provide a measure of the combined linear motion subjected to the device in the euclidean space.

    The linear acceleration sensor provides 3 components of acceleration (X, Y, and Z), as the following figure illustrates.

    Figure: User-acceleration sensor vector and axes

    User-acceleration sensor vector and axes

    -

    The linear acceleration sensor outputs 4 values: 3 Cartesian axis values and a timestamp. The linear acceleration sensor measures and returns axes values in "m/s2" (meters per second squared). When a device is accelerated in the ±X, ±Y, or ±Z direction, the corresponding output increases (+) or decreases (-). The acceleration output is shown in the same direction as the user-driven force.

    +

    The linear acceleration sensor outputs 4 values: 3 Cartesian axis values and a timestamp. The linear acceleration sensor measures and returns axes values in "m/s2" (meters per second squared). When a device is accelerated in the ±X, ±Y, or ±Z direction, the corresponding output increases (+) or decreases (-). The acceleration output is shown in the same direction as the user-driven force.

    The following table lists the measurement data that the linear acceleration sensor provides.

    Table: Measurement data detected by the linear acceleration sensor

    @@ -945,10 +945,10 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data
    - - + +

    Magnetic Sensor

    -

    The magnetic sensor is a 3-axis electronic compass (sometimes referred to as a "magnetometer" or "geomagnetic sensor"). It can also be used in determining the azimuth component of the device orientation provided that the tilt of the device is already computed. The magnetic sensor measures the Earth's magnetic field strength and fluctuations, and splits the measurement into X, Y, and Z components.

    +

    The magnetic sensor is a 3-axis electronic compass (sometimes referred to as a "magnetometer" or "geomagnetic sensor"). It can also be used in determining the azimuth component of the device orientation provided that the tilt of the device is already computed. The magnetic sensor measures the Earth's magnetic field strength and fluctuations, and splits the measurement into X, Y, and Z components.

    The following factors can have an impact on the sensor readings:

    • The weather or the season of the year
      • @@ -981,11 +981,11 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data μT (micro Tesla) - values[1]: Y - float - μT (micro Tesla) - - + values[1]: Y + float + μT (micro Tesla) + + values[2]: Z float μT (micro Tesla) @@ -995,8 +995,8 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

      The magnetic sensor uses the 3-axis Cartesian space coordinate system, as the following figure illustrates.

      Figure: Magnetic field vector and axes

      Magnetic field vector and axes

      - - + +

      Orientation Sensor

      The orientation sensor combines the 3-axis accelerometer, 3-axis magnetic sensor, and 3-axis gyroscope to determine the orientation (rotation angles) of the device. The orientation is the output of a software/hardware-based sensor fusion solution which uses the accelerometer, magnetic sensor, and gyroscope. The orientation sensor output is an alternative representation to the rotation vector sensor output used to determine the rotation of the device, and it is calculated in terms of Euler angles:

        @@ -1043,15 +1043,15 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

        The angular positions are measured using a fixed frame reference (XE, YE, ZE).

        - +

        Figure: Angular positions and the fixed frame reference

        Angular positions and the fixed frame reference

        - - + +

        Pedometer

        -

        The pedometer detects the user's steps, and returns the number of steps taken by the user since the last reboot, while at least 1 application is using the pedometer. The timestamp of the event denotes the time when the last step was taken. In addition to the number of steps, it also returns other tracking data to further describe the user's activity status. For example, it provides the user's moving distance and burned calories. All the values are reset to zero when the system reboots.

        +

        The pedometer detects the user's steps, and returns the number of steps taken by the user since the last reboot, while at least 1 application is using the pedometer. The timestamp of the event denotes the time when the last step was taken. In addition to the number of steps, it also returns other tracking data to further describe the user's activity status. For example, it provides the user's moving distance and burned calories. All the values are reset to zero when the system reboots.

        Normally, a callback function is invoked whenever a new step is detected. However, to be power-efficient, the sensor can internally accumulate its detected events while the system sleeps. In this case, the accumulated data is reported when the system wakes up, that is, the display is switched on. In addition, even though the display is not switched on explicitly, the sensor can wake up the device to deliver its accumulated data occasionally.

        -

        If you want to track the user's steps continuously, do not stop the sensor listener to be sure that it keeps running. If there is no application listening to the sensor, it stops counting the steps.

        +

        If you want to track the user's steps continuously, do not stop the sensor listener to be sure that it keeps running. If there is no application listening to the sensor, it stops counting the steps.

        The following table lists the measurement data that the pedometer provides.

        Table: Measurement data detected by the pedometer

        @@ -1118,9 +1118,9 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

        The pedestrian state is SENSOR_PEDOMETER_STATE_UNKNOWN, SENSOR_PEDOMETER_STATE_STOP, SENSOR_PEDOMETER_STATE_WALK, or SENSOR_PEDOMETER_STATE_RUN.

        - +

        Pressure Sensor

        -

        The pressure sensor measures the atmospheric pressure in the device's surrounding environment.

        +

        The pressure sensor measures the atmospheric pressure in the device's surrounding environment.

        The following table lists the measurement data that the pressure sensor provides.

        Table: Measurement data detected by the pressure sensor

        @@ -1183,7 +1183,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data
        - +

        Rotation Vector Sensor

        The rotation vector sensor represents the orientation of the device as a combination of an angle and an axis, in which the device has rotated through a specific angle around an axis (x, y, or z). The rotation vector is the output of a software/hardware-based sensor fusion solution, which uses the accelerometer, gyroscope, and magnetic sensor as inputs to compute the orientation of the device.

        @@ -1197,11 +1197,11 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - + Measurement Type Range - Unit + Unit Timestamp @@ -1241,9 +1241,9 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

        Sleep Monitor

        -

        The sleep monitor tracks the user's sleep quality. Once per minute, it reports whether the user sleeps. As this sensor usually needs to track the sleep quality over several hours, it must be power-efficient and work in a batch manner. While the system sleeps, or the display is off, the sensor keeps its detected data internally. When the sensor is unable to keep more data (its internal buffer is full), it wakes up the system and flushes all collected data. When flushing, the callback function is invoked repeatedly. The timestamp of each event can be used to figure out when the user was sleeping.

        +

        The sleep monitor tracks the user's sleep quality. Once per minute, it reports whether the user sleeps. As this sensor usually needs to track the sleep quality over several hours, it must be power-efficient and work in a batch manner. While the system sleeps, or the display is off, the sensor keeps its detected data internally. When the sensor is unable to keep more data (its internal buffer is full), it wakes up the system and flushes all collected data. When flushing, the callback function is invoked repeatedly. The timestamp of each event can be used to figure out when the user was sleeping.

        The following table lists the measurement data that the sleep monitor provides.

        Table: Measurement data detected by the sleep monitor

        @@ -1263,7 +1263,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data Microseconds - values[0]: user's sleep state + values[0]: user's sleep state - @@ -1271,10 +1271,10 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data

        The sleep state is SENSOR_SLEEP_STATE_UNKNOWN, SENSOR_SLEEP_STATE_WAKE, or SENSOR_SLEEP_STATE_SLEEP.

        Depending on the device you are using, the available raw sensors are different and the sleep detection algorithm can also differ. In addition to the sleep state field, some specific device models can provide further data, as defined by the model manufacturer.

        - - + +

        Temperature Sensor

        -

        The temperature sensor measures the ambient room temperature in the device's surrounding environment.

        +

        The temperature sensor measures the ambient room temperature in the device's surrounding environment.

        The following table lists the measurement data that the temperature sensor provides.

        Table: Measurement data detected by the temperature sensor

        @@ -1303,7 +1303,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data -
        ℃
        +

        Ultraviolet Sensor

        The ultraviolet (UV) sensor measures the ultraviolet index. The sensor detects and provides a measure of the UV rays being exposed to the device.

        @@ -1316,7 +1316,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - + Measurement Type Range @@ -1336,7 +1336,7 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

        Uncalibrated Gyroscope

        The uncalibrated gyroscope detects angular velocity or angular rates of a device. The 3D uncalibrated gyroscope sensor is considered to be very sensitive in detecting incremental rotation angles. The rotation angles obtained by integrating the angular rates over longer duration is inaccurate due to the build-up of drift. The uncalibrated gyroscope data also consists of drift compensation values for each axis, which can be used to subtract the drift from the detected angular rates. The values of drift for the 3 axes are obtained from the output of a software/hardware-based sensor fusion solution.

        The following table lists the measurement data that the uncalibrated gyroscope provides.

        @@ -1394,9 +1394,9 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - +

        Uncalibrated Magnetic Sensor

        -

        The uncalibrated magnetic sensor is a 3-axis electronic compass (sometimes referred to as a "magnetometer" or "geomagnetic sensor"). It can also be used in determining the azimuth component of the device orientation provided that the tilt of the device is already computed. It measures the Earth's magnetic field strength and fluctuations, and splits the measurement into X, Y, and Z components. The uncalibrated magnetic sensor is similar in functionality to a magnetic sensor, but does not perform hard iron calibration. Factory calibration and temperature compensation are applied.

        +

        The uncalibrated magnetic sensor is a 3-axis electronic compass (sometimes referred to as a "magnetometer" or "geomagnetic sensor"). It can also be used in determining the azimuth component of the device orientation provided that the tilt of the device is already computed. It measures the Earth's magnetic field strength and fluctuations, and splits the measurement into X, Y, and Z components. The uncalibrated magnetic sensor is similar in functionality to a magnetic sensor, but does not perform hard iron calibration. Factory calibration and temperature compensation are applied.

        The following factors can have an impact on the sensor readings:

          @@ -1450,11 +1450,11 @@ example_sensor_recorder_callback(sensor_type_e type, sensor_recorder_data_h data - - - - + + + +
    diff --git a/org.tizen.guides/html/native/location_sensors/geofences_n.htm b/org.tizen.guides/html/native/location_sensors/geofences_n.htm index ea7bca9..057625d 100644 --- a/org.tizen.guides/html/native/location_sensors/geofences_n.htm +++ b/org.tizen.guides/html/native/location_sensors/geofences_n.htm @@ -22,7 +22,7 @@

    Dependencies

    +

    Content

    +

    Related Info

    @@ -81,20 +81,20 @@

    The geopoint geofences require a geopoint and a radius, and the Wi-Fi and Bluetooth geofences require a MAC address. Based on the defined geofence type, the geofence manager creates the fence for the particular application.

    Geofence Management through My Places

    -

    Tizen provides the user a way of managing the geofence places and fences through the My places application. The following figure shows the default places and supported fences.

    -

    Figure: My places

    -

    My places

    -

    My places controls the adding, removing, and updating of places and fences. Home, Office, and Car are the default places, and Map, Wi-Fi, and Bluetooth are the supported fence methods. Car supports only Wi-Fi and Bluetooth for a fence method.

    - +

    Tizen provides the user a way of managing the geofence places and fences through the My places application. The following figure shows the default places and supported fences.

    +

    Figure: My places

    +

    My places

    +

    My places controls the adding, removing, and updating of places and fences. Home, Office, and Car are the default places, and Map, Wi-Fi, and Bluetooth are the supported fence methods. Car supports only Wi-Fi and Bluetooth for a fence method.

    +

    Prerequisites

    - +

    To use the functions and data types of the Geofence Manager API, include the <geofence_manager.h> header file in your application:

     #include <geofence_manager.h>

    Starting the Geofence Service

    - +

    To start the geofence service:

    1. Create a geofence manager handle using the geofence_manager_create() function:

      @@ -107,7 +107,7 @@ geofence_manager_create(&manager);

    2. Create a place to be used for the geofences:

       int place_id = -1; /* This is for creating a place */
-geofence_manager_add_place(manager, "place_name", &place_id);
+geofence_manager_add_place(manager, "place_name", &place_id);
      @@ -123,15 +123,15 @@ geofence_manager_add_place(manager, "place_name", &place_id); double latitude = 12.756738; double longitude = 77.386474; int radius = 100; -char* address = "India"; +char* address = "India"; geofence_h fence_h; geofence_create_geopoint(place_id, latitude, longitude, radius, address, &fence_h);
    3. Bluetooth geofence: 
      -char* bssid = "82:45:67:7E:4A:3B";
-char* ssid = "Cafeteria";
+char* bssid = "82:45:67:7E:4A:3B";
+char* ssid = "Cafeteria";
 geofence_h fence_h;
 geofence_create_bluetooth(place_id, bssid, ssid, &fence_h);
      @@ -162,7 +162,7 @@ manager = NULL;

      If you destroy the handle, there is no need to call the geofence_manager_stop() function to stop the service as the service is automatically stopped. Also, you do not have to unset the previously set callbacks.

    Getting the Geofence Event State

    - +

    To get the state of all geofence events, use the geofence event callback. The geofence event callback is invoked whenever there is a request from the user, for example, to add a geofence or to start a geofence service.

      @@ -177,10 +177,10 @@ geofence_manage_e user_action; geofence_manager_error_e user_error; void geofence_event(int place_id, int geofence_id, geofence_manager_error_e error, -               geofence_manage_e manage, void *user_data) + geofence_manage_e manage, void *user_data) { -    user_action = manage; -    user_error = error; + user_action = manage; + user_error = error; } @@ -191,7 +191,7 @@ geofence_event(int place_id, int geofence_id, geofence_manager_error_e error,
    - +

    Tracking the User for Geofence Alerts

    @@ -202,7 +202,7 @@ geofence_event(int place_id, int geofence_id, geofence_manager_error_e error,

    Register the geofence state update callback using the geofence_manager_set_geofence_state_changed_cb() function.

     geofence_manager_set_geofence_state_changed_cb(manager, geofence_state_changed,
-                                               NULL);
+                                               NULL);

  • Define the callback function:

    @@ -244,14 +244,14 @@ geofence_status_destroy(status_h);
 
    Register the proximity state update callback using the geofence_manager_set_geofence_proximity_state_changed_cb() function.
    
 
     geofence_manager_set_geofence_proximity_state_changed_cb(manager,
-                                                         proximity_state_changed,
-                                                         NULL);
+                                                         proximity_state_changed,
+                                                         NULL);

  • Define the callback function:

     void
-proximity_state_changed(int geofence_id, geofence_proximity_state_e state, 
-                        geofence_proximity_provider_e provider, void *user_data) {}
+proximity_state_changed(int geofence_id, geofence_proximity_state_e state,
+                        geofence_proximity_provider_e provider, void *user_data) {}

    • Retrieving Geofence Information

    diff --git a/org.tizen.guides/html/native/location_sensors/gesture_n.htm b/org.tizen.guides/html/native/location_sensors/gesture_n.htm index 13d05ae..11ceb22 100644 --- a/org.tizen.guides/html/native/location_sensors/gesture_n.htm +++ b/org.tizen.guides/html/native/location_sensors/gesture_n.htm @@ -60,14 +60,14 @@

    The following gesture events are supported in Tizen devices:

    - + - + +
    Note You can test the gesture recognition functionality only on a target device. The emulator does not support this feature.
    -

    Prerequisites

    +

    Prerequisites

    To use the functions and data types of the Gesture Recognition API (in mobile and wearable applications), include the <gesture_recognition.h> header file in your application:

     #include <gesture_recognition.h>
    - +

    Detecting Gestures

    - +

    To set and unset callback functions for user gestures:

      @@ -136,7 +136,7 @@ gesture_create(&handle); 
       gesture_start_recognition(handle, GESTURE_PICK_UP, GESTURE_OPTION_DEFAULT,
-                          gesture_cb, NULL);
+                          gesture_cb, NULL);

      The above example starts gesture detection to receive notifications when the GESTURE_PICK_UP gesture is detected. The application can use any of the gesture_type_e enumerators (in mobile and wearable applications) in place of the GESTURE_PICK_UP value. Note that not all gestures are supported by all devices. In such cases, the function returns the GESTURE_ERROR_NOT_SUPPORTED value.

      @@ -148,15 +148,15 @@ gesture_start_recognition(handle, GESTURE_PICK_UP, GESTURE_OPTION_DEFAULT, 
       void
 gesture_cb(gesture_type_e gesture, const gesture_data_h data,
-           double timestamp, gesture_error_e error, void *user_data)
+           double timestamp, gesture_error_e error, void *user_data)
 {
-    gesture_event_e event;
-    if (gesture == GESTURE_PICK_UP) {
-        gesture_get_event(data, &event);
+    gesture_event_e event;
+    if (gesture == GESTURE_PICK_UP) {
+        gesture_get_event(data, &event);
 
-        if (event == GESTURE_EVENT_DETECTED)
-            /* Handle the event */
-    }
+        if (event == GESTURE_EVENT_DETECTED)
+            /* Handle the event */
+    }
 }
      @@ -169,7 +169,7 @@ gesture_cb(gesture_type_e gesture, const gesture_data_h data, int x; int y; if (gesture == GESTURE_TILT) -    gesture_get_tilt(data, &x, &y); + gesture_get_tilt(data, &x, &y);

    1. When gesture detection is no longer needed, unset the callback functions with the gesture_stop_recognition() function and destroy the handle with the gesture_release() function:

      @@ -178,7 +178,7 @@ if (gesture == GESTURE_TILT) gesture_stop_recognition(handle); gesture_release(handle);
    - + diff --git a/org.tizen.guides/html/native/location_sensors/here_credentials_n.htm b/org.tizen.guides/html/native/location_sensors/here_credentials_n.htm index 9706df0..78bd1f8 100644 --- a/org.tizen.guides/html/native/location_sensors/here_credentials_n.htm +++ b/org.tizen.guides/html/native/location_sensors/here_credentials_n.htm @@ -19,11 +19,11 @@

    Mobile native

    -
    +

    Dependencies

    • Tizen 2.4 and Higher for Mobile
      • -
    +

    Related Info

    - +

    Getting HERE Maps Credentials

    The HERE Maps Plug-in for the Maps Service API is based on the HERE Maps services. It is provided as an example in the Tizen platform, and to use it on the HERE Maps, you need credentials for it.

    @@ -59,7 +59,7 @@
  • Register a new application.

    You must register a new application to create new credentials.

    - +
    Note Some regions or countries do not support the registration. If your contact details contain such a region or country, you cannot register a new application successfully. @@ -80,12 +80,12 @@
  • Use the credentials in your application.

    You can use the credentials in your application with the maps_service_set_provider_key() function.

    -

    The HERE Maps services provides 2 values as credentials: app ID and app code. If the app ID is XXXX and the app code is YYYY, concatenate them with the "/" separator:

    +

    The HERE Maps services provides 2 values as credentials: app ID and app code. If the app ID is XXXX and the app code is YYYY, concatenate them with the "/" separator:

     maps_service_h maps = NULL;
-int error = maps_service_create("HERE", &maps);
-error = maps_service_set_provider_key(maps, "XXXX/YYYY")
+int error = maps_service_create("HERE", &maps);
+error = maps_service_set_provider_key(maps, "XXXX/YYYY")
    diff --git a/org.tizen.guides/html/native/location_sensors/location_n.htm b/org.tizen.guides/html/native/location_sensors/location_n.htm index bcab009..a3d7311 100644 --- a/org.tizen.guides/html/native/location_sensors/location_n.htm +++ b/org.tizen.guides/html/native/location_sensors/location_n.htm @@ -24,7 +24,7 @@
    • Tizen 2.4 and Higher for Mobile
    • Tizen 2.3.1 and Higher for Wearable
      • -
    +

    Content

    • Location Service
      • @@ -52,79 +52,79 @@

      Location Information

      - -

      Location information has a geographical point on the Earth, and optionally location-related information can also contain information about altitude, accuracy about the geographical point and altitude, and the user speed and course of direction. The location manager features include managing location information on the device.

      -

      The main features of the Location Manager API include:

      -
        + +

        Location information has a geographical point on the Earth, and optionally location-related information can also contain information about altitude, accuracy about the geographical point and altitude, and the user speed and course of direction. The location manager features include managing location information on the device.

        +

        The main features of the Location Manager API include:

        + - -

        Location Service

        - -

        The Location Manager API (in mobile and wearable applications) provides the current location using the location sources specified in the location method. You can use the location service to manage location information in various ways.

        -

        With the location manager, you can:

        - + +

        Location Service

        + +

        The Location Manager API (in mobile and wearable applications) provides the current location using the location sources specified in the location method. You can use the location service to manage location information in various ways.

        +

        With the location manager, you can:

        + - - + +
        Note To test the Tizen location-based services on the emulator, provide location data (longitude and latitude) using the Event Injector.

        However, satellite data is not supported on the emulator, so GPS status data is available only on a target device.

        - -

        Asynchronous location-related updates and region monitoring notifications are implemented with callback interfaces (functions whose names end with "cb").

        -

        You can use the location state and updates as follows:

        -
          -

        • If the location manager is working correctly, the location state is set to LOCATIONS_SERVICE_ENABLED. The device can receive notifications about location updates and accuracy changes only in this update state.

          • -

        • If the location manager is unable to run on the requested device due to weak radio reception, the location update state is set to LOCATIONS_SERVICE_DISABLED (LOCATIONS_ERROR_SERVICE_NOT_AVAILABLE). If this situation persists for a longer period, it is recommended to stop the service and try again to conserve the device battery.

          • -

        • If the user revokes a permission for the application to use location information, the location update state is set to LOCATIONS_ACCESS_STATE_DENIED, and the location manager stops all on-going services with the application. The application can request the device user for a permission to continue the stopped service.

          • -
        - + +

        Asynchronous location-related updates and region monitoring notifications are implemented with callback interfaces (functions whose names end with "cb").

        +

        You can use the location state and updates as follows:

        +
          +

        • If the location manager is working correctly, the location state is set to LOCATIONS_SERVICE_ENABLED. The device can receive notifications about location updates and accuracy changes only in this update state.

          • +

        • If the location manager is unable to run on the requested device due to weak radio reception, the location update state is set to LOCATIONS_SERVICE_DISABLED (LOCATIONS_ERROR_SERVICE_NOT_AVAILABLE). If this situation persists for a longer period, it is recommended to stop the service and try again to conserve the device battery.

          • +

        • If the user revokes a permission for the application to use location information, the location update state is set to LOCATIONS_ACCESS_STATE_DENIED, and the location manager stops all on-going services with the application. The application can request the device user for a permission to continue the stopped service.

          • +
        +

        Location Methods

        -

        The location method is used to specify the desired quality of service of the location manager. For example, a location-based weather forecast application can require location-related information just to distinguish a city or a neighborhood, while a GPS navigation application can require the highest quality level to pinpoint a map location. Selecting the appropriate quality level not only helps the location manager to run the system efficiently, but also leads to a good user experience.

        +

        The location method is used to specify the desired quality of service of the location manager. For example, a location-based weather forecast application can require location-related information just to distinguish a city or a neighborhood, while a GPS navigation application can require the highest quality level to pinpoint a map location. Selecting the appropriate quality level not only helps the location manager to run the system efficiently, but also leads to a good user experience.

        Using the location_method_e structure (in mobile and wearable applications) allows your application to specify the following methods of location positioning system:

        -
          -
        • GPS, which uses the global positioning system
          • +
            +
          • GPS, which uses the global positioning system
          • WPS, which uses the Wi-Fi positioning system
            • -
          • Hybrid, which selects the best method available at the moment
            • -
          - -

          Based on the desired method, the location manager provides best-effort location-based services, such as an asynchronous location update or region monitoring notification.

          +
        • Hybrid, which selects the best method available at the moment
          • +
        + +

        Based on the desired method, the location manager provides best-effort location-based services, such as an asynchronous location update or region monitoring notification.

        -

        Location Settings

        +

        Location Settings

        -

        Tizen provides a robust way of controlling the usage of the location data through the device location settings. The following figure shows the various options for enabling or disabling specific positioning technologies.

        -

        Figure: Location settings and indicator

        -

        Location settings and indicator

        +

        Tizen provides a robust way of controlling the usage of the location data through the device location settings. The following figure shows the various options for enabling or disabling specific positioning technologies.

        +

        Figure: Location settings and indicator

        +

        Location settings and indicator

        The location-related functions work differently based on whether the location settings are used.

        -

        The GPS setting controls the Global Positioning System usage. It uses GPS satellite signals and provides accurate positioning services, generally outdoors. The Wireless networks setting enables the usage of network-based positioning technology, which includes Wi-Fi and cell tower-based positioning, and improves the coverage of positioning services to indoors.

        -

        All location settings are initially enabled, if the device supports GPS. To disable them, the user must manually toggle the buttons. The manual task required from the user is understood as an implicit user consent.

        +

        The GPS setting controls the Global Positioning System usage. It uses GPS satellite signals and provides accurate positioning services, generally outdoors. The Wireless networks setting enables the usage of network-based positioning technology, which includes Wi-Fi and cell tower-based positioning, and improves the coverage of positioning services to indoors.

        +

        All location settings are initially enabled, if the device supports GPS. To disable them, the user must manually toggle the buttons. The manual task required from the user is understood as an implicit user consent.

        + -
        Note Either the GPS or the Wireless networks setting must be enabled to retrieve the current location of the device user.
        -

        Once the GPS or Wireless networks setting is enabled, the user can control the usage of the location data for each application separately using the privacy setting. If the privacy setting of the application is disabled, location data is no longer available for the application.

        -

        The applications whose location setting is enabled can get the current and last known location of the user.

        +

        Once the GPS or Wireless networks setting is enabled, the user can control the usage of the location data for each application separately using the privacy setting. If the privacy setting of the application is disabled, location data is no longer available for the application.

        +

        The applications whose location setting is enabled can get the current and last known location of the user.

        Prerequisites

        - +

        To use the functions and data types of the Location Manager API (in mobile and wearable applications), include the <locations.h> header file in your application:

         #include <locations.h>
@@ -134,7 +134,7 @@
 
 
        To start the location service:
        
 
          
-
        1. Create a location manager handle using the location_manager_create() function before you use the location service.
           
+
        2. Create a location manager handle using the location_manager_create() function before you use the location service.
          
 
          In this example, the GPS is used as the source of the position data, so the first parameter is LOCATIONS_METHOD_GPS. You can use other values of the location_method_e enumeration (in mobile and wearable applications), such as LOCATIONS_METHOD_HYBRID or LOCATIONS_METHOD_WPS. LOCATIONS_METHOD_HYBRID uses both LOCATIONS_METHOD_GPS and LOCATIONS_METHOD_WPS, but the latter is less accurate.
          
 
           location_manager_h manager;
@@ -157,7 +157,7 @@ location_manager_stop(manager);
 location_manager_destroy(manager);
 manager = NULL;
 
          
-
          If you destroy the handle, there is no need to call the location_manager_stop() function to stop the service. The service is automatically stopped. Also, you do not have to unset previously set callbacks.
          
+
        If you destroy the handle, there is no need to call the location_manager_stop() function to stop the service. The service is automatically stopped. Also, you do not have to unset previously set callbacks.
        
 
 
        Getting the Last Known Location
        
 
@@ -174,7 +174,7 @@ static location_service_state_e service_state;
 static void
 __state_changed_cb(location_service_state_e state, void *user_data)
 {
-    service_state = state;
+    service_state = state;
 }
        @@ -191,11 +191,11 @@ double vertical; location_accuracy_level_e level; time_t timestamp; ret = location_manager_get_last_location(manager, &altitude, &latitude, &longitude, -                                         &climb, &direction, &speed, &level, &horizontal, -                                         &vertical, &timestamp); + &climb, &direction, &speed, &level, &horizontal, + &vertical, &timestamp); -

        The function returns the last location stored in the system. When the current location is not fixed, the last location may not be the current location, but the old location.

        +

        The function returns the last location stored in the system. When the current location is not fixed, the last location may not be the current location, but the old location.

        Use this function instead of repeatedly requesting current locations to spare the location manager from running costly positioning systems.

      • To get the current location information, call the location_manager_get_location() function after the service is enabled: @@ -203,22 +203,22 @@ ret = location_manager_get_last_location(manager, &altitude, &latitude, static void __state_changed_cb(location_service_state_e state, void *user_data) { -    double altitude; -    double latitude; -    double longitude; -    double climb; -    double direction; -    double speed; -    double horizontal; -    double vertical; -    location_accuracy_level_e level; -    time_t timestamp; - -    if (state == LOCATIONS_SERVICE_ENABLED) { -        ret = location_manager_get_location(manager, &altitude, &latitude, &longitude, -                                            &climb, &direction, &speed, &level, -                                            &horizontal, &vertical, &timestamp); -    } + double altitude; + double latitude; + double longitude; + double climb; + double direction; + double speed; + double horizontal; + double vertical; + location_accuracy_level_e level; + time_t timestamp; + + if (state == LOCATIONS_SERVICE_ENABLED) { + ret = location_manager_get_location(manager, &altitude, &latitude, &longitude, + &climb, &direction, &speed, &level, + &horizontal, &vertical, &timestamp); + } }
        • @@ -230,7 +230,7 @@ location_manager_unset_service_state_changed_cb(manager);

        Getting Location Updates

        -

        You can get a notification of the position update using the position update callback. The callback is invoked periodically, receiving the device's current position with every call. You can use the callback to retrieve the device position (given as coordinates) and convert it to the corresponding address.

        +

        You can get a notification of the position update using the position update callback. The callback is invoked periodically, receiving the device's current position with every call. You can use the callback to retrieve the device position (given as coordinates) and convert it to the corresponding address.

        1. Register the callback using the location_manager_set_position_updated_cb() function:

           location_manager_set_position_updated_cb(manager, position_updated, 2, NULL);
@@ -242,10 +242,10 @@ static double user_latitude;
 static double user_longitude;
 static void
 position_updated(double latitude, double longitude, double altitude,
-                 time_t timestamp, void *user_data)
+                 time_t timestamp, void *user_data)
 {
-    user_latitude = latitude;
-    user_longitude = longitude;
+    user_latitude = latitude;
+    user_longitude = longitude;
 }
          @@ -254,7 +254,7 @@ position_updated(double latitude, double longitude, double altitude, Note The callback is called only if the location manager has been started. The same holds for all other callbacks registered with the manager.
    • - +

    Using Location Bounds

    @@ -288,10 +288,10 @@ static double longitude; static bool capi_poly_coords_cb(location_coords_s coords, void *user_data) { -    latitude = coords.latitude; -    longitude = coords.longitude; + latitude = coords.latitude; + longitude = coords.longitude; -    return true; + return true; } @@ -305,7 +305,7 @@ static location_boundary_state_e bound_state; static void bounds_state_changed_cb(location_boundary_state_e state, void *user_data) { -    bound_state = state; + bound_state = state; } @@ -319,7 +319,7 @@ location_manager_add_boundary(manager, bounds_poly); 
     location_bounds_destroy(bounds_poly);
    - +

    Getting Satellite Information

    @@ -327,7 +327,7 @@ location_bounds_destroy(bounds_poly);

    1. Register the callback using the location_manager_set_satellite_updated_cb() function:

       gps_status_set_satellite_updated_cb(manager, capi_gps_status_satellite_updated_cb,
-                                    10, NULL);
+                                    10, NULL);

      The third parameter determines the frequency of callback calls. In this example, the callback is called every 10 seconds.

    2. When the update is received, the callback containing brief satellite information is called. To get the detailed satellite information in the sky, call the gps_status_foreach_satellites_in_view() function in the callback. Variables that store the current satellite information are updated. @@ -340,15 +340,15 @@ int cur_snr; static bool capi_gps_status_get_satellites_cb(unsigned int azimuth, unsigned int elevation, -                                  unsigned int prn, int snr, -                                  bool is_in_use, void *user_data) + unsigned int prn, int snr, + bool is_in_use, void *user_data) { -    cur_azimuth = azimuth; -    cur_elevation = elevation; -    cur_prn = prn; -    cur_snr = snr; + cur_azimuth = azimuth; + cur_elevation = elevation; + cur_prn = prn; + cur_snr = snr; -    return true; + return true; } static int numofactive; @@ -356,13 +356,13 @@ static int numofinview; static void capi_gps_status_satellite_updated_cb(int num_of_active, int num_of_inview, -                                     time_t timestamp, void *user_data) + time_t timestamp, void *user_data) { -    numofinview = num_of_active; -    if (num_of_inview > 0) -        gps_status_foreach_satellites_in_view(manager, -                                              capi_gps_status_get_satellites_cb, -                                              NULL); + numofinview = num_of_active; + if (num_of_inview > 0) + gps_status_foreach_satellites_in_view(manager, + capi_gps_status_get_satellites_cb, + NULL); } @@ -370,15 +370,15 @@ capi_gps_status_satellite_updated_cb(int num_of_active, int num_of_inview, Note The callback is called only if the location manager has been started. The same holds for all other callbacks registered with the manager.
    - +

    Tracking the Route

    To get information about the current position, velocity, and distance:

    - +
    1. Receive periodic notifications.
      1. -

        To get notifications of the position and velocity updates, register the position and velocity update callbacks. The callbacks are invoked periodically, receiving the device's current position or velocity with every call.

        +

        To get notifications of the position and velocity updates, register the position and velocity update callbacks. The callbacks are invoked periodically, receiving the device's current position or velocity with every call.

        • Register the position update callback using the location_manager_set_position_updated_cb() function:

          @@ -399,10 +399,10 @@ location_manager_set_position_updated_cb(manager, velocity_updated, 2, NULL); 
           void
 position_updated(double latitude, double longitude, double altitude,
-                 time_t timestamp, void *user_data) {}
+                 time_t timestamp, void *user_data) {}
 void
 velocity_updated(double speed, double direction, double climb,
-                 time_t timestamp, void *user_data) {}
+                 time_t timestamp, void *user_data) {}

          Within the callback, you can collect obtained data to get the points you have visited, to calculate traveled distance more precisely, or to calculate the average speed or climb.

      2. @@ -417,7 +417,7 @@ double altitude; double latitude; double longitude; location_manager_get_position(manager, &altitude, &latitude, -                              &longitude, &timestamp); + &longitude, &timestamp);

    2. To get information about the current velocity (climb in km/h, direction as degrees from the north, and speed in km/h), use the location_manager_get_velocity() function:

      @@ -442,8 +442,8 @@ location_manager_get_accuracy(manager, &level, &horizontal, &vertica 
       location_manager_get_location(manager, &altitude, &latitude, &longitude, &climb,
-                              &direction, &speed, &level,
-                              &horizontal, &vertical, &timestamp);
+                              &direction, &speed, &level,
+                              &horizontal, &vertical, &timestamp);

    3. If the location service is currently unavailable, get the last values recorded by the location manager when the GPS signal was available. To get the information, use the following functions:

      diff --git a/org.tizen.guides/html/native/location_sensors/location_sensors_cover_n.htm b/org.tizen.guides/html/native/location_sensors/location_sensors_cover_n.htm index 9345568..c534d4d 100644 --- a/org.tizen.guides/html/native/location_sensors/location_sensors_cover_n.htm +++ b/org.tizen.guides/html/native/location_sensors/location_sensors_cover_n.htm @@ -5,13 +5,13 @@ - + - Location and Sensors + Location and Sensors @@ -28,10 +28,10 @@

      Related Info

      +
    4. Creating Applications with Sensors
      5. +
    -
    +

    Location and Sensors

    @@ -67,7 +67,7 @@ - +
    diff --git a/org.tizen.guides/html/native/location_sensors/maps_n.htm b/org.tizen.guides/html/native/location_sensors/maps_n.htm index e4cf28a..9a9ca85 100644 --- a/org.tizen.guides/html/native/location_sensors/maps_n.htm +++ b/org.tizen.guides/html/native/location_sensors/maps_n.htm @@ -24,10 +24,10 @@ +

    Content

    - +
    Note - To use the map service, you must get an access key to the map provider from the provider developer site. The service must be used according to the provider's Term of Use. + To use the map service, you must get an access key to the map provider from the provider developer site. The service must be used according to the provider's Term of Use.

    Geocodes

    @@ -111,7 +111,7 @@
  • Get a structured address based on place coordinates.

    • You can parse the reverse geocode response to use its details. The response consists of structured address information, comprising, for example, of a street name, building number, city name, postal code, district name, state name, and country.

    - +

    Place Search

    The following place search request types are provided:

    @@ -121,7 +121,7 @@
  • Query place information based on a free text address within a specified geographical area.

    • After performing the place service request, you receive the place search response. You can parse the place search response to use its details. The response consists of structured place information, comprising, for example, of a place ID, name and URL, address, geographical location and distance from the center of the search area, place category, rating, review, and image.

    - +
    Note @@ -135,9 +135,9 @@
  • Query a route passing through a number of geographical locations.

    • After performing the route service request, you receive the route search response. You can parse the route calculation response to use its details. The response consists of structured route information, comprising, for example, of a route ID, geographical coordinates of the start and destination point, route bounding box, transportation mode, and total distance and duration.

    - - - + + +
    Note Depending on the map provider, the route can be presented as a list of geographical points or segments. The segment list can also be presented as a list of geographical points or maneuvers. @@ -154,7 +154,7 @@
  • MAPS_ERROR_PERMISSION_DENIED: The user has revoked a permission for the application to use the map service.
  • MAPS_ERROR_NOT_SUPPORTED: The map request or feature you are trying to use is not supported in the map provider.
  • MAPS_ERROR_NETWORK_UNREACHABLE, MAPS_ERROR_SERVICE_NOT_AVAILABLE, or MAPS_ERROR_CONNECTION_TIME_OUT: The map provider cannot access the map server for various reasons.
    • - +

    Map View Widget

    @@ -194,9 +194,9 @@

    To use the Maps Service API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/internet</privilege>
-   <!--To use the map view-->
-   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/internet</privilege>
+   <!--To use the map view-->
+   <privilege>http://tizen.org/privilege/network.get</privilege>
 </privileges>
    @@ -221,22 +221,22 @@ static bool _maps_service_provider_info_cb(char* maps_provider, void* user_data) { -    /* Handle the map provider name, passed as maps_provider */ + /* Handle the map provider name, passed as maps_provider */ -    return bool; + return bool; } void get_available_providers() { -    void *user_data = NULL; -    const int error = maps_service_foreach_provider(_maps_service_provider_info_cb, -                                                    user_data); - -    if (error == MAPS_ERROR_NONE) -        /* Select a provider from the available_providers vector */ -    else -        /* Error handling */ + void *user_data = NULL; + const int error = maps_service_foreach_provider(_maps_service_provider_info_cb, + user_data); + + if (error == MAPS_ERROR_NONE) + /* Select a provider from the available_providers vector */ + else + /* Error handling */ } @@ -244,13 +244,13 @@ get_available_providers()
  • Before you use the Maps Service API, create a Maps Service instance using the maps_service_create() function: 
     maps_service_h maps = NULL;
-int error = maps_service_create("Maps Provider", &maps);
+int error = maps_service_create("Maps Provider", &maps);
  • Set the security key appropriate to the selected map provider using the maps_service_set_provider_key() function: 
    -error = maps_service_set_provider_key(maps, "XXXYYYZZZ");
+error = maps_service_set_provider_key(maps, "XXXYYYZZZ");
    • @@ -260,15 +260,15 @@ bool supported = false; /* Check whether routing is available */ error = maps_service_provider_is_service_supported(maps, MAPS_SERVICE_SEARCH_ROUTE, -                                                   &supported); + &supported); const bool is_routing_supported = (error == MAPS_ERROR_NONE) ? supported : false; /* Check whether routing through specified waypoints is available */ error = maps_service_provider_is_service_supported(maps, -                                                   MAPS_SERVICE_SEARCH_ROUTE_WAYPOINTS, -                                                   &supported); + MAPS_SERVICE_SEARCH_ROUTE_WAYPOINTS, + &supported); const bool is_routing_waypoints_supported = -    (error == MAPS_ERROR_NONE) ? supported : false; + (error == MAPS_ERROR_NONE) ? supported : false;

    To check for the availability of other services, follow the same approach using the keys from the maps_service_e enumerator (in mobile and wearable applications).

    @@ -279,23 +279,23 @@ const bool is_routing_waypoints_supported = error = maps_service_provider_is_data_supported(maps, MAPS_ROUTE_PATH, &supported); const bool is_route_path_supported = (error == MAPS_ERROR_NONE) ? supported : false; if (is_route_path_supported) -    /* Use route path */ + /* Use route path */ /* Check whether segment path data is supported */ error = maps_service_provider_is_data_supported(maps, MAPS_ROUTE_SEGMENTS_PATH, -                                                &supported); + &supported); const bool is_route_segment_path_supported = -    (error == MAPS_ERROR_NONE) ? supported : false; + (error == MAPS_ERROR_NONE) ? supported : false; if (is_route_segment_path_supported) -    /* Use segment path */ + /* Use segment path */ /* Check whether segment maneuver data is supported */ error = maps_service_provider_is_data_supported(maps, MAPS_ROUTE_SEGMENTS_MANEUVERS, -                                                &supported); + &supported); const bool is_route_segment_maneuvers_supported = -    (error == MAPS_ERROR_NONE) ? supported : false; + (error == MAPS_ERROR_NONE) ? supported : false; if (is_route_segment_maneuvers_supported) -    /* Use segment maneuvers */ + /* Use segment maneuvers */

    To check the availability of other data features, follow the same approach using the keys from the maps_service_data_e enumerator (in mobile and wearable applications).

    @@ -306,27 +306,27 @@ if (is_route_segment_maneuvers_supported) maps_preference_h preference = NULL; int error = maps_preference_create(&preference); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Set the distance unit preference */ error = maps_preference_set_distance_unit(preference, MAPS_DISTANCE_UNIT_M); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Set the language preference */ -error = maps_preference_set_language(preference, "en-US"); +error = maps_preference_set_language(preference, "en-US"); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Apply the set of preferences for the map service */ error = maps_service_set_preference(maps, preference); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Destroy the preference set instance */ error = maps_preference_destroy(preference); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */

    Optionally, you can set the maximum amount of search results and a default country code using the maps_preference_set_max_results() and maps_preference_set_country_code() functions.

    To set specific preferences for the map provider, use the maps_preference_set_property() function with key-value pairs, defined in the appropriate map provider documentation.

    @@ -353,12 +353,12 @@ if (error != MAPS_ERROR_NONE)
  • Request the geocode:
    • Use the maps_service_geocode() function for a request based on a free-formed address: 
      -/* Search for geocode of the Samsung's campus "Digital City" in Suwon */
-error = maps_service_geocode(maps, "Suwon, Digital City", preference,
-                             __maps_service_geocode_cb, user_data, &request_id);
+/* Search for geocode of the Samsung's campus "Digital City" in Suwon */
+error = maps_service_geocode(maps, "Suwon, Digital City", preference,
+                             __maps_service_geocode_cb, user_data, &request_id);
 
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      • @@ -371,12 +371,12 @@ maps_area_h bounds = NULL; */ /* Search for geocode of the Digital City within a specified geographic area */ -error = maps_service_geocode_inside_area(maps, "Digital City", bounds, preference, -                                         __maps_service_geocode_cb, -                                         user_data, &request_id); +error = maps_service_geocode_inside_area(maps, "Digital City", bounds, preference, + __maps_service_geocode_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -388,11 +388,11 @@ maps_address_h address = NULL; /* Search for a geocode of a place, specified with a structured address */ error = maps_service_geocode_by_structured_address(maps, address, preference, -                                                   __maps_service_geocode_cb, -                                                   user_data, &request_id); + __maps_service_geocode_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */
    • @@ -400,14 +400,14 @@ if (error != MAPS_ERROR_NONE) 
     static bool
 __maps_service_geocode_cb(maps_error_e result, int request_id, int index, int total,
-                          maps_coordinates_h coordinates, void* user_data)
+                          maps_coordinates_h coordinates, void* user_data)
 {
-    /* Handle the obtained coordinate data */
+    /* Handle the obtained coordinate data */
 
-    /* Release the results */
-    maps_coordinates_destroy(coordinates);
+    /* Release the results */
+    maps_coordinates_destroy(coordinates);
 
-    return true;
+    return true;
 }
    @@ -420,11 +420,11 @@ __maps_service_geocode_cb(maps_error_e result, int request_id, int index, int to 
     /* Obtain the reverse geocode with specified coordinates */
 error = maps_service_reverse_geocode(maps, 37.257865, 127.053659, preference,
-                                     __maps_service_reverse_geocode_cb,
-                                     user_data, &request_id);
+                                     __maps_service_reverse_geocode_cb,
+                                     user_data, &request_id);
 
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    @@ -432,13 +432,13 @@ if (error != MAPS_ERROR_NONE) 
     static void
 __maps_service_reverse_geocode_cb(maps_error_e result, int request_id,
-                                  int index, int total,
-                                  maps_address_h address, void* user_data)
+                                  int index, int total,
+                                  maps_address_h address, void* user_data)
 {
-    /* Handle the obtained address */
+    /* Handle the obtained address */
 
-    /* Release the results */
-    maps_address_destroy(address);
+    /* Release the results */
+    maps_address_destroy(address);
 }
    @@ -460,11 +460,11 @@ maps_coordinates_h position = NULL; int distance = 500; error = maps_service_search_place(maps, position, distance, filter, -                                  preference, __maps_service_search_place_cb, -                                  user_data, &request_id); + preference, __maps_service_search_place_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -477,11 +477,11 @@ maps_area_h boundary = NULL; */ error = maps_service_search_place_by_area(maps, boundary, filter, preference, -                                          __maps_service_search_place_cb, -                                          user_data, &request_id); + __maps_service_search_place_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -493,13 +493,13 @@ maps_area_h boundary = NULL; or maps_area_create_circle() */ -error = maps_service_search_place_by_address(maps, "Digital City", boundary, -                                             filter, preference, -                                             __maps_service_search_place_cb, -                                             user_data, &request_id); +error = maps_service_search_place_by_address(maps, "Digital City", boundary, + filter, preference, + __maps_service_search_place_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -507,14 +507,14 @@ if (error != MAPS_ERROR_NONE) 
     static bool
 __maps_service_search_place_cb(maps_error_e error, int request_id, int index,
-                               int total, maps_place_h place, void* user_data)
+                               int total, maps_place_h place, void* user_data)
 {
-    /* Handle the obtained place data */
+    /* Handle the obtained place data */
 
-    /* Release the results */
-    maps_place_destroy(place);
+    /* Release the results */
+    maps_place_destroy(place);
 
-    return true;
+    return true;
 }
    @@ -532,11 +532,11 @@ maps_area_h boundary = NULL; */ error = maps_service_search_place_list(maps, boundary, filter, preference, -                                       __maps_service_search_place_list_cb, -                                       user_data, &request_id); + __maps_service_search_place_list_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -544,17 +544,17 @@ if (error != MAPS_ERROR_NONE) 
     static bool
 __maps_service_search_place_list_cb(maps_error_e error,
-                                    int request_id, int total,
-                                    maps_place_list_h place_list,
-                                    void* user_data)
+                                    int request_id, int total,
+                                    maps_place_list_h place_list,
+                                    void* user_data)
 {
-    /* Handle the obtained place data */
-    maps_place_list_foreach(place_list, __maps_place_details_cb, user_data);
+    /* Handle the obtained place data */
+    maps_place_list_foreach(place_list, __maps_place_details_cb, user_data);
 
-    /* Release the results */
-    maps_place_list_destroy(place_list);
+    /* Release the results */
+    maps_place_list_destroy(place_list);
 
-    return true;
+    return true;
 }
    @@ -564,18 +564,18 @@ __maps_service_search_place_list_cb(maps_error_e error, static bool __maps_place_details_cb(int index, maps_place_h place, void *user_data) { -    /* Handle the obtained place data */ + /* Handle the obtained place data */ -    /* Get and store the URI to get the place details later */ -    char *place_uri = NULL; -    maps_place_get_uri(place, &place_uri); + /* Get and store the URI to get the place details later */ + char *place_uri = NULL; + maps_place_get_uri(place, &place_uri); -    /* -     Do not release the place handle, -     because it is just a reference to the list data -    */ + /* + Do not release the place handle, + because it is just a reference to the list data + */ -    return true; + return true; } @@ -585,11 +585,11 @@ __maps_place_details_cb(int index, maps_place_h place, void *user_data)
    • Use the maps_service_get_place_details() function to retrieve the place details: 
       error = maps_service_get_place_details(maps, place_uri,
-                                       __maps_service_get_place_details_cb,
-                                       user_data, &request_id);
+                                       __maps_service_get_place_details_cb,
+                                       user_data, &request_id);
 
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      • @@ -597,12 +597,12 @@ if (error != MAPS_ERROR_NONE) 
       static void
 __maps_service_get_place_details_cb(maps_error_e result, int request_id,
-                                    maps_place_h place, void *user_data)
+                                    maps_place_h place, void *user_data)
 {
-    /* Handle the obtained place data */
+    /* Handle the obtained place data */
 
-    /* Release the results */
-    maps_place_destroy(place);
+    /* Release the results */
+    maps_place_destroy(place);
 }
      @@ -625,11 +625,11 @@ maps_coordinates_h origin = NULL, destination = NULL; /* Create the coordinates with maps_coordinates_create() */ error = maps_service_search_route(maps, origin, destination, preference, -                                  __maps_service_search_route_cb, -                                  user_data, &request_id); + __maps_service_search_route_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -643,12 +643,12 @@ const int waypoint_num = 5; maps_coordinates_h* waypoint_list = NULL; error = maps_service_search_route_waypoints(maps, waypoint_list, -                                            waypoint_num, preference, -                                            __maps_service_search_route_cb, -                                            user_data, &request_id); + waypoint_num, preference, + __maps_service_search_route_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */
    @@ -657,14 +657,14 @@ if (error != MAPS_ERROR_NONE) 
     static bool
 __maps_service_search_route_cb(maps_error_e error, int request_id, int index, int total,
-                               maps_route_h route, void* user_data)
+                               maps_route_h route, void* user_data)
 {
-    /* Handle the obtained route data */
+    /* Handle the obtained route data */
 
-    /* Release the results */
-    maps_route_destroy(route);
+    /* Release the results */
+    maps_route_destroy(route);
 
-    return true;
+    return true;
 }
    @@ -678,7 +678,7 @@ __maps_service_search_route_cb(maps_error_e error, int request_id, int index, in error = maps_service_cancel_request(maps, request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */

    Recognizing the Address Information

    @@ -691,7 +691,7 @@ char *building_number = NULL; error = maps_address_get_building_number(address, &building_number); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the building_number */ @@ -702,7 +702,7 @@ char *street = NULL; error = maps_address_get_street(address, &street); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the street name */ @@ -744,7 +744,7 @@ free(street); char *name = NULL; error = maps_place_get_name(place, &name); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the place name */ @@ -758,7 +758,7 @@ free(name); maps_coordinates_h location = NULL; error = maps_place_get_location(place, &location); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the place location */ @@ -772,7 +772,7 @@ maps_coordinates_destroy(location); maps_place_rating_h rating = NULL; error = maps_place_get_rating(place, &rating); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the place rating */ @@ -799,7 +799,7 @@ maps_place_rating_destroy(rating); /* Obtain a list of place categories */ error = maps_place_foreach_category(place, __maps_place_categories_cb, user_data); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -807,14 +807,14 @@ if (error != MAPS_ERROR_NONE) 
     static bool
 __maps_place_categories_cb(int index, int total, maps_place_category_h category,
-                           void* user_data)
+                           void* user_data)
 {
-    /* Handle the obtained place category data */
+    /* Handle the obtained place category data */
 
-    /* Release the results */
-    maps_place_category_destroy(category);
+    /* Release the results */
+    maps_place_category_destroy(category);
 
-    return true;
+    return true;
 }
    @@ -835,7 +835,7 @@ __maps_place_categories_cb(int index, int total, maps_place_category_h category, /* Obtain the map provider-specific place data properties */ error = maps_place_foreach_property(place, __maps_place_properties_cb, user_data); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -843,17 +843,17 @@ if (error != MAPS_ERROR_NONE) 
     static bool
 __maps_place_properties_cb(int index, int total, char* key, void* value,
-                           void* user_data)
+                           void* user_data)
 {
-    /* Handle the obtained property: */
-    /* property_name: key */
-    /* property_value: value */
+    /* Handle the obtained property: */
+    /* property_name: key */
+    /* property_value: value */
 
-    /* Release the property name and value */
-    free(key);
-    free(value);
+    /* Release the property name and value */
+    free(key);
+    free(value);
 
-    return true;
+    return true;
 }
    @@ -864,7 +864,7 @@ __maps_place_properties_cb(int index, int total, char* key, void* value,

    The result of the route calculation request (maps_service_search_route() or maps_service_search_route_waypoints()) is retrieved from the map service using multiple iterations of the maps_service_search_route_cb() callback. The result is an instance of route data.

    - +
    Note Different map providers are capable of providing different sets of route data features. Some map providers can extend the route data features with extra properties that are not specified in the Maps Service API. Such properties are organized as a key-value storage where the keys are the names of the properties. @@ -872,7 +872,7 @@ __maps_place_properties_cb(int index, int total, char* key, void* value,

    If your map provider does not support a specific feature, the get function for the feature returns an error. To prevent problems, you can check which data features are available in your map provider using the maps_service_provider_is_data_supported() function.

    - +

    To parse route data:

    1. To get the route information features, such as route ID, origin, destination, and total distance, use the following functions with a maps_route_h place handle:

      @@ -883,7 +883,7 @@ __maps_place_properties_cb(int index, int total, char* key, void* value, char *id = NULL; error = maps_route_get_route_id(route, &id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the route ID */ @@ -897,10 +897,10 @@ free(id); maps_coordinates_h origin = NULL, destination = NULL; error = maps_route_get_origin(route, &origin); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ error = maps_route_get_destination(route, &destination); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the route origin and destination */ @@ -915,7 +915,7 @@ maps_coordinates_destroy(destination); double total_distance = .0; error = maps_route_get_total_distance(route, &total_distance); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Use the total route distance */ @@ -937,20 +937,20 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_route_foreach_path(route, __maps_route_path_cb, user_data);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */

      Implement the __maps_route_path_cb() callback:

       static bool
 __maps_route_path_cb(int index, int total, maps_coordinates_h coordinates,
-                     void* user_data)
+                     void* user_data)
 {
-    /* Handle the obtained route path coordinates */
+    /* Handle the obtained route path coordinates */
 
-    /* Release the results */
-    maps_coordinates_destroy(coordinates);
+    /* Release the results */
+    maps_coordinates_destroy(coordinates);
 
-    return true;
+    return true;
 }
      2. @@ -959,20 +959,20 @@ __maps_route_path_cb(int index, int total, maps_coordinates_h coordinates, 
       error = maps_route_foreach_segment(route, __maps_route_segment_cb, user_data);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */

      Implement the __maps_route_segment_cb() callback:

       static bool
 __maps_route_segment_cb(int index, int total, maps_route_segment_h segment,
-                        void* user_data)
+                        void* user_data)
 {
-    /* Handle the obtained route segment */
+    /* Handle the obtained route segment */
 
-    /* Release the results */
-    maps_route_segment_destroy(segment);
+    /* Release the results */
+    maps_route_segment_destroy(segment);
 
-    return true;
+    return true;
 }
      @@ -986,7 +986,7 @@ __maps_route_segment_cb(int index, int total, maps_route_segment_h segment, /* Obtain the map provider-specific route data properties */ error = maps_route_foreach_property(route, __maps_route_properties_cb, user_data); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -994,17 +994,17 @@ if (error != MAPS_ERROR_NONE) 
       static bool
 __maps_route_properties_cb(int index, int total, char* key, void* value,
-                           void* user_data)
+                           void* user_data)
 {
-    /* Handle the obtained property: */
-    /* property_name: key */
-    /* property_value: value */
+    /* Handle the obtained property: */
+    /* property_name: key */
+    /* property_value: value */
 
-    /* Release the property name and value */
-    free(key);
-    free(value);
+    /* Release the property name and value */
+    free(key);
+    free(value);
 
-    return true;
+    return true;
 }
      @@ -1025,21 +1025,21 @@ __maps_route_properties_cb(int index, int total, char* key, void* value, /* Create extra preferences for the place search service */ error = maps_preference_create(&preference); if (error != MAPS_ERROR_NONE) -    /* Error handling */ -error = maps_preference_set_property(preference, MAPS_PLACE_FILTER_TYPE, "restaurant"); + /* Error handling */ +error = maps_preference_set_property(preference, MAPS_PLACE_FILTER_TYPE, "restaurant"); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ maps_coordinates_h position = NULL; /* Create the coordinates with maps_coordinates_create() */ int distance = 500; error = maps_service_search_place(maps, position, distance, filter, preference, -                                  __maps_service_search_place_cb, -                                  user_data, &request_id); + __maps_service_search_place_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ maps_preference_destroy(preference); @@ -1071,24 +1071,24 @@ maps_preference_destroy(preference); /* Create extra preferences for the routing service */ error = maps_preference_create(&preference); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ error = maps_preference_set_property(preference, MAPS_ROUTE_FREEFORM_ADDR_TO_AVOID, -                                     "Suwon, Digital City"); + "Suwon, Digital City"); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ error = maps_preference_set_route_optimization(preference, MAPS_ROUTE_TYPE_SHORTEST); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ maps_coordinates_h origin = NULL, destination = NULL; /* Create the coordinates with maps_coordinates_create() */ error = maps_service_search_route(maps, origin, destination, preference, -                                  __maps_service_search_route_cb, -                                  user_data, &request_id); + __maps_service_search_route_cb, + user_data, &request_id); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ maps_preference_destroy(preference); @@ -1106,11 +1106,11 @@ maps_preference_destroy(preference); maps_view_h maps_view = NULL; /* Create an image object for the map view */ Evas_Object *evas_object_image = -    evas_object_image_filled_add(evas_object_evas_get(window)); + evas_object_image_filled_add(evas_object_evas_get(window)); error = maps_view_create(maps, evas_object_image, &maps_view); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ @@ -1120,7 +1120,7 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_set_type(maps_view, MAPS_VIEW_TYPE_NORMAL);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      @@ -1128,7 +1128,7 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_set_buildings_enabled(maps_view, true);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      @@ -1136,7 +1136,7 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_set_traffic_enabled(maps_view, true);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      @@ -1144,15 +1144,15 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_set_scalebar_enabled(maps_view, true);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    2. Set the map view language with the maps_view_set_language() function: 
      -error = maps_view_set_language(maps_view, "eng");
+error = maps_view_set_language(maps_view, "eng");
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      3. @@ -1161,18 +1161,18 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_set_screen_location(maps_view, 0, 100, 500, 1000);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */

      You can also set the location with the maps_view_move() and maps_view_resize() functions:

       error = maps_view_move(0, 100);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
 
 error = maps_view_resize(500, 1000);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      @@ -1180,7 +1180,7 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_set_visibility(maps_view, true);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      @@ -1192,7 +1192,7 @@ maps_coordinates_create(28.64362, 77.19865, &maps_coord); error = maps_view_set_center(maps_view, maps_coord); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */ maps_coordinates_destroy(maps_coord); @@ -1202,7 +1202,7 @@ maps_coordinates_destroy(maps_coord); 
       error = maps_view_set_zoom_level(maps_view, 12);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      @@ -1218,7 +1218,7 @@ maps_view_destroy(maps_view);

      You can create polyline, polygon, and marker objects for the map view.

      - +
      Note Before you use the View Object API (in mobile and wearable applications), create a map view object instance. @@ -1241,7 +1241,7 @@ maps_coordinates_list_append(coord_list, coord2); error = maps_view_object_create_polyline(coord_list, 255, 0, 0, 0, 5, &object); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */
    3. To create a polygon: @@ -1260,7 +1260,7 @@ maps_coordinates_list_append(coord_list, coord3); error = maps_view_object_create_polyline(coord_list, 255, 0, 0, 0, 5, &object); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */
    4. To create a marker with the MAPS_VIEW_MARKER_PIN type: @@ -1270,10 +1270,10 @@ maps_coordinates_h coord = NULL; maps_coordinates_create(28.64362, 77.19865, &coord); -error = maps_view_object_create_marker(coord, "image/marker_icon.png", -                                       MAPS_VIEW_MARKER_PIN, &object); +error = maps_view_object_create_marker(coord, "image/marker_icon.png", + MAPS_VIEW_MARKER_PIN, &object); if (error != MAPS_ERROR_NONE) -    /* Error handling */ + /* Error handling */

      You can also create the MAPS_VIEW_MARKER_STICKER type marker.

      5. @@ -1284,7 +1284,7 @@ if (error != MAPS_ERROR_NONE) 
       error = maps_view_add_object(maps_view, object);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    5. When no longer needed, remove the instance with the maps_view_remove_object() function: @@ -1309,16 +1309,16 @@ maps_view_remove_object(maps_view, object); 
       error = maps_view_set_event_cb(maps_view, MAPS_VIEW_EVENT_GESTURE,
-                               __main_view_event_cb, NULL);
+                               __main_view_event_cb, NULL);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
 
 static void
 __main_view_event_cb(const maps_view_event_type_e type,
-                     maps_view_event_data_h event_data,
-                     void *user_data)
+                     maps_view_event_data_h event_data,
+                     void *user_data)
 {
-    /* Handle the obtained event */
+    /* Handle the obtained event */
 }
      6. @@ -1329,7 +1329,7 @@ __main_view_event_cb(const maps_view_event_type_e type, 
       error = maps_view_unset_event_cb(maps_view, MAPS_VIEW_EVENT_GESTURE);
 if (error != MAPS_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
    diff --git a/org.tizen.guides/html/native/location_sensors/mapzen_credentials_n.htm b/org.tizen.guides/html/native/location_sensors/mapzen_credentials_n.htm index 3c2d3f0..ffb237e 100644 --- a/org.tizen.guides/html/native/location_sensors/mapzen_credentials_n.htm +++ b/org.tizen.guides/html/native/location_sensors/mapzen_credentials_n.htm @@ -23,10 +23,10 @@

    Dependencies

    • Tizen 3.0 and Higher for Mobile
      • -
    +

    Content

    Related Info

    @@ -42,7 +42,7 @@

    Getting a Mapzen API Key

    Mapzen products help you put a map anywhere, search and route the planet, and try a world of open data. They are built from open-source tools that are packaged into a Web service and hosted on the Mapzen servers. If you want to use Mapzen services, you must create a Mapzen developer account and a valid API key, and keep your requests to the service within certain rate limits.

    - +
    Note Mapzen products are available for any use, including commercial purposes. You must follow the attribution requirements for the data source, and also provide acknowledgment to Mapzen if you are using these Web services. @@ -68,8 +68,8 @@ 
     maps_service_h maps = NULL;
-int error = maps_service_create("MAPZEN", &maps);
-error = maps_service_set_provider_key(maps, "mapzen-xxxxxx")
+int error = maps_service_create("MAPZEN", &maps);
+error = maps_service_set_provider_key(maps, "mapzen-xxxxxx")

    API Rate Limits

    @@ -125,7 +125,7 @@ error = maps_service_set_provider_key(maps, "mapzen-xxxxxx")
  • View a graph of your recent usage for a certain period of time, such as the past day or month.
    • -

    If you exceed rate limits, you can notice it in the HTTP status codes you receive in the header for the server's response to your queries. The typical errors for exceeded limits are "403 Forbidden" and "429 Too Many Requests".

    +

    If you exceed rate limits, you can notice it in the HTTP status codes you receive in the header for the server's response to your queries. The typical errors for exceeded limits are "403 Forbidden" and "429 Too Many Requests".

    All queries do not count towards your rate limit. Mapzen uses server caching to deliver commonly requested content as quickly as possible. Queries served from the cache are not included in the rate limit count. For example, queries can be served from the cache when you browse a map with vector tiles in a popular extent or repeatedly perform an identical geocoding search.

    diff --git a/org.tizen.guides/html/native/media/audio_n.htm b/org.tizen.guides/html/native/media/audio_n.htm index fb2f9af..c9edbde 100644 --- a/org.tizen.guides/html/native/media/audio_n.htm +++ b/org.tizen.guides/html/native/media/audio_n.htm @@ -5,13 +5,13 @@ - + - Audio Management + Audio Management @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • -
    +

    Audio Management

    diff --git a/org.tizen.guides/html/native/media/camera_n.htm b/org.tizen.guides/html/native/media/camera_n.htm index f347034..7954cb8 100644 --- a/org.tizen.guides/html/native/media/camera_n.htm +++ b/org.tizen.guides/html/native/media/camera_n.htm @@ -45,61 +45,61 @@

    Camera

    -

    Tizen offers basic camera features, including preview and capture. It allows you to capture still images with the device's internal camera and keep images on your target device.

    - -

    Figure: Camera image examples

    +

    Tizen offers basic camera features, including preview and capture. It allows you to capture still images with the device's internal camera and keep images on your target device.

    + +

    Figure: Camera image examples

    Camera image examples

    - -

    The main features of the Camera API include:

    -
      + +

      The main features of the Camera API include:

      +
      • Configuring the camera and its callbacks

        You can configure the camera and set the camera and auto-focus callbacks.

      • Setting the display for the camera preview

        You can preview images in real time with the StartPreview() function. The feature provides:

        -
          -
        • Support for several pixel formats, such as NV12, NV12T, NV16, NV21, YUYV, UYVY, and YUV420P
          • -
        • Preview at the frame rate
          • -
        • Rotation and flip of the preview
          • +
            +
          • Support for several pixel formats, such as NV12, NV12T, NV16, NV21, YUYV, UYVY, and YUV420P
            • +
          • Preview at the frame rate
            • +
          • Rotation and flip of the preview

          You can also customize the display settings for the camera preview.

        • Capturing and saving images -

          You can start the camera preview and capture an image.

          • +

          You can start the camera preview and capture an image.

        • Setting camera attributes

          You can control the camera settings:

          -
            -
          • Contrast
            • -
          • Exposure
            • -
          • Brightness
            • -
          • Effects
            • -
          • ISO
            • -
          • White balance
            • -
          • Zoom
            • -
          • Flash
            • -
          • Focus
            • -
          • Metering
            • -
          • EXIF tag (geo, orientation, software info and description)
            • -
          • Scene mode, HDR, theater
            • -
          • Image quality
            • -
          -

          Depending on the camera device type, the device can support different orientations, resolutions, or preview and capture formats. You can obtain this information from the device using the camera_foreach_supported_preview_resolution(), camera_foreach_supported_preview_format(), or other camera_foreach_supported_xxx() functions.

          - -

          Since devices can have multiple camera sensors with different capabilities, create a Camera with a proper camera_device_e value, determining which camera sensor is used. Usually the primary sensor is located on the back side and the secondary sensor on the front side of the device. Once the camera sensor is selected, the selected sensor starts working.

          - - +
            +
          • Contrast
            • +
          • Exposure
            • +
          • Brightness
            • +
          • Effects
            • +
          • ISO
            • +
          • White balance
            • +
          • Zoom
            • +
          • Flash
            • +
          • Focus
            • +
          • Metering
            • +
          • EXIF tag (geo, orientation, software info and description)
            • +
          • Scene mode, HDR, theater
            • +
          • Image quality
            • +
          +

          Depending on the camera device type, the device can support different orientations, resolutions, or preview and capture formats. You can obtain this information from the device using the camera_foreach_supported_preview_resolution(), camera_foreach_supported_preview_format(), or other camera_foreach_supported_xxx() functions.

          + +

          Since devices can have multiple camera sensors with different capabilities, create a Camera with a proper camera_device_e value, determining which camera sensor is used. Usually the primary sensor is located on the back side and the secondary sensor on the front side of the device. Once the camera sensor is selected, the selected sensor starts working.

          + +
          Note Simultaneous use of multiple camera sensors is not allowed.

          The target device often supports more functionalities than the emulator.

          The behavior of the shutter sound can differ according to the legislation of each country.

          -
          • +
        • Releasing resources

          When you have finished working with the camera, you can release the resources.

        -

        The following figure illustrates the camera state changes in the normal mode:

        -

        Figure: Camera states in the normal mode

        -

        Camera states in the normal mode

        +

        The following figure illustrates the camera state changes in the normal mode:

        +

        Figure: Camera states in the normal mode

        +

        Camera states in the normal mode

        Prerequisites

        @@ -117,10 +117,10 @@ 
         struct _camdata {
-    Evas_Object *win;
-    Evas_Object *rect;
-    Evas *evas;
-    camera_h g_camera; /* Camera handle */
+    Evas_Object *win;
+    Evas_Object *rect;
+    Evas *evas;
+    camera_h g_camera; /* Camera handle */
 };
 typedef struct _camdata camdata;
 
@@ -142,9 +142,9 @@ int error_code = 0;
 /* Create the camera handle */
 error_code = camera_create(CAMERA_DEVICE_CAMERA0, &cam_data.g_camera);
 if (error_code == CAMERA_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code);
 else
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

        The CAMERA_DEVICE_CAMERA0 parameter means that the currently activated device camera is 0, which is the primary camera. You can select between the primary (0) and secondary (1) camera. These values are defined in the camera_device_e enumeration (in mobile and wearable applications).

        • @@ -199,52 +199,52 @@ Evas_Object *g_eo = NULL; static void create_base_gui(camdata *cam_data, camera_display_type_e display_type) { -    /* Window */ -    elm_config_accel_preference_set("opengl"); -    /* PACKAGE contains the package name's character info */ -    cam_data->win = elm_win_add(NULL, PACKAGE, ELM_WIN_BASIC); - -    evas_object_resize(cam_data->win, 240, 320); - -    evas_object_move(cam_data->win, 0, 0); -    elm_win_autodel_set(cam_data->win, EINA_TRUE); - -    cam_data->evas = evas_object_evas_get(cam_data->win); - -    switch (display_type) { -    case CAMERA_DISPLAY_TYPE_EVAS: -        /* Set the Evas image object for drawing */ -        g_eo = evas_object_image_add(cam_data->evas); -        evas_object_image_size_set(g_eo, 240, 320); -        evas_object_image_fill_set(g_eo, 0, 0, 240, 320); -        evas_object_resize(g_eo, 240, 320); -        evas_object_show(g_eo); -        evas_object_show(cam_data.win); -        break; -    case CAMERA_DISPLAY_TYPE_OVERLAY: -        cam_data->rect = evas_object_rectangle_add(cam_data->evas); -        evas_object_resize(cam_data->rect, 240, 320); -        evas_object_move(cam_data->rect, 0, 0); -        evas_object_color_set(cam_data->rect, 0, 0, 0, 0); -        evas_object_render_op_set(cam_data->rect, EVAS_RENDER_COPY); -        evas_object_size_hint_weight_set(cam_data->rect, EVAS_HINT_EXPAND, -                                         EVAS_HINT_EXPAND); -        /* Show the window after the base GUI is set up */ -        evas_object_show(cam_data->win); -        break; -    case default: -        break; -    } + /* Window */ + elm_config_accel_preference_set("opengl"); + /* PACKAGE contains the package name's character info */ + cam_data->win = elm_win_add(NULL, PACKAGE, ELM_WIN_BASIC); + + evas_object_resize(cam_data->win, 240, 320); + + evas_object_move(cam_data->win, 0, 0); + elm_win_autodel_set(cam_data->win, EINA_TRUE); + + cam_data->evas = evas_object_evas_get(cam_data->win); + + switch (display_type) { + case CAMERA_DISPLAY_TYPE_EVAS: + /* Set the Evas image object for drawing */ + g_eo = evas_object_image_add(cam_data->evas); + evas_object_image_size_set(g_eo, 240, 320); + evas_object_image_fill_set(g_eo, 0, 0, 240, 320); + evas_object_resize(g_eo, 240, 320); + evas_object_show(g_eo); + evas_object_show(cam_data.win); + break; + case CAMERA_DISPLAY_TYPE_OVERLAY: + cam_data->rect = evas_object_rectangle_add(cam_data->evas); + evas_object_resize(cam_data->rect, 240, 320); + evas_object_move(cam_data->rect, 0, 0); + evas_object_color_set(cam_data->rect, 0, 0, 0, 0); + evas_object_render_op_set(cam_data->rect, EVAS_RENDER_COPY); + evas_object_size_hint_weight_set(cam_data->rect, EVAS_HINT_EXPAND, + EVAS_HINT_EXPAND); + /* Show the window after the base GUI is set up */ + evas_object_show(cam_data->win); + break; + case default: + break; + } } error_code = camera_set_display(cam_data.g_camera, CAMERA_DISPLAY_TYPE_OVERLAY, -                                GET_DISPLAY(cam_data.win)); + GET_DISPLAY(cam_data.win)); if (error_code != CAMERA_ERROR_NONE) { -    dlog_print(DLOG_DEBUG, "camera_set_display failed [0x%x]", ret); -    camera_destroy(cam_data.g_camera); -    cam_data.g_camera = 0; + dlog_print(DLOG_DEBUG, "camera_set_display failed [0x%x]", ret); + camera_destroy(cam_data.g_camera); + cam_data.g_camera = 0; -    return; + return; } @@ -264,21 +264,21 @@ int resolution[2]; static bool _preview_resolution_cb(int width, int height, void *user_data) { -    int *resolution = (int*)user_data; -    resolution[0] = width; -    resolution[1] = height; + int *resolution = (int*)user_data; + resolution[0] = width; + resolution[1] = height; -    return false; + return false; } /* Find a resolution that is supported by the device */ error_code = camera_foreach_supported_preview_resolution(cam_data.g_camera, -                                                         _preview_resolution_cb, -                                                         resolution); + _preview_resolution_cb, + resolution); /* Set the supported resolution for camera preview */ error_code = camera_set_preview_resolution(cam_data.g_camera, resolution[0], -                                           resolution[1]); + resolution[1]); @@ -313,16 +313,16 @@ error_code = camera_set_preview_cb(cam_data.g_camera, _camera_preview_cb, NULL); static void _camera_preview_cb(camera_preview_data_s *frame, void *user_data) { -    int error_code = 0; + int error_code = 0; -    if (g_enable_focus == true) { -        error_code = camera_start_focusing(cam_data.g_camera, true); + if (g_enable_focus == true) { + error_code = camera_start_focusing(cam_data.g_camera, true); -        if (error_code == CAMERA_ERROR_NOT_SUPPORTED) -            error_code = camera_start_focusing(cam_data.g_camera, false); + if (error_code == CAMERA_ERROR_NOT_SUPPORTED) + error_code = camera_start_focusing(cam_data.g_camera, false); -        g_enable_focus = false; -    } + g_enable_focus = false; + } } @@ -338,7 +338,7 @@ _camera_preview_cb(camera_preview_data_s *frame, void *user_data) 
         error_code = camera_set_focus_changed_cb(cam_data.g_camera,
-                                         _camera_focus_cb, NULL);
+                                         _camera_focus_cb, NULL);

        Before auto-focusing starts, the auto-focus state is CAMERA_FOCUS_STATE_RELEASED. After the camera_start_focusing() function is called, the camera starts auto-focusing and the state changes to CAMERA_FOCUS_STATE_ONGOING. If the auto-focusing finishes successfully, the state changes to CAMERA_FOCUS_STATE_FOCUSED. If the auto-focusing fails, the state changes to CAMERA_FOCUS_STATE_FAILED.

        @@ -349,16 +349,16 @@ error_code = camera_set_focus_changed_cb(cam_data.g_camera, static void _camera_focus_cb(camera_focus_state_e state, void *user_data) { -    int error_code; + int error_code; -    if (state == CAMERA_FOCUS_STATE_FOCUSED && g_enable_shot == true) { -        /* Start capturing */ -        error_code = camera_start_capture(cam_data.g_camera, -                                          _camera_capturing_cb, -                                          _camera_completed_cb, NULL); + if (state == CAMERA_FOCUS_STATE_FOCUSED && g_enable_shot == true) { + /* Start capturing */ + error_code = camera_start_capture(cam_data.g_camera, + _camera_capturing_cb, + _camera_completed_cb, NULL); -        g_enable_shot = false; -    } + g_enable_shot = false; + } } @@ -390,10 +390,10 @@ _camera_focus_cb(camera_focus_state_e state, void *user_data)

        To determine the active camera, check the camera_device_e enumerator:

        -typedef 
+typedef
 enum {
-    CAMERA_DEVICE_CAMERA0 = 0, /* Primary camera */
-    CAMERA_DEVICE_CAMERA1 /* Secondary camera */
+    CAMERA_DEVICE_CAMERA0 = 0, /* Primary camera */
+    CAMERA_DEVICE_CAMERA1 /* Secondary camera */
 } camera_device_e;
        @@ -450,26 +450,26 @@ int display_rotation_angle = 0; /* Get the recommended display rotation value */ error_code = camera_attr_get_lens_orientation(cam_data.g_camera, -                                              &lens_orientation); + &lens_orientation); display_rotation_angle = (360 - lens_orientation) % 360; /* Convert the display rotation value to an enum type */ switch (display_rotation_angle) { case 0: -    display_rotation = CAMERA_ROTATION_NONE; -    break; + display_rotation = CAMERA_ROTATION_NONE; + break; case 90: -    display_rotation = CAMERA_ROTATION_90; -    break; + display_rotation = CAMERA_ROTATION_90; + break; case 180: -    display_rotation = CAMERA_ROTATION_180; -    break; + display_rotation = CAMERA_ROTATION_180; + break; case 270: -    display_rotation = CAMERA_ROTATION_270; -    break; + display_rotation = CAMERA_ROTATION_270; + break; default: -    display_rotation = CAMERA_ROTATION_NONE; -    break; + display_rotation = CAMERA_ROTATION_NONE; + break; } /* Set the display rotation */ @@ -512,9 +512,9 @@ display_rotation_angle = (360 - lens_orientation) % 360; /* Set the mirror display */ if (display_rotation_angle == 90 || display_rotation_angle == 270) -    camera_default_flip = MM_FLIP_VERTICAL; + camera_default_flip = MM_FLIP_VERTICAL; else -    camera_default_flip = MM_FLIP_HORIZONTAL; + camera_default_flip = MM_FLIP_HORIZONTAL; /* Set the display flip */ error_code = camera_set_display_flip(cam_data.g_camera, camera_default_flip); @@ -604,14 +604,14 @@ error_code = camera_start_preview(cam_data.g_camera); 
         static void
 _camera_capturing_cb(camera_image_data_s* image, camera_image_data_s* postview,
-                     camera_image_data_s* thumbnail, void *user_data)
+                     camera_image_data_s* thumbnail, void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Writing image to file");
-    FILE *file = fopen(g_fname, "w+");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Writing image to file");
+    FILE *file = fopen(g_fname, "w+");
 
-    if (image->data != NULL)
-        fwrite(image->data, 1, image->size, file);
-    fclose(file);
+    if (image->data != NULL)
+        fwrite(image->data, 1, image->size, file);
+    fclose(file);
 }
        @@ -629,14 +629,14 @@ _camera_capturing_cb(camera_image_data_s* image, camera_image_data_s* postview, static void _camera_completed_cb(void *user_data) { -    int error_code = 0; + int error_code = 0; -    usleep(25000); /* Display the captured image for 0.025 seconds */ + usleep(25000); /* Display the captured image for 0.025 seconds */ -    /* Restart the camera preview */ -    error_code = camera_start_preview(cam_data.g_camera); + /* Restart the camera preview */ + error_code = camera_start_preview(cam_data.g_camera); -    g_enable_focus = true; + g_enable_focus = true; } @@ -709,13 +709,13 @@ error_code = camera_attr_get_brightness(cam_data.g_camera, &g_bright_level); 
         if (g_bright_level >= LEVEL_UPPER_BOUND) {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Brightness is set to maximum level");
-    g_bright_level = LEVEL_UPPER_BOUND - 1;
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Brightness is set to maximum level");
+    g_bright_level = LEVEL_UPPER_BOUND - 1;
 } else if (g_bright_level <= LEVEL_LOWER_BOUND) {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Brightness is set to minimum level");
-    g_bright_level = LEVEL_LOWER_BOUND + 1;
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Brightness is set to minimum level");
+    g_bright_level = LEVEL_LOWER_BOUND + 1;
 } else {
-    g_bright_level++;
+    g_bright_level++;
 }
 
 /* Set the brightness level */
diff --git a/org.tizen.guides/html/native/media/face_detection_n.htm b/org.tizen.guides/html/native/media/face_detection_n.htm
index f460298..9fa85f7 100644
--- a/org.tizen.guides/html/native/media/face_detection_n.htm
+++ b/org.tizen.guides/html/native/media/face_detection_n.htm
@@ -81,8 +81,8 @@
 
        • For face detection, use the following facedata_s structure:
 
           struct _facedata_s {
-    mv_source_h g_source;
-    mv_engine_config_h g_engine_config;
+    mv_source_h g_source;
+    mv_engine_config_h g_engine_config;
 };
 typedef struct _facedata_s facedata_s;
 static facedata_s facedata;
@@ -91,9 +91,9 @@ static facedata_s facedata;
 
        • For face recognition, use the following facedata_s structure:
 
           struct _facedata_s {
-    mv_source_h g_source;
-    mv_engine_config_h g_engine_config;
-    mv_face_recognition_model g_face_recog_model;
+    mv_source_h g_source;
+    mv_engine_config_h g_engine_config;
+    mv_face_recognition_model g_face_recog_model;
 };
 typedef struct _facedata_s facedata_s;
 static facedata_s facedata;
@@ -102,21 +102,21 @@ static facedata_s facedata;
 
        • For face tracking, use the following facedata_s structure:
 
           struct _facedata_s {
-    /* Variable for camera display */
-    Evas_Object *win;
-    Evas_Object *rect;
-    Evas *evas;
+    /* Variable for camera display */
+    Evas_Object *win;
+    Evas_Object *rect;
+    Evas *evas;
 
-    int preview_width;
-    int preview_height;
+    int preview_width;
+    int preview_height;
 
-    camera_h g_camera;
+    camera_h g_camera;
 
-    mv_source_h g_source;
-    mv_engine_config_h g_engine_config;
+    mv_source_h g_source;
+    mv_engine_config_h g_engine_config;
 
-    mv_quadrangle_s face_roi;
-    mv_face_tracking_model_h g_face_track_model;
+    mv_quadrangle_s face_roi;
+    mv_face_tracking_model_h g_face_track_model;
 };
 typedef struct _facedata_s facedata_s;
 static facedata_s facedata;
@@ -138,7 +138,7 @@ int error_code = 0;
 
 error_code = mv_create_source(&facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
          
 
 
          The source stores the face to be detected and all related data. You manage the source through the source handle.
          
@@ -152,17 +152,17 @@ unsigned int bufferSize = 0;
 int width = 0;
 int height = 0;
 
-error_code = image_util_decode_jpeg("/mydir/NasaAstronaut.jpg",
-                                    IMAGE_UTIL_COLORSPACE_RGB888,
-                                    &dataBuffer, &height, &bufferSize);
+error_code = image_util_decode_jpeg("/mydir/NasaAstronaut.jpg",
+                                    IMAGE_UTIL_COLORSPACE_RGB888,
+                                    &dataBuffer, &height, &bufferSize);
 if (error_code != IMAGE_UTIL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Fill the dataBuffer to g_source */
 error_code = mv_source_fill_by_buffer(facedata.g_source, dataBuffer, bufferSize,
-                                      width, height, MEDIA_VISION_COLORSPACE_RGB888);
+                                      width, height, MEDIA_VISION_COLORSPACE_RGB888);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 free(dataBuffer);
 dataBuffer = NULL;
@@ -173,25 +173,25 @@ dataBuffer = NULL;
 
           error_code = mv_create_engine_config(&facedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
          
 
 
          Face detection details can be configured by setting attributes to the engine configuration handle. In this use case, the MV_FACE_DETECTION_MODEL_FILE_PATH attribute is configured. For more information on the attributes, see the Media Vision API reference (in mobile and wearable applications).
          
 
           error_code =
-    mv_engine_config_set_string_attribute(facedata.g_engine_config,
-                                          MV_FACE_DETECTION_MODEL_FILE_PATH,
-                                          "/usr/share/OpenCV/haarcascades/haarcascade_frontalface_alt.xml");
+    mv_engine_config_set_string_attribute(facedata.g_engine_config,
+                                          MV_FACE_DETECTION_MODEL_FILE_PATH,
+                                          "/usr/share/OpenCV/haarcascades/haarcascade_frontalface_alt.xml");
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
          
 
          • 
 
        • When the source and engine configuration handles are ready, use the mv_face_detect() function to detect faces:
 
           error_code = mv_face_detect(facedata.g_source, facedata.g_engine_config,
-                            _on_face_detected_cb, NULL);
+                            _on_face_detected_cb, NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
          
 
          • 
 
        • The mv_face_detect() function invokes the _on_face_detected_cb() callback.
@@ -199,18 +199,18 @@ if (error_code != MEDIA_VISION_ERROR_NONE)
 
           static void
 _on_face_detected_cb(mv_source_h source, mv_engine_config_h engine_config,
-                     mv_rectangle_s *face_locations,
-                     int number_of_faces, void *user_data)
+                     mv_rectangle_s *face_locations,
+                     int number_of_faces, void *user_data)
 {
-    if (number_of_faces > 0) {
-        int index = 0;
-        for (index = 0; index < number_of_faces; ++index) {
-            dlog_print(DLOG_INFO, LOG_TAG,
-                       "face [%d]: x-[%d], y-[%d], width-[%d], height-[%d]\n",
-                       index, face_locations[index].x, face_locations[index].y,
-                       face_locations[index].width, face_locations[index].height);
-        }
-    }
+    if (number_of_faces > 0) {
+        int index = 0;
+        for (index = 0; index < number_of_faces; ++index) {
+            dlog_print(DLOG_INFO, LOG_TAG,
+                       "face [%d]: x-[%d], y-[%d], width-[%d], height-[%d]\n",
+                       index, face_locations[index].x, face_locations[index].y,
+                       face_locations[index].width, face_locations[index].height);
+        }
+    }
 }
 
          
 
          • 
@@ -219,11 +219,11 @@ _on_face_detected_cb(mv_source_h source, mv_engine_config_h engine_config,
 
           error_code = mv_destroy_source(facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_destroy_engine_config(facedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
          
 
          • 
 
@@ -240,11 +240,11 @@ int error_code = 0;
 
 error_code = mv_create_source(&facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_create_engine_config(&facedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
          
 
          • 
 
        • Create a g_face_recog_model media vision face recognition model handle using the mv_face_recognition_model_create() function. The handle must be created before any recognition is attempted.
@@ -252,11 +252,11 @@ if (error_code != MEDIA_VISION_ERROR_NONE)
 
           error_code = mv_face_recognition_model_create(&facedata.g_face_recog_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
          
 
          • 
 
        • Add face examples to the face recognition model handle.
-
          Make sure that the face examples are of the same person but captured at different angles. The following example assumes that 10 face samples (face_sample_1.jpg - face_sample_10.jpg in the <OwnDataPath> folder) are used and that the face area in each example  covers approximately 95~100% of the image. The label of the face is set to '1'.
          
+
          Make sure that the face examples are of the same person but captured at different angles. The following example assumes that 10 face samples (face_sample_1.jpg - face_sample_10.jpg in the <OwnDataPath> folder) are used and that the face area in each example  covers approximately 95~100% of the image. The label of the face is set to '1'.
          
 
 
           int example_index = 0;
@@ -269,44 +269,44 @@ int width = 0;
 int height = 0;
 
 for (example_index = 1; example_index <= 10; ++example_index) {
-    /* Decode image and fill the image data to g_source handle */
-    snprintf(filePath, 1024, "%s/face_sample_%d.jpg", mydir, example_index);
-    error_code = image_util_decode_jpeg(filePath, IMAGE_UTIL_COLORSPACE_RGB888,
-                                        &dataBuffer, &width, &height, &bufferSize);
-    if (error_code != MEDIA_VISION_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
-
-    roi.x = roi.y = 0;
-    roi.width = width;
-    roi.height = height;
-    error_code = mv_source_clear(facedata.g_source);
-    if (error_code != MEDIA_VISION_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
-
-    error_code = mv_source_fill_by_buffer(facedata.g_source, &dataBuffer,
-                                          &bufferSize, &width, &height,
-                                          MEDIA_VISION_COLORSPACE_RGB888);
-    if (error_code != MEDIA_VISION_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
-
-    free(dataBuffer);
-    dataBuffer = NULL;
-
-    error_code = mv_face_recognition_model_add(facedata.g_source,
-                                               facedata.g_face_recog_model,
-                                               &roi, face_label);
-    if (error_code != MEDIA_VISION_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    /* Decode image and fill the image data to g_source handle */
+    snprintf(filePath, 1024, "%s/face_sample_%d.jpg", mydir, example_index);
+    error_code = image_util_decode_jpeg(filePath, IMAGE_UTIL_COLORSPACE_RGB888,
+                                        &dataBuffer, &width, &height, &bufferSize);
+    if (error_code != MEDIA_VISION_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+
+    roi.x = roi.y = 0;
+    roi.width = width;
+    roi.height = height;
+    error_code = mv_source_clear(facedata.g_source);
+    if (error_code != MEDIA_VISION_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+
+    error_code = mv_source_fill_by_buffer(facedata.g_source, &dataBuffer,
+                                          &bufferSize, &width, &height,
+                                          MEDIA_VISION_COLORSPACE_RGB888);
+    if (error_code != MEDIA_VISION_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+
+    free(dataBuffer);
+    dataBuffer = NULL;
+
+    error_code = mv_face_recognition_model_add(facedata.g_source,
+                                               facedata.g_face_recog_model,
+                                               &roi, face_label);
+    if (error_code != MEDIA_VISION_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 }
 
          
 
          • 
 
        • Use the mv_face_recognition_model_learn() function to train the face recognition model with the added examples:
 
           error_code = mv_face_recognition_model_learn(facedata.g_engine_config,
-                                             facedata.g_face_recog_model);
+                                             facedata.g_face_recog_model);
 
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
          
 
          • 
 
        • When the face recognition model handle is ready, use the mv_face_recognize() function to recognize the face.
@@ -315,29 +315,29 @@ if (error_code != MEDIA_VISION_ERROR_NONE)
 
 
           /* Decode the image and fill the image data to g_source handle */
-snprintf(filePath, 1024, "%s/whos_face.jpg", mydir);
+snprintf(filePath, 1024, "%s/whos_face.jpg", mydir);
 error_code = image_util_decode_jpeg(filePath, IMAGE_UTIL_COLORSPACE_RGB888,
-                                    &dataBuffer, &width, &height, &bufferSize);
+                                    &dataBuffer, &width, &height, &bufferSize);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
 error_code = mv_source_clear(facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
 error_code = mv_source_fill_by_buffer(facedata.g_source, &dataBuffer, &bufferSize,
-                                      &width, &height, MEDIA_VISION_COLORSPACE_RGB888);
+                                      &width, &height, MEDIA_VISION_COLORSPACE_RGB888);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
 free(dataBuffer);
 dataBuffer = NULL;
 
 error_code = mv_face_recognize(facedata.g_source, facedata.g_face_recog_model,
-                               facedata.g_engine_config, NULL,
-                               _on_face_recognized_cb, NULL);
+                               facedata.g_engine_config, NULL,
+                               _on_face_recognized_cb, NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
          
 
          • 
 
        • The mv_face_recognize() function invokes the _on_face_recognized_cb() callback.
@@ -345,15 +345,15 @@ if (error_code != MEDIA_VISION_ERROR_NONE)
 
           static void
 _on_face_recognized_cb(mv_source_h source,
-                       mv_face_recognition_model_h recognition_model,
-                       mv_engine_config_h engine_config, mv_rectangle_s *face_location,
-                       const int *face_label, double confidence, void *user_data)
+                       mv_face_recognition_model_h recognition_model,
+                       mv_engine_config_h engine_config, mv_rectangle_s *face_location,
+                       const int *face_label, double confidence, void *user_data)
 {
-    if (face_label) {
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "face label [%d] with confidence [%.2f]\n",
-                   *face_label, confidence);
-    }
+    if (face_label) {
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "face label [%d] with confidence [%.2f]\n",
+                   *face_label, confidence);
+    }
 }
 
          
 
          • 
@@ -362,15 +362,15 @@ _on_face_recognized_cb(mv_source_h source,
 
           error_code = mv_destroy_source(facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_destroy_engine_config(facedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_face_recognition_model_destroy(facedata.g_face_recog_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
          
 
 
@@ -389,32 +389,32 @@ if (error_code != MEDIA_VISION_ERROR_NONE)
 int error_code = 0;
 error_code = camera_create(CAMERA_DEVICE_CAMERA0, &facedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Set the camera display */
 error_code = camera_set_display(facedata.g_camera, CAMERA_DISPLAY_TYPE_OVERLAY,
-                                GET_DISPLAY(facedata.win);
+                                GET_DISPLAY(facedata.win);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Get the camera preview resolution */
 error_code = camera_get_preview_resolution(facedata.g_camera,
-                                           &facedata.preview_width,
-                                           &facedata.preview_height);
+                                           &facedata.preview_width,
+                                           &facedata.preview_height);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Set the camera preview callback */
 error_code = camera_set_media_packet_preview_cb(facedata.g_camera,
-                                                _camera_media_packet_preview_cb,
-                                                NULL);
+                                                _camera_media_packet_preview_cb,
+                                                NULL);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Start the camera preview */
 error_code = camera_start_preview(facedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Create the source and engine configuration handles: @@ -422,11 +422,11 @@ if (error_code != CAMERA_ERROR_NONE) 
         error_code = mv_create_source(&facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_create_engine_config(&facedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
      • Define the camera preview callback. @@ -436,17 +436,17 @@ if (error_code != MEDIA_VISION_ERROR_NONE) static void _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data) { -    if (pkt == NULL) -        return; + if (pkt == NULL) + return; -    error_code = mv_source_fill_by_media_packet(facedata.g_source, pkt); -    if (error_code != MEDIA_VISION_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error code); + error_code = mv_source_fill_by_media_packet(facedata.g_source, pkt); + if (error_code != MEDIA_VISION_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error code); -    if (pkt) { -        error_code = media_packet_destroy(pkt); -        pkt = NULL; -    } + if (pkt) { + error_code = media_packet_destroy(pkt); + pkt = NULL; + } }
        • @@ -456,33 +456,33 @@ _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data) 
         error_code = mv_face_detect(facedata.g_source, facedata.g_engine_config,
-                            _on_face_detected_cb, NULL);
+                            _on_face_detected_cb, NULL);
 
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 static void
 _on_face_detected_cb(mv_source_h source, mv_engine_config_h engine_config,
-                     mv_rectangle_s *face_locations, int number_of_faces, void *user_data)
+                     mv_rectangle_s *face_locations, int number_of_faces, void *user_data)
 {
-    if (number_of_faces > 0) {
-        /*
-           Track the face of index '0'.
-           Convert mv_rectangle_s to mv_quadrangle_s
-        */
-        facedata.face_roi.points[0].x = face_location[0].x;
-        facedata.face_roi.points[0].y = face_location[0].y;
-        facedata.face_roi.points[1].x =
-            face_location[0].x + face_location[0].width;
-        facedata.face_roi.points[1].y = face_location[0].y;
-        facedata.face_roi.points[2].x = face_location[0].x ;
-        facedata.face_roi.points[2].y =
-            face_location[0].y + face_location[0].height;
-        facedata.face_roi.points[3].x =
-            face_location[0].x + face_location[0].width;
-        facedata.face_roi.points[3].y =
-            face_location[0].y + face_location[0].height;
-    }
+    if (number_of_faces > 0) {
+        /*
+           Track the face of index '0'.
+           Convert mv_rectangle_s to mv_quadrangle_s
+        */
+        facedata.face_roi.points[0].x = face_location[0].x;
+        facedata.face_roi.points[0].y = face_location[0].y;
+        facedata.face_roi.points[1].x =
+            face_location[0].x + face_location[0].width;
+        facedata.face_roi.points[1].y = face_location[0].y;
+        facedata.face_roi.points[2].x = face_location[0].x ;
+        facedata.face_roi.points[2].y =
+            face_location[0].y + face_location[0].height;
+        facedata.face_roi.points[3].x =
+            face_location[0].x + face_location[0].width;
+        facedata.face_roi.points[3].y =
+            face_location[0].y + face_location[0].height;
+    }
 }
        @@ -493,16 +493,16 @@ _on_face_detected_cb(mv_source_h source, mv_engine_config_h engine_config, 
         error_code = mv_face_tracking_model_create(&facedata.g_face_track_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
      • Prepare the face tracking model handle with the initial location (detected earlier): 
         error_code = mv_face_tracking_model_prepare(facedata.g_face_track_model,
-                                            facedata.g_engine_config,
-                                            facedata.g_source, &facedata.face_roi);
+                                            facedata.g_engine_config,
+                                            facedata.g_source, &facedata.face_roi);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
      • Use the mv_face_track() function to track the face. @@ -512,10 +512,10 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
     error_code = mv_face_track(facedata.g_source, facedata.g_face_track_model,
-                           facedata.g_engine_config, _on_face_tracked_cb,
-                           false, NULL);
+                           facedata.g_engine_config, _on_face_tracked_cb,
+                           false, NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
  • The mv_face_track() function invokes the _on_face_tracked_cb() callback. @@ -523,15 +523,15 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
     static void
 _on_face_tracked_cb(mv_source_h source, mv_face_tracking_model_h tracking_model,
-                    mv_engine_config_h engine_config, mv_quadrangle_s *location,
-                    double confidence, void *user_data)
+                    mv_engine_config_h engine_config, mv_quadrangle_s *location,
+                    double confidence, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "Location: (%d,%d) -> (%d,%d) -> (%d,%d) -> (%d,%d)\n",
-               location->points[0].x, location->point[0].y,
-               location->points[1].x, location->point[1].y,
-               location->points[2].x, location->point[2].y,
-               location->points[3].x, location->point[3].y)
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "Location: (%d,%d) -> (%d,%d) -> (%d,%d) -> (%d,%d)\n",
+               location->points[0].x, location->point[0].y,
+               location->points[1].x, location->point[1].y,
+               location->points[2].x, location->point[2].y,
+               location->points[3].x, location->point[3].y)
 }
    • @@ -542,15 +542,15 @@ _on_face_tracked_cb(mv_source_h source, mv_face_tracking_model_h tracking_model, 
     error_code = camera_stop_preview(facedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = camera_unset_media_packet_preview_cb(facedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = camera_destroy(facedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

    For more information, see Releasing Resources in the Camera guide.

    @@ -561,15 +561,15 @@ if (error_code != CAMERA_ERROR_NONE) 
     error_code = mv_destroy_source(facedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_destroy_engine_config(facedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_face_tracking_model_destroy(facedata.g_face_track_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
    diff --git a/org.tizen.guides/html/native/media/image_barcode_n.htm b/org.tizen.guides/html/native/media/image_barcode_n.htm index dbfafbf..594150e 100644 --- a/org.tizen.guides/html/native/media/image_barcode_n.htm +++ b/org.tizen.guides/html/native/media/image_barcode_n.htm @@ -54,7 +54,7 @@

    You can handle images by creating a source handle and filling it from an image buffer or media packet. Create the source handle with the mv_create_source() function, and fill it with the mv_source_fill_by_buffer() or mv_source_fill_by_media_packet() function.

  • Detecting barcodes -

    You can detect barcodes in an image or from camera preview streams, and then decrypt them to display messages to the user.

    +

    You can detect barcodes in an image or from camera preview streams, and then decrypt them to display messages to the user.

    Before detecting a barcode, you must define the barcode detection target attribute value:

    • Detect both 1D and 2D barcodes
      • @@ -120,21 +120,21 @@ 
       struct _bardetdata_s {
-    /* Camera display variables */
-    Evas_Object *win;
-    Evas_Object *rect;
-    Evas *evas;
+    /* Camera display variables */
+    Evas_Object *win;
+    Evas_Object *rect;
+    Evas *evas;
 
-    int preview_width;
-    int preview_height;
+    int preview_width;
+    int preview_height;
 
-    /* Media source handle */
-    mv_source_h g_source;
-    /* Barcode detection engine handle */
-    mv_engine_config_h g_engine_cfg;
+    /* Media source handle */
+    mv_source_h g_source;
+    /* Barcode detection engine handle */
+    mv_engine_config_h g_engine_cfg;
 
-    /* Camera handle */
-    camera_h g_camera;
+    /* Camera handle */
+    camera_h g_camera;
 };
 typedef struct _bardetdata_s bargendata_s;
 
@@ -152,7 +152,7 @@ int error_code = 0;
 
 error_code = mv_create_source(&bardetdata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      The source stores the barcode to be detected and all related data. You manage the source through the source handle.

      @@ -168,7 +168,7 @@ int error_code = 0; error_code = mv_create_engine_config(&bardetdata.g_engine_cfg); if (error_code != MEDIA_VISION_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      For example, to define the detection target, use the mv_engine_config_set_int_attribute() function with the MV_BARCODE_DETECT_ATTR_TARGET attribute. The possible values are defined in the mv_barcode_detect_attr_target_e enumeration (in mobile and wearable applications). The default value is MV_BARCODE_DETECT_ATTR_TARGET_ALL.

      @@ -183,31 +183,31 @@ if (error_code != MEDIA_VISION_ERROR_NONE) /* Create the camera handle */ error_code = camera_create(CAMERA_DEVICE_CAMERA0, &bardetdata.g_camera); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Set the camera display */ error_code = camera_set_display(bardetdata.g_camera, CAMERA_DISPLAY_TYPE_OVERLAY, -                                GET_DISPLAY(bardetdata.win)); + GET_DISPLAY(bardetdata.win)); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Get the camera preview resolution */ error_code = camera_get_preview_resolution(bardetdata.g_camera, &bardetdata.width, -                                           &bardetdata.height); + &bardetdata.height); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code %d", error_code); /* Set the camera preview callback */ error_code = camera_set_media_packet_preview_cb(bardetdata.g_camera, -                                                _camera_media_packet_preview_cb, -                                                NULL); + _camera_media_packet_preview_cb, + NULL); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Start the camera preview */ error_code = camera_start_preview(barcodeAppData.g_camera); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      For more information about the camera_set_display() function, see Configuring the Camera and its Callbacks in the Camera guide.

      @@ -229,21 +229,21 @@ if (error_code != CAMERA_ERROR_NONE) 
       struct _bargendata_s {
-    /* Barcode information variables */
-    mv_barcode_type_e type;
-    mv_barcode_qr_ecc_e ecc;
-    mv_barcode_qr_mode_e mode;
-    int version;
+    /* Barcode information variables */
+    mv_barcode_type_e type;
+    mv_barcode_qr_ecc_e ecc;
+    mv_barcode_qr_mode_e mode;
+    int version;
 
-    size_t width;
-    size_t height;
+    size_t width;
+    size_t height;
 
-    mv_barcode_image_format_e image_format;
+    mv_barcode_image_format_e image_format;
 
-    /* Media source handle */
-    mv_source_h g_source;
-    /* Barcode generation engine handle */
-    mv_engine_config_h g_engine_cfg;
+    /* Media source handle */
+    mv_source_h g_source;
+    /* Barcode generation engine handle */
+    mv_engine_config_h g_engine_cfg;
 };
 typedef struct _bargendata_s bargendata_s;
 
@@ -261,7 +261,7 @@ int error_code = 0;
 
 error_code = mv_create_engine_config(&bargendata.g_engine_cfg);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      For example, to define whether the barcode is generated with text, use the mv_engine_config_set_int_attribute() function with the MV_BARCODE_GENERATE_ATTR_TEXT attribute. The possible values for the attribute are defined in the mv_barcode_generate_attr_text_e enumeration (in mobile and wearable applications). The default value is MV_BARCODE_GENERATE_ATTR_TEXT_INVISIBLE.

      @@ -306,19 +306,19 @@ if (error_code != MEDIA_VISION_ERROR_NONE) static void _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data) { -    mv_rectangle_s mv_roi = {{0,0}, bardetdata.width, bardetdata.height}; + mv_rectangle_s mv_roi = {{0,0}, bardetdata.width, bardetdata.height}; -    if (pkt == NULL) -        return; + if (pkt == NULL) + return; -    error_code = mv_source_fill_by_media_packet(bardetdata.g_source, pkt); -    if (error_code != MEDIA_VISION_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error code); + error_code = mv_source_fill_by_media_packet(bardetdata.g_source, pkt); + if (error_code != MEDIA_VISION_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error code); -    if (pkt) { -        error_code = media_packet_destroy(pkt); -        pkt = NULL; -    } + if (pkt) { + error_code = media_packet_destroy(pkt); + pkt = NULL; + } @@ -328,10 +328,10 @@ _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data)

      In the _camera_media_packet_preview_cb() callback, detect barcodes in the image using the mv_barcode_detect() function:

      -    error_code = mv_barcode_detect(bardetdata.g_source, bardetdata.g_engine_cfg,
-                                   mv_roi, _barcode_detected_cb, NULL);
-    if (error_code != MEDIA_VISION_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    error_code = mv_barcode_detect(bardetdata.g_source, bardetdata.g_engine_cfg,
+                                   mv_roi, _barcode_detected_cb, NULL);
+    if (error_code != MEDIA_VISION_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 }
      @@ -350,21 +350,21 @@ _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data) 
       static void
 _barcode_detected_cb(mv_source_h source, mv_engine_config_h engine_cfg,
-                     const mv_quadrangle_s *barcode_locations, const char *message[],
-                     const mv_barcode_type_e *types, int number_of_barcodes,
-                     void *user_data)
+                     const mv_quadrangle_s *barcode_locations, const char *message[],
+                     const mv_barcode_type_e *types, int number_of_barcodes,
+                     void *user_data)
 {
-    int i = 0;
-    char type[50] = {'\0'};
+    int i = 0;
+    char type[50] = {'\0'};
 
-    /* Clear the source for the next preview image */
-    mv_source_clear(mv_source);
+    /* Clear the source for the next preview image */
+    mv_source_clear(mv_source);
 
-    if (number_of_barcode > 0) {
-        dlog_print(DLOG_INFO, LOG_TAG, "the number of barcodes: %d", number_of barcode);
-        for (i = 0; i < number_of_barcodes; i++)
-            dlog_print(DLOG_INFO, LOG_TAG, "%d >> message: %s\n", I, messages[i]);
-    }
+    if (number_of_barcode > 0) {
+        dlog_print(DLOG_INFO, LOG_TAG, "the number of barcodes: %d", number_of barcode);
+        for (i = 0; i < number_of_barcodes; i++)
+            dlog_print(DLOG_INFO, LOG_TAG, "%d >> message: %s\n", I, messages[i]);
+    }
 }
      @@ -377,15 +377,15 @@ _barcode_detected_cb(mv_source_h source, mv_engine_config_h engine_cfg, 
       error_code = camera_stop_preview(bardetdata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = camera_unset_media_packet_preview_cb(bardetdata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = camera_destroy(bardetdata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      For more information, see Releasing Resources in the Camera guide.

      @@ -399,11 +399,11 @@ if (error_code != CAMERA_ERROR_NONE) 
       error_code = mv_destroy_source(bardetdata.g_source)
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_destroy_engine_config(bardetdata.g_engine_cfg);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      @@ -444,7 +444,7 @@ int error_code = 0; error_code = mv_create_source(&bargendata.g_source); if (error_code != MEDIA_VISION_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);

      The source handle is used to save the generated barcode and related data into the source, and to access the barcode and related data from the source.

      @@ -457,13 +457,13 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
       error_code = mv_barcode_generate_source(bargendata.g_engine_cfg,
-                                        "MediaVision-Tutorial-QRcode",
-                                        bargendata.type, bargendata.mode,
-                                        bargendata.ecc, bargendata.version,
-                                        bargendata.g_source);
+                                        "MediaVision-Tutorial-QRcode",
+                                        bargendata.type, bargendata.mode,
+                                        bargendata.ecc, bargendata.version,
+                                        bargendata.g_source);
 
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      @@ -481,20 +481,20 @@ unsigned int image_buffer_size = 0; error_code = mv_source_get_width(bargendata.g_source, &image_width); if (error_code != MEDIA_VISION_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); error_code = mv_source_get_height(bargendata.g_source, &image_height); if (error_code != MEDIA_VISION_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); error_code = mv_source_get_colorspace(bargendata.g_source, &image_colorspace); if (error_code != MEDIA_VISION_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); error_code = mv_source_get_buffer(bargendata.g_source, &image_buffer_ptr, -                                  &image_buffer_size); + &image_buffer_size); if (error_code != MEDIA_VISION_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); @@ -506,7 +506,7 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
       error_code = mv_destroy_source(bargendata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      @@ -542,15 +542,15 @@ bargendata.image_format = MV_BARCODE_IMAGE_FORMAT_PNG; 
       error_code = mv_barcode_generate_image(bargendata.g_engine_cfg,
-                                       "MediaVision-Tutorial-QRcode",
-                                       bargendata.width, bargendata.height,
-                                       bargendata.type, bargendata.mode,
-                                       bargendata.ecc, bargendata.version,
-                                       "/opt/usr/media/mv_barcode_qrcode.png",
-                                       bargendata.image_format);
+                                       "MediaVision-Tutorial-QRcode",
+                                       bargendata.width, bargendata.height,
+                                       bargendata.type, bargendata.mode,
+                                       bargendata.ecc, bargendata.version,
+                                       "/opt/usr/media/mv_barcode_qrcode.png",
+                                       bargendata.image_format);
 
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      @@ -566,7 +566,7 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
       error_code = mv_destroy_engine_config(bargendata.g_engine_cfg);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      @@ -658,11 +658,11 @@ if (error_code != MEDIA_VISION_ERROR_NONE) Encoding mode Numeric - Numeric digits ('0', '1', ..., '9') + Numeric digits ('0', '1', ..., '9') Alphanumeric - Alphanumeric characters: numeric (0, 1, ..., 9), characters (A, B, ..., Z), and punctuation (' ', $, %, *, +, -, '.', /, ':') + Alphanumeric characters: numeric (0, 1, ..., 9), characters (A, B, ..., Z), and punctuation (' ', $, %, *, +, -, '.', /, ':') Byte 8-bit diff --git a/org.tizen.guides/html/native/media/image_edit_n.htm b/org.tizen.guides/html/native/media/image_edit_n.htm index b48bbef..8b3c88d 100644 --- a/org.tizen.guides/html/native/media/image_edit_n.htm +++ b/org.tizen.guides/html/native/media/image_edit_n.htm @@ -55,7 +55,7 @@

      Tizen offers various image processing features.

      The main features of the Image Util API include:

      - +
      • Conversion

        You can change the colorspace format among the supported formats.

        • @@ -69,9 +69,9 @@

        You can decode images and encode them with the following formats:

        • Bitmap formats:
          • YUV420, YUV422, RGB888, RGBA8888, BGRA8888, ARGB8888
          • -
        • Input image formats for decoding: +
        • Input image formats for decoding:
          • Only JPEG is supported when using image util
          • -
        • Output image formats for encoding: +
        • Output image formats for encoding:
          • JPEG

          Pay attention to how the image quality depends on the size and compression ratio.

        @@ -92,8 +92,8 @@

      • Declare the required variables:

        -#define SAMPLE_FILENAME "sample_image.jpg"
-#define OUTPUT_ROTATED_JPEG "rotated_image.jpg"
+#define SAMPLE_FILENAME "sample_image.jpg"
+#define OUTPUT_ROTATED_JPEG "rotated_image.jpg"
 
 const image_util_colorspace_e colorspace = IMAGE_UTIL_COLORSPACE_RGB888;
 unsigned char *img_rotate_target = NULL;
@@ -108,7 +108,7 @@ unsigned int size_decode = 0;
 
        To find out which JPEG color spaces are supported on the device, use the image_util_foreach_supported_jpeg_colorspace() function:
        
 
         int image_util_foreach_supported_jpeg_colorspace(image_util_supported_jpeg_colorspace_cb
-                                                 callback, void * user_data);
+                                                 callback, void * user_data);
 
        
 
        The possible color spaces are defined in the image_util_colorspace_e enumeration (in mobile and wearable applications).
        
 
        For more information about the YUV color space, see http://www.fourcc.org/yuv.php.
        
@@ -117,7 +117,7 @@ int image_util_foreach_supported_jpeg_colorspace(image_util_supported_jpeg_color
 
        To support the image_util_transform_run() function, which is used for all image transformations, set the source image and create a handle for it (to be used as the second parameter):
        
 
         ret = image_util_decode_jpeg(SAMPLE_FILENAME, colorspace, &img_source,
-                             &width, &height, &size_decode);
+                             &width, &height, &size_decode);
 
 ret = media_format_create(&fmt);
 ret = media_format_set_video_mime(fmt, colorspace);
@@ -177,8 +177,8 @@ ret = image_util_transform_set_colorspace(handle, colorspace);
 
 
         ret = image_util_transform_run(handle, src,
-                               (image_util_transform_completed_cb)completed_callback,
-                               user_data);
+                               (image_util_transform_completed_cb)completed_callback,
+                               user_data);
 
        
 
   
        
@@ -251,8 +251,8 @@ ret = image_util_transform_set_resolution(handle, width, height);
 
 
         ret = image_util_transform_run(handle, src,
-                               (image_util_transform_completed_cb)completed_callback,
-                               user_data);
+                               (image_util_transform_completed_cb)completed_callback,
+                               user_data);
 
        
 
 
@@ -328,8 +328,8 @@ ret = image_util_transform_set_rotation(handle, rotation);
 
 
         ret = image_util_transform_run(handle, src,
-                               (image_util_transform_completed_cb)completed_callback,
-                               user_data);
+                               (image_util_transform_completed_cb)completed_callback,
+                               user_data);
 
        
 
   
        
@@ -402,8 +402,8 @@ ret = image_util_transform_set_crop_area(handle, start_x, start_y, end_x, end_y)
 
 
         ret = image_util_transform_run(handle, src,
-                               (image_util_transform_completed_cb)completed_callback,
-                               user_data);
+                               (image_util_transform_completed_cb)completed_callback,
+                               user_data);
 
        
 
 
@@ -445,7 +445,7 @@ ret = image_util_transform_destroy(handle);
 
 
         ret = image_util_decode_jpeg(SAMPLE_FILENAME, colorspace, &img_source,
-                             &width, &height, &size_decode);
+                             &width, &height, &size_decode);
        • @@ -456,7 +456,7 @@ ret = image_util_decode_jpeg(SAMPLE_FILENAME, colorspace, &img_source, 
         ret = image_util_decode_jpeg_from_memory(jpeg_buffer, jpeg_size, colorspace,
-                                         image_buffer, width, height, size);
+                                         image_buffer, width, height, size);
        @@ -473,7 +473,7 @@ ret = image_util_decode_jpeg_from_memory(jpeg_buffer, jpeg_size, colorspace, 
         ret = image_util_encode_jpeg(img_flip_target, dest_width, dest_height,
-                             colorspace, 100, OUTPUT_ROTATED_JPEG);
+                             colorspace, 100, OUTPUT_ROTATED_JPEG);
        @@ -484,7 +484,7 @@ ret = image_util_encode_jpeg(img_flip_target, dest_width, dest_height, 
         ret = image_util_encode_jpeg_to_memory(img_flip_target, dest_width, dest_height,
-                                       colorspace, 100, jpeg_buffer, jpeg_size);
+                                       colorspace, 100, jpeg_buffer, jpeg_size);
        @@ -495,146 +495,146 @@ ret = image_util_encode_jpeg_to_memory(img_flip_target, dest_width, dest_height,

        The following tables define the supported colorspace formats.

        Table: RGB pixel formats

        - - - - - - - - - - - - - - - - - - - +
        LabelFOURCC in hexBits per pixelDescription
        RGB0x324247521, 4, 8, 16, 24, 32Alias for BI_RGB
        RGBA0x4142475216, 32Raw RGB with alpha. Sample precision and packing is arbitrary and determined using bit masks for each component, as for BI_BITFIELDS.
        + + + + + + + + + + + + + + + + + + + + +
        LabelFOURCC in hexBits per pixelDescription
        RGB0x324247521, 4, 8, 16, 24, 32Alias for BI_RGB
        RGBA0x4142475216, 32Raw RGB with alpha. Sample precision and packing is arbitrary and determined using bit masks for each component, as for BI_BITFIELDS.
        + +

        Table: Packed YUV formats

        + + + + + + + - -
        LabelFOURCC in hexBits per pixelDescription
        - -

        Table: Packed YUV formats

        - - - - - - - - - - - - - - - - - - - + + + + + - -
        LabelFOURCC in hexBits per pixelDescription
        UYVY0x5956595516YUV 4:2:2 (Y sample at every pixel, U and V sampled at every second pixel horizontally on each line). A macropixel contains 2 pixels in 1 u_int32.
        YUYV0x5659555916Duplicate of YUY2.
        UYVY0x5956595516YUV 4:2:2 (Y sample at every pixel, U and V sampled at every second pixel horizontally on each line). A macropixel contains 2 pixels in 1 u_int32.
        + + YUYV + 0x56595559 + 16 + Duplicate of YUY2. + + +

        Table: Planar YUV formats

        - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - - - -
        LabelFOURCC in hexBits per pixelDescription
        YV160x36315659168-bit Y plane followed by 8-bit 2x1 subsampled V and U planes.
        YV120x32315659128-bit Y plane followed by 8-bit 2x2 subsampled V and U planes.
        LabelFOURCC in hexBits per pixelDescription
        YV160x36315659168-bit Y plane followed by 8-bit 2x1 subsampled V and U planes.
        YV120x32315659128-bit Y plane followed by 8-bit 2x2 subsampled V and U planes.
        I4200x30323449128-bit Y plane followed by 8-bit 2x2 subsampled U and V planes.
        I4200x30323449128-bit Y plane followed by 8-bit 2x2 subsampled U and V planes.
        NV120x3231564E128-bit Y plane followed by an interleaved U/V plane with 2x2 subsampling.
        NV120x3231564E128-bit Y plane followed by an interleaved U/V plane with 2x2 subsampling.
        NV210x3132564E12As NV12 with U and V reversed in the interleaved plane.
        + + NV21 + 0x3132564E + 12 + As NV12 with U and V reversed in the interleaved plane. + + +

        Quality and Size Comparison

        The following table shows the effect on the image quality and file sizes when using different compression ratios.

        -

        Table: Quality and size comparison

        - - - - - - +

        Table: Quality and size comparison

        +
        ImageQualitySize (bytes)
        + + + + + - - - - - - - + + + + + + + - - - - - - + + + + + + - - - - - - + + + + + + - - - - - - - - - - - - - + + + + + + + + + + + + + - - -
        ImageQualitySize (bytes) Compression ratioDescription
        Highest quality imageHighest quality (Q = 100)83,2612.6:1Description
        Highest quality imageHighest quality (Q = 100)83,2612.6:1 Extremely minor artifacts
        High quality imageHigh quality (Q = 50)15,13815:1
        High quality imageHigh quality (Q = 50)15,13815:1 Initial signs of subimage artifacts
        Medium quality imageMedium quality (Q = 25)9,55323:1
        Medium quality imageMedium quality (Q = 25)9,55323:1 Stronger artifacts; loss of high-frequency information
        Low quality imageLow quality (Q = 10)4,78746:1Severe high frequency loss; artifacts on subimage boundaries ("macroblocking") are obvious
        Lowest quality imageLowest quality
        Low quality imageLow quality (Q = 10)4,78746:1Severe high frequency loss; artifacts on subimage boundaries ("macroblocking") are obvious
        Lowest quality imageLowest quality
        + + + diff --git a/org.tizen.guides/html/native/media/image_recognition_n.htm b/org.tizen.guides/html/native/media/image_recognition_n.htm index f53e1e9..a054c72 100644 --- a/org.tizen.guides/html/native/media/image_recognition_n.htm +++ b/org.tizen.guides/html/native/media/image_recognition_n.htm @@ -79,9 +79,9 @@
      • For image recognition, use the following imagedata_s structure: 
         struct _imagedata_s {
-    mv_source_h g_source;
-    mv_engine_config_h g_engine_config;
-    mv_image_object h g_image_object;
+    mv_source_h g_source;
+    mv_engine_config_h g_engine_config;
+    mv_image_object h g_image_object;
 };
 typedef struct _imagedata_s imagedata_s;
 static imagedata_s imagedata;
@@ -90,21 +90,21 @@ static imagedata_s imagedata;
 
      • For image tracking, use the following imagedata_s structure:
 
         struct _imagedata_s {
-    /* Variable for camera display */
-    Evas_Object *win;
-    Evas_Object *rect;
-    Evas *evas;
+    /* Variable for camera display */
+    Evas_Object *win;
+    Evas_Object *rect;
+    Evas *evas;
 
-    int preview_width;
-    int preview_height;
+    int preview_width;
+    int preview_height;
 
-    camera_h g_camera;
+    camera_h g_camera;
 
-    mv_source_h g_source;
-    mv_engine_config_h g_engine_config;
+    mv_source_h g_source;
+    mv_engine_config_h g_engine_config;
 
-    mv_image_object_h g_image_object
-    mv_image_tracking_model_h g_image_track_model;
+    mv_image_object_h g_image_object
+    mv_image_tracking_model_h g_image_track_model;
 };
 typedef struct _imagedata_s imagedata_s;
 static imagedata_s imagedata;
@@ -126,11 +126,11 @@ int error_code = 0;
 
 error_code = mv_create_source(&imagedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_create_engine_config(&imagedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
 
        
 
        • 
 
      • Decode the image file and fill the g_source handle with the decoded raw data.
@@ -143,71 +143,71 @@ unsigned int bufferSize = 0;
 int width = 0;
 int height = 0;
 
-error_code = image_util_decode_jpeg("/mydir/sample.jpg", IMAGE_UTIL_COLORSPACE_RGB888,
-                                    &dataBuffer, &width, &height, &bufferSize);
+error_code = image_util_decode_jpeg("/mydir/sample.jpg", IMAGE_UTIL_COLORSPACE_RGB888,
+                                    &dataBuffer, &width, &height, &bufferSize);
 if (error_code != IMAGE_UTIL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Fill the dataBuffer to g_source */
 error_code = mv_source_fill_by_buffer(imagedata.g_source, dataBuffer, bufferSize,
-                                      width, height, MEDIA_VISION_COLORSPACE_RGB888);
+                                      width, height, MEDIA_VISION_COLORSPACE_RGB888);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 free(dataBuffer);
 dataBuffer = NULL;
      • To recognize the sample.jpg image from others, create a g_image_object media vision image object handle and set a label. -

        In the following example, the image object label is set to '1'.

        +

        In the following example, the image object label is set to '1'.

         error_code = mv_image_object_create(&imagedata.g_image_object);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_image_object_set_label(&imagedata.g_image_object, 1);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Use the mv_image_object_fill() function to extract the sample.jpg features and keep them in the g_image_object image object handle.

        In the following example, the NULL parameter is given since the object to be recognized is the whole of the input image file. Give a correct ROI value, if the image object to be recognized is only a part of the input image file.

         error_code = mv_image_object_fill(imagedata.g_image_object, imagedata.g_engine_config,
-                                  imagedata.g_source, NULL);
+                                  imagedata.g_source, NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Use the mv_image_recognize() function to recognize the image object.

        The following example assumes that there is a what_isThis.jpg image file in the <OwnDataPath> folder, including the image object.

        -error_code = image_util_decode_jpeg("/mydir/what_isThis.jpg",
-                                    IMAGE_UTIL_COLORSPACE_RGB888,
-                                    &dataBuffer, &width, &height, &bufferSize);
+error_code = image_util_decode_jpeg("/mydir/what_isThis.jpg",
+                                    IMAGE_UTIL_COLORSPACE_RGB888,
+                                    &dataBuffer, &width, &height, &bufferSize);
 if (error_code != IMAGE_UTIL_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_source_clear(imagedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 /* Fill the dataBuffer to g_source */
 error_code = mv_source_fill_by_buffer(imagedata.g_source, dataBuffer, bufferSize,
-                                      width, height, MEDIA_VISION_COLORSPACE_RGB888);
+                                      width, height, MEDIA_VISION_COLORSPACE_RGB888);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 free(dataBuffer);
 dataBuffer = NULL;
 
 error_code = mv_image_recognize(imagedata.g_source, &imagedata.g_image_object, 1,
-                                imagedata.g_engine_config, _on_image_recognized_cb,
-                                NULL);
+                                imagedata.g_engine_config, _on_image_recognized_cb,
+                                NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • The mv_image_recognize() function invokes the _on_image_recognized_cb() callback. @@ -215,28 +215,28 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
         static void
 _on_image_recognized_cb(mv_source_h source, mv_engine_config_h engine_config,
-                        const mv_image_object_h *image_objects,
-                        mv_quadrangle_s **locations,
-                        unsigned int number_of_objects, void *user_data)
+                        const mv_image_object_h *image_objects,
+                        mv_quadrangle_s **locations,
+                        unsigned int number_of_objects, void *user_data)
 {
-    int object_num = 0;
-    for (object_num = 0; object_num < number_of_object; ++object_num) {
-        if (locations[object_num]) {
-            int recognized_label = 0;
-            mv_image_object_get_label(image_objects[object_num], &recognized_label);
-            dlog_print(DLOG_INFO, LOG_TAG,
-                       "image label [%d] on location:
-                        (%d,%d) -> (%d,%d) -> (%d,%d) -> (%d,%d)\n",
-                       recognized_label, locations[object_num]->points[0].x,
-                       locations[object_num]->points[0].y,
-                       locations[object_num]->points[1].x,
-                       locations[object_num]->points[1].y,
-                       locations[object_num]->points[2].x,
-                       locations[object_num]->points[2].y,
-                       locations[object_num]->points[3].x,
-                       locations[object_num]->points[3].y);
-        }
-    }
+    int object_num = 0;
+    for (object_num = 0; object_num < number_of_object; ++object_num) {
+        if (locations[object_num]) {
+            int recognized_label = 0;
+            mv_image_object_get_label(image_objects[object_num], &recognized_label);
+            dlog_print(DLOG_INFO, LOG_TAG,
+                       "image label [%d] on location:
+                        (%d,%d) -> (%d,%d) -> (%d,%d) -> (%d,%d)\n",
+                       recognized_label, locations[object_num]->points[0].x,
+                       locations[object_num]->points[0].y,
+                       locations[object_num]->points[1].x,
+                       locations[object_num]->points[1].y,
+                       locations[object_num]->points[2].x,
+                       locations[object_num]->points[2].y,
+                       locations[object_num]->points[3].x,
+                       locations[object_num]->points[3].y);
+        }
+    }
 }
        • @@ -245,15 +245,15 @@ _on_image_recognized_cb(mv_source_h source, mv_engine_config_h engine_config, 
         error_code = mv_destroy_source(imagedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_destroy_engine_config(imagedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_image_object_destroy(imagedata.g_image_object);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
        @@ -272,32 +272,32 @@ if (error_code != MEDIA_VISION_ERROR_NONE) int error_code = 0; error_code = camera_create(CAMERA_DEVICE_CAMERA0, &imagedata.g_camera); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Set the camera display */ error_code = camera_set_display(imagedata.g_camera, CAMERA_DISPLAY_TYPE_OVERLAY, -                                GET_DISPLAY(imagedata.win); + GET_DISPLAY(imagedata.win); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Get the camera preview resolution */ error_code = camera_get_preview_resolution(imagedata.g_camera, -                                           &imagedata.preview_width, -                                           &imagedata.preview_height); + &imagedata.preview_width, + &imagedata.preview_height); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Set the camera preview callback */ error_code = camera_set_media_packet_preview_cb(imagedata.g_camera, -                                                _camera_media_packet_preview_cb, -                                                NULL); + _camera_media_packet_preview_cb, + NULL); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Start the camera preview */ error_code = camera_start_preview(imagedata.g_camera); if (error_code != CAMERA_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Create the source and engine configuration handles: @@ -305,34 +305,34 @@ if (error_code != CAMERA_ERROR_NONE) 
         error_code = mv_create_source(&imagedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_create_engine_config(&imagedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
      • To track an image, create a g_image_object media vision image object handle and set a label. -

        In the following example, the image to be tracked is sample.jpg and the image object label is set to '1'.

        +

        In the following example, the image to be tracked is sample.jpg and the image object label is set to '1'.

         error_code = mv_image_object_create(&imagedata.g_image_object);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_image_object_set_label(&imagedata.g_image_object, 1);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Use the mv_image_object_fill() function to extract the sample.jpg features and keep them in the g_image_object image object handle.

        In the following example, the NULL parameter is given since the object to be tracked is the whole of the input image file. Give a correct ROI value, if the image object to be tracked is only a part of the input image file.

         error_code = mv_image_object_fill(imagedata.g_image_object,
-                                  imagedata.g_engine_config,
-                                  imagedata.g_source, NULL);
+                                  imagedata.g_engine_config,
+                                  imagedata.g_source, NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Create a g_image_track_model media vision image tracking model handle and set the target image object to be tracked: @@ -340,12 +340,12 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
         error_code = mv_image_tracking_model_create(&imagedata.g_image_track_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_image_tracking_model_set_target(imagedata.g_image_object,
-                                                imagedata.g_image_track_model);
+                                                imagedata.g_image_track_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
      • Define the camera preview callback. @@ -355,17 +355,17 @@ if (error_code != MEDIA_VISION_ERROR_NONE) static void _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data) { -    if (pkt == NULL) -        return; + if (pkt == NULL) + return; -    error_code = mv_source_fill_by_media_packet(imagedata.g_source, pkt); -    if (error_code != MEDIA_VISION_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error code); + error_code = mv_source_fill_by_media_packet(imagedata.g_source, pkt); + if (error_code != MEDIA_VISION_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error code); -    if (pkt) { -        error_code = media_packet_destroy(pkt); -        pkt = NULL; -    } + if (pkt) { + error_code = media_packet_destroy(pkt); + pkt = NULL; + } }
        • @@ -377,9 +377,9 @@ _camera_media_packet_preview_cb(media_packet_h pkt, void *user_data) 
         error_code = mv_image_track(imagedata.g_source, imagedata.g_image_track_model,
-                            imagedata.g_engine_config, _on_image_tracked_cb, NULL);
+                            imagedata.g_engine_config, _on_image_tracked_cb, NULL);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code= %d", error_code);
      • The mv_image_track() function invokes the _on_image_tracked_cb() callback. @@ -387,17 +387,17 @@ if (error_code != MEDIA_VISION_ERROR_NONE) 
         static void
 _on_image_tracked_cb(mv_source_h source, mv_image_object_h image_object,
-                     mv_engine_config_h engine_config, mv_quadrangle_s *location,
-                     void *user_data)
+                     mv_engine_config_h engine_config, mv_quadrangle_s *location,
+                     void *user_data)
 {
-    if (location) {
-        dlog_print(DLOG_INFO, LOG_TAG,
-                   "location: (%d,%d) -> (%d,%d) -> (%d,%d) -> (%d,%d)\n",
-                   location->points[0].x, location->points[0].y,
-                   location->points[1].x, location->points[1].y,
-                   location->points[2].x, location->points[2].y,
-                   location->points[3].x, location->points[3].y);
-    }
+    if (location) {
+        dlog_print(DLOG_INFO, LOG_TAG,
+                   "location: (%d,%d) -> (%d,%d) -> (%d,%d) -> (%d,%d)\n",
+                   location->points[0].x, location->points[0].y,
+                   location->points[1].x, location->points[1].y,
+                   location->points[2].x, location->points[2].y,
+                   location->points[3].x, location->points[3].y);
+    }
 }
        • @@ -408,15 +408,15 @@ _on_image_tracked_cb(mv_source_h source, mv_image_object_h image_object, 
         error_code = camera_stop_preview(imagedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = camera_unset_media_packet_preview_cb(imagedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = camera_destroy(imagedata.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

        For more information, see Releasing Resources in the Camera guide.

        @@ -427,19 +427,19 @@ if (error_code != CAMERA_ERROR_NONE) 
         error_code = mv_destroy_source(imagedata.g_source);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_destroy_engine_config(imagedata.g_engine_config);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_image_object_destroy(imagedata.g_image_object);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
 error_code = mv_image_tracking_model_destroy(imagedata.g_image_track_model);
 if (error_code != MEDIA_VISION_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
        diff --git a/org.tizen.guides/html/native/media/media_content_metadata_n.htm b/org.tizen.guides/html/native/media/media_content_metadata_n.htm index 2edbf54..1ca4f62 100644 --- a/org.tizen.guides/html/native/media/media_content_metadata_n.htm +++ b/org.tizen.guides/html/native/media/media_content_metadata_n.htm @@ -5,13 +5,13 @@ - + - Media Content and Metadata + Media Content and Metadata @@ -27,7 +27,7 @@
      • Tizen 2.3.1 and Higher for Wearable
    • -
    +

    Media Content and Metadata

    diff --git a/org.tizen.guides/html/native/media/media_content_n.htm b/org.tizen.guides/html/native/media/media_content_n.htm index 0e03a7d..308cacf 100644 --- a/org.tizen.guides/html/native/media/media_content_n.htm +++ b/org.tizen.guides/html/native/media/media_content_n.htm @@ -62,20 +62,20 @@
  • Retrieving Folder Content
    • -
  • Media information +
  • Media information
    • -
  • Playlist +
  • Playlist +
  • Tag +

    Related Info

    • Media Content API for Mobile Native
      • @@ -109,12 +109,12 @@

      Media Content

      - +

      You can get information about media content from the metadata in the content, such as an ID3 or MP4 tag. You can obtain or update data from the media database, which stores metadata for the media files (such as images, videos, and audio) in the device.

      - -

      Figure: Media content of the device

      -

      Media content of the device

      - + +

      Figure: Media content of the device

      +

      Media content of the device

      +

      The media files are updated using an application (by calling the Content API) or a media scanner. When updating the files in the media scanner, the following limitations apply:

      • SD card insertion and removal: Media files are updated only in the SD card.
      • Rebooting the device: Media files are updated in the internal memory and SD card in the device.
      @@ -139,7 +139,7 @@
    • Filter

      You can create a filter to find specific media items.

    • Media playlists -

      You can add or delete a playlist of the video and audio files, and add media files to a created playlist. In addition, you can also search for playlists and read playlist information.

      • +

      You can add or delete a playlist of the video and audio files, and add media files to a created playlist. In addition, you can also search for playlists and read playlist information.

    • Media tags

      You can access the tag information of the media files in the database. You can, for example, add media tags, retrieve tag information, and delete tags.

    • Media albums @@ -150,7 +150,7 @@

      You can retrieve information about the media storages.

    - +

    Prerequisites

    To enable your application to use the media content functionality:

    @@ -159,10 +159,10 @@

    To use the Media Content API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

     <privileges>
-   <!--To insert content-->
-   <privilege>http://tizen.org/privilege/content.write</privilege>
-   <!--To access a storage to insert content-->
-   <privilege>http://tizen.org/privilege/mediastorage</privilege>
+   <!--To insert content-->
+   <privilege>http://tizen.org/privilege/content.write</privilege>
+   <!--To access a storage to insert content-->
+   <privilege>http://tizen.org/privilege/mediastorage</privilege>
 </privileges>
    • @@ -179,9 +179,9 @@ int ret = MEDIA_CONTENT_ERROR_NONE; ret = media_content_connect(); if (ret == MEDIA_CONTENT_ERROR_NONE) -    dlog_print(DLOG_DEBUG, LOG_TAG, "connection is success"); + dlog_print(DLOG_DEBUG, LOG_TAG, "connection is success"); else -    dlog_print(DLOG_ERROR, LOG_TAG, "connection failed"); + dlog_print(DLOG_ERROR, LOG_TAG, "connection failed"); return ret; @@ -203,17 +203,17 @@ media_content_disconnect(); bool gallery_folder_list_cb(media_folder_h folder, void *user_data) { -    media_folder_h new_folder = NULL; -    media_folder_clone(&new_folder, folder); + media_folder_h new_folder = NULL; + media_folder_clone(&new_folder, folder); -    GList **list = (GList**)user_data; /* Include glib.h for this value */ + GList **list = (GList**)user_data; /* Include glib.h for this value */ -    *list = g_list_append(*list, new_folder); + *list = g_list_append(*list, new_folder); -    return true; + return true; } -
  • To find the folders, call the media_folder_foreach_folder_from_db() function with the defined callback. After the callback has created the folder list, you can access the folder details with various media_folder_get_XXX() functions. +
  • To find the folders, call the media_folder_foreach_folder_from_db() function with the defined callback. After the callback has created the folder list, you can access the folder details with various media_folder_get_XXX() functions. 
     int i;
 int count;
@@ -222,41 +222,41 @@ GList *folder_list = NULL; /* Include glib.h for this value */
 media_folder_h folder_handle = NULL;
 
 ret = media_folder_foreach_folder_from_db(filter, gallery_folder_list_cb,
-                                          &folder_list);
+                                          &folder_list);
 if (ret != MEDIA_CONTENT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "media_folder_foreach_folder_from_db failed: %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "media_folder_foreach_folder_from_db failed: %d", ret);
 
-    return ret;
+    return ret;
 } else {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "media_folder_foreach_folder_from_db success!!");
-
-    char *folder_id = NULL;
-    char *folder_name = NULL;
-    char *folder_path = NULL;
-
-    for (i = 0; i < g_list_length(folder_list); i++) {
-        folder_handle = (media_folder_h)g_list_nth_data(folder_list, i);
-
-        ret = media_folder_get_folder_id(folder_handle, &folder_id);
-        ret = media_folder_get_name(folder_handle, &folder_name);
-        ret = media_folder_get_path(folder_handle, &folder_path);
-
-        ret = media_folder_get_media_count_from_db(folder_id, filter, &count);
-
-        /* Release allocated strings */
-        free(folder_id);
-        free(folder_name);
-        free(folder_path);
-        if (ret != MEDIA_CONTENT_ERROR_NONE) {
-            dlog_print(DLOG_ERROR, LOG_TAG,
-                       "media_folder_get_media_count_from_db failed: %d", ret);
-
-            return ret;
-        } else {
-            dlog_print(DLOG_DEBUG, LOG_TAG, "media count [%d]: %d", i, count);
-        }
-    }
+    dlog_print(DLOG_DEBUG, LOG_TAG, "media_folder_foreach_folder_from_db success!!");
+
+    char *folder_id = NULL;
+    char *folder_name = NULL;
+    char *folder_path = NULL;
+
+    for (i = 0; i < g_list_length(folder_list); i++) {
+        folder_handle = (media_folder_h)g_list_nth_data(folder_list, i);
+
+        ret = media_folder_get_folder_id(folder_handle, &folder_id);
+        ret = media_folder_get_name(folder_handle, &folder_name);
+        ret = media_folder_get_path(folder_handle, &folder_path);
+
+        ret = media_folder_get_media_count_from_db(folder_id, filter, &count);
+
+        /* Release allocated strings */
+        free(folder_id);
+        free(folder_name);
+        free(folder_path);
+        if (ret != MEDIA_CONTENT_ERROR_NONE) {
+            dlog_print(DLOG_ERROR, LOG_TAG,
+                       "media_folder_get_media_count_from_db failed: %d", ret);
+
+            return ret;
+        } else {
+            dlog_print(DLOG_DEBUG, LOG_TAG, "media count [%d]: %d", i, count);
+        }
+    }
 }
    • @@ -264,12 +264,12 @@ if (ret != MEDIA_CONTENT_ERROR_NONE) { 
     /* Remove the folder list */
 if (folder_list) {
-    for (i = 0; i < g_list_length(folder_list); i++) {
-        folder_handle = (media_folder_h)g_list_nth_data(folder_list, i);
-        media_folder_destroy(folder_handle);
-    }
+    for (i = 0; i < g_list_length(folder_list); i++) {
+        folder_handle = (media_folder_h)g_list_nth_data(folder_list, i);
+        media_folder_destroy(folder_handle);
+    }
 
-    g_list_free(folder_list);
+    g_list_free(folder_list);
 }
    @@ -280,21 +280,21 @@ if (folder_list) {

    To retrieve a list of media items:

      -
    1. Define a callback function for the media_info_foreach_media_from_db() function, called for each available media item. Use the callback to create a list of media items. +
    2. Define a callback function for the media_info_foreach_media_from_db() function, called for each available media item. Use the callback to create a list of media items. 
       bool
 gallery_media_item_cb(media_info_h media, void *user_data)
 {
-    media_info_h new_media = NULL;
-    media_info_clone(&new_media, media);
+    media_info_h new_media = NULL;
+    media_info_clone(&new_media, media);
 
-    GList **list = (GList**)user_data; /* Include glib.h for this value */
-    *list = g_list_append(*list, new_media);
+    GList **list = (GList**)user_data; /* Include glib.h for this value */
+    *list = g_list_append(*list, new_media);
 
-    return true;
+    return true;
 }
      3. -
    3. To find the items satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties. For a detailed list of condition fields (such as MEDIA_TYPE) and their values (such as MEDIA_CONTENT_TYPE_IMAGE and MEDIA_CONTENT_TYPE_VIDEO), see the media_content_type.h header file. +
    4. To find the items satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties. For a detailed list of condition fields (such as MEDIA_TYPE) and their values (such as MEDIA_CONTENT_TYPE_IMAGE and MEDIA_CONTENT_TYPE_VIDEO), see the media_content_type.h header file.

      The following example filters media items so that only image and video files are included in the result. The filter is case-insensitive, and the results are sorted in a descending order based on the item display name. For more information about the filter properties, see Setting up a Filter. 

       #define BUFLEN 200
@@ -307,22 +307,22 @@ media_content_collation_e collate_type = MEDIA_CONTENT_COLLATE_NOCASE;
 media_content_order_e order_type = MEDIA_CONTENT_ORDER_DESC;
 ret = media_filter_create(&filter);
 
-snprintf(buf, BUFLEN, "%s = %d OR %s = %d", MEDIA_TYPE, MEDIA_CONTENT_TYPE_IMAGE,
-         MEDIA_TYPE, MEDIA_CONTENT_TYPE_VIDEO);
+snprintf(buf, BUFLEN, "%s = %d OR %s = %d", MEDIA_TYPE, MEDIA_CONTENT_TYPE_IMAGE,
+         MEDIA_TYPE, MEDIA_CONTENT_TYPE_VIDEO);
 ret = media_filter_set_condition(filter, buf, collate_type);
 if (ret != MEDIA_CONTENT_ERROR_NONE) {
-    media_filter_destroy(filter);
-    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set condition");
+    media_filter_destroy(filter);
+    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set condition");
 
-    return ret;
+    return ret;
 }
 
 ret = media_filter_set_order(filter, order_type, MEDIA_DISPLAY_NAME, collate_type);
 if (ret != MEDIA_CONTENT_ERROR_NONE) {
-    media_filter_destroy(filter);
-    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set order");
+    media_filter_destroy(filter);
+    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set order");
 
-    return ret;
+    return ret;
 }
    5. To find the media items, use the media_info_foreach_media_from_db() function with the defined callback. The function is synchronous, and it blocks until the callback has been called for all items or the callback returns false. @@ -335,12 +335,12 @@ ret = media_info_foreach_media_from_db(filter, gallery_media_item_cb, &all_i 
       /* Remove all items list */
 if (all_item_list) {
-    for (i = 0; i < g_list_length(all_item_list); i++) {
-        media_handle = (media_info_h)g_list_nth_data(all_item_list, i);
-        ret = media_info_destroy(media_handle);
-    }
+    for (i = 0; i < g_list_length(all_item_list); i++) {
+        media_handle = (media_info_h)g_list_nth_data(all_item_list, i);
+        ret = media_info_destroy(media_handle);
+    }
 
-    g_list_free(all_item_list);
+    g_list_free(all_item_list);
 }
 
 /* Destroy the filter handle */
@@ -350,7 +350,7 @@ media_filter_destroy(filter);

    Receiving Update Notifications

    - +

    To get notifications of database changes, register a callback. You can only set 1 notification callback at this stage of the process:

      @@ -358,42 +358,42 @@ media_filter_destroy(filter); 
       void
 _noti_cb(media_content_error_e error, int pid,
-         media_content_db_update_item_type_e update_item,
-         media_content_db_update_type_e update_type,
-         media_content_type_e media_type,
-         char *uuid, char *path, char *mime_type, void *user_data)
+         media_content_db_update_item_type_e update_item,
+         media_content_db_update_type_e update_type,
+         media_content_type_e media_type,
+         char *uuid, char *path, char *mime_type, void *user_data)
 {
-    if (error == MEDIA_CONTENT_ERROR_NONE)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "noti success! %d\n", error);
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "error occurred! %d\n", error);
-
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Noti from PID(%d)\n", pid);
-
-    if (update_item == MEDIA_ITEM_FILE)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti item: MEDIA_ITEM_FILE\n");
-    else if (update_item == MEDIA_ITEM_DIRECTORY)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti item: MEDIA_ITEM_DIRECTORY\n");
-
-    if (update_type == MEDIA_CONTENT_INSERT)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti type: MEDIA_CONTENT_INSERT\n");
-    else if (update_type == MEDIA_CONTENT_DELETE)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti type: MEDIA_CONTENT_DELETE\n");
-    else if (update_type == MEDIA_CONTENT_UPDATE)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti type: MEDIA_CONTENT_UPDATE\n");
-
-    dlog_print(DLOG_DEBUG, LOG_TAG, "content type: %d\n", media_type);
-
-    if (path)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "path: %s\n", path);
-    if (uuid)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "uuid: %s\n", uuid);
-    if (mime_type)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "mime_type: %s\n", mime_type);
-    if (user_data)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "String: %s\n", (char *)user_data);
-
-    return;
+    if (error == MEDIA_CONTENT_ERROR_NONE)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "noti success! %d\n", error);
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "error occurred! %d\n", error);
+
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Noti from PID(%d)\n", pid);
+
+    if (update_item == MEDIA_ITEM_FILE)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti item: MEDIA_ITEM_FILE\n");
+    else if (update_item == MEDIA_ITEM_DIRECTORY)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti item: MEDIA_ITEM_DIRECTORY\n");
+
+    if (update_type == MEDIA_CONTENT_INSERT)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti type: MEDIA_CONTENT_INSERT\n");
+    else if (update_type == MEDIA_CONTENT_DELETE)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti type: MEDIA_CONTENT_DELETE\n");
+    else if (update_type == MEDIA_CONTENT_UPDATE)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Noti type: MEDIA_CONTENT_UPDATE\n");
+
+    dlog_print(DLOG_DEBUG, LOG_TAG, "content type: %d\n", media_type);
+
+    if (path)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "path: %s\n", path);
+    if (uuid)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "uuid: %s\n", uuid);
+    if (mime_type)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "mime_type: %s\n", mime_type);
+    if (user_data)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "String: %s\n", (char *)user_data);
+
+    return;
 }
      @@ -402,7 +402,7 @@ _noti_cb(media_content_error_e error, int pid, int ret = MEDIA_CONTENT_ERROR_NONE; /* Subscribe notifications */ -char *user_str = strdup("hi"); +char *user_str = strdup("hi"); media_content_set_db_updated_cb(_noti_cb, (void*)user_str); @@ -418,20 +418,20 @@ media_content_unset_db_updated_cb();

      To find albums in the system and filter the results:

      1. To find the albums satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties.

        -

        The following example filters media albums so that only albums with the artist named "Tizen" are included in the result. The filter is case-insensitive, and the results are sorted in a descending order based on the album display name. For more information about the filter properties, see Setting up a Filter.

        +

        The following example filters media albums so that only albums with the artist named "Tizen" are included in the result. The filter is case-insensitive, and the results are sorted in a descending order based on the album display name. For more information about the filter properties, see Setting up a Filter.

         #define BUFLEN 200
 
 filter_h filter = NULL;
-char buf[BUFLEN] = {'\0'};
+char buf[BUFLEN] = {'\0'};
 
 media_filter_create(&filter);
 
-snprintf(buf, BUFLEN, "%s = 'Tizen'", MEDIA_ARTIST);
+snprintf(buf, BUFLEN, "%s = 'Tizen'", MEDIA_ARTIST);
 media_filter_set_condition(filter, buf, MEDIA_CONTENT_COLLATE_NOCASE);
 
 media_filter_set_order(filter, MEDIA_CONTENT_ORDER_DESC, MEDIA_DISPLAY_NAME,
-                       MEDIA_CONTENT_COLLATE_NOCASE);
+                       MEDIA_CONTENT_COLLATE_NOCASE);
 
 media_album_foreach_album_from_db(filter, media_album_list_cb, NULL);
 
@@ -477,37 +477,37 @@ media_album_list_cb(media_album_h album, void *user_data)
 
      2. 
 Use the media_album_get_album_id(), media_album_get_name(), and media_album_get_artist() functions to read the album ID, name, and artist:
 
        -    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
-
-    int id = -1;
-    char *name = NULL;
-    char *artist = NULL;
-    int count = -1;
-
-    /* Get the ID of the album */
-    ret = media_album_get_album_id(album, &id);
-    if (ret != MEDIA_CONTENT_ERROR_NONE)
-        /* Error handling */
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Album id: %d\n", id);
-
-    /* Get name of the album */
-    ret = media_album_get_name(album, &name);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Album name: %s\n", name);
-        free(name);
-    }
-
-    /* Get the artist name */
-    ret = media_album_get_artist(album, &artist);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Artist: %s\n", artist);
-        free(artist);
-    }
+    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
+
+    int id = -1;
+    char *name = NULL;
+    char *artist = NULL;
+    int count = -1;
+
+    /* Get the ID of the album */
+    ret = media_album_get_album_id(album, &id);
+    if (ret != MEDIA_CONTENT_ERROR_NONE)
+        /* Error handling */
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Album id: %d\n", id);
+
+    /* Get name of the album */
+    ret = media_album_get_name(album, &name);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Album name: %s\n", name);
+        free(name);
+    }
+
+    /* Get the artist name */
+    ret = media_album_get_artist(album, &artist);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Artist: %s\n", artist);
+        free(artist);
+    }
 
        
 
   
        
@@ -522,15 +522,15 @@ Get the media item count in the album with the media_album_get_media_count
 
        The second parameter is the filter. If it is set to NULL, all media is counted.
        
 
 
        -    /* Get media count in the album */
-    /* Filter is NULL - all media items are counted */
-    ret = media_album_get_media_count_from_db(id, NULL, &count);
-    if (ret != MEDIA_CONTENT_ERROR_NONE)
-        /* Error handling */
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Media count in this album: %d\n", count);
+    /* Get media count in the album */
+    /* Filter is NULL - all media items are counted */
+    ret = media_album_get_media_count_from_db(id, NULL, &count);
+    if (ret != MEDIA_CONTENT_ERROR_NONE)
+        /* Error handling */
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Media count in this album: %d\n", count);
 
-    return true;
+    return true;
 }
        
 
 
        3. 
@@ -566,43 +566,43 @@ media_album_foreach_media_from_db(id, NULL, album_contents_info_cb, NULL);
 
 
      3. Receive and handle the album content.
 
        Define the callback which you set in the media_album_foreach_media_from_db() function.
        
-
        The following example prints the title, MIME type, and size of the media item for which it was called.
         
+
        The following example prints the title, MIME type, and size of the media item for which it was called.
        
 
         bool
 album_contents_info_cb(media_info_h media, void *user_data)
 {
-    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
-
-    char *title = NULL;
-    char *mime_type = NULL;
-    unsigned long long size = -1;
-
-    /* Read the item title */
-    ret = media_info_get_title(media, &title);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Title: %s\n", title);
-        free(title);
-    }
-
-    /* Read the item MIME type */
-    ret = media_info_get_mime_type(media, &mime_type);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "MIME type: %s\n", mime_type);
-        free(mime_type);
-    }
-
-    /* Read the item size */
-    ret = media_info_get_size(media, &size);
-    if (ret != MEDIA_CONTENT_ERROR_NONE)
-        /* Error handling */
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Size: %llu\n", size);
-
-    return true;
+    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
+
+    char *title = NULL;
+    char *mime_type = NULL;
+    unsigned long long size = -1;
+
+    /* Read the item title */
+    ret = media_info_get_title(media, &title);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Title: %s\n", title);
+        free(title);
+    }
+
+    /* Read the item MIME type */
+    ret = media_info_get_mime_type(media, &mime_type);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "MIME type: %s\n", mime_type);
+        free(mime_type);
+    }
+
+    /* Read the item size */
+    ret = media_info_get_size(media, &size);
+    if (ret != MEDIA_CONTENT_ERROR_NONE)
+        /* Error handling */
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Size: %llu\n", size);
+
+    return true;
 }
        
 
 
@@ -618,7 +618,7 @@ album_contents_info_cb(media_info_h media, void *user_data)
 
        To set a bookmark for a video file at a given timestamp, use the media_bookmark_insert_to_db() function:
        
 
 
        -char* thumbnail_path = "path/to/image/file";
+char* thumbnail_path = "path/to/image/file";
 
 media_bookmark_insert_to_db(media_id, 220, thumbnail_path);
 media_bookmark_insert_to_db(media_id, 210, thumbnail_path);
@@ -628,7 +628,7 @@ media_bookmark_insert_to_db(media_id, 210, thumbnail_path);
 
  
        Finding Bookmarks
        
 
-
        To find a media item's bookmarks and filter the results:
        
+
        To find a media item's bookmarks and filter the results:
        
 
 
          
 
        1. To find the bookmarks satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties.
          
@@ -640,19 +640,19 @@ filter_h filter = NULL;
 media_filter_create(&filter);
 
 #define BUFLEN 200
-char buf[BUFLEN] = {'\0'};
+char buf[BUFLEN] = {'\0'};
 
-snprintf(buf, BUFLEN, "%s >= 220", BOOKMARK_MARKED_TIME);
+snprintf(buf, BUFLEN, "%s >= 220", BOOKMARK_MARKED_TIME);
 media_filter_set_condition(filter, buf, MEDIA_CONTENT_COLLATE_DEFAULT);
 
 media_filter_set_offset(filter,
-                        /* Offset */
-                        0,
-                        /* Count */
-                        3);
+                        /* Offset */
+                        0,
+                        /* Count */
+                        3);
 
 media_filter_set_order(filter, MEDIA_CONTENT_ORDER_ASC, BOOKMARK_MARKED_TIME,
-                       MEDIA_CONTENT_COLLATE_NOCASE);
+                       MEDIA_CONTENT_COLLATE_NOCASE);
 
        4. 
 
 
      4. To find the bookmarks set for a media item, use the media_info_foreach_bookmark_from_db() function.
        
@@ -690,19 +690,19 @@ bool
 get_bookmarks_cb(media_bookmark_h bookmark, void* user_data)
 {
        5. -

        A handle to the record is passed as a parameter. The return value determines whether the iterative calls of the callback continue (true) or are stopped (false).

        +

        A handle to the record is passed as a parameter. The return value determines whether the iterative calls of the callback continue (true) or are stopped (false).

      5. Once you have the bookmark handle (media_bookmark_h), you can read the bookmark information:
        • Use the media_bookmark_get_thumbnail_path() function to get the thumbnail path of the bookmark: 
          -    char *thumb = NULL;
+    char *thumb = NULL;
 
-    if (bookmark != NULL) {
-        media_bookmark_get_thumbnail_path(bookmark, &thumb);
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Thumbnail path: %s\n", thumb);
-        free(thumb);
+    if (bookmark != NULL) {
+        media_bookmark_get_thumbnail_path(bookmark, &thumb);
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Thumbnail path: %s\n", thumb);
+        free(thumb);
          @@ -715,13 +715,13 @@ get_bookmarks_cb(media_bookmark_h bookmark, void* user_data)
        • Use the media_bookmark_get_marked_time() function to get the marked time of the bookmark: 
          -        time_t time;
+        time_t time;
 
-        media_bookmark_get_marked_time(bookmark, &time);
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Marked time [s]: %d\n", (int) time);
-    }
+        media_bookmark_get_marked_time(bookmark, &time);
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Marked time [s]: %d\n", (int) time);
+    }
 
-    return true;
+    return true;
 }
        @@ -762,13 +762,13 @@ media_filter_create(&filter);

      6. Set a condition using the media_filter_set_condition() function.

        -

        The following example sets a condition which finds albums with the artist named "Tizen" with a case-insensitive search:

        +

        The following example sets a condition which finds albums with the artist named "Tizen" with a case-insensitive search:

         #define BUFLEN 200
-char buf[BUFLEN] = {'\0'};
+char buf[BUFLEN] = {'\0'};
 
-snprintf(buf, BUFLEN, "%s = 'Tizen'", MEDIA_ARTIST);
+snprintf(buf, BUFLEN, "%s = 'Tizen'", MEDIA_ARTIST);
 ret = media_filter_set_condition(filter, buf, MEDIA_CONTENT_COLLATE_NOCASE);
        @@ -811,7 +811,7 @@ media_filter_get_condition(filter, &check_condition, &check_collate_type 
         media_filter_set_order(filter, MEDIA_CONTENT_ORDER_ASC, MEDIA_ARTIST,
-                       MEDIA_CONTENT_COLLATE_DEFAULT);
+                       MEDIA_CONTENT_COLLATE_DEFAULT);

        The second and fourth parameters determine the order and collation types, and the available types are defined in the enumerators media_content_order_e (in mobile and wearable applications) and media_content_collation_e (in mobile and wearable applications).

        @@ -824,7 +824,7 @@ char *check_order_keyword = NULL; media_content_collation_e check_order_collate_type = MEDIA_CONTENT_COLLATE_DEFAULT; media_filter_get_order(filter, &check_order_type, &check_order_keyword, -                       &check_order_collate_type); + &check_order_collate_type);
        7. @@ -848,7 +848,7 @@ media_filter_get_offset(filter, &check_offset, &check_count);
      7. -

        When the filter is ready and its properties defined, you can use it in various media foreach functions to find different media items.

        +

        When the filter is ready and its properties defined, you can use it in various media foreach functions to find different media items.

        For example, to iterate through all media info in the media database, use the media_info_foreach_media_from_db() function:

         media_info_foreach_media_from_db(filter, media_cb, NULL);
@@ -871,20 +871,20 @@ media_filter_destroy(filter);
 
          
 
 
        1. To find only folders satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties.
          
-
          The following example filters media folders so that only folders named "Downloads" found in the internal storage are included in the result. The filter is case-insensitive, and the results are sorted in an ascending order based on the modified time. For more information about the filter properties, see Setting up a Filter.
          
+
          The following example filters media folders so that only folders named "Downloads" found in the internal storage are included in the result. The filter is case-insensitive, and the results are sorted in an ascending order based on the modified time. For more information about the filter properties, see Setting up a Filter.
          
 
           filter_h filter = NULL;
 
 media_filter_create(&filter);
 
 #define BUFLEN 200
-char buf[BUFLEN] = {'\0'};
-snprintf(buf, BUFLEN, "%s = 'Downloads'", FOLDER_NAME);
-snprintf(buf, BUFLEN, "%s = %d", FOLDER_STORAGE_TYPE, MEDIA_CONTENT_STORAGE_INTERNAL);
+char buf[BUFLEN] = {'\0'};
+snprintf(buf, BUFLEN, "%s = 'Downloads'", FOLDER_NAME);
+snprintf(buf, BUFLEN, "%s = %d", FOLDER_STORAGE_TYPE, MEDIA_CONTENT_STORAGE_INTERNAL);
 
 media_filter_set_condition(filter, buf, MEDIA_CONTENT_COLLATE_NOCASE);
 media_filter_set_order(filter, MEDIA_CONTENT_ORDER_ASC, FOLDER_MODIFIED_TIME,
-                       MEDIA_CONTENT_COLLATE_DEFAULT);
+                       MEDIA_CONTENT_COLLATE_DEFAULT);
 media_folder_foreach_folder_from_db(filter, folder_cb, NULL);
 
          
 
          2. 
@@ -929,31 +929,31 @@ folder_cb(media_folder_h folder, void *user_data)
 
          • Use the media_folder_get_folder_id(), media_folder_get_name(), and media_folder_get_path() functions to read the folder ID, name, and path:
            
 
 
            -    char *folder_id = NULL;
-    char *name = NULL;
-    char *path = NULL;
-
-    ret = media_folder_get_folder_id(folder, &folder_id);
-    if (ret != MEDIA_CONTENT_ERROR_NONE)
-        /* Error handling */
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Folder id: %s\n", folder_id);
-
-    ret = media_folder_get_name(folder, &name);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Folder name: %s\n", name);
-        free(name);
-    }
-
-    ret = media_folder_get_path(folder, &path);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Folder path: %s\n", path);
-        free(path);
-    }
+    char *folder_id = NULL;
+    char *name = NULL;
+    char *path = NULL;
+
+    ret = media_folder_get_folder_id(folder, &folder_id);
+    if (ret != MEDIA_CONTENT_ERROR_NONE)
+        /* Error handling */
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Folder id: %s\n", folder_id);
+
+    ret = media_folder_get_name(folder, &name);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Folder name: %s\n", name);
+        free(name);
+    }
+
+    ret = media_folder_get_path(folder, &path);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Folder path: %s\n", path);
+        free(path);
+    }
 
            
 
 
@@ -965,36 +965,36 @@ folder_cb(media_folder_h folder, void *user_data)
 
          • Read the folder storage type using the media_folder_get_storage_type() function:
            
 
 
            -    media_content_storage_e storage_type = MEDIA_CONTENT_STORAGE_INTERNAL;
-
-    ret = media_folder_get_storage_type(folder, &storage_type);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        switch (storage_type) {
-        case MEDIA_CONTENT_STORAGE_INTERNAL:
-            dlog_print(DLOG_DEBUG, LOG_TAG, "Folder storage type: Internal\n");
-            break;
-        case MEDIA_CONTENT_STORAGE_EXTERNAL:
-            dlog_print(DLOG_DEBUG, LOG_TAG, "Folder storage type: External\n");
-            break;
-        default:
-            dlog_print(DLOG_DEBUG, LOG_TAG, "Folder storage type: Unknown\n");
-            break;
-        }
-    }
+    media_content_storage_e storage_type = MEDIA_CONTENT_STORAGE_INTERNAL;
+
+    ret = media_folder_get_storage_type(folder, &storage_type);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        switch (storage_type) {
+        case MEDIA_CONTENT_STORAGE_INTERNAL:
+            dlog_print(DLOG_DEBUG, LOG_TAG, "Folder storage type: Internal\n");
+            break;
+        case MEDIA_CONTENT_STORAGE_EXTERNAL:
+            dlog_print(DLOG_DEBUG, LOG_TAG, "Folder storage type: External\n");
+            break;
+        default:
+            dlog_print(DLOG_DEBUG, LOG_TAG, "Folder storage type: Unknown\n");
+            break;
+        }
+    }
 
            • 
 
 
          • Get the last modified time:
            
 
 
            -    time_t time = 0;
+    time_t time = 0;
 
-    ret = media_folder_get_modified_time(folder, &time);
-    if (MEDIA_CONTENT_ERROR_NONE != ret)
-        /* Error handling */
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Modified time: %s", ctime(&time));
+    ret = media_folder_get_modified_time(folder, &time);
+    if (MEDIA_CONTENT_ERROR_NONE != ret)
+        /* Error handling */
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Modified time: %s", ctime(&time));
 
            • 
 
 
          • Get the media item count in the folder with the media_folder_get_media_count_from_db() function. 
            The second parameter is the filter. If it is set to NULL, all media is counted.
            
@@ -1002,17 +1002,17 @@ folder_cb(media_folder_h folder, void *user_data)
 
 
 
            -    int item_count = -1;
+    int item_count = -1;
 
-    ret = media_folder_get_media_count_from_db(folder_id, NULL, &item_count);
-    if (MEDIA_CONTENT_ERROR_NONE != ret)
-        /* Error handling */
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG,
-                   "Number of media contents: %d\n", item_count);
-    free(folder_id);
+    ret = media_folder_get_media_count_from_db(folder_id, NULL, &item_count);
+    if (MEDIA_CONTENT_ERROR_NONE != ret)
+        /* Error handling */
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG,
+                   "Number of media contents: %d\n", item_count);
+    free(folder_id);
 
-    return true;
+    return true;
 }
            
 
 
@@ -1049,17 +1049,17 @@ media_folder_foreach_media_from_db(folder_id, NULL, media_cb, NULL);
 bool
 media_cb(media_info_h media, void *user_data)
 {
-    char *title = NULL;
+    char *title = NULL;
 
-    ret = media_info_get_title(media, &title);
-    if (ret != MEDIA_CONTENT_ERROR_NONE) {
-        /* Error handling */
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Title: %s\n", title);
-        free(title);
-    }
+    ret = media_info_get_title(media, &title);
+    if (ret != MEDIA_CONTENT_ERROR_NONE) {
+        /* Error handling */
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Title: %s\n", title);
+        free(title);
+    }
 
-    return true;
+    return true;
 }
        8. @@ -1070,18 +1070,18 @@ media_cb(media_info_h media, void *user_data)

        To access media item information:

          -
        1. Define a callback function for the media_info_foreach_media_from_db() function, called for each available media item. Use the callback to create a list of items. +
        2. Define a callback function for the media_info_foreach_media_from_db() function, called for each available media item. Use the callback to create a list of items. 
           bool
 gallery_media_item_cb(media_info_h media, void *user_data)
 {
-    media_info_h new_media = NULL;
-    media_info_clone(&new_media, media);
+    media_info_h new_media = NULL;
+    media_info_clone(&new_media, media);
 
-    GList **list = (GList**)user_data;
-    *list = g_list_append(*list, new_media);
+    GList **list = (GList**)user_data;
+    *list = g_list_append(*list, new_media);
 
-    return true;
+    return true;
 }
        3. To find the items satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties. @@ -1094,7 +1094,7 @@ media_info_h media_handle = NULL; char *media_id = NULL; char *media_name = NULL; char *media_path = NULL; -char buf[BUFLEN] = {'\0'}; +char buf[BUFLEN] = {'\0'}; int ret = MEDIA_CONTENT_ERROR_NONE; filter_h filter = NULL; media_content_collation_e collate_type = MEDIA_CONTENT_COLLATE_NOCASE; @@ -1103,22 +1103,22 @@ media_content_order_e order_type = MEDIA_CONTENT_ORDER_DESC; media_filter_create(&filter); /* Set the condition */ -snprintf(buf, BUFLEN, "%s = %d OR %s = %d", MEDIA_TYPE, -         MEDIA_CONTENT_TYPE_IMAGE, MEDIA_TYPE, MEDIA_CONTENT_TYPE_VIDEO); +snprintf(buf, BUFLEN, "%s = %d OR %s = %d", MEDIA_TYPE, + MEDIA_CONTENT_TYPE_IMAGE, MEDIA_TYPE, MEDIA_CONTENT_TYPE_VIDEO); ret = media_filter_set_condition(filter, buf, collate_type); if (ret != MEDIA_CONTENT_ERROR_NONE) { -    media_filter_destroy(filter); -    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set condition"); + media_filter_destroy(filter); + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set condition"); -    return ret; + return ret; } ret = media_filter_set_order(filter, order_type, MEDIA_DISPLAY_NAME, collate_type); if (ret != MEDIA_CONTENT_ERROR_NONE) { -    media_filter_destroy(filter); -    dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set order"); + media_filter_destroy(filter); + dlog_print(DLOG_ERROR, LOG_TAG, "Failed to set order"); -    return ret; + return ret; }
          4. @@ -1129,94 +1129,94 @@ if (ret != MEDIA_CONTENT_ERROR_NONE) { 
           ret = media_info_foreach_media_from_db(filter, gallery_media_item_cb, &all_item_list);
 if (ret != MEDIA_CONTENT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "media_info_foreach_media_from_db failed: %d", ret);
-    media_filter_destroy(filter);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "media_info_foreach_media_from_db failed: %d", ret);
+    media_filter_destroy(filter);
 
-    return ret;
+    return ret;
 } else {
-    int i;
-
-    for (i = 0; i < g_list_length(all_item_list); i++) {
-        media_handle = (media_info_h)g_list_nth_data(all_item_list, i);
-
-        media_info_get_media_id(media_handle, &media_id);
-        media_info_get_media_type(media_handle, &media_type);
-        media_info_get_display_name(media_handle, &media_name);
-        media_info_get_file_path(media_handle, &media_path);
-
-        if (media_type == MEDIA_CONTENT_TYPE_IMAGE) {
-            image_meta_h image_handle;
-            media_content_orientation_e orientation = 0;
-            int width = 0;
-            int height = 0;
-            char *datetaken = NULL;
-            char *burst_id = NULL;
-
-            ret = media_info_get_image(media_handle, &image_handle);
-            if (ret != MEDIA_CONTENT_ERROR_NONE) {
-                /* Error handling */
-            } else {
-                image_meta_get_width(image_handle, &width);
-                image_meta_get_height(image_handle, &height);
-                image_meta_get_orientation(image_handle, &orientation);
-                image_meta_get_date_taken(image_handle, &datetaken);
-                image_meta_get_burst_id(image_handle, &burst_id);
-
-                dlog_print(DLOG_DEBUG, LOG_TAG, "This is an image");
-                dlog_print(DLOG_DEBUG, LOG_TAG,
-                           "Width: %d, Height: %d, Orientation: %d, Date taken: %s",
-                           width, height, orientation, datetaken);
-            }
-
-            if (datetaken)
-                free(datetaken);
-            if (burst_id)
-                free(burst_id);
-
-            image_meta_destroy(image_handle);
-        } else if (media_type == MEDIA_CONTENT_TYPE_VIDEO) {
-            video_meta_h video_handle;
-            char *title = NULL;
-            char *artist = NULL;
-            char *album = NULL;
-            char *album_artist = NULL;
-            int duration = 0;
-            time_t time_played = 0;
-
-            ret = media_info_get_video(media_handle, &video_handle);
-            if (ret != MEDIA_CONTENT_ERROR_NONE) {
-                /* Error handling */
-            } else {
-                video_meta_get_artist(video_handle, &artist);
-                video_meta_get_album(video_handle, &album);
-                video_meta_get_album_artist(video_handle, &album_artist);
-                video_meta_get_duration(video_handle, &duration);
-
-                media_info_get_played_time(media_handle, &time_played);
-
-                dlog_print(DLOG_DEBUG, LOG_TAG, "This is a video");
-                dlog_print(DLOG_DEBUG, LOG_TAG,
-                           "Title: %s, Album: %s, Artist: %s, Album_artist: %s \n
-                            Duration: %d, Played time: %d",
-                           title, album, artist, album_artist, duration, time_played);
-            }
-
-            free(artist);
-            free(album);
-            free(album_artist);
-
-            video_meta_destroy(video_handle);
-        }
-        dlog_print(DLOG_DEBUG, LOG_TAG, "media_id [%d]: %s", i, media_id);
-        dlog_print(DLOG_DEBUG, LOG_TAG, "media_name [%d]: %s", i, media_name);
-        dlog_print(DLOG_DEBUG, LOG_TAG, "media_path [%d]: %s", i, media_path);
-
-        free(media_id);
-        free(media_name);
-        free(media_path);
-        free(title);
-    }
+    int i;
+
+    for (i = 0; i < g_list_length(all_item_list); i++) {
+        media_handle = (media_info_h)g_list_nth_data(all_item_list, i);
+
+        media_info_get_media_id(media_handle, &media_id);
+        media_info_get_media_type(media_handle, &media_type);
+        media_info_get_display_name(media_handle, &media_name);
+        media_info_get_file_path(media_handle, &media_path);
+
+        if (media_type == MEDIA_CONTENT_TYPE_IMAGE) {
+            image_meta_h image_handle;
+            media_content_orientation_e orientation = 0;
+            int width = 0;
+            int height = 0;
+            char *datetaken = NULL;
+            char *burst_id = NULL;
+
+            ret = media_info_get_image(media_handle, &image_handle);
+            if (ret != MEDIA_CONTENT_ERROR_NONE) {
+                /* Error handling */
+            } else {
+                image_meta_get_width(image_handle, &width);
+                image_meta_get_height(image_handle, &height);
+                image_meta_get_orientation(image_handle, &orientation);
+                image_meta_get_date_taken(image_handle, &datetaken);
+                image_meta_get_burst_id(image_handle, &burst_id);
+
+                dlog_print(DLOG_DEBUG, LOG_TAG, "This is an image");
+                dlog_print(DLOG_DEBUG, LOG_TAG,
+                           "Width: %d, Height: %d, Orientation: %d, Date taken: %s",
+                           width, height, orientation, datetaken);
+            }
+
+            if (datetaken)
+                free(datetaken);
+            if (burst_id)
+                free(burst_id);
+
+            image_meta_destroy(image_handle);
+        } else if (media_type == MEDIA_CONTENT_TYPE_VIDEO) {
+            video_meta_h video_handle;
+            char *title = NULL;
+            char *artist = NULL;
+            char *album = NULL;
+            char *album_artist = NULL;
+            int duration = 0;
+            time_t time_played = 0;
+
+            ret = media_info_get_video(media_handle, &video_handle);
+            if (ret != MEDIA_CONTENT_ERROR_NONE) {
+                /* Error handling */
+            } else {
+                video_meta_get_artist(video_handle, &artist);
+                video_meta_get_album(video_handle, &album);
+                video_meta_get_album_artist(video_handle, &album_artist);
+                video_meta_get_duration(video_handle, &duration);
+
+                media_info_get_played_time(media_handle, &time_played);
+
+                dlog_print(DLOG_DEBUG, LOG_TAG, "This is a video");
+                dlog_print(DLOG_DEBUG, LOG_TAG,
+                           "Title: %s, Album: %s, Artist: %s, Album_artist: %s \n
+                            Duration: %d, Played time: %d",
+                           title, album, artist, album_artist, duration, time_played);
+            }
+
+            free(artist);
+            free(album);
+            free(album_artist);
+
+            video_meta_destroy(video_handle);
+        }
+        dlog_print(DLOG_DEBUG, LOG_TAG, "media_id [%d]: %s", i, media_id);
+        dlog_print(DLOG_DEBUG, LOG_TAG, "media_name [%d]: %s", i, media_name);
+        dlog_print(DLOG_DEBUG, LOG_TAG, "media_path [%d]: %s", i, media_path);
+
+        free(media_id);
+        free(media_name);
+        free(media_path);
+        free(title);
+    }
 }
          @@ -1230,44 +1230,44 @@ filter = NULL;

        Inserting Media in the Database

        - +

        To use newly created media files, insert them into the database:

        1. To add information in the database, use one of the following options:

          - +

          • media_info_insert_to_db() function:

             int ret = MEDIA_CONTENT_ERROR_NONE;
-char *image_file = "Default.jpg";
+char *image_file = "Default.jpg";
 char *directory = NULL;
 char *path = NULL;
 
 storage_get_directory(0, STORAGE_DIRECTORY_IMAGES, &directory);
 path = (char*)malloc(strlen(directory) + strlen(image_file) + 1);
 memset(path, 0x00, strlen(directory) + strlen(image_file) + 1);
-sprintf(path, "%s/%s", directory, image_file);
+sprintf(path, "%s/%s", directory, image_file);
 
 media_info_h media_item = NULL;
 
 ret = media_info_insert_to_db(path, &media_item);
 
 if ((ret == MEDIA_CONTENT_ERROR_NONE) && (media_item != NULL)) {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Insertion successful");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Insertion successful");
 } else {
-    dlog_print(DLOG_ERROR, LOG_TAG, "Insertion failed");
-    if (media_item != NULL)
-        media_info_destroy(media_item);
+    dlog_print(DLOG_ERROR, LOG_TAG, "Insertion failed");
+    if (media_item != NULL)
+        media_info_destroy(media_item);
 
-    return ret;
+    return ret;
 }
 
 /* After using the media handle, destroy it */
 ret = media_info_destroy(media_item);
 if (ret != MEDIA_CONTENT_ERROR_NONE) {
-    /* Error handling */
+    /* Error handling */
 
-    return ret;
+    return ret;
 }

            After using the media_info_insert_to_db() function, destroy the received media_info_h using the media_info_destroy() function.

            • @@ -1275,18 +1275,18 @@ if (ret != MEDIA_CONTENT_ERROR_NONE) {
          • media_content_scan_file() function: 
             int ret = MEDIA_CONTENT_ERROR_NONE;
-char *image_file = "Default.jpg";
+char *image_file = "Default.jpg";
 char *directory = NULL;
 char *file_path = NULL;
 
 storage_get_directory(0, STORAGE_DIRECTORY_IMAGES, &directory);
 file_path = (char*)malloc(strlen(directory) + strlen(image_file) + 1);
 memset(file_path, 0x00, strlen(directory) + strlen(image_file) + 1);
-sprintf(file_path, "%s/%s", directory, image_file);
+sprintf(file_path, "%s/%s", directory, image_file);
 
 ret = media_content_scan_file(file_path);
 if (ret != MEDIA_CONTENT_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
          @@ -1299,16 +1299,16 @@ if (ret != MEDIA_CONTENT_ERROR_NONE)

          Inserting a Media Folder in the Database

          To insert a media folder, and optionally any subfolders, in the database:

          - +
            -
          1. Define a callback function that is called after the asynchronous insertion (scanning) process is completed: +
          2. Define a callback function that is called after the asynchronous insertion (scanning) process is completed: 
             void
 _scan_cb(media_content_error_e err, void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Folder scanned\n");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Folder scanned\n");
 
-    return;
+    return;
 }
            3. @@ -1322,9 +1322,9 @@ storage_get_directory(0, STORAGE_DIRECTORY_IMAGES, &dir_path); ret = media_content_scan_folder(dir_path, TRUE, _scan_cb, NULL); if (ret != MEDIA_CONTENT_ERROR_NONE) { -    /* Error handling */ + /* Error handling */ -    return ret; + return ret; }
          @@ -1346,7 +1346,7 @@ int id; int ret; /* Create the playlist */ -media_playlist_insert_to_db("playlist_for_tutorial", &playlist); +media_playlist_insert_to_db("playlist_for_tutorial", &playlist);

          You can modify the playlist name later on using the media_playlist_set_name() function.

          2. @@ -1356,22 +1356,22 @@ media_playlist_insert_to_db("playlist_for_tutorial", &playlist); bool _media_info_cb(media_info_h media, void *user_data) { -    char *data = NULL; -    char *id = NULL; + char *data = NULL; + char *id = NULL; -    if (media != NULL) { -        GList **list = (GList**)user_data; + if (media != NULL) { + GList **list = (GList**)user_data; -        media_info_get_media_id(media, &id); -        dlog_print(DLOG_DEBUG, LOG_TAG, "Media found: %s\n", id); + media_info_get_media_id(media, &id); + dlog_print(DLOG_DEBUG, LOG_TAG, "Media found: %s\n", id); -        data = strdup(id); -        *list = g_list_append(*list, data); + data = strdup(id); + *list = g_list_append(*list, data); -        free(id); -    } + free(id); + } -    return true; + return true; } @@ -1389,19 +1389,19 @@ media_info_get_media_count_from_db(NULL, &media_count); media_info_foreach_media_from_db(NULL, _media_info_cb, &media_id_list); if (media_count > 0) { -    for (x = 0; x < media_count; x++) { -        char *media_id = (char*)g_list_nth_data(media_id_list, x); + for (x = 0; x < media_count; x++) { + char *media_id = (char*)g_list_nth_data(media_id_list, x); -        ret = media_playlist_add_media(playlist, media_id); + ret = media_playlist_add_media(playlist, media_id); -        free(media_id); -    } + free(media_id); + } } media_playlist_update_to_db(playlist); -
        2. When no longer needed, destroy the playlist: +
        3. When no longer needed, destroy the playlist: 
           media_playlist_destroy(playlist);
          @@ -1445,14 +1445,14 @@ media_filter_destroy(filter);

          To read playlist information, define a callback for the media_playlist_foreach_playlist_from_db() function and retrieve the basic playlist information (name, ID, and records included in the playlist) in the callback:

            -

          1. Read the playlist details within the callback:

            +

          2. Read the playlist details within the callback:

             static bool
 playlist_list_cb(media_playlist_h playlist, void* user_data)
 {
-    char *name = NULL;
-    int playlist_id = 0;
-    int count = 0;
+    char *name = NULL;
+    int playlist_id = 0;
+    int count = 0;

            A handle to the record is passed as a parameter. The return value determines whether the iterative calls of the callback continue (true) or are stopped (false).

            3. @@ -1461,32 +1461,32 @@ playlist_list_cb(media_playlist_h playlist, void* user_data)

          3. Use the media_playlist_get_name() and media_playlist_get_playlist_id() functions to read the playlist name and ID:

            -    media_playlist_get_name(playlist, &name);
-    media_playlist_get_playlist_id(playlist, &playlist_id);
+    media_playlist_get_name(playlist, &name);
+    media_playlist_get_playlist_id(playlist, &playlist_id);
            4. -

          4. Access the records within the playlist using the playlist ID.

            +

          5. Access the records within the playlist using the playlist ID.

            In the following example, 2 searches are executed for the records. The first search operates on all records on the playlist and retrieves the record count. The second search retrieves the first 10 records. Destroy the filters after all operations.

            -    filter_h temp_filter = NULL;
-    media_filter_create(&temp_filter);
+    filter_h temp_filter = NULL;
+    media_filter_create(&temp_filter);
 
-    media_filter_set_offset(temp_filter, -1, -1);
+    media_filter_set_offset(temp_filter, -1, -1);
 
-    media_playlist_get_media_count_from_db(playlist_id, temp_filter, &count);
-    filter_h audio_fltr;
+    media_playlist_get_media_count_from_db(playlist_id, temp_filter, &count);
+    filter_h audio_fltr;
 
-    media_filter_create(&audio_fltr);
+    media_filter_create(&audio_fltr);
 
-    media_filter_set_offset(audio_fltr, 0, 10);
+    media_filter_set_offset(audio_fltr, 0, 10);
 
-    media_playlist_foreach_media_from_db(playlist_id, audio_fltr,
-                                         audio_list_cb, NULL);
+    media_playlist_foreach_media_from_db(playlist_id, audio_fltr,
+                                         audio_list_cb, NULL);
 
-    media_filter_destroy(audio_fltr);
-    media_filter_destroy(temp_filter);
+    media_filter_destroy(audio_fltr);
+    media_filter_destroy(temp_filter);
 
-    return true;
+    return true;
 }
            6. @@ -1499,17 +1499,17 @@ playlist_list_cb(media_playlist_h playlist, void* user_data) static bool audio_list_cb(int playlist_member_id, media_info_h media_hndl, void *user_data) { -    char * id; -    media_info_get_media_id(media_hndl, &id); -    dlog_print(DLOG_DEBUG, LOG_TAG, "Media on the playlist: %s\n", id); -    free(id); + char * id; + media_info_get_media_id(media_hndl, &id); + dlog_print(DLOG_DEBUG, LOG_TAG, "Media on the playlist: %s\n", id); + free(id); -    return true; + return true; }
          4. -
        4. When no longer needed, destroy the playlist: +
        5. When no longer needed, destroy the playlist: 
           media_playlist_destroy(playlist);
          @@ -1527,14 +1527,14 @@ media_playlist_delete_from_db(id);

          Adding Tags

          - +

          To add a tag to the database, and a file to the tag:

          1. Add the tag.

            Use the media_tag_insert_to_db() function to add the tag. The result is a handle to the new tag.

             media_tag_h tag = NULL;
-const char *tag_name = "Tag name";
+const char *tag_name = "Tag name";
 
 media_tag_insert_to_db(tag_name, &tag);
            @@ -1546,7 +1546,7 @@ media_tag_insert_to_db(tag_name, &tag); media_info_h image_info = NULL; char *image_id = NULL; -media_info_insert_to_db("path/to/image_file", &image_info); +media_info_insert_to_db("path/to/image_file", &image_info); media_info_get_media_id(image_info, &image_id); @@ -1575,32 +1575,32 @@ media_tag_destroy(tag);

            To access information first about the tags and then about the media items related to specific tags:

              -
            1. Define callback functions for the media_tag_foreach_tag_from_db() and media_tag_foreach_media_from_db() functions, called for each available tag and each available media item for a specific tag. Use the callbacks to create a list of tags and media items. +
            2. Define callback functions for the media_tag_foreach_tag_from_db() and media_tag_foreach_media_from_db() functions, called for each available tag and each available media item for a specific tag. Use the callbacks to create a list of tags and media items. 
               /* glib library is used, so include glib.h */
 
 bool
 gallery_tag_item_cb(media_tag_h tag, void *user_data)
 {
-    media_tag_h new_tag = NULL;
-    media_tag_clone(&new_tag, tag);
+    media_tag_h new_tag = NULL;
+    media_tag_clone(&new_tag, tag);
 
-    GList **list = (GList**)user_data;
-    *list = g_list_append(*list, new_tag);
+    GList **list = (GList**)user_data;
+    *list = g_list_append(*list, new_tag);
 
-    return true;
+    return true;
 }
 
 bool
 gallery_media_item_cb(media_info_h media, void *user_data)
 {
-    media_info_h new_media = NULL;
-    media_info_clone(&new_media, media);
+    media_info_h new_media = NULL;
+    media_info_clone(&new_media, media);
 
-    GList **list = (GList**)user_data;
-    *list = g_list_append(*list, new_media);
+    GList **list = (GList**)user_data;
+    *list = g_list_append(*list, new_media);
 
-    return true;
+    return true;
 }
            3. To find the tags and related media items, use the media_tag_foreach_tag_from_db() and media_tag_foreach_media_from_db() functions with the defined callbacks. The functions are synchronous, and they block until the callbacks have been called for all items or the callbacks return false. @@ -1615,75 +1615,75 @@ GList *media_list_in_tag = NULL; ret = media_tag_foreach_tag_from_db(NULL, gallery_tag_item_cb, &tag_list); if (ret != MEDIA_CONTENT_ERROR_NONE) { -    dlog_print(DLOG_ERROR, LOG_TAG, "media_tag_foreach_tag_from_db() failed: %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "media_tag_foreach_tag_from_db() failed: %d", ret); -    return ret; + return ret; } else { -    dlog_print(DLOG_DEBUG, LOG_TAG, "media_tag_foreach_tag_from_db() successful"); -    char *tag_name = NULL; -    int tag_id; - -    for (i = 0; i < g_list_length(tag_list); i++) { -        tag_handle = (media_tag_h)g_list_nth_data(tag_list, i); -        media_tag_get_tag_id(tag_handle, &tag_id); -        media_tag_get_name(tag_handle, &tag_name); - -        ret = media_tag_foreach_media_from_db(tag_id, NULL, gallery_media_item_cb, -                                              &media_list_in_tag); -        if (ret != MEDIA_CONTENT_ERROR_NONE) { -            dlog_print(DLOG_ERROR, LOG_TAG, -                       "media_tag_foreach_media_from_db() failed: %d", ret); - -            return ret; -        } else { -            dlog_print(DLOG_DEBUG, LOG_TAG, -                       "media_tag_foreach_media_from_db() successful"); -            int j = 0; -            media_info_h tag_media_handle; -            char *media_id = NULL; -            char *media_name = NULL; -            char *media_path = NULL; -            media_content_type_e media_type = MEDIA_CONTENT_TYPE_IMAGE; - -            for (j = 0; j < g_list_length(media_list_in_tag); j++) { -                tag_media_handle = (media_info_h)g_list_nth_data(media_list_in_tag, j); -                ret = media_info_get_media_id(tag_media_handle, &media_id); - -                ret = media_info_get_display_name(tag_media_handle, &media_name); - -                ret = media_info_get_file_path(tag_media_handle, &media_path); - -                ret = media_info_get_media_type(tag_media_handle, &media_type); - -                dlog_print(DLOG_DEBUG, LOG_TAG, -                           "[%s] media_id [%d]: %s", tag_name, j, media_id); -                dlog_print(DLOG_DEBUG, LOG_TAG, -                           "[%s] media_type [%d]: %d", tag_name, j, media_type); -                dlog_print(DLOG_DEBUG, LOG_TAG, -                           "[%s] media_name [%d]: %s", tag_name, j, media_name); -                dlog_print(DLOG_DEBUG, LOG_TAG, -                           "[%s] media_path [%d]: %s", tag_name, j, media_path); - -                free(media_name); -                free(media_path); -                media_info_destroy(tag_media_handle); -            } -        } -        free(tag_name); -        media_tag_destroy(tag_handle); -        g_list_free(media_list_in_tag); -        media_list_in_tag = NULL; -    } -    g_list_free(tag_list); + dlog_print(DLOG_DEBUG, LOG_TAG, "media_tag_foreach_tag_from_db() successful"); + char *tag_name = NULL; + int tag_id; + + for (i = 0; i < g_list_length(tag_list); i++) { + tag_handle = (media_tag_h)g_list_nth_data(tag_list, i); + media_tag_get_tag_id(tag_handle, &tag_id); + media_tag_get_name(tag_handle, &tag_name); + + ret = media_tag_foreach_media_from_db(tag_id, NULL, gallery_media_item_cb, + &media_list_in_tag); + if (ret != MEDIA_CONTENT_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "media_tag_foreach_media_from_db() failed: %d", ret); + + return ret; + } else { + dlog_print(DLOG_DEBUG, LOG_TAG, + "media_tag_foreach_media_from_db() successful"); + int j = 0; + media_info_h tag_media_handle; + char *media_id = NULL; + char *media_name = NULL; + char *media_path = NULL; + media_content_type_e media_type = MEDIA_CONTENT_TYPE_IMAGE; + + for (j = 0; j < g_list_length(media_list_in_tag); j++) { + tag_media_handle = (media_info_h)g_list_nth_data(media_list_in_tag, j); + ret = media_info_get_media_id(tag_media_handle, &media_id); + + ret = media_info_get_display_name(tag_media_handle, &media_name); + + ret = media_info_get_file_path(tag_media_handle, &media_path); + + ret = media_info_get_media_type(tag_media_handle, &media_type); + + dlog_print(DLOG_DEBUG, LOG_TAG, + "[%s] media_id [%d]: %s", tag_name, j, media_id); + dlog_print(DLOG_DEBUG, LOG_TAG, + "[%s] media_type [%d]: %d", tag_name, j, media_type); + dlog_print(DLOG_DEBUG, LOG_TAG, + "[%s] media_name [%d]: %s", tag_name, j, media_name); + dlog_print(DLOG_DEBUG, LOG_TAG, + "[%s] media_path [%d]: %s", tag_name, j, media_path); + + free(media_name); + free(media_path); + media_info_destroy(tag_media_handle); + } + } + free(tag_name); + media_tag_destroy(tag_handle); + g_list_free(media_list_in_tag); + media_list_in_tag = NULL; + } + g_list_free(tag_list); }

            Deleting Tags

            - +

            To delete a tag:

              -
            1. Retrieve the tag ID to delete the tag. +
            2. Retrieve the tag ID to delete the tag.

              In this use case, the ID is obtained by calling the media_tag_foreach_tag_from_db() function, gathering a tag list in the function callback, iterating through the tag list to find the needed tag handle, and getting the tag ID with the handle using the media_tag_get_tag_id() function.

              The callback is identical to the one used in the Retrieving Tag Information use case.

              @@ -1698,19 +1698,19 @@ int len = g_list_length(tag_list);
 
 int i;
 for (i = 0; i < len; i++) {
-    tag_handle = (media_tag_h) g_list_nth_data(tag_list, i);
-    ret = media_tag_get_tag_id(tag_handle, &tag_id);
+    tag_handle = (media_tag_h) g_list_nth_data(tag_list, i);
+    ret = media_tag_get_tag_id(tag_handle, &tag_id);
            3. Delete the tag with the media_tag_delete_from_db() function. 
              -    ret = media_tag_delete_from_db(tag_id);
+    ret = media_tag_delete_from_db(tag_id);
            4. When no longer needed, destroy the handle: 
              -    ret = media_tag_destroy(tag_handle);
+    ret = media_tag_destroy(tag_handle);
 }
              5. @@ -1733,14 +1733,14 @@ tag_list = NULL; void storage_cb(media_storage_h storage, void *user_data) { -    media_storage_h new_storage = NULL; -    media_storage_clone(&new_storage, storage); + media_storage_h new_storage = NULL; + media_storage_clone(&new_storage, storage); -    GList **list = (GList**)user_data; -    *list = g_list_append(*list, new_media); + GList **list = (GList**)user_data; + *list = g_list_append(*list, new_media); } -
            5. To find the storages, call the media_storage_foreach_storage_from_db() function with the defined callback. After the callback has created the storage list, you can access the storage details with various media_storage_get_XXX() functions. +
            6. To find the storages, call the media_storage_foreach_storage_from_db() function with the defined callback. After the callback has created the storage list, you can access the storage details with various media_storage_get_XXX() functions. 
               char *id = NULL;
 char *name = NULL;
@@ -1750,25 +1750,25 @@ media_storage_h storage = NULL;
 
 ret = media_storage_foreach_storage_from_db(NULL, storage_cb, &storage_list);
 if (ret != MEDIA_CONTENT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "media_storage_foreach_storage_from_db failed: %d", ret);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "media_storage_foreach_storage_from_db failed: %d", ret);
 
-    return ret;
+    return ret;
 } else {
-    int i;
+    int i;
 
-    for (i = 0; i < g_list_length(storage_list); i++) {
-        storage = (media_storage_h)g_list_nth_data(storage_list, i);
-        media_storage_get_id(new_storage, &id);
-        media_storage_get_name(new_storage, &name);
-        media_storage_get_path(new_storage, &path);
+    for (i = 0; i < g_list_length(storage_list); i++) {
+        storage = (media_storage_h)g_list_nth_data(storage_list, i);
+        media_storage_get_id(new_storage, &id);
+        media_storage_get_name(new_storage, &name);
+        media_storage_get_path(new_storage, &path);
 
-        dlog_print(DLOG_DEBUG, LOG_TAG, "id:[%s] name:[%s] path:[%s]", id, name, path);
+        dlog_print(DLOG_DEBUG, LOG_TAG, "id:[%s] name:[%s] path:[%s]", id, name, path);
 
-        free(id);
-        free(name);
-        free(storage);
-    }
+        free(id);
+        free(name);
+        free(storage);
+    }
 }
            @@ -1777,22 +1777,22 @@ if (ret != MEDIA_CONTENT_ERROR_NONE) {

            Finding Media Item Groups

            A group is a collection of media items which have the same value of a given property. For example, if the property is the artist, there are as many groups as there are artists, and each group consists of items by the same artist. The possible groups are determined by the media_group_e enumerator values (in mobile and wearable applications), such as MEDIA_CONTENT_GROUP_ARTIST and MEDIA_CONTENT_GROUP_MIME_TYPE.

            - +

            To find media item groups and filter the results:

            1. To find the media items satisfying certain criteria, or modify the results in a specific way, create a filter and set its properties.

              -

              The following example filters media items so that only items whose display name ends with ".jpg" are included in the result (the '%' characters act as wildcards in the filter query, and they must be escaped using another '%' character to avoid compiler warnings). For more information about the filter properties, see Setting up a Filter.

              +

              The following example filters media items so that only items whose display name ends with ".jpg" are included in the result (the '%' characters act as wildcards in the filter query, and they must be escaped using another '%' character to avoid compiler warnings). For more information about the filter properties, see Setting up a Filter.

               filter_h filter;
 
 media_filter_create(&filter);
 
 #define BUFLEN 200 /* This is just an example */
-char buf[BUFLEN] = {'\0'};
+char buf[BUFLEN] = {'\0'};
 
-snprintf(buf, BUFLEN, "%s LIKE '%%.jpg'", MEDIA_DISPLAY_NAME);
+snprintf(buf, BUFLEN, "%s LIKE '%%.jpg'", MEDIA_DISPLAY_NAME);
 media_filter_set_condition(filter, buf, MEDIA_CONTENT_COLLATE_DEFAULT);
            2. To group media files based on the MIME type: @@ -1805,7 +1805,7 @@ media_group_e group = MEDIA_CONTENT_GROUP_MIME_TYPE; int count = -1; media_group_get_group_count_from_db(NULL, group, &count); -dlog_print(DLOG_DEBUG, LOG_TAG, "Group count: %d\n", count); +dlog_print(DLOG_DEBUG, LOG_TAG, "Group count: %d\n", count);

              Since the filter (first parameter) is set to NULL, no filtering is performed and all groups are counted.

              3. @@ -1847,41 +1847,41 @@ group_cb(const char *name, void *user_data)
            3. Once you have the group name and identifier (passed in user_data), you can read the group information:
              • -

                Get the number of items in the group using the media_group_get_media_count_from_db() function.

                +

                Get the number of items in the group using the media_group_get_media_count_from_db() function.

                The third parameter is the filter. If it is set to NULL, all items in the group are counted.

                -    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
-    media_group_e group = (media_group_e) user_data;
+    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
+    media_group_e group = (media_group_e) user_data;
 
-    dlog_print(DLOG_DEBUG, LOG_TAG, "\n");
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Group name: %s\n", name);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "\n");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Group name: %s\n", name);
 
-    int count = -1;
-    media_group_get_media_count_from_db(name, group, NULL, &count);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Media count in group: %d\n", count);
+    int count = -1;
+    media_group_get_media_count_from_db(name, group, NULL, &count);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Media count in group: %d\n", count);

              • Get all items in the group using the media_group_foreach_media_from_db() function. Define a callback (media_cb()) for the function to be triggered for each found item.

                -    media_group_foreach_media_from_db(name, group, NULL, media_cb, NULL);
+    media_group_foreach_media_from_db(name, group, NULL, media_cb, NULL);
 
-    return true;
+    return true;
 }
 
 bool
 media_cb(media_info_h media, void *user_data)
 {
-    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
-    char *name = NULL;
+    media_content_error_e ret = MEDIA_CONTENT_ERROR_NONE;
+    char *name = NULL;
 
-    media_info_get_display_name(media, &name);
-    if (name != NULL) {
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Name: %s\n", name);
-        free(name);
-    }
+    media_info_get_display_name(media, &name);
+    if (name != NULL) {
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Name: %s\n", name);
+        free(name);
+    }
 
-    return true;
+    return true;
 }
            @@ -1891,341 +1891,341 @@ media_cb(media_info_h media, void *user_data)

            The following tables list the information available about the media files.

            -

            Table: General information

            - - - +

            Table: General information

            +
            + + - - - + + + - - + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - -
            Metadata nameDescription
            Description
            Media ID ID of the media content
            File path Path of the media content
            Display name Display name of the media content
            Media type
            Media type The media type of the media content
            Mime type
            Mime type Mime type of the media content
            Size
            Size File size of the media content
            Added time
            Added time The time the media content was added in the database
            Modified time
            Modified time The last modification time of the media content
            Timeline
            Timeline The time the media content was created

            You can use this value to sort the content.

            Thumbnail path
            Thumbnail path Path of the stored thumbnail image of the media content
            Description
            Description Description of the media content
            Longitude
            Longitude Longitude of the media content
            Latitude
            Latitude Latitude of the media content
            Altitude
            Altitude Altitude of the media content
            Weather
            Weather Weather information of the media content
            Rating
            Rating Rating of the media content
            Favorite
            Favorite Favorite of the media content
            Author
            Author The author of the media content
            Provider
            Provider Provider of the media content
            Content name
            Content name Content name of the media content
            Title
            Title Title of the media content
            Category
            Category Category of the media content
            Location tag
            Location tag Location tag of the media content
            Age rating
            Age rating Age rating of the media content
            Keyword
            Keyword Keyword of the media content
            Is DRM
            Is DRM Check flag for DRM content
            Storage type
            Storage type Storage type of the media content
            Played count
            Played count Played count of the media content
            Played time
            Played time Last played time of the media content
            Played position
            Played position Last played position of the media content
            + + + +

            For metadata of an audio file, call the media_info_get_audio() function with the media handle.

            -

            Table: Audio metadata (only for audio files)

            - - - - - - - - +

            Table: Audio metadata (only for audio files)

            +
            Metadata nameDescription
            Media ID
            + + + + + + + - - - + + + - - - + + + - - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - - + + + - - - + + + - - - + + + - - - + + + - - + +
            Metadata nameDescription
            Media ID Media ID of the audio content

            This value is same as the media ID in general information.

            Album
            Album Album information of the audio content
            Artist
            Artist Artist of the audio content
            Album ArtistAlbum artist of the audio content +
            Album ArtistAlbum artist of the audio content

            The artist and album artist can be the same.

            Genre
            Genre Genre of the audio content
            Composer
            Composer Composer of the audio content
            Year
            Year The year the audio content was created
            Recorded date
            Recorded date The date the audio content was recorded
            Copyright
            Copyright Copyright information of the audio content
            Track number
            Track number Track number of the audio content
            Bit rate
            Bit rate Bit rate of the audio content
            Bit per sampleBit per sample of the audio content +
            Bit per sampleBit per sample of the audio content

            The bit per sample is the same as the sample format. The sample format is the number of digits in the digital representation of each sample.

            Sample rate
            Sample rate Sample rate of the audio content
            Channel
            Channel Channel information of the audio content
            Duration
            Duration Duration of the audio content
            - +

            For metadata of an image file, call the media_info_get_image() function with the media handle.

            -

            Table: Image metadata (only for image files)

            - - - - - - - - +

            Table: Image metadata (only for image files)

            +
            Metadata nameDescription
            Media ID
            + + + + + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - + + - - - + + + - - - + + + - - - - + + + - - -
            Metadata nameDescription
            Media ID Media ID of the image

            This value is the same as the media ID in the general information.

            Width
            Width Width of the image
            Height
            Height Height of the image
            Exposure time
            Exposure time Exposure time of the image
            F-number
            F-number F-number of the image
            ISO
            ISO ISO information of the image
            Model
            Model Model name of the image
            Orientation
            Orientation Orientation information of the image
            Date taken
            Date taken The time the image was created

            You can get this information from the EXIF tag. If there is no EXIF tag for the image, set the created time in the file system.

            Is burstshot
            Is burstshot Check flag for a burst shot of the image

            The burst shot is a continuous shooting mode.

            Burstshot IDID of a burst shot image +
            Burstshot IDID of a burst shot image

            Assign the same ID to the burst shooting mode.

            -

            For metadata of a video file, call withmedia_info_get_video() function with the media handle.

            -

            Table: Video metadata (only for video files)

            - - - - - - - - + + +
            Metadata nameDescription
            Media ID
            +

            For metadata of a video file, call withmedia_info_get_video() function with the media handle.

            +

            Table: Video metadata (only for video files)

            + + + + + + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - + - + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - -
            Metadata nameDescription
            Media ID The media ID of the video content

            This value is same with media ID of general information.

            Album
            Album Album of the video content
            Artist
            Artist Artist of the video content
            Album artist
            Album artist Album artist of the video content
            Genre
            Genre Genre of the video content
            Composer
            Composer Media composer of the video content
            YearYear The year the video content was created
            Recorded date
            Recorded date The date the video content was recorded
            Copyright
            Copyright Copyright of the video content
            Track number
            Track number Track number of the video content
            Bit rate
            Bit rate Bit rate of the video content
            Duration
            Duration Duration of the video content
            Width
            Width Width of the video content
            Height
            Height Height of the video content
            - + + + + + -
    diff --git a/org.tizen.guides/html/native/media/media_controller_n.htm b/org.tizen.guides/html/native/media/media_controller_n.htm index 3a75f20..866dfbe 100644 --- a/org.tizen.guides/html/native/media/media_controller_n.htm +++ b/org.tizen.guides/html/native/media/media_controller_n.htm @@ -54,138 +54,138 @@

    To transfer the information at the client request, the media controller server updates the state information while the application is active. If the application is terminated when the client request arrives, the media controller server transfers the latest information.

  • Sending and processing commands

    You can send a command to the server from the client side, and then process the command on the server side.

    -

    The client can request information from the server, and receive it through a callback.

    +

    The client can request information from the server, and receive it through a callback.

    The following tables define the various information the client can receive.

    -

    Table: Media controller server state attributes

    +

    Table: Media controller server state attributes

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    AttributeDescription
    Server states
    MC_SERVER_ACTIVATERequested media controller server is active
    MC_SERVER_DEACTIVATERequested media controller server is not active
    Playback states
    MC_PLAYBACK_STATE_NONENo history of media playback
    MC_PLAYBACK_STATE_PLAYINGPlayback state of playing
    MC_PLAYBACK_STATE_PAUSEDPlayback state of paused
    MC_PLAYBACK_STATE_STOPPEDPlayback state of stopped
    MC_PLAYBACK_STATE_NEXT_FILEPlayback state of next file
    MC_PLAYBACK_STATE_PREV_FILEPlayback state of previous file
    MC_PLAYBACK_STATE_FAST_FORWARDPlayback state of fast forward
    AttributeDescription
    MC_PLAYBACK_STATE_REWINDPlayback state of rewind
    Shuffle mode states
    MC_SHUFFLE_MODE_ONShuffle mode is on
    MC_SHUFFLE_MODE_OFFShuffle mode is off
    Repeat mode states
    MC_REPEAT_MODE_ONRepeat mode is on
    MC_REPEAT_MODE_OFFRepeat mode is off
    + + Server states + + + MC_SERVER_ACTIVATE + Requested media controller server is active + + + MC_SERVER_DEACTIVATE + Requested media controller server is not active + + + Playback states + + + MC_PLAYBACK_STATE_NONE + No history of media playback + + + MC_PLAYBACK_STATE_PLAYING + Playback state of playing + + + MC_PLAYBACK_STATE_PAUSED + Playback state of paused + + + MC_PLAYBACK_STATE_STOPPED + Playback state of stopped + + + MC_PLAYBACK_STATE_NEXT_FILE + Playback state of next file + + + MC_PLAYBACK_STATE_PREV_FILE + Playback state of previous file + + + MC_PLAYBACK_STATE_FAST_FORWARD + Playback state of fast forward + + + MC_PLAYBACK_STATE_REWIND + Playback state of rewind + + + Shuffle mode states + + + MC_SHUFFLE_MODE_ON + Shuffle mode is on + + + MC_SHUFFLE_MODE_OFF + Shuffle mode is off + + + Repeat mode states + + + MC_REPEAT_MODE_ON + Repeat mode is on + + + MC_REPEAT_MODE_OFF + Repeat mode is off + + +

    Table: Media controller server metadata attributes

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
    AttributeDescription
    MC_META_MEDIA_TITLETitle of the latest content in the media controller server
    MC_META_MEDIA_ARTISTArtist of the latest content in the media controller server
    MC_META_MEDIA_ALBUMAlbum name of the latest content in the media controller server
    MC_META_MEDIA_AUTHORAuthor of the latest content in the media controller server
    MC_META_MEDIA_GENREGenre of the latest content in the media controller server
    MC_META_MEDIA_DURATIONDuration of the latest content in the media controller server
    MC_META_MEDIA_DATEDate of the latest content in the media controller server
    MC_META_MEDIA_COPYRIGHTCopyright of the latest content in the media controller server
    MC_META_MEDIA_DESCRIPTIONDescription of the latest content in the media controller server
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - + + + - - - + + + - -
    AttributeDescription
    MC_META_MEDIA_TITLETitle of the latest content in the media controller server
    MC_META_MEDIA_ARTISTArtist of the latest content in the media controller server
    MC_META_MEDIA_ALBUMAlbum name of the latest content in the media controller server
    MC_META_MEDIA_AUTHORAuthor of the latest content in the media controller server
    MC_META_MEDIA_GENREGenre of the latest content in the media controller server
    MC_META_MEDIA_DURATIONDuration of the latest content in the media controller server
    MC_META_MEDIA_DATEDate of the latest content in the media controller server
    MC_META_MEDIA_COPYRIGHTCopyright of the latest content in the media controller server
    MC_META_MEDIA_DESCRIPTIONDescription of the latest content in the media controller server
    MC_META_MEDIA_TRACK_NUMTrack number of the latest content in the media controller server
    MC_META_MEDIA_TRACK_NUMTrack number of the latest content in the media controller server
    MC_META_MEDIA_PICTUREAlbum art of the latest content in the media controller server
    MC_META_MEDIA_PICTUREAlbum art of the latest content in the media controller server
    + +

    • Prerequisites

    @@ -298,8 +298,8 @@ char *server_name = NULL; mc_server_state_e server_state; ret = mc_client_get_latest_server_info(g_mc_client, &server_name, &server_state); -dlog_print(DLOG_DEBUG, LOG_TAG, "Server Name: %s, Server state: %d\n", -           server_name, server_state); +dlog_print(DLOG_DEBUG, LOG_TAG, "Server Name: %s, Server state: %d\n", + server_name, server_state); @@ -317,7 +317,7 @@ mc_playback_states_e playback_state; ret = mc_client_get_server_playback_info(g_client_h, server_name, &playback); ret = mc_client_get_playback_state(playback, &playback_state); -dlog_print(DLOG_DEBUG, LOG_TAG, "Playback State: %d\n", playback_state); +dlog_print(DLOG_DEBUG, LOG_TAG, "Playback State: %d\n", playback_state);

    The mc_client_get_playback_state() function retrieves the playback state from the playback information returned by the mc_client_get_server_playback_info() function.

    @@ -361,8 +361,8 @@ char *server_name = NULL; mc_server_state_e server_state; ret = mc_client_get_latest_server_info(g_mc_client, &server_name, &server_state); -dlog_print(DLOG_DEBUG, LOG_TAG, "Server Name: %s, Server state: %d\n", -           server_name, server_state); +dlog_print(DLOG_DEBUG, LOG_TAG, "Server Name: %s, Server state: %d\n", + server_name, server_state); @@ -420,8 +420,8 @@ ret = mc_server_create(&g_server_h); void command_received_cb(const char* client_name, mc_playback_states_e state, void *user_data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "Client Name: %s, Playback state: %d\n", -               client_name, state); + dlog_print(DLOG_DEBUG, LOG_TAG, "Client Name: %s, Playback state: %d\n", + client_name, state); } @@ -451,7 +451,7 @@ command_received_cb(const char* client_name, mc_playback_states_e state, void *u 
     ret = mc_server_set_playback_state_command_received_cb(g_mc_server,
-                                                       command_received_cb, NULL);
+                                                       command_received_cb, NULL);
    diff --git a/org.tizen.guides/html/native/media/media_conversions_n.htm b/org.tizen.guides/html/native/media/media_conversions_n.htm index 80f6cd7..2b20773 100644 --- a/org.tizen.guides/html/native/media/media_conversions_n.htm +++ b/org.tizen.guides/html/native/media/media_conversions_n.htm @@ -43,7 +43,7 @@
  • Setting Parameters
  • Monitoring the Transcoding Progress
    • - +

    Related Info

    • Media Codec API for Mobile Native
      • @@ -67,10 +67,10 @@

      Media Codecs

      -

      Media codec provides interfaces for encoding and decoding audio and video data.

      +

      Media codec provides interfaces for encoding and decoding audio and video data.

      + +

      To use codecs:

      -

      To use codecs:

      -

      1. Create a handle for the codec instance with the mediacodec_create() function. After a successful handle creation, your system can use the codec.

      2. Set the codec configuration with the mediacodec_set_codec(), and mediacodec_set_vdec_info() or mediacodec_set_venc_info() functions.

        @@ -78,12 +78,12 @@

      3. Decode and encode with the mediacodec_process_input() and mediacodec_get_output() functions.

      -

      A single MediaCodec instance handles 1 specific type of data (such as aac audio or H.264 video), and can encode or decode. The codec operates on "raw" data, so strip off any file headers (such as ID3 tags).

      +

      A single MediaCodec instance handles 1 specific type of data (such as aac audio or H.264 video), and can encode or decode. The codec operates on "raw" data, so strip off any file headers (such as ID3 tags).

      - -

      The following figures illustrate the general media state changes.

      -

      Figure: Media state changes

      -

      Media state changes

      + +

      The following figures illustrate the general media state changes.

      +

      Figure: Media state changes

      +

      Media state changes

      After you have initialized the codecs, you can:

      @@ -99,7 +99,7 @@
    • Make scale and frame rate changes

      Since video file size and format changes are possible, there is attachment flexibility for email, MMS, and SMS messaging. You can also extract a thumbnail from certain video chapters, and chapter previews are available.

    • Trim -

      A trim chapter is available in the video editor.

    +

    A trim chapter is available in the video editor.

    With the Video Util API you can:

    • Set up the video utilities
      • @@ -109,12 +109,12 @@

      The following figure shows the result of the video file size change (due to scaling and container and codec format change).

      -

      Figure: Transcoder

      +

      Figure: Transcoder

      Transcoder

      - +

      The following table lists the supported audio and video codecs (decoder).

      - +

      Table: Decoders

      @@ -156,7 +156,7 @@ - +
      AMR-WB
      @@ -170,7 +170,7 @@ Audio codec Video codec - + AAC LC MPEG-1 @@ -286,9 +286,9 @@ ret = mediacodec_set_input_buffer_used_cb(mediacodec, _input_buffer_used_cb, NUL static void _input_buffer_used_cb(media_packet_h pkt, void *user_data) { -    media_packet_destroy(pkt); + media_packet_destroy(pkt); -    return; + return; } @@ -300,8 +300,8 @@ _input_buffer_used_cb(media_packet_h pkt, void *user_data) 
       ret = mediacodec_set_output_buffer_available_cb(mediacodec,
-                                                _output_buffer_available_cb,
-                                                mediacodec);
+                                                _output_buffer_available_cb,
+                                                mediacodec);

      If the media_packet is dequeued from the codec, this callback is invoked.

      @@ -312,15 +312,15 @@ ret = mediacodec_set_output_buffer_available_cb(mediacodec, static void _output_buffer_available_cb(media_packet_h pkt, void *user_data) { -    media_packet_h out_pkt; -    mediacodec_h mediacodec = (mediacodec_h)user_data; + media_packet_h out_pkt; + mediacodec_h mediacodec = (mediacodec_h)user_data; -    if (pkt != NULL) { -        mediacodec_get_output(mediacodec, &out_pkt, 0); -        media_packet_destroy(out_pkt); -    } + if (pkt != NULL) { + mediacodec_get_output(mediacodec, &out_pkt, 0); + media_packet_destroy(out_pkt); + } -    return; + return; } @@ -344,11 +344,11 @@ _output_buffer_available_cb(media_packet_h pkt, void *user_data) 
       unsigned char nal[48] = {0x00, 0x00, 0x00, 0x01, 0x67, 0x4D, 0x40, 0x33,
-                         0x9A, 0x73, 0x80, 0xA0, 0x08, 0xB4, 0x20, 0x00,
-                         0x32, 0xE9, 0xE0, 0x09, 0x89, 0x68, 0x11, 0xE3,
-                         0x06, 0x23, 0xC0, 0x00, 0x00, 0x00, 0x01, 0x68,
-                         0xEE, 0x3C, 0x80, 0x00, 0x00, 0x00, 0x01, 0x65,
-                         0x88, 0x80, 0x01, 0x48, 0x00, 0x06, 0x57, 0xFD};
+                         0x9A, 0x73, 0x80, 0xA0, 0x08, 0xB4, 0x20, 0x00,
+                         0x32, 0xE9, 0xE0, 0x09, 0x89, 0x68, 0x11, 0xE3,
+                         0x06, 0x23, 0xC0, 0x00, 0x00, 0x00, 0x01, 0x68,
+                         0xEE, 0x3C, 0x80, 0x00, 0x00, 0x00, 0x01, 0x65,
+                         0x88, 0x80, 0x01, 0x48, 0x00, 0x06, 0x57, 0xFD};
 
 media_format_h fmt;
 media_packet_h pkt;
@@ -374,16 +374,16 @@ ret = media_packet_set_buffer_size(pkt, 48);
 void
 _fill_buffer(media_packet_h pkt, unsigned char *yuv, int width, int height)
 {
-    int i;
+    int i;
 
-    /* Y plane */
-    media_packet_get_video_stride_width(pkt, 0, &stride);
-    media_packet_get_video_plane_data_ptr(pkt, 0, &data);
+    /* Y plane */
+    media_packet_get_video_stride_width(pkt, 0, &stride);
+    media_packet_get_video_plane_data_ptr(pkt, 0, &data);
 
-    for (i = 0; i < height; i++) {
-        memcpy(data, yuv, width);
-        data += stride;
-    }
+    for (i = 0; i < height; i++) {
+        memcpy(data, yuv, width);
+        data += stride;
+    }
 }
      @@ -557,7 +557,7 @@ ret = video_util_set_accurate_mode(video_h, 0); 
       ret = video_util_set_resolution(video_h, 176, 144);
      -

      If the transcoding is performed with the original input ("trim"), both the width and height are 0.

      +

      If the transcoding is performed with the original input ("trim"), both the width and height are 0.

    • @@ -620,7 +620,7 @@ ret = video_util_destroy(video_h); Note If you do not call the destroy function after the transcoding is complete, you cannot start a new transcoding process, and a memory crash can occur.
    - + @@ -639,9 +639,9 @@ ret = video_util_destroy(video_h);

    Check the supported file formats using the video_util_foreach_supported_file_format() function:

     error_code =
-    video_util_foreach_supported_file_format(handle,
-                                             video_util_file_supported,
-                                             NULL);
+    video_util_foreach_supported_file_format(handle,
+                                             video_util_file_supported,
+                                             NULL);

    The second parameter specifies the callback that is invoked separately for each supported file format.

    @@ -651,14 +651,14 @@ error_code = static bool video_util_file_supported(video_util_file_format_e format, void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "format %s\n", -               format == VIDEO_UTIL_FILE_FORMAT_3GP ? -               "VIDEO_UTIL_FILE_FORMAT_3GP" : -               format == VIDEO_UTIL_FILE_FORMAT_MP4 ? -               "VIDEO_UTIL_FILE_FORMAT_MP4" : -               "VIDEO_UTIL_FILE_FORMAT_MAX"); - -    return 0; + dlog_print(DLOG_INFO, LOG_TAG, "format %s\n", + format == VIDEO_UTIL_FILE_FORMAT_3GP ? + "VIDEO_UTIL_FILE_FORMAT_3GP" : + format == VIDEO_UTIL_FILE_FORMAT_MP4 ? + "VIDEO_UTIL_FILE_FORMAT_MP4" : + "VIDEO_UTIL_FILE_FORMAT_MAX"); + + return 0; }

    The video_util_file_format_e enumeration defines the available file formats.

    @@ -681,10 +681,10 @@ ret = video_util_set_file_format(video_h, VIDEO_UTIL_FILE_FORMAT_3GP);

    Check the supported audio and video codecs using the video_util_foreach_supported_audio_codec() and video_util_foreach_supported_video_codec() functions:

     video_util_foreach_supported_audio_codec(handle,
-                                         video_util_audio_supported, NULL);
+                                         video_util_audio_supported, NULL);
 
 video_util_foreach_supported_video_codec(handle,
-                                         video_util_video_supported, NULL);
+                                         video_util_video_supported, NULL);

    The second parameter of both functions specifies the callback that is invoked separately for each supported codec.

    @@ -694,29 +694,29 @@ video_util_foreach_supported_video_codec(handle, static bool video_util_audio_supported(video_util_audio_codec_e codec, void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "audio codec %s\n", -               codec==VIDEO_UTIL_AUDIO_CODEC_AAC ? -               "VIDEO_UTIL_AUDIO_CODEC_AAC" : -               codec==VIDEO_UTIL_AUDIO_CODEC_AMRNB ? -               "VIDEO_UTIL_AUDIO_CODEC_AMRNB" : -               "VIDEO_UTIL_AUDIO_CODEC_NONE"); - -    return 0; + dlog_print(DLOG_INFO, LOG_TAG, "audio codec %s\n", + codec==VIDEO_UTIL_AUDIO_CODEC_AAC ? + "VIDEO_UTIL_AUDIO_CODEC_AAC" : + codec==VIDEO_UTIL_AUDIO_CODEC_AMRNB ? + "VIDEO_UTIL_AUDIO_CODEC_AMRNB" : + "VIDEO_UTIL_AUDIO_CODEC_NONE"); + + return 0; } static bool video_util_video_supported(video_util_video_codec_e codec, void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "video codec %s\n", -               codec == VIDEO_UTIL_VIDEO_CODEC_MPEG4 ? -               "VIDEO_UTIL_VIDEO_CODEC_MPEG4" : -               codec == VIDEO_UTIL_VIDEO_CODEC_H263 ? -               "VIDEO_UTIL_VIDEO_CODEC_H263" : -               codec == VIDEO_UTIL_VIDEO_CODEC_H264 ? -               "VIDEO_UTIL_VIDEO_CODEC_H264" : -               "VIDEO_UTIL_VIDEO_CODEC_NONE"); - -    return 0; + dlog_print(DLOG_INFO, LOG_TAG, "video codec %s\n", + codec == VIDEO_UTIL_VIDEO_CODEC_MPEG4 ? + "VIDEO_UTIL_VIDEO_CODEC_MPEG4" : + codec == VIDEO_UTIL_VIDEO_CODEC_H263 ? + "VIDEO_UTIL_VIDEO_CODEC_H263" : + codec == VIDEO_UTIL_VIDEO_CODEC_H264 ? + "VIDEO_UTIL_VIDEO_CODEC_H264" : + "VIDEO_UTIL_VIDEO_CODEC_NONE"); + + return 0; }

    The video_util_audio_codec_e and video_util_video_codec_e enumerations define the available audio and video codecs.

    @@ -727,17 +727,17 @@ video_util_video_supported(video_util_video_codec_e codec, void *user_data) static bool video_util_video_supported(video_util_video_codec_e codec, void *user_data) { -    if (codec == VIDEO_UTIL_VIDEO_CODEC_MPEG4) -        user_data = true; + if (codec == VIDEO_UTIL_VIDEO_CODEC_MPEG4) + user_data = true; -    return 0; + return 0; } bool supported = false; video_util_foreach_supported_video_codec(handle, video_util_video_supported, -                                         &supported); -dlog_print(DLOG_INFO, LOG_TAG, "MPEG4 codec %s", -           supported ? "supported" : "not supported"); + &supported); +dlog_print(DLOG_INFO, LOG_TAG, "MPEG4 codec %s", + supported ? "supported" : "not supported"); @@ -778,7 +778,7 @@ int error_code = video_util_set_fps(handle, 25);

    Start the transcoding using the video_util_start_transcoding() function:

     error_code = video_util_start_transcoding(handle, start, duration, *out_path,
-                                          progress_cb, completed_cb, *user_data);
+                                          progress_cb, completed_cb, *user_data);

    The fifth parameter specifies the transcoding progress callback, which is invoked periodically during the transcoding process. The sixth parameter specifies the transcoding complete callback, which is invoked after the transcoding process is complete.

    diff --git a/org.tizen.guides/html/native/media/media_cover_n.htm b/org.tizen.guides/html/native/media/media_cover_n.htm index 881b074..a5bf5c4 100644 --- a/org.tizen.guides/html/native/media/media_cover_n.htm +++ b/org.tizen.guides/html/native/media/media_cover_n.htm @@ -5,13 +5,13 @@ - + - Media and Camera + Media and Camera @@ -31,7 +31,7 @@
  • Creating Applications with Multimedia
    • - +

    Media and Camera

    @@ -111,7 +111,7 @@
  • Camera -

    You can use the camera to preview and capture images. You can capture still images with the device's internal camera and keep images on your target device.

    • +

    You can use the camera to preview and capture images. You can capture still images with the device's internal camera and keep images on your target device.

    diff --git a/org.tizen.guides/html/native/media/media_handle_n.htm b/org.tizen.guides/html/native/media/media_handle_n.htm index 5e54656..b047a80 100644 --- a/org.tizen.guides/html/native/media/media_handle_n.htm +++ b/org.tizen.guides/html/native/media/media_handle_n.htm @@ -43,16 +43,16 @@

    Media Handle Management

    -

    Your application can manage various media handles with media tools.

    -

    The main features of the Media Tool API include:

    -
      +

      Your application can manage various media handles with media tools.

      +

      The main features of the Media Tool API include:

      + - + +
    +

    The media_format_h handle is created by the caller, who can set and get the video or audio information. The media_format_h handle creates the media_packet_h handle and allocates the buffer. The caller can set and get the metadata with the media_packet_h handle.

    The media_format_h handle has a specific design for increasing and decreasing its reference count.

    @@ -89,13 +89,13 @@ 
     media_format_h format;
 if (media_format_create(&format) == MEDIA_FORMAT_ERROR_NONE) {
-    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
-    media_format_set_video_width(format, 640);
-    media_format_set_video_height(format, 480);
-    media_format_set_video_avg_bps(format, 10000000);
-    media_format_set_video_max_bps(format, 15000000);
+    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
+    media_format_set_video_width(format, 640);
+    media_format_set_video_height(format, 480);
+    media_format_set_video_avg_bps(format, 10000000);
+    media_format_set_video_max_bps(format, 15000000);
 } else {
-    printf("media_format_create() failed!");
+    printf("media_format_create() failed!");
 }
    @@ -117,10 +117,10 @@ int avg_bps; int max_bps; if (media_format_get_video_info(fmt, &mimetype, &w, &h, &avg_bps, &max_bps) -    == MEDIA_PACKET_ERROR_NONE) -    printf("media_format_get_video_info success! width = %d, height = %d", w, h); + == MEDIA_PACKET_ERROR_NONE) + printf("media_format_get_video_info success! width = %d, height = %d", w, h); else -    print("media_format_get_video failed..."); + print("media_format_get_video failed...");

    To retrieve the audio format information, use the media_format_get_audio_info() function.

    @@ -153,32 +153,32 @@ else 
     {
-    media_format_h fmt;
-    media_packet_h packet;
-
-    media_format_create(&fmt);
-    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
-    media_format_set_video_width(format, 640);
-    media_format_set_video_height(format, 480);
-    media_format_set_video_avg_bps(format, 10000000);
-    media_format_set_video_max_bps(format, 15000000);
-
-    /*
-       MEDIA_FORMAT_H264_HP data type is MEDIA_FORMAT_ENCODED and the buffer
-       is allocated into the heap
-       If the data type is MEDIA_FORMAT_RAW,
-       the buffer is allocated into the TBM surface
-    */
-    media_packet_create_alloc(fmt, _finalize_callback, fcb_data, &packet);
-    media_format_unref(fmt);
-
-    media_packet_destroy(packet);
+    media_format_h fmt;
+    media_packet_h packet;
+
+    media_format_create(&fmt);
+    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
+    media_format_set_video_width(format, 640);
+    media_format_set_video_height(format, 480);
+    media_format_set_video_avg_bps(format, 10000000);
+    media_format_set_video_max_bps(format, 15000000);
+
+    /*
+       MEDIA_FORMAT_H264_HP data type is MEDIA_FORMAT_ENCODED and the buffer
+       is allocated into the heap
+       If the data type is MEDIA_FORMAT_RAW,
+       the buffer is allocated into the TBM surface
+    */
+    media_packet_create_alloc(fmt, _finalize_callback, fcb_data, &packet);
+    media_format_unref(fmt);
+
+    media_packet_destroy(packet);
 }
 
 int
 _finalize_callback(media_packet_h packet, int err, void* userdata)
 {
-    return MEDIA_PACKET_REUSE;
+    return MEDIA_PACKET_REUSE;
 }
    @@ -190,25 +190,25 @@ _finalize_callback(media_packet_h packet, int err, void* userdata) 
     {
-    media_format_h fmt;
-    media_packet_h packet;
-
-    media_format_create(&fmt);
-    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
-    media_format_set_video_width(format, 640);
-    media_format_set_video_height(format, 480);
-    media_format_set_video_avg_bps(format, 10000000);
-    media_format_set_video_max_bps(format, 15000000);
-
-    /* Only create the handle, do not allocate a buffer */
-    media_packet_create(fmt, _finalize_callback, fcb_data, &packet);
-    media_format_unref(fmt);
+    media_format_h fmt;
+    media_packet_h packet;
+
+    media_format_create(&fmt);
+    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
+    media_format_set_video_width(format, 640);
+    media_format_set_video_height(format, 480);
+    media_format_set_video_avg_bps(format, 10000000);
+    media_format_set_video_max_bps(format, 15000000);
+
+    /* Only create the handle, do not allocate a buffer */
+    media_packet_create(fmt, _finalize_callback, fcb_data, &packet);
+    media_format_unref(fmt);
 }
 
 int
 _finalize_callback(media_packet_h packet, int err, void* userdata)
 {
-    return MEDIA_PACKET_FINALIZE;
+    return MEDIA_PACKET_FINALIZE;
 }
    @@ -220,25 +220,25 @@ _finalize_callback(media_packet_h packet, int err, void* userdata) 
     {
-    media_format_h fmt;
-    media_packet_h packet;
-
-    media_format_create(&fmt);
-    media_format_set_video_mime(format, MEDIA_FORMAT_RGBA);
-    media_format_set_video_width(format, 128);
-    media_format_set_video_height(format, 128);
-    media_format_set_video_avg_bps(format, 10000000);
-    media_format_set_video_avg_bps(format, 15000000);
-
-    media_packet_create_from_tbm_surface(fmt, surface, _finalize_callback,
-                                         fcb_data, &packet);
-    media_format_unref(fmt);
+    media_format_h fmt;
+    media_packet_h packet;
+
+    media_format_create(&fmt);
+    media_format_set_video_mime(format, MEDIA_FORMAT_RGBA);
+    media_format_set_video_width(format, 128);
+    media_format_set_video_height(format, 128);
+    media_format_set_video_avg_bps(format, 10000000);
+    media_format_set_video_avg_bps(format, 15000000);
+
+    media_packet_create_from_tbm_surface(fmt, surface, _finalize_callback,
+                                         fcb_data, &packet);
+    media_format_unref(fmt);
 }
 
 int
 _finalize_callback(media_packet_h packet, int err, void* userdata)
 {
-    return MEDIA_PACKET_FINALIZE;
+    return MEDIA_PACKET_FINALIZE;
 }
    @@ -250,27 +250,27 @@ _finalize_callback(media_packet_h packet, int err, void* userdata) 
     {
-    media_format_h fmt;
-    media_packet_h packet;
-
-    media_format_create(&fmt);
-    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
-    media_format_set_video_width(format, 640);
-    media_format_set_video_height(format, 480);
-    media_format_set_video_avg_bps(format, 10000000);
-    media_format_set_video_avg_bps(format, 15000000);
-
-    media_packet_create_from_external_memory(fmt, mem_ptr, size, _finalize_callback,
-                                             fcb_data, &packet);
-    media_format_unref(fmt);
+    media_format_h fmt;
+    media_packet_h packet;
+
+    media_format_create(&fmt);
+    media_format_set_video_mime(format, MEDIA_FORMAT_H264_HP);
+    media_format_set_video_width(format, 640);
+    media_format_set_video_height(format, 480);
+    media_format_set_video_avg_bps(format, 10000000);
+    media_format_set_video_avg_bps(format, 15000000);
+
+    media_packet_create_from_external_memory(fmt, mem_ptr, size, _finalize_callback,
+                                             fcb_data, &packet);
+    media_format_unref(fmt);
 }
 
 int
 _finalize_callback(media_packet_h packet, int err, void* userdata)
 {
-    /* Do something */
+    /* Do something */
 
-    return MEDIA_PACKET_FINALIZE;
+    return MEDIA_PACKET_FINALIZE;
 }
    @@ -317,97 +317,97 @@ media_packet_destroy(packet);

    Reference Count Design

    The following table describes the reference count design of the media_format_h handle.

    - +

    Table: Media format handle reference count design

    - - - - - - - - +
    FunctionReference count numberDescription
    + + + + + + + +media_format_create(&fmt1); - - + + - - + + - - + + - - + + - - + + - - - + + - - + + - - + + - - + + - - - + + + - - - + + + - - - + + + - - -
    FunctionReference count numberDescription
    media_format_h fmt1, fmt2, tmp;
    media_packet_h pkt1, pkt2;
    -media_format_create(&fmt1);    		 fmt1: 1 Define the media_format_h and media_packet_h handles.

    Create the fmt1 handle and set the media_format_video_mime() or media_format_audio_mime() function.
    media_packet_create(&pkt1, fmt1);
    media_packet_create(&pkt1, fmt1); fmt1: 2 After the media_packet_create() function, you must use the media_format_unref() function, because the media_packet_create() function increases the media_format_h reference count.
    media_format_unref(fmt1);
    media_format_unref(fmt1); fmt1: 1 If the ref_count is 1, the fmt1 is currently owned by the pkt1 only.
    media_packet_copy(pkt1, &pkt2);
    media_packet_copy(pkt1, &pkt2); fmt1: 2 Copy the pkt1 metadata to pkt2, except the allocated buffer and buffer size. pkt2 refers to fmt1, and fmt1 ref_count is increased.
    media_packet_get_format(pkt1, &tmp);
    media_packet_get_format(pkt1, &tmp); fmt1: 3 fmt1 ref_count is increased by the media_packet_get_format() function.
    media_format_set_video_mime(tmp, ...);
    media_format_set_video_mime(tmp, ...); fmt1: 3If you try to modify the fmt1 data (call the media_format_set_video_mime() function) for fmt1 (=tmp), the ref_count is bigger than 1, and fmt1 cannot be modified. + If you try to modify the fmt1 data (call the media_format_set_video_mime() function) for fmt1 (=tmp), the ref_count is bigger than 1, and fmt1 cannot be modified.

    To modify the fmt1 data, call the media_format_make_writable() function.
    media_format_make_writable(tmp, &fmt2);
    media_format_make_writable(tmp, &fmt2); fmt1: 2
    fmt2: 1    		 If called, the tmp (fmt1) ref_count is decreased. Creates the fmt2 handle and copies the fmt1 data to fmt2.
    media_format_set_video_mime(fmt2, ...);
    media_format_set_video_mime(fmt2, ...); fmt1: 2
    fmt2: 1    		 fmt2 ref_count is 1, which means that you can modify the fmt2 data.
    media_packet_set_format(pkt2, fmt2);
    media_packet_set_format(pkt2, fmt2); fmt1: 2
    fmt2: 2    		 Set the modified fmt2 to the pkt2 handle. You must call the media_format_unref(fmt2) function.
    media_format_unref(tmp);
    media_format_unref(tmp); fmt1: 1
    fmt2: 2    		 You must call this function because of the media_packet_get_format(pkt1, &tmp) function call.
    media_format_unref(fmt2);
    media_format_unref(fmt2); fmt1: 1
    fmt2: 1    		 You must call this function because of the media_packet_set_format(pkt2, fmt2) function call.
    media_packet_destroy(pkt1);
    media_packet_destroy(pkt1); fmt1: 1 > finalize
    fmt2: 1    		 If you destroy the pkt1 handle, the fmt1 ref_count is decreased. If the ref_count becomes 0, fmt1 is freed.
    media_packet_destroy(pkt2);
    media_packet_destroy(pkt2); fmt1: 1 > finalize
    fmt2: 0 > finalize    		 If you destroy the pkt2 handle, the fmt2 ref_count is decreased. If the ref_count becomes 0, fmt2 is freed.
    - + + + + diff --git a/org.tizen.guides/html/native/media/media_key_n.htm b/org.tizen.guides/html/native/media/media_key_n.htm index d5b5d37..4ba9012 100644 --- a/org.tizen.guides/html/native/media/media_key_n.htm +++ b/org.tizen.guides/html/native/media/media_key_n.htm @@ -42,18 +42,18 @@

    Media Key Events

    -

    Tizen enables you to manage media key events. The media key events are generated by the remote control buttons in a Bluetooth headset or Bluetooth earphone. The media_key_e enumerator (in mobile and wearable applications) defines the available key types.

    - -

    The main features of the Media key API include:

    -
      -
    • Registering a callback +

      Tizen enables you to manage media key events. The media key events are generated by the remote control buttons in a Bluetooth headset or Bluetooth earphone. The media_key_e enumerator (in mobile and wearable applications) defines the available key types.

      + +

      The main features of the Media key API include:

      +
        +
      • Registering a callback

        You can register a callback for media key events using the media_key_reserve() function. The first parameter of the function defines the media_key_event_cb type callback, which you can implement to perform any actions you need.

        -
        • -
      • Deregistering a callback +
        • +
      • Deregistering a callback

        You can deregister a callback for media key events using the media_key_release() function.

      -

      Prerequisites

      - +

      Prerequisites

      +

      To use the functions and data types of the Media key API (in mobile and wearable applications), include the <media_key.h> header file in your application:

       #include <media_key.h>
@@ -71,53 +71,53 @@
 void
 event_cb(media_key_e key, media_key_event_e status, void* user_data)
 {
-    switch (key) {
-    case MEDIA_KEY_PLAY:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PLAY");
-        break;
-    case MEDIA_KEY_STOP:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_STOP");
-        break;
-    case MEDIA_KEY_PAUSE:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PAUSE");
-        break;
-    case MEDIA_KEY_PREVIOUS:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PREVIOUS");
-        break;
-    case MEDIA_KEY_NEXT:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_NEXT");
-        break;
-    case MEDIA_KEY_FASTFORWARD:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_FASTFORWARD");
-        break;
-    case MEDIA_KEY_REWIND:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_REWIND");
-        break;
-    case MEDIA_KEY_PLAYPAUSE:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PLAYPAUSE");
-        break;
-    case MEDIA_KEY_UNKNOWN:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_UNKNOWN");
-        break;
-    default:
-        dlog_print(DLOG_INFO, LOG_TAG, "Key: Unknown");
-        break;
-    }
-
-    switch (status) {
-    case MEDIA_KEY_STATUS_PRESSED:
-        dlog_print(DLOG_INFO, LOG_TAG, "Event: MEDIA_KEY_STATUS_PRESSED");
-        break;
-    case MEDIA_KEY_STATUS_RELEASED:
-        dlog_print(DLOG_INFO, LOG_TAG, "Event: MEDIA_KEY_STATUS_RELEASED");
-        break;
-    case MEDIA_KEY_STATUS_UNKNOWN:
-        dlog_print(DLOG_INFO, LOG_TAG, "Event: MEDIA_KEY_STATUS_UNKNOWN");
-        break;
-    default:
-        dlog_print(DLOG_INFO, LOG_TAG, "Event: Unknown");
-        break;
-    }
+    switch (key) {
+    case MEDIA_KEY_PLAY:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PLAY");
+        break;
+    case MEDIA_KEY_STOP:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_STOP");
+        break;
+    case MEDIA_KEY_PAUSE:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PAUSE");
+        break;
+    case MEDIA_KEY_PREVIOUS:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PREVIOUS");
+        break;
+    case MEDIA_KEY_NEXT:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_NEXT");
+        break;
+    case MEDIA_KEY_FASTFORWARD:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_FASTFORWARD");
+        break;
+    case MEDIA_KEY_REWIND:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_REWIND");
+        break;
+    case MEDIA_KEY_PLAYPAUSE:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_PLAYPAUSE");
+        break;
+    case MEDIA_KEY_UNKNOWN:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: MEDIA_KEY_UNKNOWN");
+        break;
+    default:
+        dlog_print(DLOG_INFO, LOG_TAG, "Key: Unknown");
+        break;
+    }
+
+    switch (status) {
+    case MEDIA_KEY_STATUS_PRESSED:
+        dlog_print(DLOG_INFO, LOG_TAG, "Event: MEDIA_KEY_STATUS_PRESSED");
+        break;
+    case MEDIA_KEY_STATUS_RELEASED:
+        dlog_print(DLOG_INFO, LOG_TAG, "Event: MEDIA_KEY_STATUS_RELEASED");
+        break;
+    case MEDIA_KEY_STATUS_UNKNOWN:
+        dlog_print(DLOG_INFO, LOG_TAG, "Event: MEDIA_KEY_STATUS_UNKNOWN");
+        break;
+    default:
+        dlog_print(DLOG_INFO, LOG_TAG, "Event: Unknown");
+        break;
+    }
 }
      • @@ -128,30 +128,30 @@ event_cb(media_key_e key, media_key_event_e status, void* user_data) void media_key_api_func() { -    int r = 0; + int r = 0; -    r = media_key_reserve(event_cb, NULL); + r = media_key_reserve(event_cb, NULL); -    if (r == MEDIA_KEY_ERROR_NONE) -        dlog_print(DLOG_INFO, LOG_TAG, "Reserve media key success."); -    else -        dlog_print(DLOG_ERROR, LOG_TAG, "Reserve media key failed."); + if (r == MEDIA_KEY_ERROR_NONE) + dlog_print(DLOG_INFO, LOG_TAG, "Reserve media key success."); + else + dlog_print(DLOG_ERROR, LOG_TAG, "Reserve media key failed.");

    • When you no longer need to monitor the media key events, deregister the callback with the media_key_release() function:

      -    r = media_key_release();
-
-    if (r == MEDIA_KEY_ERROR_NONE)
-        dlog_print(DLOG_INFO, LOG_TAG, "Release media key success.");
-    else if (r == MEDIA_KEY_ERROR_INVALID_PARAMETER)
-        dlog_print(DLOG_ERROR, LOG_TAG, "Invalid parameter.");
-    else if (r == MEDIA_KEY_ERROR_OPERATION_FAILED)
-        dlog_print(DLOG_ERROR, LOG_TAG, "Operation failed.");
-    else
-        dlog_print(DLOG_ERROR, LOG_TAG, "Failed. Unknown reason.");
+    r = media_key_release();
+
+    if (r == MEDIA_KEY_ERROR_NONE)
+        dlog_print(DLOG_INFO, LOG_TAG, "Release media key success.");
+    else if (r == MEDIA_KEY_ERROR_INVALID_PARAMETER)
+        dlog_print(DLOG_ERROR, LOG_TAG, "Invalid parameter.");
+    else if (r == MEDIA_KEY_ERROR_OPERATION_FAILED)
+        dlog_print(DLOG_ERROR, LOG_TAG, "Operation failed.");
+    else
+        dlog_print(DLOG_ERROR, LOG_TAG, "Failed. Unknown reason.");
 }
      • diff --git a/org.tizen.guides/html/native/media/media_muxing_n.htm b/org.tizen.guides/html/native/media/media_muxing_n.htm index a1969a1..1c6c7a6 100644 --- a/org.tizen.guides/html/native/media/media_muxing_n.htm +++ b/org.tizen.guides/html/native/media/media_muxing_n.htm @@ -48,7 +48,7 @@

      Media Muxing

      -

      You can mux encoded media into a multiplexed stream and parse multiplexed media streams.

      +

      You can mux encoded media into a multiplexed stream and parse multiplexed media streams.

      With the Media Muxer and Media Demuxer API you can:

      • Prepare and manage the media muxer @@ -83,13 +83,13 @@

        Figure: Media muxer state changes

        Media muxer state changes

        - +
        Note All file types and container formats are not guaranteed to support the Media Muxer API.
        -

        Media Demuxer

        +

        Media Demuxer

        You can demux any multiplexed media streams, such as MP4 and MP3.

        The main features of the Media Demuxer API include:

        @@ -125,7 +125,7 @@

        Figure: Media demuxer state changes

        Media demuxer state changes

        - +
        Note All file types and container formats are not guaranteed to support the Media Demuxer API. @@ -162,43 +162,43 @@ mediamuxer_h *muxer; ret = mediamuxer_create(&muxer); if (ret != MEDIAMUXER_ERROR_NONE) -    return false; + return false;
      • If the handle is created normally, set the output file path by passing the absolute uri path to the mediamuxer_set_data_sink() function: 
        -char *path = "/home/media/myfile.mp4"
+char *path = "/home/media/myfile.mp4"
 mediamuxer_output_format_e format = MEDIAMUXER_CONTAINER_FORMAT_MP4;
-if (mediamuxer_set_data_sink(muxer, path, format)!= MEDIAMUXER_ERROR_NONE) 
-    printf("mediamuxer_set_data_sink failed\n");
+if (mediamuxer_set_data_sink(muxer, path, format)!= MEDIAMUXER_ERROR_NONE)
+    printf("mediamuxer_set_data_sink failed\n");
        • -
      • Add the necessary media tracks to the media muxer. The following function shows adding a video elementary track to be muxed. +
      • Add the necessary media tracks to the media muxer. The following function shows adding a video elementary track to be muxed.

        A successful mediamuxer_add_track() function call returns a track_index. Whenever you have to deal with the track, the corresponding track_index must be used. Mapping a track_index to the corresponding media track is your responsibility.

         int
 test_mediamuxer_add_track_video()
 {
-    int track_index_vid = -1;
-    media_format_mimetype_e mimetype;
-    int width;
-    int height;
-    int avg_bps;
-    int max_bps;
-
-    media_format_create(&media_format);
-    media_format_set_video_mime(media_format, MEDIA_FORMAT_H264_SP);
-    media_format_set_video_width(media_format, 640);
-    media_format_set_video_height(media_format, 480);
-    media_format_set_video_avg_bps(media_format, 256000);
-    media_format_set_video_max_bps(media_format, 256000);
-
-    /* Add the video track */
-    mediamuxer_add_track(myMuxer, media_format, &track_index_vid);
-
-    return 0;
+    int track_index_vid = -1;
+    media_format_mimetype_e mimetype;
+    int width;
+    int height;
+    int avg_bps;
+    int max_bps;
+
+    media_format_create(&media_format);
+    media_format_set_video_mime(media_format, MEDIA_FORMAT_H264_SP);
+    media_format_set_video_width(media_format, 640);
+    media_format_set_video_height(media_format, 480);
+    media_format_set_video_avg_bps(media_format, 256000);
+    media_format_set_video_max_bps(media_format, 256000);
+
+    /* Add the video track */
+    mediamuxer_add_track(myMuxer, media_format, &track_index_vid);
+
+    return 0;
 }
        • @@ -206,7 +206,7 @@ test_mediamuxer_add_track_video()
      • Once all the tracks are added, start the media muxer: 
         if (mediamuxer_start(muxer) != MEDIAMUXER_ERROR_NONE)
-    printf("mediamuxer_start API failed\n");
+    printf("mediamuxer_start API failed\n");
        • @@ -214,21 +214,21 @@ if (mediamuxer_start(muxer) != MEDIAMUXER_ERROR_NONE)

        The write sample is a specific track. It is your responsibility to use the appropriate track_index to choose the correct track, and to add the corresponding data to the muxer through the write sample. Repeat the same for the rest of the tracks. Before calling this function, create a valid handle for the media_packet_h handle to get the input samples. For more information, see Media Handle Management.

         if (mediamuxer_write_sample(muxer, track_index, in_buf) != MEDIAMUXER_ERROR_NONE)
-    printf("mediamuxer_write_sample API for track %d failed\n", track_index);
+    printf("mediamuxer_write_sample API for track %d failed\n", track_index);
      • Once the EOS (End Of Stream) of a particular track is reached, call mediamuxer_close_track() function to finalize the track: 
         if (mediamuxer_close_track(muxer, track_index) != MEDIAMUXER_ERROR_NONE)
-    printf("mediamuxer_close_track API failed\n");
+    printf("mediamuxer_close_track API failed\n");
        • -

        Managing the Media Muxer

        +

        Managing the Media Muxer

        To manage the media muxer, the mediamuxer_write_sample() function is called in a loop until the EOS is reached. You can use multi-threading, writing samples corresponding to different tracks in different threads.

          @@ -237,59 +237,59 @@ if (mediamuxer_close_track(muxer, track_index) != MEDIAMUXER_ERROR_NONE) int test_mediamuxer_write_sample() { -    pthread_t thread[1]; -    pthread_attr_t attr; -    /* Initialize and set thread detached attribute */ -    pthread_attr_init(&attr); -    pthread_attr_setdetachstate(&attr, PTHREAD_CREATE_DETACHED); -    pthread_create(&thread[0], &attr, _write_video_data, NULL); -    pthread_create(&thread[1], &attr, _write_audio_data, NULL); + pthread_t thread[1]; + pthread_attr_t attr; + /* Initialize and set thread detached attribute */ + pthread_attr_init(&attr); + pthread_attr_setdetachstate(&attr, PTHREAD_CREATE_DETACHED); + pthread_create(&thread[0], &attr, _write_video_data, NULL); + pthread_create(&thread[1], &attr, _write_audio_data, NULL); -    /* Add audio track, which is not given in this use case */ + /* Add audio track, which is not given in this use case */ -    pthread_attr_destroy(&attr); + pthread_attr_destroy(&attr); -    return 0; + return 0; } void* _write_video_data() { -    gint is_eos = 0; -    int *status = (int *)g_malloc(sizeof(int) * 1); -    v*status = -1; -    int track_index_vid = 1; /* track_index = 1 for video */ -    media_packet_h vid_pkt; -    while (!is_eos) { -        /* -         Read encoded video data -         Get the proper video media packet from, -         for example, mediacodec/mediademuxer -        */ -        user_func_get_media_packet(&vid_pkt, &is_eos); -        if (!is_eos) { -            mediamuxer_write_sample(myMuxer, track_index_vid, vid_pkt); -            media_packet_destroy(vid_pkt); -        } else { -            g_print("\nVideo while done in the test suite"); -            mediamuxer_close_track(myMuxer, track_index_vid); -        } -    } - -    return (void *)status; + gint is_eos = 0; + int *status = (int *)g_malloc(sizeof(int) * 1); + v*status = -1; + int track_index_vid = 1; /* track_index = 1 for video */ + media_packet_h vid_pkt; + while (!is_eos) { + /* + Read encoded video data + Get the proper video media packet from, + for example, mediacodec/mediademuxer + */ + user_func_get_media_packet(&vid_pkt, &is_eos); + if (!is_eos) { + mediamuxer_write_sample(myMuxer, track_index_vid, vid_pkt); + media_packet_destroy(vid_pkt); + } else { + g_print("\nVideo while done in the test suite"); + mediamuxer_close_track(myMuxer, track_index_vid); + } + } + + return (void *)status; } -
        1. After you have finished work with the media muxer handle, reset the media muxer and destroy the handle by using the mediamuxer_stop() and mediamuxer_destroy() functions. +
        2. After you have finished work with the media muxer handle, reset the media muxer and destroy the handle by using the mediamuxer_stop() and mediamuxer_destroy() functions.

          The media muxer state changes to MEDIAMUXER_STATE_NONE.

           ret = mediamuxer_stop(muxer);
 if (ret != MEDIAMUXER_ERROR_NONE)
-    return false;
+    return false;
 ret = mediamuxer_destroy(muxer);
 if (ret != MEDIAMUXER_ERROR_NONE)
-    return false;
+    return false;
        @@ -303,36 +303,36 @@ if (ret != MEDIAMUXER_ERROR_NONE) mediademuxer_h *demuxer; ret = mediademuxer_create(&demuxer); if (ret != MEDIADEMUXER_ERROR_NONE) -    return false; + return false;
      • If the handle is created normally, set the input data source by passing the path to the mediademuxer_set_data_source() function: 
         if (mediademuxer_set_data_source(demuxer, path)!= MEDIADEMUXER_ERROR_NONE)
-    printf("mediademuxer_set_data_source API failed\n");
+    printf("mediademuxer_set_data_source API failed\n");
      • Call the mediademuxer_prepare() function to move the media demuxer into the ready state: 
         if (mediademuxer_prepare(demuxer) != MEDIADEMUXER_ERROR_NONE)
-    printf("mediademuxer_prepare API failed\n");
+    printf("mediademuxer_prepare API failed\n");
        • -
      • Once the media demuxer is in the ready state, get the total number of individual elementary streams present: +
      • Once the media demuxer is in the ready state, get the total number of individual elementary streams present: 
         if (mediademuxer_get_track_count(demuxer, &num_tracks) != MEDIADEMUXER_ERROR_NONE)
-    printf("mediademuxer_get_track_count API failed\n");
+    printf("mediademuxer_get_track_count API failed\n");
      • Select all the tracks to be extracted: 
         for (track = 0; track < num_tracks; track++) {
-    if (mediademuxer_select_track(demuxer, track))
-        g_print("mediademuxer_select track %d failed\n", track);
+    if (mediademuxer_select_track(demuxer, track))
+        g_print("mediademuxer_select track %d failed\n", track);
 }
        • @@ -340,7 +340,7 @@ for (track = 0; track < num_tracks; track++) {
      • Start the media demuxer: 
         if (mediademuxer_start(demuxer))
-    g_print("mediademuxer_start failed\n");
+    g_print("mediademuxer_start failed\n");
        • @@ -351,30 +351,30 @@ media_format_h *g_media_format = NULL; int track; g_media_format = (media_format_h *)g_malloc(sizeof(media_format_h) * num_tracks); for (track = 0; track < num_tracks; track++) { -    ret = media_format_create(&g_media_format[track]); -    if (ret == 0) { -        g_print("g_media_format[%d] is created successfully! \n", track); -        ret = mediademuxer_get_track_info(demuxer, track, g_media_format[track]); -        if (ret == 0) { -            if (media_format_get_video_info(g_media_format[track], &mime, -                                            &w, &h, NULL, NULL) -                == MEDIA_FORMAT_ERROR_NONE) { -                g_print("media_format_get_video_info is success!\n"); -                vid_track = track; -            } else if (media_format_get_audio_info(g_media_format[track], &mime, -                                                   &channel, &samplerate, NULL, NULL) -                       == MEDIA_FORMAT_ERROR_NONE) { -                g_print("media_format_get_audio_info is success!\n"); -                aud_track = track; -            } else { -                g_print("Not supported yet"); -            } -        } else { -            g_print("Error while getting mediademuxer_get_track_info\n"); -        } -    } else { -        g_print("Error while creating media_format_create\n"); -    } + ret = media_format_create(&g_media_format[track]); + if (ret == 0) { + g_print("g_media_format[%d] is created successfully! \n", track); + ret = mediademuxer_get_track_info(demuxer, track, g_media_format[track]); + if (ret == 0) { + if (media_format_get_video_info(g_media_format[track], &mime, + &w, &h, NULL, NULL) + == MEDIA_FORMAT_ERROR_NONE) { + g_print("media_format_get_video_info is success!\n"); + vid_track = track; + } else if (media_format_get_audio_info(g_media_format[track], &mime, + &channel, &samplerate, NULL, NULL) + == MEDIA_FORMAT_ERROR_NONE) { + g_print("media_format_get_audio_info is success!\n"); + aud_track = track; + } else { + g_print("Not supported yet"); + } + } else { + g_print("Error while getting mediademuxer_get_track_info\n"); + } + } else { + g_print("Error while creating media_format_create\n"); + } } @@ -382,7 +382,7 @@ for (track = 0; track < num_tracks; track++) { -

        Managing the Media Demuxer

        +

        Managing the Media Demuxer

        To manage the media demuxer process:

          @@ -391,87 +391,87 @@ for (track = 0; track < num_tracks; track++) { int test_mediademuxer_read_sample() { -    pthread_t thread[1]; -    pthread_attr_t attr; -    /* Initialize and set thread detached attribute */ -    pthread_attr_init(&attr); -    pthread_attr_setdetachstate(&attr, PTHREAD_CREATE_DETACHED); -    if (vid_track != -1) { -        g_print("In main: creating thread for video\n"); -        pthread_create(&thread[0], &attr, _fetch_video_data, NULL); -    } -    pthread_attr_destroy(&attr); - -    return 0; + pthread_t thread[1]; + pthread_attr_t attr; + /* Initialize and set thread detached attribute */ + pthread_attr_init(&attr); + pthread_attr_setdetachstate(&attr, PTHREAD_CREATE_DETACHED); + if (vid_track != -1) { + g_print("In main: creating thread for video\n"); + pthread_create(&thread[0], &attr, _fetch_video_data, NULL); + } + pthread_attr_destroy(&attr); + + return 0; } void* _fetch_video_data(void *ptr) { -    int *status = (int *)g_malloc(sizeof(int) * 1); -    *status = -1; -    g_print("Video Data function\n"); -    int count = 0; -    media_packet_h vidbuf; -    media_format_h vidfmt; -    if (media_format_create(&vidfmt)) { -        g_print("media_format_create failed\n"); - -        return (void *)status; -    } -    if (media_format_set_video_mime(vidfmt, MEDIA_FORMAT_H264_SP)) { -        g_print("media_format_set_video_mime failed\n"); - -        return (void *)status; -    } -    if (media_format_set_video_width(vidfmt, 760)) { -        g_print("media_format_set_video_width failed\n"); - -        return (void *)status; -    } -    if (media_format_set_video_height(vidfmt, 480)) { -        g_print("media_format_set_video_height failed\n"); - -        return (void *)status; -    } -    if (media_packet_create_alloc(vidfmt, NULL, NULL, &vidbuf)) { -        g_print("media_packet_create_alloc failed\n"); -    } -    while (1) { -        int EOS = mediademuxer_read_sample(demuxer, vid_track, &vidbuf); -        if (EOS == MD_EOS || EOS != MD_ERROR_NONE) -            pthread_exit(NULL); -        count++; -        g_print("Read::[%d] video sample\n", count); -        /* Use the media packet and release the packet here */ -        media_packet_destroy(vidbuf); -        /* Create a new packet for getting next frame of data */ -        if (media_packet_create_alloc(vidfmt, NULL, NULL, &vidbuf)) { -            g_print("media_packet_create_alloc failed\n"); -            break; -        } -    } -    *status = 0; - -    return (void *)status; + int *status = (int *)g_malloc(sizeof(int) * 1); + *status = -1; + g_print("Video Data function\n"); + int count = 0; + media_packet_h vidbuf; + media_format_h vidfmt; + if (media_format_create(&vidfmt)) { + g_print("media_format_create failed\n"); + + return (void *)status; + } + if (media_format_set_video_mime(vidfmt, MEDIA_FORMAT_H264_SP)) { + g_print("media_format_set_video_mime failed\n"); + + return (void *)status; + } + if (media_format_set_video_width(vidfmt, 760)) { + g_print("media_format_set_video_width failed\n"); + + return (void *)status; + } + if (media_format_set_video_height(vidfmt, 480)) { + g_print("media_format_set_video_height failed\n"); + + return (void *)status; + } + if (media_packet_create_alloc(vidfmt, NULL, NULL, &vidbuf)) { + g_print("media_packet_create_alloc failed\n"); + } + while (1) { + int EOS = mediademuxer_read_sample(demuxer, vid_track, &vidbuf); + if (EOS == MD_EOS || EOS != MD_ERROR_NONE) + pthread_exit(NULL); + count++; + g_print("Read::[%d] video sample\n", count); + /* Use the media packet and release the packet here */ + media_packet_destroy(vidbuf); + /* Create a new packet for getting next frame of data */ + if (media_packet_create_alloc(vidfmt, NULL, NULL, &vidbuf)) { + g_print("media_packet_create_alloc failed\n"); + break; + } + } + *status = 0; + + return (void *)status; } -
        1. After you have finished work with the media demuxer, reset the media demuxer and destroy the handle by using the mediademuxer_unprepare() and mediademuxer_destroy() functions. +
        2. After you have finished work with the media demuxer, reset the media demuxer and destroy the handle by using the mediademuxer_unprepare() and mediademuxer_destroy() functions.

          The media demuxer state changes to MEDIADEMUXER_STATE_NONE.

           ret = mediademuxer_unprepare(demuxer);
 if (ret != MEDIADEMUXER_ERROR_NONE)
-    return false;
+    return false;
 ret = mediademuxer_destroy(demuxer);
 if (ret != MEDIADEMUXER_ERROR_NONE)
-    return false;
+    return false;
        - +
      diff --git a/org.tizen.guides/html/native/media/media_playback_n.htm b/org.tizen.guides/html/native/media/media_playback_n.htm index 1043b32..34f8902 100644 --- a/org.tizen.guides/html/native/media/media_playback_n.htm +++ b/org.tizen.guides/html/native/media/media_playback_n.htm @@ -56,7 +56,7 @@
    • Playing a Tone
    • Playing a Tone for a Specified Duration
    - +

    Related Info

      @@ -72,8 +72,8 @@

    Media Playback

    -

    You can play different audio formats and video in your application.

    -

    The main media playback features are:

    +

    You can play different audio formats and video in your application.

    +

    The main media playback features are:

    • Handling audio

      Enables you to play audio and control the playback.

      • @@ -88,43 +88,43 @@
    • Using the tone player

      Enables you to play tones.

    - +

    Before you start, set up the player.

    - -

    Audio Player

    -

    You can play audio and control functions for using audio resources. The resources can be media files stored on the device in a file or memory, or they can be streamed from a streaming server (defined with a URI) through the network.

    - + +

    Audio Player

    +

    You can play audio and control functions for using audio resources. The resources can be media files stored on the device in a file or memory, or they can be streamed from a streaming server (defined with a URI) through the network.

    +

    The supported audio formats include MP3, AAC, WMA, M4A, 3GA, WAV, and AMR. The available formats depend on the target device.

    - -

    You can use multiple instances of the player to play several audio data streams concurrently. This means that your application can play multiple uncompressed audio files at the same time.

    - -

    The following figure illustrates the general player state changes.

    -

    Figure: Player state changes

    -

    Player state changes

    - - - + +

    You can use multiple instances of the player to play several audio data streams concurrently. This means that your application can play multiple uncompressed audio files at the same time.

    + +

    The following figure illustrates the general player state changes.

    +

    Figure: Player state changes

    +

    Player state changes

    + + +

    The player_interrupted_cb() callback is called when an application is interrupted by another application. The player is paused or moved to the IDLE state according to the audio session manager (ASM) policy. You must check the state of the current instance and take appropriate action. If the player is changed to the PAUSED state due to an interruption, the callback can be called at the end of the interruption with the PLAYER_INTERRUPTED_COMPLETED error code. For example, if the application is interrupted by a call, alarm, or notification, the completed message is posted. However, no messages are posted if the interruption has other causes. Make sure you handle the application accordingly when audio switching occurs between various applications.

    - -

    The following figure illustrates what happens when the player gets interrupted by the system.

    -

    Figure: Player states when interrupted by system

    -

    Player states when interrupted by system

    - -

    Video Player

    -

    Tizen enables your application to play video, and it uses its own user surface. The surface requires a drawing area, so you have to get an overlay region and set it to the player instance to display the drawing area:

    -
      + +

      The following figure illustrates what happens when the player gets interrupted by the system.

      +

      Figure: Player states when interrupted by system

      +

      Player states when interrupted by system

      + +

      Video Player

      +

      Tizen enables your application to play video, and it uses its own user surface. The surface requires a drawing area, so you have to get an overlay region and set it to the player instance to display the drawing area:

      +
      1. Get the overlay region or Evas object from the Graphics module. -

        You can display video on a UI layer with the Evas object as well as on an overlay layer.

        2. -
      2. Create the player instance.
        3. -
      3. Set the surface type and display handle to the player using the player_set_display() function.
        4. +

        You can display video on a UI layer with the Evas object as well as on an overlay layer.

        +
      4. Create the player instance.
        5. +
      5. Set the surface type and display handle to the player using the player_set_display() function.

      The supported video formats include WMV, ASF, MP4, 3GP, AVI, MKV, and OGG. The available formats depend on the target device.

      -

      In case of a video interruption, the state can be READY due to the resource restriction in the system.

      - -

      The following figure illustrates what happens when the player gets interrupted by the system.

      -

      Figure: Player states when interrupted by system

      +

      In case of a video interruption, the state can be READY due to the resource restriction in the system.

      + +

      The following figure illustrates what happens when the player gets interrupted by the system.

      +

      Figure: Player states when interrupted by system

      Player states when interrupted by system

      @@ -164,73 +164,73 @@ - -

      Playback Streams

      -

      You can set specific URLs for streaming media playback by using the player_set_uri() function.

      -

      Both Hypertext Transfer Protocol (HTTP) and Real Time Streaming Protocol (RTSP) protocols support streaming media playback. The HTTP request header supports the playback of both complete and download-in-progress media files. The index table (atoms) must be moved in front of the file for progressive download.

      - + +

      Playback Streams

      +

      You can set specific URLs for streaming media playback by using the player_set_uri() function.

      +

      Both Hypertext Transfer Protocol (HTTP) and Real Time Streaming Protocol (RTSP) protocols support streaming media playback. The HTTP request header supports the playback of both complete and download-in-progress media files. The index table (atoms) must be moved in front of the file for progressive download.

      +

      In case of HTTP streaming, buffering can happen when the player is prepared. You can get the status using the player_set_buffering_cb() function.

      - +

      The following table lists the streaming protocol features supported by the player.

      -

      Table: Supported streaming protocol features

      - - - - - - - - - - - - - - - - - - - - - -
      Streaming protocolSupported feature
      Hypertext Transfer Protocol (HTTP)HTTP Streaming
      HTTP Live Streaming
      HTTP Progressive Download Play
      Real Time Streaming Protocol (RTSP)RTSP Streaming
      - +

      Table: Supported streaming protocol features

      + + + + + + + + + + + + + + + + + + + + + +
      Streaming protocolSupported feature
      Hypertext Transfer Protocol (HTTP)HTTP Streaming
      HTTP Live Streaming
      HTTP Progressive Download Play
      Real Time Streaming Protocol (RTSP)RTSP Streaming
      +

      WAV Player

      The WAV Player API (in mobile and wearable applications) provides controlling functions for using audio resources (media files stored in the device). Use the WAV Player API to enable your application to play audio and control playback. You can use the WAV and OGG audio formats.

      -

      Tizen enables your application to play wave format audio in 1 of 2 ways:

      -
        +

        Tizen enables your application to play wave format audio in 1 of 2 ways:

        + + +
      -

      Most operations of the WAV Player API work in a synchronous mode. The WAV Player API requires a callback to notify the application of the operational status of the player. The callback must be implemented and passed to stop the WAV playback.

      -

      Multiple instances of the WAV player can be used to play several audio data streams concurrently. This means that your application can play multiple uncompressed audio files, such as WAV, at the same time.

      - -

      The following figure illustrates the general WAV player state changes.

      -

      Figure: WAV player state changes

      -

      WAV player state changes

      +

      Most operations of the WAV Player API work in a synchronous mode. The WAV Player API requires a callback to notify the application of the operational status of the player. The callback must be implemented and passed to stop the WAV playback.

      +

      Multiple instances of the WAV player can be used to play several audio data streams concurrently. This means that your application can play multiple uncompressed audio files, such as WAV, at the same time.

      + +

      The following figure illustrates the general WAV player state changes.

      +

      Figure: WAV player state changes

      +

      WAV player state changes

      Tone Player

      -

      Tizen enables your application to play a tone or a list of tones using the Tone Player API (in mobile and wearable applications).

      -

      You can generate tones in 2 ways:

      -
        -

      • Specify the frequency values. You can specify either 1 or 2 frequencies.

        • -

      • Use a DTMF (Dual Tone Multi Frequency) preset frequency value of the tone_type_e enumerator (in mobile and wearable applications).

        • -
      +

      Tizen enables your application to play a tone or a list of tones using the Tone Player API (in mobile and wearable applications).

      +

      You can generate tones in 2 ways:

      +
        +

      • Specify the frequency values. You can specify either 1 or 2 frequencies.

        • +

      • Use a DTMF (Dual Tone Multi Frequency) preset frequency value of the tone_type_e enumerator (in mobile and wearable applications).

        • +

      You can start and stop playing a tone, and play a tone for a specified duration.

      - -

      The following figures illustrate the general tone player state changes.

      -

      Figure: Tone player states

      -

      Tone player states

      + +

      The following figures illustrate the general tone player state changes.

      +

      Figure: Tone player states

      +

      Tone player states

      Prerequisites

      @@ -248,8 +248,8 @@

    1. Retrieve the default internal storage paths for audio and video files, and define the specific paths for the audio and video files to play. To access and use internal storage, include the storage.h header file in your application.

      -#define MP3_SAMPLE "SampleAudio.mp3";
-#define MP4_SAMPLE "SampleVideo.mp4";
+#define MP3_SAMPLE "SampleAudio.mp3";
+#define MP4_SAMPLE "SampleVideo.mp4";
 
 int internal_storage_id;
 char *audio_storage_path = NULL;
@@ -259,57 +259,57 @@ char *video_path = NULL;
 
 static bool
 storage_cb(int storage_id, storage_type_e type, storage_state_e state,
-           const char *path, void *user_data)
+           const char *path, void *user_data)
 {
-    if (type == STORAGE_TYPE_INTERNAL) {
-        internal_storage_id = storage_id;
+    if (type == STORAGE_TYPE_INTERNAL) {
+        internal_storage_id = storage_id;
 
-        return false;
-    }
+        return false;
+    }
 
-    return true;
+    return true;
 }
 
 void
 _get_storage_path()
 {
-    int error_code = 0;
-    char *path = NULL;
-
-    error_code = storage_foreach_device_supported(storage_cb, NULL);
-    error_code = storage_get_directory(internal_storage_id,
-                                       STORAGE_DIRECTORY_MUSIC, &path);
-    if (error_code != STORAGE_ERROR_NONE) {
-        audio_storage_path = strdup(path);
-        free(path);
-    }
-
-    error_code = storage_get_directory(internal_storage_id,
-                                       STORAGE_DIRECTORY_VIDEOS, &path);
-    if (error_code != STORAGE_ERROR_NONE) {
-        video_storage_path = strdup(path);
-        free(path);
-    }
+    int error_code = 0;
+    char *path = NULL;
+
+    error_code = storage_foreach_device_supported(storage_cb, NULL);
+    error_code = storage_get_directory(internal_storage_id,
+                                       STORAGE_DIRECTORY_MUSIC, &path);
+    if (error_code != STORAGE_ERROR_NONE) {
+        audio_storage_path = strdup(path);
+        free(path);
+    }
+
+    error_code = storage_get_directory(internal_storage_id,
+                                       STORAGE_DIRECTORY_VIDEOS, &path);
+    if (error_code != STORAGE_ERROR_NONE) {
+        video_storage_path = strdup(path);
+        free(path);
+    }
 }
 
 void
 _set_test_path()
 {
-    int path_len = 0;
+    int path_len = 0;
 
-    path_len = strlen(audio_storage_path) + strlen(MP3_SAMPLE) + 1;
-    audio_path = malloc(path_len);
-    memset(audio_path, 0x0, path_len);
+    path_len = strlen(audio_storage_path) + strlen(MP3_SAMPLE) + 1;
+    audio_path = malloc(path_len);
+    memset(audio_path, 0x0, path_len);
 
-    strncat(audio_path, audio_storage_path, strlen(audio_storage_path));
-    strncat(audio_path, MP3_SAMPLE, strlen(MP3_SAMPLE));
+    strncat(audio_path, audio_storage_path, strlen(audio_storage_path));
+    strncat(audio_path, MP3_SAMPLE, strlen(MP3_SAMPLE));
 
-    path_len = strlen(video_storage_path) + strlen(MP4_SAMPLE) + 1;
-    video_path = malloc(path_len);
-    memset(video_path, 0x0, path_len);
+    path_len = strlen(video_storage_path) + strlen(MP4_SAMPLE) + 1;
+    video_path = malloc(path_len);
+    memset(video_path, 0x0, path_len);
 
-    strncat(video_path, video_storage_path, strlen(video_storage_path));
-    strncat(video_path, MP4_SAMPLE, strlen(MP4_SAMPLE));
+    strncat(video_path, video_storage_path, strlen(video_storage_path));
+    strncat(video_path, MP4_SAMPLE, strlen(MP4_SAMPLE));
 }
      2. @@ -340,40 +340,40 @@ int tone_player_id;

      Define a variable for the player handle, and create the handle by passing the variable to the player_create() function. You need the handle for defining which file to play and with what playback settings. The following example code also creates buttons for the UI to control the playback.

       struct appdata {
-    player_h player;
+    player_h player;
 };
 
 static void
 init_base_player(appdata_s *ad)
 {
-    int error_code = 0;
-    error_code = player_create(&ad->player);
-    if (error_code != PLAYER_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create");
-    /*
-       Perform more playback configuration, such as setting callbacks,
-       setting the source file URI, and preparing the player
-    */
+    int error_code = 0;
+    error_code = player_create(&ad->player);
+    if (error_code != PLAYER_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create");
+    /*
+       Perform more playback configuration, such as setting callbacks,
+       setting the source file URI, and preparing the player
+    */
 }
 
 static void
 create_base_gui(appdata_s *ad)
 {
-    /* Create a window */
-    /* Create a button */
-    /* Add a callback to the button */
-    evas_object_smart_callback_add(button_init, "clicked", init_base_player, ad);
-    evas_object_smart_callback_add(button_end, "clicked", release_base_player, ad);
-    /* Create an Evas image object for the video surface */
+    /* Create a window */
+    /* Create a button */
+    /* Add a callback to the button */
+    evas_object_smart_callback_add(button_init, "clicked", init_base_player, ad);
+    evas_object_smart_callback_add(button_end, "clicked", release_base_player, ad);
+    /* Create an Evas image object for the video surface */
 }
 
 static void
 app_create(void *data)
 {
-    appdata_s *ad = data;
-    create_base_gui(ad);
+    appdata_s *ad = data;
+    create_base_gui(ad);
 
-    return true;
+    return true;
 }
      @@ -390,21 +390,21 @@ app_create(void *data) static void _player_interrupted_cb(player_interrupted_coded_e code, void *data) { -    appdata_s *ad = data; -    player_state_e state; + appdata_s *ad = data; + player_state_e state; -    player_get_state(ad->player, &state); -    log_print(DLOG_INFO, LOG_TAG, "current player state = %d", state); -    /* If the state is PLAYER_STATE_PAUSED, update UI (for example, button) */ + player_get_state(ad->player, &state); + log_print(DLOG_INFO, LOG_TAG, "current player state = %d", state); + /* If the state is PLAYER_STATE_PAUSED, update UI (for example, button) */ } static void init_base_player(appdata_s *ad) { -    /* Set an interruption callback if the application wants to know the reason */ -    error_code = player_set_interrupted_cb(g_player, _player_interrupted_cb, ad); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create"); + /* Set an interruption callback if the application wants to know the reason */ + error_code = player_set_interrupted_cb(g_player, _player_interrupted_cb, ad); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to create"); }

      The playback is interrupted and the callback triggered when, for example, another multimedia application is run. The player state automatically changes to PLAYER_STATE_PAUSED or PLAYER_STATE_IDLE according to the session policy. To get the current state, use the player_get_state() function.

      @@ -416,17 +416,17 @@ init_base_player(appdata_s *ad) static void _player_completed_cb(void *data) { -   dlog_print(DLOG_INFO, "Player", "Playback End"); + dlog_print(DLOG_INFO, "Player", "Playback End"); } static void init_base_player(appdata_s *ad) { -    /* Set a completed callback for when the playback ends */ -    error_code = player_set_completed_cb(g_player, _player_completed_cb, ad); + /* Set a completed callback for when the playback ends */ + error_code = player_set_completed_cb(g_player, _player_completed_cb, ad); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set completed cb"); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set completed cb"); } @@ -437,15 +437,15 @@ init_base_player(appdata_s *ad) static void _player_error_cb(int error_code, void *user_data) { -    dlog_print(DLOG_ERROR, LOG_TAG, "playback failed, error = %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "playback failed, error = %x", error_code); } static void init_base_player(appdata_s *ad) { -    error_code = player_set_error_cb(g_player, _player_error_cb, NULL); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set error cb"); + error_code = player_set_error_cb(g_player, _player_error_cb, NULL); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set error cb"); }

      The player error callback is triggered when the player stops working due to an error. You can use the callback to try to recover from the error. For example, try to change the player state to PLAYER_STATE_READY by calling the player_stop() function. Then remove all other callbacks and reset the player by calling the player_unprepare() function. At the end, the player is in the PLAYER_STATE_IDLE state, so you can release the resources allocated to the player.

      @@ -511,7 +511,7 @@ error_code = player_set_uri(ad->player, video_path);

      To retrieve the correct display handle, use the GET_DISPLAY() function. To set the display, use the player_set_display() function with the player handle, display type (a player_display_type_e enumerator in mobile and wearable applications), and display handle:

       error_code = player_set_display(g_player, PLAYER_DISPLAY_TYPE_OVERLAY,
-                                GET_DISPLAY(evas_obj));
+                                GET_DISPLAY(evas_obj));

      After the player_set_display() function has been successfully executed, the player is connected to the display.

      @@ -542,10 +542,10 @@ error_code = player_prepare_async(ad->player, _prepared_cb, ad); 
       player_state_e state;
 do {
-    error_code = player_get_state(ad->player, &state);
-    if (error_code != PLAYER_ERROR_NONE)
-        break;
-    usleep(1000);
+    error_code = player_get_state(ad->player, &state);
+    if (error_code != PLAYER_ERROR_NONE)
+        break;
+    usleep(1000);
 } while (state != PLAYER_STATE_READY);
      @@ -553,16 +553,16 @@ do {

      Start playing the video file using the player_start() function:

       if (error_code == PLAYER_ERROR_NONE)
-    error_code = player_start(g_player);
+    error_code = player_start(g_player);

      If you used the player_prepare_async() function to prepare the player, use the following callback function to handle the playback:

       static void
 _prepared_cb(void *data)
 {
-    appdata_s *ad = data;
-    int error_code = 0;
-    error_code = player_start(ad->player);
+    appdata_s *ad = data;
+    int error_code = 0;
+    error_code = player_start(ad->player);
 }

      The player_start() function changes the player state from PLAYER_STATE_READY to PLAYER_STATE_PLAYING. The video file plays until you call the player_stop() or player_pause() function.

      @@ -582,7 +582,7 @@ _prepared_cb(void *data)

      Stop the player using the player_stop() function:

       error_code = player_stop(player);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_stop() = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_stop() = %d", error_code);
      @@ -590,7 +590,7 @@ dlog_print(DLOG_ERROR, LOG_TAG, "player_stop() = %d", error_code);

      Reset the player using the player_unprepare() function:

       error_code = player_unprepare(player);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_unprepare() = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_unprepare() = %d", error_code);

      After the player is reset, it is in the PLAYER_STATE_IDLE state.

      @@ -599,7 +599,7 @@ dlog_print(DLOG_ERROR, LOG_TAG, "player_unprepare() = %d", error_code)

      Destroy the player handle using the player_destroy() function:

       error_code = player_destroy(player);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_destroy = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_destroy = %d", error_code);
      @@ -631,9 +631,9 @@ static char *path_3 = NULL; char *resource_path = NULL; resource_path = app_get_resource_path(); -snprintf(path_1, sizeof(path_1)-1, "%s/sample.3gp", resource_path); -snprintf(path_2, sizeof(path_2)-1, "%s/test.wav", resource_path); -snprintf(path_3, sizeof(path_3)-1, "%s/test2.wav", resource_path); +snprintf(path_1, sizeof(path_1)-1, "%s/sample.3gp", resource_path); +snprintf(path_2, sizeof(path_2)-1, "%s/test.wav", resource_path); +snprintf(path_3, sizeof(path_3)-1, "%s/test2.wav", resource_path); free(resource_path); static const int PLAYBACK_TIME = 6; @@ -683,27 +683,27 @@ ret = player_prepare(player_3); ret = player_get_state(player_1, &state_1); while (state_1 != PLAYER_STATE_READY) { -    ret = player_get_state(player_1, &state_1); + ret = player_get_state(player_1, &state_1); -    usleep(1000); + usleep(1000); } /* Wait to prepare player_2 */ ret = player_get_state(player_2, &state_2); while (state_2 != PLAYER_STATE_READY) { -    ret = player_get_state(player_2, &state_2); + ret = player_get_state(player_2, &state_2); -    usleep(1000); + usleep(1000); } /* Wait to prepare player_3 */ ret = player_get_state(player_3, &state_3); while (state_3 != PLAYER_STATE_READY) { -    ret = player_get_state(player_3, &state_3); + ret = player_get_state(player_3, &state_3); -    usleep(1000); + usleep(1000); } @@ -760,16 +760,16 @@ ret = player_destroy(player_3); bool is_visible; error_code = player_is_display_visible(player, &is_visible); -dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", error_code); +dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", error_code);

    2. If the display is not visible, make it visible using the player_set_display_visible() function with the second parameter set to true:

       if (!is_visible) {
-    error_code = player_set_display_visible(player, true);
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "player_set_display_visible = %d", error_code);
+    error_code = player_set_display_visible(player, true);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "player_set_display_visible = %d", error_code);
 }
      3. @@ -780,7 +780,7 @@ if (!is_visible) {

      Set the display mode using the player_set_display_mode() function:

       error_code = player_set_display_mode(player, PLAYER_DISPLAY_MODE_FULL_SCREEN);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);

      The available display modes are defined in the player_display_mode_e enumeration (in mobile and wearable applications).

      @@ -789,7 +789,7 @@ dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_

      Set the display rotation using the player_set_display_rotation() function:

       error_code = player_set_display_rotation(player, PLAYER_DISPLAY_ROTATION_90);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);

      The available display rotations are defined in the player_display_rotation_e enumeration (in mobile and wearable applications).

      @@ -827,7 +827,7 @@ int width; int height; error_code = player_get_video_size(player, &width, &height); -dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", error_code); +dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", error_code);
    3. @@ -837,7 +837,7 @@ dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", erro int duration; error_code = player_get_duration(player, &duration); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_duration = %d", error_code); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_duration = %d", error_code);
    4. @@ -849,8 +849,8 @@ int channels; int bit_rate; error_code = player_get_audio_stream_info(player, &sample_rate, -                                          &channels, &bit_rate); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_audio_stream_info = %d", error_code); + &channels, &bit_rate); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_audio_stream_info = %d", error_code);
    5. @@ -861,7 +861,7 @@ int fps; int bit_rate; error_code = player_get_video_stream_info(player, &fps, &bit_rate); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_video_stream_info = %d", error_code); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_video_stream_info = %d", error_code);
    6. @@ -872,7 +872,7 @@ char *audio_codec; char *video_codec; error_code = player_get_codec_info(player, &audio_codec, &video_codec); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_codec_info = %d", error_code); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_codec_info = %d", error_code);
    7. @@ -888,17 +888,17 @@ char *title; char *year; error_code = player_get_content_info(player, PLAYER_CONTENT_INFO_ALBUM, &album); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info album = %d", album); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info album = %d", album); error_code = player_get_content_info(player, PLAYER_CONTENT_INFO_ARTIST, &artist); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info artist = %d", artist); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info artist = %d", artist); error_code = player_get_content_info(player, PLAYER_CONTENT_INFO_AUTHOR, &author); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info author = %d", author); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info author = %d", author); error_code = player_get_content_info(player, PLAYER_CONTENT_INFO_GENRE, &genre); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info genre = %d", genre); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info genre = %d", genre); error_code = player_get_content_info(player, PLAYER_CONTENT_INFO_TITLE, &title); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info title = %d", title); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info title = %d", title); error_code = player_get_content_info(player, PLAYER_CONTENT_INFO_YEAR, &year); -dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info year = %d", year); +dlog_print(DLOG_INFO, LOG_TAG, "player_get_content_info year = %d", year);
      @@ -914,7 +914,7 @@ void *album_art; int size; error_code = player_get_album_art(player, &album_art, &size); -dlog_print(DLOG_INFO, LOG_TAG, "player_set_display_mode = %d", error_code); +dlog_print(DLOG_INFO, LOG_TAG, "player_set_display_mode = %d", error_code);
      8. @@ -933,7 +933,7 @@ dlog_print(DLOG_INFO, LOG_TAG, "player_set_display_mode = %d", error_c

    8. Set the subtitle path using the player_set_subtitle_path() function:

      -#define SUBTITLE "subtitles_test_file.srt"
+#define SUBTITLE "subtitles_test_file.srt"
 
 char *data_path = app_get_data_path();
 int path_len = strlen(data_path) + 10;
@@ -942,7 +942,7 @@ strncat(path, data_path, path_len);
 strncat(path, SUBTITLE, path_len);
 
 error_code = player_set_subtitle_path(player, path);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_set_subtitle_path() = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_set_subtitle_path() = %d", error_code);
 free(path);
      @@ -969,19 +969,19 @@ free(path); static void _playback_completed_cb(int id, void *user_data) { -    const char* path = (const char*)user_data; -    dlog_print(DLOG_INFO, "WAV Player", "Completed! [id:%d, path:%s]", id, path); + const char* path = (const char*)user_data; + dlog_print(DLOG_INFO, "WAV Player", "Completed! [id:%d, path:%s]", id, path); } void main() { -    int wav_player_id; -    wav_player_error_e ret; -    const char* wav_path = "PATH OF YOUR WAV FILE"; + int wav_player_id; + wav_player_error_e ret; + const char* wav_path = "PATH OF YOUR WAV FILE"; -    ret = wav_player_start(wav_path, SOUND_TYPE_MEDIA, _playback_completed_cb, -                           (void*)wav_path, &wav_player_id); + ret = wav_player_start(wav_path, SOUND_TYPE_MEDIA, _playback_completed_cb, + (void*)wav_path, &wav_player_id); }

      To set the path of your WAV file, you may need to retrieve the default path for audio files. For more information, see the Data Storages guide.

      @@ -993,8 +993,8 @@ main() void my_stop() { -    wav_player_error_e ret; -    ret = wav_player_stop(wav_player_id); + wav_player_error_e ret; + ret = wav_player_stop(wav_player_id); }
      9. @@ -1033,8 +1033,8 @@ tone_player_start(TONE_TYPE_SUP_CONGESTION, SOUND_TYPE_CALL, 1000, &tone_pla

      When you set the duration to a specified time, playback stops automatically after that time. You can also stop playback manually using the tone_player_stop() function.

      - - + +
    diff --git a/org.tizen.guides/html/native/media/media_recording_n.htm b/org.tizen.guides/html/native/media/media_recording_n.htm index b681393..661d09a 100644 --- a/org.tizen.guides/html/native/media/media_recording_n.htm +++ b/org.tizen.guides/html/native/media/media_recording_n.htm @@ -40,12 +40,12 @@
  • Recording a Video
    • - +

    Related Info

    @@ -56,34 +56,34 @@

    Media Recording

    Tizen offers basic recorder features, including an audio and video recorder.

    - -

    The main features of the Recorder API include:

    + +

    The main features of the Recorder API include:

    - +

    The following file formats are supported:

    -
      +
      • Video: mp4 and 3gp
        • -
      • Audio: m4a and amr
        • +
      • Audio: m4a and amr

      Valid input sources consist of internal and external microphones and a camera. The used input audio or video source depends on the currently connected audio path and camera module of the device. The recorder APIs in the video recorder serve as the interface with the hardware. Input is processed through that handle.

      -

      During testing, you can use the emulator to imitate audio or video recording, as long as your computer has a proper input source device.

      +

      During testing, you can use the emulator to imitate audio or video recording, as long as your computer has a proper input source device.

      + +

      The following figure illustrates the general recorder state changes.

      +

      Figure: Recorder states

      +

      Recorder states

      + -

      The following figure illustrates the general recorder state changes.

      -

      Figure: Recorder states

      -

      Recorder states

      - -
      Note While running applications on the emulator, audio-video synchronization errors can occur due to the computer performance.
      - +

      Prerequisites

      @@ -111,9 +111,9 @@ static recorder_h g_recorder; /* Create the audio recorder handle */ int error_code = recorder_create_audiorecorder(&g_recorder); if (error_code == RECORDER_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code); else -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      The function sets the audio recorder state to RECORDER_STATE_CREATED.

      @@ -133,11 +133,11 @@ error_code = recorder_set_state_changed_cb(g_recorder, _state_changed_cb, NULL); 
       static void
 _state_changed_cb(recorder_state_e previous, recorder_state_e current,
-                  bool by_policy, void *user_data)
+                  bool by_policy, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG,
-               "_recorder_state_changed_cb (prev: %d, curr: %d)\n",
-               previous, current);
+    dlog_print(DLOG_INFO, LOG_TAG,
+               "_recorder_state_changed_cb (prev: %d, curr: %d)\n",
+               previous, current);
 }
      @@ -150,10 +150,10 @@ _state_changed_cb(recorder_state_e previous, recorder_state_e current,

    • Set the audio codec for encoding the audio stream using the recorder_set_audio_encoder() function:

      -#define FILENAME_PREFIX "AUDIO"
+#define FILENAME_PREFIX "AUDIO"
 struct tm localtime = {0};
 time_t rawtime = time(NULL);
-char filename[256] = {'\0'};
+char filename[256] = {'\0'};
 size_t size;
 
 /* Set the audio encoder */
@@ -183,14 +183,14 @@ error_code = recorder_set_file_format(g_recorder, RECORDER_FILE_FORMAT_3GP);
 
       /* Create the file name */
 if (localtime_r(&rawtime, &localtime) != NULL) {
-    size = snprintf(filename, sizeof(filename),
-                    "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.3gp",
-                    app_get_data_path(), FILENAME_PREFIX,
-                    localtime.tm_year + 1900,
-                    localtime.tm_mon + 1, localtime.tm_mday,
-                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
+    size = snprintf(filename, sizeof(filename),
+                    "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.3gp",
+                    app_get_data_path(), FILENAME_PREFIX,
+                    localtime.tm_year + 1900,
+                    localtime.tm_mon + 1, localtime.tm_mday,
+                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
 } else {
-    /* Error handling */
+    /* Error handling */
 }
 
 /* Set the full path and file name */
@@ -226,9 +226,9 @@ error_code = recorder_attr_set_audio_samplerate(g_recorder, 44100);
 
      Register a callback using the recorder_set_recording_limit_reached_cb() function:
      
 
       error_code =
-    recorder_set_recording_limit_reached_cb(g_recorder,
-                                            _recorder_recording_limit_reached_cb,
-                                            NULL);
+    recorder_set_recording_limit_reached_cb(g_recorder,
+                                            _recorder_recording_limit_reached_cb,
+                                            NULL);
    • @@ -237,9 +237,9 @@ error_code = 
       static void
 _recorder_recording_limit_reached_cb(recorder_recording_limit_type_e type,
-                                     void *user_data)
+                                     void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Recording limit reached: %d\n", type);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Recording limit reached: %d\n", type);
 }
      • @@ -307,27 +307,27 @@ error_code = recorder_pause(g_recorder); static bool _recorder_expect_state(recorder_h recorder, recorder_state_e expected_state) { -    recorder_state_e state; -    int error_code = recorder_get_state(recorder, &state); + recorder_state_e state; + int error_code = recorder_get_state(recorder, &state); -    dlog_print(DLOG_INFO, LOG_TAG, -               "recorder state = %d, expected recorder state = %d", -               state, expected_state); -    if (state == expected_state) -        return TRUE; + dlog_print(DLOG_INFO, LOG_TAG, + "recorder state = %d, expected recorder state = %d", + state, expected_state); + if (state == expected_state) + return TRUE; -    return FALSE; + return FALSE; } /* Stop the recorder and save the recorded data to a file */ if (_recorder_expect_state(g_recorder, RECORDER_STATE_RECORDING) -    || _recorder_expect_state(g_recorder, RECORDER_STATE_PAUSED)) { -    error_code = recorder_commit(g_recorder); -    if (error_code != RECORDER_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + || _recorder_expect_state(g_recorder, RECORDER_STATE_PAUSED)) { + error_code = recorder_commit(g_recorder); + if (error_code != RECORDER_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); -        return true; -    } + return true; + } } @@ -378,9 +378,9 @@ error_code = recorder_destroy(g_recorder);

      Define a structure for storing the camera and video recorder handles and a Boolean variable specifying whether the video recorder is switched off:

       struct recdata {
-    bool shutdown;
-    recorder_h recorder;
-    camera_h camera;
+    bool shutdown;
+    recorder_h recorder;
+    camera_h camera;
 };
      @@ -390,7 +390,7 @@ struct recdata { 
       static const int RECORD_TIME=2;
 static const int RECORD_LIMIT=4;
-#define FILENAME_PREFIX "VIDEO"
+#define FILENAME_PREFIX "VIDEO"
 static int g_bitrate = 288000;
 static int duration;
 static int playing=0;
@@ -432,9 +432,9 @@ rec_data.recorder = NULL;
 /* Create the camera handle */
 error_code = camera_create(CAMERA_DEVICE_CAMERA0, &rec_data.camera);
 if (error_code == CAMERA_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code);
 else
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      The function sets the camera state to CAMERA_STATE_CREATED. To query the state, use the camera_get_state() function.

      @@ -453,8 +453,8 @@ else

      Register a callback using the recorder_set_recording_limit_reached_cb() function:

       ret = recorder_set_recording_limit_reached_cb(rec_data.recorder,
-                                              _recorder_recording_limit_reached_cb,
-                                              0);
+                                              _recorder_recording_limit_reached_cb,
+                                              0);
      @@ -464,9 +464,9 @@ ret = recorder_set_recording_limit_reached_cb(rec_data.recorder, 
       static void
 _recorder_recording_limit_reached_cb(recorder_recording_limit_type_e type,
-                                     void *user_data)
+                                     void *user_data)
 {
-    dlog_print(DLOG_DEBUG, "Video Recorder", "Recording limit reached: %d\n", type);
+    dlog_print(DLOG_DEBUG, "Video Recorder", "Recording limit reached: %d\n", type);
 }
      @@ -495,9 +495,9 @@ ret = recorder_pause(rec_data.recorder); /* Create the video recorder handle */ error_code = recorder_create_videorecorder(rec_data.camera, &rec_data.recorder); if (error_code == RECORDER_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code); else -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);

      The function sets the video recorder state to RECORDER_STATE_CREATED. To query the state, use the recorder_get_state() function.

      @@ -510,11 +510,11 @@ else 
       /* Set the state change callback for the video recorder */
 error_code = recorder_set_state_changed_cb(rec_data.recorder,
-                                           on_state_changed_cb, NULL);
+                                           on_state_changed_cb, NULL);
 if (error_code == RECORDER_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_INFO, LOG_TAG, "error code = %d", error_code);
 else
-    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
    • @@ -524,11 +524,11 @@ else /* State change callback for the video recorder */ static void on_state_changed_cb(recorder_state_e previous, recorder_state_e current, -                    bool by_asm, void *data) + bool by_asm, void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, -               "_recorder_state_changed_cb (prev: %d, curr: %d)\n", -               previous, current); + dlog_print(DLOG_DEBUG, LOG_TAG, + "_recorder_state_changed_cb (prev: %d, curr: %d)\n", + previous, current); }
      • @@ -552,16 +552,16 @@ recorder_video_codec_e supported_codec; static bool _video_encoder_cb(recorder_video_codec_e codec, void *user_data) { -    recorder_video_codec_e * supported_codec = -        (recorder_video_codec_e*)user_data; -    *supported_codec = codec; + recorder_video_codec_e * supported_codec = + (recorder_video_codec_e*)user_data; + *supported_codec = codec; -    return false; + return false; } error_code = recorder_foreach_supported_video_encoder(rec_data.recorder, -                                                      _video_encoder_cb, -                                                      &supported_codec); + _video_encoder_cb, + &supported_codec);

      The possible video codec values are defined in the recorder_video_codec_e enumeration (in mobile and wearable applications).

      @@ -593,7 +593,7 @@ error_code = recorder_attr_set_video_encoder_bitrate(rec_data.recorder, g_bitrat 
       /* Set the file format */
 error_code = recorder_set_file_format(rec_data.recorder,
-                                      RECORDER_FILE_FORMAT_MP4);
+                                      RECORDER_FILE_FORMAT_MP4);

      The possible file format values are defined in the recorder_file_format_e enumeration (in mobile and wearable applications).

      @@ -604,19 +604,19 @@ error_code = recorder_set_file_format(rec_data.recorder, 
       struct tm localtime = {0};
 time_t rawtime = time(NULL);
-char filename[256] = {'\0'};
+char filename[256] = {'\0'};
 size_t size;
 
 /* Create the file name */
 if (localtime_r(&rawtime, &localtime) != NULL) {
-    size = snprintf(filename, sizeof(filename),
-                    "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.mp4",
-                    app_get_data_path(), FILENAME_PREFIX,
-                    localtime.tm_year + 1900,
-                    localtime.tm_mon + 1, localtime.tm_mday,
-                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
+    size = snprintf(filename, sizeof(filename),
+                    "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.mp4",
+                    app_get_data_path(), FILENAME_PREFIX,
+                    localtime.tm_year + 1900,
+                    localtime.tm_mon + 1, localtime.tm_mday,
+                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
 } else {
-    /* Error handling */
+    /* Error handling */
 }
 /* Set the full path and file name */
 error_code = recorder_set_filename(rec_data.recorder, filename);
@@ -730,7 +730,7 @@ error_code = recorder_destroy(rec_data.recorder);
 
 
 
-  
+
    diff --git a/org.tizen.guides/html/native/media/media_streams_n.htm b/org.tizen.guides/html/native/media/media_streams_n.htm index fda7e01..807f717 100644 --- a/org.tizen.guides/html/native/media/media_streams_n.htm +++ b/org.tizen.guides/html/native/media/media_streams_n.htm @@ -246,7 +246,7 @@

    Media streamer scenario

    Creating the Server Part

    - +

    To create the server part:

    1. Create the media streamer handle and call the media_streamer_create() function: @@ -256,7 +256,7 @@ int media_streamer_create(&ms_streamer);

      Memory is allocated for the given handle.

      2. -
    2. Create a source node of the video data stream to transfer to the client part. +
    3. Create a source node of the video data stream to transfer to the client part.

      For example, the Videotest node is a checkerboard pattern of colors at the edge of the YCbCr gamut and nearby colors that are out of gamut.

      1. Create the Videotestsrc source node: @@ -272,10 +272,10 @@ media_streamer_node_add(ms_streamer, video_src);
      4. -
    4. To transfer data over an IP connection, create the final sending node on the server part and the first receiving node on the client part. The creation of the client part is described in Creating the Client Part. +
    5. To transfer data over an IP connection, create the final sending node on the server part and the first receiving node on the client part. The creation of the client part is described in Creating the Client Part.

      The Real Time Protocol (RTP) node is universal and unique at the same time, and capable of performing enormous work on the RTP packets for their truthful and confident transmission, such as RTP packet validation, maintenance of the SSRC participant database, scheduling of RR/SR RTCP packets, and parsing codec streams transmitted in the same RTP session.

        -
      1. Create the rtp_bin RTP node: +
      2. Create the rtp_bin RTP node: 
         media_streamer_node_h rtp_bin = NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_RTP, NULL, NULL, &rtp_bin);
@@ -284,8 +284,8 @@ media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_RTP, NULL, NULL, &rtp_bi
 
      3. Create a bundle and add the RTP node parameters to it:
 
         bundle *params = bundle_create();
-bundle_add_str(params, MEDIA_STREAMER_PARAM_VIDEO_OUT_PORT, "5000");
-bundle_add_str(params, MEDIA_STREAMER_PARAM_HOST, "127.0.0.1");
+bundle_add_str(params, MEDIA_STREAMER_PARAM_VIDEO_OUT_PORT, "5000");
+bundle_add_str(params, MEDIA_STREAMER_PARAM_HOST, "127.0.0.1");
 media_streamer_node_set_params(rtp_bin, params);
 
        
 
        4. 
@@ -296,15 +296,15 @@ media_streamer_node_add(ms_streamer, rtp_bin);
      6. -
    6. Create the encoding format. +
    7. Create the encoding format.

      To turn raw video from Videotestsrc or captured video data into encoded video data, an encoder is needed. The conversion of raw video streams (scaling, frame rate conversion, colorspace conversion, and samplerate conversion) is one of the main tasks to conform to the profile output format. The encoding format can be H263 or H264, for example.

       media_format_h vfmt_encoded = NULL;
 /* Define encoded video format */
 media_format_create(&vfmt_encoded);
 if (media_format_set_video_mime(vfmt_encoded, MEDIA_FORMAT_H263)
-    != MEDIA_FORMAT_ERROR_NONE)
-    g_print("media_format_set_video_mime failed!");
+    != MEDIA_FORMAT_ERROR_NONE)
+    g_print("media_format_set_video_mime failed!");
 
 media_format_set_video_width(vfmt_encoded, 800);
 media_format_set_video_height(vfmt_encoded, 600);
@@ -312,12 +312,12 @@ media_format_set_video_avg_bps(vfmt_encoded, 10000);
 media_format_set_video_max_bps(vfmt_encoded, 30000);
      8. -
    8. Create the video encoder node. +
    9. Create the video encoder node.

      The video converter, video scale, video encoder, video filter, and video parser elements are logically connected inside the video encoder node. They are all initially predefined in the .ini file.

       media_streamer_node_h video_enc = NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_VIDEO_ENCODER, NULL,
-                           vfmt_encoded, &video_enc);
+                           vfmt_encoded, &video_enc);

      Add the video encoder node to the media streamer:

      @@ -330,7 +330,7 @@ media_streamer_node_add(ms_streamer, video_enc);
 
       media_streamer_node_h video_pay = NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_VIDEO_PAY, NULL,
-                           vfmt_encoded, &video_pay);
+                           vfmt_encoded, &video_pay);
    10. Add the video pay node to the media streamer: @@ -349,14 +349,14 @@ int src_pad_num = 0; char **sink_pad_name = NULL; int sink_pad_num = 0; media_streamer_node_get_pad_name(video_pay, &src_pad_name, src_pad_num, -                                 &sink_pad_name, &sink_pad_num); + &sink_pad_name, &sink_pad_num);
    11. Link the nodes consequently into a line: 
      -media_streamer_node_link(video_src, "src", video_enc, "sink");
-media_streamer_node_link(video_enc, "src", video_pay, "sink");
-media_streamer_node_link(video_pay, "src", rtp_bin, "video_in");
+media_streamer_node_link(video_src, "src", video_enc, "sink");
+media_streamer_node_link(video_enc, "src", video_pay, "sink");
+media_streamer_node_link(video_pay, "src", rtp_bin, "video_in");
    @@ -365,21 +365,21 @@ media_streamer_node_link(video_pay, "src", rtp_bin, "video_in&quo

    Preparing the Server Part

    - +

    To prepare the server part of the media streamer, transfer the nodes from the MEDIA_STREAMER_STATE_IDLE state to the MEDIA_STREAMER_STATE_READY state.

    -

    Call the media_streamer_prepare() function to change the state:

    +

    Call the media_streamer_prepare() function to change the state:

     int media_streamer_prepare(ms_streamer);
    - +

    Playing the Server Part

    - +

    To play the server part of the Media Streamer, transfer the nodes from the MEDIA_STREAMER_STATE_READY state to the MEDIA_STREAMER_STATE_PLAYING state.

    Call the media_streamer_play() function to change the state and start playing:

     int media_streamer_play(ms_streamer);
    - +

    Creating the Client Part

    To create the client part on the 2nd device on which the server part device is intended to stream to through an IP:

    @@ -406,15 +406,15 @@ media_streamer_node_add(ms_streamer, video_sink); -
  • Create the encoding format. +
  • Create the encoding format.

    To receive video in a proper format, set it initially to have a proper video stream frame on the client part.

     media_format_h vfmt_encoded = NULL;
 /* Define the encoded video format */
 media_format_create(&vfmt_encoded);
 if (media_format_set_video_mime(vfmt_encoded, MEDIA_FORMAT_H263)
-    != MEDIA_FORMAT_ERROR_NONE)
-    g_print("media_format_set_video_mime failed!");
+    != MEDIA_FORMAT_ERROR_NONE)
+    g_print("media_format_set_video_mime failed!");
 
 media_format_set_video_width(vfmt_encoded, 800);
 media_format_set_video_height(vfmt_encoded, 600);
@@ -422,10 +422,10 @@ media_format_set_video_avg_bps(vfmt_encoded, 10000);
 media_format_set_video_max_bps(vfmt_encoded, 30000);
    • -
  • To receive data over an IP connection, first create the receiving node on the client part to be able to receive RTP packets for their further decoding into a video stream. +
  • To receive data over an IP connection, first create the receiving node on the client part to be able to receive RTP packets for their further decoding into a video stream.

    The RTP node is universal and unique at the same time, and capable of performing enormous work on RTP packets for their truthful and confident receiving, such as keeping per participant statistics based on received RTCP packets, allowing an application to easily receive and decode an RTP stream with multiple SSRCs, and reordering and removing duplicate RTP packets as they are received from a network source.

      -
    1. Create the rtp_bin RTP node: +
    2. Create the rtp_bin RTP node: 
       media_streamer_node_h rtp_bin = NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_RTP, NULL, NULL, &rtp_bin);
@@ -434,13 +434,13 @@ media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_RTP, NULL, NULL, &rtp_bi
 
    3. Create a bundle and add the RTP node parameters to it:
 
       bundle *params = bundle_create();
-bundle_add_str(params, MEDIA_STREAMER_PARAM_VIDEO_IN_PORT, "5005");
+bundle_add_str(params, MEDIA_STREAMER_PARAM_VIDEO_IN_PORT, "5005");
 media_streamer_node_set_params(rtp_bin, params);
 
      
 
      4. 
 
    4. Set the incoming format for the RTP node:
 
      -media_streamer_node_set_pad_format(rtp_node, "video_in_rtp", vfmt_encoded);
+media_streamer_node_set_pad_format(rtp_node, "video_in_rtp", vfmt_encoded);
 
      
 
      5. 
 
    5. Add the RTP node to the media streamer:
@@ -456,7 +456,7 @@ media_streamer_node_add(ms_streamer, rtp_bin);
 
       media_streamer_node_h video_depay= NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_VIDEO_DEPAY, NULL,
-                           vfmt_encoded, &video_depay);
+                           vfmt_encoded, &video_depay);
 
      
 
      6. 
 
    6. Add the video depay node to the media streamer:
@@ -466,12 +466,12 @@ media_streamer_node_add(ms_streamer, video_depay);
 
      7.
    • -
  • Create the video decoder node. +
  • Create the video decoder node.

    The video decoder, video parser, video converter, and video scale elements are logically connected inside the video decider node. They are all initially predefined in the .ini file.

     media_streamer_node_h video_dec = NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_VIDEO_DECODER, NULL,
-                           vfmt_encoded, &video_dec);
+                           vfmt_encoded, &video_dec);

    Add the video decoder node to the media streamer:

    @@ -482,22 +482,22 @@ media_streamer_node_add(ms_streamer, video_dec);
 
     media_streamer_node_h video_queue= NULL;
 media_streamer_node_create(MEDIA_STREAMER_NODE_TYPE_QUEUE, NULL,
-                           vfmt_encoded, &video_queue);
+                           vfmt_encoded, &video_queue);
 
    
 
    Add the video queue node to the media streamer:
    
 
     media_streamer_node_add(ms_streamer, video_queue);
    • -
  • To have a proper receiving node functionality, link the client nodes between each other into a logic chain: +
  • To have a proper receiving node functionality, link the client nodes between each other into a logic chain: 
    -media_streamer_node_link(video_depay, "src", video_dec, "sink");
-media_streamer_node_link(video_dec, "src", video_queue, "sink");
-media_streamer_node_link(video_queue, "src", video_sink, "sink");
+media_streamer_node_link(video_depay, "src", video_dec, "sink");
+media_streamer_node_link(video_dec, "src", video_queue, "sink");
+media_streamer_node_link(video_queue, "src", video_sink, "sink");
    • - +

    Preparing the Client Part

    To prepare the client part of the media streamer, transfer the nodes from the MEDIA_STREAMER_STATE_IDLE state to the MEDIA_STREAMER_STATE_READY state.

    @@ -517,7 +517,7 @@ int media_streamer_play(ms_streamer);

    Figure: Media streamer client part device receiving Videotestsrc streamed in the streaming scenario

    Media streamer streaming media

    - +
    diff --git a/org.tizen.guides/html/native/media/metadata_n.htm b/org.tizen.guides/html/native/media/metadata_n.htm index 1f86a52..5fc8710 100644 --- a/org.tizen.guides/html/native/media/metadata_n.htm +++ b/org.tizen.guides/html/native/media/metadata_n.htm @@ -46,7 +46,7 @@
  • Editable Metadata Attributes
  • Extractable Metadata Attributes
    • - +

    Related Info

    @@ -63,7 +63,7 @@

    Metadata

    - +

    To handle content metadata, you can use the following features:

      @@ -72,17 +72,17 @@

      The metadata editor supports editing the metadata of the mp3 and mp4 (audio only) file formats. Image and video file editing is not supported.

    • Metadata extraction

      Media files, such as mp3 and mp4 files, contain extractable metadata. You can extract metadata from such media files with the metadata extractor.

      - -

      Figure: Getting metadata

      + +

      Figure: Getting metadata

      Getting metadata

      - +

      The metadata extractor can be used with video and audio files only. It is not supported in the image files.

    • MIME type information

      You can get a MIME type for a file extension and get a list of extensions associated, for example, with an image or a JPEG MIME type.

    - +

    Prerequisites

    @@ -115,47 +115,47 @@ static metadata_editor_h g_metadata_h = NULL; 
     int internal_storage_id;
 char *internal_music_storage_path;
-char *music_file_name = "test_music.mp3";
+char *music_file_name = "test_music.mp3";
 char *music_test_path;
 
 static bool
 storage_cb(int storage_id, storage_type_e type, storage_state_e state,
-           const char *path, void *user_data)
+           const char *path, void *user_data)
 {
-    if (type == STORAGE_TYPE_INTERNAL) {
-        internal_storage_id = storage_id;
+    if (type == STORAGE_TYPE_INTERNAL) {
+        internal_storage_id = storage_id;
 
-        return false;
-    }
+        return false;
+    }
 
-    return true;
+    return true;
 }
 
 void
 _get_internal_storage_path()
 {
-    int error;
-    char *path = NULL;
-
-    error = storage_foreach_device_supported(storage_cb, NULL);
-    error = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_MUSIC, &path);
-    if (error == STORAGE_ERROR_NONE) {
-        internal_music_storage_path = strdup(path);
-        free(path);
-    }
+    int error;
+    char *path = NULL;
+
+    error = storage_foreach_device_supported(storage_cb, NULL);
+    error = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_MUSIC, &path);
+    if (error == STORAGE_ERROR_NONE) {
+        internal_music_storage_path = strdup(path);
+        free(path);
+    }
 }
 
 void
 _make_test_path()
 {
-    int path_len = 0;
+    int path_len = 0;
 
-    path_len = strlen(internal_music_storage_path) + strlen(music_file_name) + 2;
-    music_test_path = malloc(path_len);
-    memset(music_test_path, 0x0, path_len);
+    path_len = strlen(internal_music_storage_path) + strlen(music_file_name) + 2;
+    music_test_path = malloc(path_len);
+    memset(music_test_path, 0x0, path_len);
 
-    snprintf(music_test_path, path_len, "%s/%s",
-             internal_music_storage_path, music_file_name);
+    snprintf(music_test_path, path_len, "%s/%s",
+             internal_music_storage_path, music_file_name);
 }
    @@ -186,65 +186,65 @@ static metadata_extractor_h g_metadata_h = NULL; int internal_storage_id; char *internal_music_storage_path; char *internal_video_storage_path; -char *music_file_name = "test_music.mp3"; -char *video_file_name = "test_video.mp4"; +char *music_file_name = "test_music.mp3"; +char *video_file_name = "test_video.mp4"; char *music_test_path; char *video_test_path; static bool storage_cb(int storage_id, storage_type_e type, storage_state_e state, -           const char *path, void *user_data) + const char *path, void *user_data) { -    if (type == STORAGE_TYPE_INTERNAL) { -        internal_storage_id = storage_id; + if (type == STORAGE_TYPE_INTERNAL) { + internal_storage_id = storage_id; -        return false; -    } + return false; + } -    return true; + return true; } void _get_internal_storage_path() { -    int error; -    char *path = NULL; - -    error = storage_foreach_device_supported(storage_cb, NULL); -    error = storage_get_directory(internal_storage_id, -                                  STORAGE_DIRECTORY_MUSIC, &path); -    if (error != STORAGE_ERROR_NONE) { -        internal_music_storage_path = strdup(path); -        free(path); -    } - -    error = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_VIDEOS, &path); -    if (error != STORAGE_ERROR_NONE) { -        internal_video_storage_path = strdup(path); -        free(path); -    } + int error; + char *path = NULL; + + error = storage_foreach_device_supported(storage_cb, NULL); + error = storage_get_directory(internal_storage_id, + STORAGE_DIRECTORY_MUSIC, &path); + if (error != STORAGE_ERROR_NONE) { + internal_music_storage_path = strdup(path); + free(path); + } + + error = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_VIDEOS, &path); + if (error != STORAGE_ERROR_NONE) { + internal_video_storage_path = strdup(path); + free(path); + } } void _make_test_path() { -    int path_len = 0; + int path_len = 0; -    path_len = strlen(internal_music_storage_path) + strlen(music_file_name) + 1; -    music_test_path = malloc(path_len); -    memset(music_test_path, 0x0, path_len); + path_len = strlen(internal_music_storage_path) + strlen(music_file_name) + 1; + music_test_path = malloc(path_len); + memset(music_test_path, 0x0, path_len); -    strncat(music_test_path, internal_music_storage_path, -            strlen(internal_music_storage_path)); -    strncat(music_test_path, music_file_name, strlen(music_file_name)); + strncat(music_test_path, internal_music_storage_path, + strlen(internal_music_storage_path)); + strncat(music_test_path, music_file_name, strlen(music_file_name)); -    path_len = strlen(internal_video_storage_path) + strlen(video_file_name) + 1; -    video_test_path = malloc(path_len); -    memset(video_test_path, 0x0, path_len); + path_len = strlen(internal_video_storage_path) + strlen(video_file_name) + 1; + video_test_path = malloc(path_len); + memset(video_test_path, 0x0, path_len); -    strncat(video_test_path, internal_video_storage_path, -            strlen(internal_video_storage_path)); -    strncat(video_test_path, video_file_name, strlen(video_file_name)); + strncat(video_test_path, internal_video_storage_path, + strlen(internal_video_storage_path)); + strncat(video_test_path, video_file_name, strlen(video_file_name)); } @@ -278,7 +278,7 @@ ret = metadata_editor_set_path(g_metadata_h, music_test_path);

    As parameters, define the metadata editor handle, the attribute you want to edit, and the new value you want to set to the attribute. The possible attributes are defined in the metadata_editor_attr_e enumeration (in mobile and wearable applications).

    The following example code edits the title of the audio content. You can edit other attributes by defining a different attribute enumerator (and a corresponding new value).

    -char *value = "My Song";
+char *value = "My Song";
 
 ret = metadata_editor_set_metadata(g_metadata_h, METADATA_EDITOR_ATTR_TITLE, value);
    @@ -294,7 +294,7 @@ ret = metadata_editor_set_metadata(g_metadata_h, METADATA_EDITOR_ATTR_TITLE, val

    Add artwork to the file using the metadata_editor_append_picture() function.

    As parameters, define the metadata editor handle and the path of the image file that contains the artwork. The image file must be in the JPEG or PNG format. The image is added to the last image file position. You can add multiple image files to the same audio file.

    -char *artwork = "append_image.jpg";
+char *artwork = "append_image.jpg";
 
 ret = metadata_editor_append_picture(g_metadata_h, artwork);
    @@ -370,10 +370,10 @@ ret = metadata_extractor_set_path(g_metadata_h, music_test_path); char *value = NULL; ret = metadata_extractor_get_metadata(g_metadata_h, METADATA_DURATION, &value); -dlog_print(DLOG_DEBUG, LOG_TAG, "METADATA_DURATION: %s\n", value); +dlog_print(DLOG_DEBUG, LOG_TAG, "METADATA_DURATION: %s\n", value); if (value != NULL) { -    free(value); -    value = NULL; + free(value); + value = NULL; } @@ -395,17 +395,17 @@ void *artwork = NULL; char *artwork_mime = NULL; ret = metadata_extractor_get_artwork(g_metadata_h, &artwork, -                                     &artwork_size, &artwork_mime); + &artwork_size, &artwork_mime); dlog_print(DLOG_DEBUG, LOG_TAG, -           "Artwork: size: %d, mime type: %s\n", artwork_size, artwork_mime); + "Artwork: size: %d, mime type: %s\n", artwork_size, artwork_mime); if (artwork != NULL) { -    free(artwork); -    artwork = NULL; + free(artwork); + artwork = NULL; } if (artwork_mime != NULL) { -    free(artwork_mime); -    artwork_mime = NULL; + free(artwork_mime); + artwork_mime = NULL; } @@ -425,10 +425,10 @@ char *lyrics = NULL; ret = metadata_extractor_get_synclyrics(g_metadata_h, 1, &time_info, &lyrics); if (lyrics != NULL) { -    dlog_print(DLOG_DEBUG, LOG_TAG, -               "Synclyrics: time_info: %d, lyrics: %s\n", time_info, lyrics); -    free(lyrics); -    lyrics = NULL; + dlog_print(DLOG_DEBUG, LOG_TAG, + "Synclyrics: time_info: %d, lyrics: %s\n", time_info, lyrics); + free(lyrics); + lyrics = NULL; } @@ -454,21 +454,21 @@ int frame_size = 0; void *frame = NULL; ret = metadata_extractor_get_frame(g_metadata_h, &frame, &frame_size); -dlog_print(DLOG_DEBUG, LOG_TAG, "Frame: size: %d\n", frame_size); +dlog_print(DLOG_DEBUG, LOG_TAG, "Frame: size: %d\n", frame_size); if (frame != NULL) { -    free(frame); -    frame = NULL; + free(frame); + frame = NULL; } /* Use metadata_extractor_get_frame_at_time() */ unsigned long timestamp = 500; ret = metadata_extractor_get_frame_at_time(g_metadata_h, timestamp, true, -                                           &frame, &frame_size); -dlog_print(DLOG_DEBUG, LOG_TAG, "Frame at %d: size: %d\n", timestamp, frame_size); + &frame, &frame_size); +dlog_print(DLOG_DEBUG, LOG_TAG, "Frame at %d: size: %d\n", timestamp, frame_size); if (frame != NULL) { -    free(frame); -    frame = NULL; + free(frame); + frame = NULL; } @@ -493,15 +493,15 @@ metadata_extractor_destroy(g_metadata_h);
    • For an individual file extension:

      Use the mime_type_get_mime_type() function. The first parameter is the file extension without the leading dot and the second parameter is the MIME type for the given file extension.

      - -

      The MIME type is 'application/octet-stream' if the given file extension is not associated with any specific file format.

      + +

      The MIME type is 'application/octet-stream' if the given file extension is not associated with any specific file format.

       #include <dirent.h>
 #include <string.h>
 
 char *mime_type;
-int error = mime_type_get_mime_type("jpg", &mime_type);
+int error = mime_type_get_mime_type("jpg", &mime_type);
    • For the extensions of all files in the resource directory: @@ -513,30 +513,30 @@ struct dirent *pDirent = NULL; DIR *dir; char *res_path = app_get_resource_path(); if (!res_path) -    /* Error handling */ + /* Error handling */ dir = opendir(res_path); if (dir) { -    while ((pDirent = readdir(dir)) != NULL) { -        if (pDirent->d_type != DT_REG) /* Only regular files */ -            continue; + while ((pDirent = readdir(dir)) != NULL) { + if (pDirent->d_type != DT_REG) /* Only regular files */ + continue;

    • Get the extension from a file name using the strrchr() function available in the <string.h> header. Incrementing the pointer address is necessary, so use the extension without a dot:

      -        char *extension = strrchr(pDirent->d_name, '.');
-        if (!extension)
-            continue;
-        extension++;
+        char *extension = strrchr(pDirent->d_name, '.');
+        if (!extension)
+            continue;
+        extension++;

    • Use the mime_type_get_mime_type() function to get the MIME type of each file using the extension pointer as an extension:

      -        mime_type_get_mime_type(extension, &mime_type);
-        /* Here you have a MIME type in its variable */
-        free(mime_type);
-    }
-    closedir(dir);
+        mime_type_get_mime_type(extension, &mime_type);
+        /* Here you have a MIME type in its variable */
+        free(mime_type);
+    }
+    closedir(dir);
 }
    @@ -548,225 +548,225 @@ if (dir) { 
     char **extension;
 int length;
-int error = mime_type_get_file_extension("image/jpeg", &extension, &length);
+int error = mime_type_get_file_extension("image/jpeg", &extension, &length);
 
 int i;
 for (i = 0; i < length; i++)
-    /* Use extension[i] */
+    /* Use extension[i] */
 
 for (i = 0; i < length; i++)
-    free(extension[i]);
+    free(extension[i]);
 free(extension);

    Editable Metadata Attributes

    The following table lists the metadata you can edit.

    - -

    Table: Editable metadata attributes

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    AttributeDescription
    METADATA_EDITOR_ATTR_ARTISTArtist of the audio content
    METADATA_EDITOR_ATTR_TITLETitle of the audio content
    METADATA_EDITOR_ATTR_ALBUMAlbum of the audio content
    METADATA_EDITOR_ATTR_GENREGenre of the audio content
    METADATA_EDITOR_ATTR_AUTHORAuthor of the audio content
    METADATA_EDITOR_ATTR_COPYRIGHTCopyright of the audio content
    METADATA_EDITOR_ATTR_DATEDate of the audio content
    METADATA_EDITOR_ATTR_DESCRIPTIONDescription of the audio content
    METADATA_EDITOR_ATTR_COMMENTComment of the audio content
    METADATA_EDITOR_ATTR_TRACK_NUMTrack number of the audio content
    METADATA_EDITOR_ATTR_PICTURE_NUMPicture number of the audio content
    METADATA_EDITOR_ATTR_CONDUCTORConductor of the audio content
    METADATA_EDITOR_ATTR_UNSYNCLYRICSUnsync lyrics of the audio content
    + +

    Table: Editable metadata attributes

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    AttributeDescription
    METADATA_EDITOR_ATTR_ARTISTArtist of the audio content
    METADATA_EDITOR_ATTR_TITLETitle of the audio content
    METADATA_EDITOR_ATTR_ALBUMAlbum of the audio content
    METADATA_EDITOR_ATTR_GENREGenre of the audio content
    METADATA_EDITOR_ATTR_AUTHORAuthor of the audio content
    METADATA_EDITOR_ATTR_COPYRIGHTCopyright of the audio content
    METADATA_EDITOR_ATTR_DATEDate of the audio content
    METADATA_EDITOR_ATTR_DESCRIPTIONDescription of the audio content
    METADATA_EDITOR_ATTR_COMMENTComment of the audio content
    METADATA_EDITOR_ATTR_TRACK_NUMTrack number of the audio content
    METADATA_EDITOR_ATTR_PICTURE_NUMPicture number of the audio content
    METADATA_EDITOR_ATTR_CONDUCTORConductor of the audio content
    METADATA_EDITOR_ATTR_UNSYNCLYRICSUnsync lyrics of the audio content

    Extractable Metadata Attributes

    - +

    The following table lists the extractable metadata.

    - -

    Table: Metadata extractor attributes

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    AttributeDescription
    METADATA_DURATIONDuration of the content
    METADATA_VIDEO_BITRATEBitrate of the video content
    METADATA_VIDEO_FPSFPS of the video content
    METADATA_VIDEO_WIDTHWidth of the video content
    METADATA_VIDEO_HEIGHTHeight of the video content
    METADATA_HAS_VIDEOWhether the content has video stream
    METADATA_AUDIO_BITRATEBitrate of the audio content
    METADATA_AUDIO_CHANNELSChannel of the audio content
    METADATA_AUDIO_SAMPLERATESample rate of the audio content
    METADATA_AUDIO_BITPERSAMPLEBit per sample of the audio content
    METADATA_HAS_AUDIOWhether the content has audio stream
    METADATA_ARTISTArtist of the content
    METADATA_TITLETitle of the content
    METADATA_ALBUMAlbum of the content
    METADATA_ALBUM_ARTISTAlbum artist of the content
    METADATA_GENREGenre of the content
    METADATA_AUTHORAuthor of the content
    METADATA_COPYRIGHTCopyright of the content
    METADATA_DATEDate of the content
    METADATA_DESCRIPTIONDescription of the content
    METADATA_COMMENTComment about the content
    METADATA_TRACK_NUMTrack number of the content
    METADATA_CLASSIFICATIONClassification of the content
    METADATA_RATINGRating of the content
    METADATA_LONGITUDELongitude of the content
    METADATA_LATITUDELatitude of the content
    METADATA_ALTITUDEAltitude of the content
    METADATA_CONDUCTORConductor of the content
    METADATA_UNSYNCLYRICSAsynchronous lyrics of the content
    METADATA_SYNCLYRICS_NUMSynchronous lyrics of the content
    METADATA_RECDATERecorded date of the content
    METADATA_ROTATEOrientation of the content
    - + +

    Table: Metadata extractor attributes

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    AttributeDescription
    METADATA_DURATIONDuration of the content
    METADATA_VIDEO_BITRATEBitrate of the video content
    METADATA_VIDEO_FPSFPS of the video content
    METADATA_VIDEO_WIDTHWidth of the video content
    METADATA_VIDEO_HEIGHTHeight of the video content
    METADATA_HAS_VIDEOWhether the content has video stream
    METADATA_AUDIO_BITRATEBitrate of the audio content
    METADATA_AUDIO_CHANNELSChannel of the audio content
    METADATA_AUDIO_SAMPLERATESample rate of the audio content
    METADATA_AUDIO_BITPERSAMPLEBit per sample of the audio content
    METADATA_HAS_AUDIOWhether the content has audio stream
    METADATA_ARTISTArtist of the content
    METADATA_TITLETitle of the content
    METADATA_ALBUMAlbum of the content
    METADATA_ALBUM_ARTISTAlbum artist of the content
    METADATA_GENREGenre of the content
    METADATA_AUTHORAuthor of the content
    METADATA_COPYRIGHTCopyright of the content
    METADATA_DATEDate of the content
    METADATA_DESCRIPTIONDescription of the content
    METADATA_COMMENTComment about the content
    METADATA_TRACK_NUMTrack number of the content
    METADATA_CLASSIFICATIONClassification of the content
    METADATA_RATINGRating of the content
    METADATA_LONGITUDELongitude of the content
    METADATA_LATITUDELatitude of the content
    METADATA_ALTITUDEAltitude of the content
    METADATA_CONDUCTORConductor of the content
    METADATA_UNSYNCLYRICSAsynchronous lyrics of the content
    METADATA_SYNCLYRICS_NUMSynchronous lyrics of the content
    METADATA_RECDATERecorded date of the content
    METADATA_ROTATEOrientation of the content
    +
    diff --git a/org.tizen.guides/html/native/media/openal_n.htm b/org.tizen.guides/html/native/media/openal_n.htm index 5e0e2aa..c04a568 100644 --- a/org.tizen.guides/html/native/media/openal_n.htm +++ b/org.tizen.guides/html/native/media/openal_n.htm @@ -68,22 +68,22 @@ /* Open default device */ device = alcOpenDevice(NULL); if (device != NULL) { -    /* Create context */ -    context=alcCreateContext(device, NULL); -    if (context != NULL) { -        /* Set active context */ -        alcMakeContextCurrent(context); -    } + /* Create context */ + context=alcCreateContext(device, NULL); + if (context != NULL) { + /* Set active context */ + alcMakeContextCurrent(context); + } }

    When your audio stream is no longer needed or inactive for a long time, destroy the context by calling the alcDestroyContext() function.

    - +
    Note The device cannot fall into a sleep state while the context is not destroyed. To avoid unwanted battery consumption, destroy the context punctually.
    - +
  • Requesting a source and buffer @@ -117,9 +117,9 @@ if (device != NULL) {

    The following example code verifies that a given extension is available, retrieves the names of all available devices and the name of the default device using the alcGetString() function, and opens the default device using the alcOpenDevice() function:

     /* Verify that a given extension is available for the current context */
-enumeration = alcIsExtensionPresent(NULL, "ALC_ENUMERATION_EXT");
+enumeration = alcIsExtensionPresent(NULL, "ALC_ENUMERATION_EXT");
 if (enumeration == AL_FALSE)
-    LOGI("[%s] enumeration extension not available", __func__);
+    LOGI("[%s] enumeration extension not available", __func__);
 
 /*
    Retrieve a list of available devices
@@ -134,12 +134,12 @@ defaultDeviceName = alcGetString(NULL, ALC_DEFAULT_DEVICE_SPECIFIER);
 /* Open the default device */
 device = alcOpenDevice(defaultDeviceName);
 if (!device) {
-    LOGI("[%s] unable to open default device", __func__);
+    LOGI("[%s] unable to open default device", __func__);
 
-    return;
+    return;
 }
 
-LOGI("[%s] Device: %s ", __func__, alcGetString(device, ALC_DEVICE_SPECIFIER));
+LOGI("[%s] Device: %s ", __func__, alcGetString(device, ALC_DEVICE_SPECIFIER));

    The alcOpenDevice() function opens the audio device through the pulseaudio layer.

    • @@ -151,19 +151,19 @@ LOGI("[%s] Device: %s ", __func__, alcGetString(device, ALC_DEVICE_SPE /* Create context */ context = alcCreateContext(device, NULL); if (context == NULL) { -    alcCloseDevice(device); -    LOGI("[%s] failed to create context", __func__); + alcCloseDevice(device); + LOGI("[%s] failed to create context", __func__); -    return; + return; } /* Set active context */ if (!alcMakeContextCurrent(context)) { -    alcDestroyContext(context); -    alcCloseDevice(device); -    LOGI("[%s] failed to make default context", __func__); + alcDestroyContext(context); + alcCloseDevice(device); + LOGI("[%s] failed to make default context", __func__); -    return; + return; }

    Once the device is associated with an active context, the AL commands are applied to that context.

    @@ -307,8 +307,8 @@ alGenBuffers(4, buffer); /* Fill all the buffers with audio data from the wave file */ for (iLoop = 0; iLoop < 4; iLoop++) { -    alBufferData(buffer[iLoop], AL_FORMAT_MONO8, pData, DATA_CHUNK_SIZE, 22050); -    alSourceQueueBuffers(source, 1, &buffer[iLoop]); + alBufferData(buffer[iLoop], AL_FORMAT_MONO8, pData, DATA_CHUNK_SIZE, 22050); + alSourceQueueBuffers(source, 1, &buffer[iLoop]); } @@ -320,40 +320,40 @@ for (iLoop = 0; iLoop < 4; iLoop++) { 
     /* Start playing the streamed audio */
 alSourcePlay(source);
-LOGI("[%s] alSourcePlay", __func__);
+LOGI("[%s] alSourcePlay", __func__);
 
 /* Buffer queuing loop must operate in a new thread */
 iBuffersProcessed = 0;
 while (!thread_finish) {
-    usleep(10 * 1000); /* Sleep 10 msec periodically */
-
-    alGetSourcei(source, AL_BUFFERS_PROCESSED, &iBuffersProcessed);
-
-    iTotalBuffersProcessed += iBuffersProcessed;
-    LOGI("Buffers Processed %d", iTotalBuffersProcessed);
-
-    /*
-       For each processed buffer, remove it from the source queue,
-       read the next chunk of audio data from the file,
-       fill the buffer with new data, and add it to the source queue
-    */
-    while (iBuffersProcessed) {
-        /*
-           Remove the buffer from the queue
-           (uiBuffer contains the buffer ID for the dequeued buffer)
-        */
-        uiBuffer = 0;
-        alSourceUnqueueBuffers(source, 1, &uiBuffer);
-
-        /* Read more pData audio data (if there is any) */
-
-        /* Copy audio data to buffer */
-        alBufferData(uiBuffer, AL_FORMAT_MONO8, pData, DATA_CHUNK_SIZE, 22050);
-        /* Insert the audio buffer to the source queue */
-        alSourceQueueBuffers(source, 1, &uiBuffer);
-
-        iBuffersProcessed--;
-    }
+    usleep(10 * 1000); /* Sleep 10 msec periodically */
+
+    alGetSourcei(source, AL_BUFFERS_PROCESSED, &iBuffersProcessed);
+
+    iTotalBuffersProcessed += iBuffersProcessed;
+    LOGI("Buffers Processed %d", iTotalBuffersProcessed);
+
+    /*
+       For each processed buffer, remove it from the source queue,
+       read the next chunk of audio data from the file,
+       fill the buffer with new data, and add it to the source queue
+    */
+    while (iBuffersProcessed) {
+        /*
+           Remove the buffer from the queue
+           (uiBuffer contains the buffer ID for the dequeued buffer)
+        */
+        uiBuffer = 0;
+        alSourceUnqueueBuffers(source, 1, &uiBuffer);
+
+        /* Read more pData audio data (if there is any) */
+
+        /* Copy audio data to buffer */
+        alBufferData(uiBuffer, AL_FORMAT_MONO8, pData, DATA_CHUNK_SIZE, 22050);
+        /* Insert the audio buffer to the source queue */
+        alSourceQueueBuffers(source, 1, &uiBuffer);
+
+        iBuffersProcessed--;
+    }
 }
    diff --git a/org.tizen.guides/html/native/media/radio_n.htm b/org.tizen.guides/html/native/media/radio_n.htm index f083255..30d5802 100644 --- a/org.tizen.guides/html/native/media/radio_n.htm +++ b/org.tizen.guides/html/native/media/radio_n.htm @@ -45,8 +45,8 @@

    Tizen provides functions for controlling radio hardware on your system.

    -

    The main features of the Radio API include:

    - +

    The main features of the Radio API include:

    + - +

    The Radio API allows only one instance at the time. Radio playback can be interrupted by another radio application.

    The following figure illustrates the general radio state changes.

    -

    Figure: Radio state changes

    -

    Radio state changes

    - +

    Figure: Radio state changes

    +

    Radio state changes

    +

    Prerequisites

    To enable your application to use the radio functionality:

    @@ -78,26 +78,26 @@ 
     #define MAX_FREQUENCIES 10
 struct radioInfo {
-    radio_h radio;
-    int frequencies[MAX_FREQUENCIES];
-    int num_freq;
-    int selected_channel;
+    radio_h radio;
+    int frequencies[MAX_FREQUENCIES];
+    int num_freq;
+    int selected_channel;
 };
 typedef struct radioInfo mRadioInfo;
 
 mRadioInfo mRadio;
 ret = radio_create(&mRadio.radio);
 if (ret != RADIO_ERROR_NONE)
-    return false;
+    return false;

  • To receive notifications when the radio playback is interrupted, register a callback function using the radio_set_interrupted_cb() function:

     ret = radio_set_interrupted_cb(mRadio.radio, on_radio_interrupted, &mRadio);
 if (ret != RADIO_ERROR_NONE) {
-    /* Delete the radio handle before closing the application */
+    /* Delete the radio handle before closing the application */
 
-    return false;
+    return false;
 }

    Radio playback is interrupted, for example, when the application moves to the background.

    @@ -107,19 +107,19 @@ if (ret != RADIO_ERROR_NONE) { static void on_radio_interrupted(radio_interrupted_code_e code, void* userdata) { -    /* Search the radio handle from userdata */ -    mRadioInfo* mRadio = (mRadioInfo *)userdata; - -    switch (code) { -    case RADIO_INTERRUPTED_COMPLETED: -        /* Application, which was the source of the conflict, is now closed */ -        /* Restart the radio playback here */ -        break; -    default: -        /* Radio listening is interrupted */ -        /* Release the application resources or save the current state here */ -        break; -    } + /* Search the radio handle from userdata */ + mRadioInfo* mRadio = (mRadioInfo *)userdata; + + switch (code) { + case RADIO_INTERRUPTED_COMPLETED: + /* Application, which was the source of the conflict, is now closed */ + /* Restart the radio playback here */ + break; + default: + /* Radio listening is interrupted */ + /* Release the application resources or save the current state here */ + break; + } }
    • @@ -134,7 +134,7 @@ on_radio_interrupted(radio_interrupted_code_e code, void* userdata) 
     ret = radio_set_scan_completed_cb(mRadio.radio, on_scan_finished, &mRadio);
 if (ret != RADIO_ERROR_NONE)
-    return false;
+    return false;

  • Implement the scan complete callback:

    @@ -142,8 +142,8 @@ if (ret != RADIO_ERROR_NONE) void on_scan_finished(void* userdata) { -    /* Frequency scanning is completed */ -    /* Tune in to one of the scanned frequencies and start listening */ + /* Frequency scanning is completed */ + /* Tune in to one of the scanned frequencies and start listening */ }
    • @@ -159,10 +159,10 @@ radio_scan_start(mRadio.radio, on_scan_updated, &mRadio); void on_scan_updated(int frequency, void* userdata) { -    mRadioInfo* mRadio = (mRadioInfo *)userdata; -    /* Store the radio channels in the array */ -    /* Frequency values represent the kHz of the channel */ -    mRadio->frequencies[mRadio->num_freq++] = frequency; + mRadioInfo* mRadio = (mRadioInfo *)userdata; + /* Store the radio channels in the array */ + /* Frequency values represent the kHz of the channel */ + mRadio->frequencies[mRadio->num_freq++] = frequency; } @@ -183,14 +183,14 @@ on_scan_updated(int frequency, void* userdata) 
     ret = radio_set_frequency(mRadio.radio, mRadio.frequencies[mRadio.selected_channel]);
 if (ret != RADIO_ERROR_NONE)
-    return false;
+    return false;

  • Start playing the frequency using the radio_start() function:

     ret = radio_start(mRadio.radio);
 if (ret != RADIO_ERROR_NONE)
-    return false;
+    return false;

    If the radio emits no sound, check the signal strength with the radio_get_signal_strength() function, which returns the current signal strength as a dBuV value.

    • @@ -206,7 +206,7 @@ if (ret != RADIO_ERROR_NONE) 
     ret = radio_seek_down(mRadio.radio, on_seek_completed, &mRadio);
 if (ret != RADIO_ERROR_NONE)
-    return false;
+    return false;

    To seek up, use the radio_seek_up() function in the same way.

    @@ -215,17 +215,17 @@ if (ret != RADIO_ERROR_NONE) void on_seek_completed(int frequency, void* userdata) { -    mRadioInfo *mRadio = (mRadioInfo *)userdata; -    int new_frequency = 0; + mRadioInfo *mRadio = (mRadioInfo *)userdata; + int new_frequency = 0; -    /* Search is complete, and the radio is tuned in to the new frequency */ -    /* Application sets the new frequency and updates the user interface */ -    radio_get_frequency(mRadio->radio, &new_frequency); + /* Search is complete, and the radio is tuned in to the new frequency */ + /* Application sets the new frequency and updates the user interface */ + radio_get_frequency(mRadio->radio, &new_frequency); } - + diff --git a/org.tizen.guides/html/native/media/raw_audio_n.htm b/org.tizen.guides/html/native/media/raw_audio_n.htm index 023b232..3a9858e 100644 --- a/org.tizen.guides/html/native/media/raw_audio_n.htm +++ b/org.tizen.guides/html/native/media/raw_audio_n.htm @@ -41,7 +41,7 @@
  • Managing Synchronous Recording
  • Managing Asynchronous Recording
    • - +

    Related Info

    - +

    The following figures illustrate the general audio output states, and how the state changes when the audio output is interrupted by the system.

    ´

    Figure: Audio output states

    Audio output states

    Figure: Audio output states when interrupted by system

    Audio output states when interrupted by system

    - +

    Using Audio Output

    For supporting various low-end Tizen devices, the application must follow certain guidelines:

    - +

    Related Info

    @@ -512,7 +512,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
    1. Prepare the appID, appSecret, regID, and requestID:
        -
      • The appID and appSecret values are from the email that you received when requesting permission to Tizen push servers.
        • +
      • The appID and appSecret values are from the email that you received when requesting permission to Tizen push servers.
      • The regID value is the one that the application server received from your application installed in a Tizen device. Depending on the regID value, the URI of the server to which your application server sends the notification varies.
      • The requestID value is used to identify the notification in the push server. When your application server sends notifications using the same requestID value, the last notification overwrites all the previous notifications that are not delivered yet.
      @@ -558,19 +558,19 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc= -

      For example, to show a "Hi" message in the quick panel and increase the badge count by 1 when the notification arrives at the device, the message field of the notification must be the following:

      +

      For example, to show a "Hi" message in the quick panel and increase the badge count by 1 when the notification arrives at the device, the message field of the notification must be the following:

      -"badgeOption=INCREASE&badgeNumber=1&action=ALERT&alertMessage=Hi"
+"badgeOption=INCREASE&badgeNumber=1&action=ALERT&alertMessage=Hi"

      If you want to deliver the notification directly to your application, the message field must be the following:

      -"action=LAUNCH"
+"action=LAUNCH"

      When the push service in the target device receives a notification with this message, it launches your application and delivers the notification through an Application Controls. Your application can get the notification using the push_service_app_control_to_notification() function. For more information, see how to receive notifications when the application is not running.

      -

      The message field takes effect only when the application is not running (more precisely, when the application is not connected to the push service). If a notification with the above message field arrives at the device where the application is running, the push service delivers the notification directly to the application. It does not show the "Hi" message in the quick panel or increase the badge count.

      +

      The message field takes effect only when the application is not running (more precisely, when the application is not connected to the push service). If a notification with the above message field arrives at the device where the application is running, the push service delivers the notification directly to the application. It does not show the "Hi" message in the quick panel or increase the badge count.

    2. Load your own data to the appData field as a string.

      This use case focuses on how an application developer can construct a notification. For advanced features, see the Push Server guide for server developers.

      @@ -592,47 +592,47 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc= static void _noti_cb(push_service_notification_h noti, void *user_data) { -    int ret; - -    char *data=NULL; /* App data loaded on the notification */ -    char *msg=NULL; /* Noti message */ -    long long int time_stamp; /* Time when the noti is generated */ -    char *sender=NULL; /* Optional sender information */ -    char *session_info=NULL; /* Optional session information */ -    char *request_id=NULL; /* Optional request ID */ - -    /* Retrieve app data from noti */ -    ret = push_service_get_notification_data(noti, &data); -    /* Decrypt app data here if it is encrypted */ - -    /* Retrieve notification message from noti */ -    ret = push_service_get_notification_message(noti, &msg); - -    /* Retrieve the time when notification is created from noti */ -    ret = push_service_get_notification_time(noti, &time_stamp); - -    /* Retrieve the optional information */ -    ret = push_service_get_notification_sender(noti, &sender); -    ret = push_service_get_notification_session_info(noti, &session_info); -    ret = push_service_get_notification_request_id(noti, &request_id); - -    /* -     Use data, msg, time_stamp, sender, -     session_info, and request_id as needed -    */ - -    /* Free all resources */ -    /* Do not free noti in the callback function */ -    if (data) -        free(data); -    if (msg) -        free(msg); -    if (sender) -        free(sender); -    if (session_info) -        free(session_info); -    if (request_id) -        free(request_id); + int ret; + + char *data=NULL; /* App data loaded on the notification */ + char *msg=NULL; /* Noti message */ + long long int time_stamp; /* Time when the noti is generated */ + char *sender=NULL; /* Optional sender information */ + char *session_info=NULL; /* Optional session information */ + char *request_id=NULL; /* Optional request ID */ + + /* Retrieve app data from noti */ + ret = push_service_get_notification_data(noti, &data); + /* Decrypt app data here if it is encrypted */ + + /* Retrieve notification message from noti */ + ret = push_service_get_notification_message(noti, &msg); + + /* Retrieve the time when notification is created from noti */ + ret = push_service_get_notification_time(noti, &time_stamp); + + /* Retrieve the optional information */ + ret = push_service_get_notification_sender(noti, &sender); + ret = push_service_get_notification_session_info(noti, &session_info); + ret = push_service_get_notification_request_id(noti, &request_id); + + /* + Use data, msg, time_stamp, sender, + session_info, and request_id as needed + */ + + /* Free all resources */ + /* Do not free noti in the callback function */ + if (data) + free(data); + if (msg) + free(msg); + if (sender) + free(sender); + if (session_info) + free(session_info); + if (request_id) + free(request_id); }
      3. @@ -649,46 +649,46 @@ _noti_cb(push_service_notification_h noti, void *user_data) static void app_control(app_control_h app_control, void *data) { -    char *op = NULL; -    push_service_notification_h noti = NULL; -    int ret; - -    if (app_control_get_operation(app_control, &op) < 0) -        return; - -    /* Retrieve the noti from the bundle */ -    ret = push_service_app_control_to_notification(app_control, op, &noti); - -    if (noti) { -        /* Handle the noti */ - -        /* Free the noti */ -        push_service_free_notification(noti); -    } else { -        /* Case when the application is not launched by the push service */ -    } -    if (op) -        free(op); + char *op = NULL; + push_service_notification_h noti = NULL; + int ret; + + if (app_control_get_operation(app_control, &op) < 0) + return; + + /* Retrieve the noti from the bundle */ + ret = push_service_app_control_to_notification(app_control, op, &noti); + + if (noti) { + /* Handle the noti */ + + /* Free the noti */ + push_service_free_notification(noti); + } else { + /* Case when the application is not launched by the push service */ + } + if (op) + free(op); }

      Since Tizen 3.0, the push service provides launch types when the application is launched by the service. Use the following code to figure out why the application is launched, as the app_control() function is invoked in both cases of receiving notification and changing registration state.

      -#define EXTRA_DATA_FROM_REGISTRATION_CHANGE "registration_change"
-#define EXTRA_DATA_FROM_NOTIFICATION "notification"
+#define EXTRA_DATA_FROM_REGISTRATION_CHANGE "registration_change"
+#define EXTRA_DATA_FROM_NOTIFICATION "notification"
 
 static void
 app_control(app_control_h app_control, void *data)
 {
-    char *value = NULL;
-    app_control_get_extra_data(app_control, APP_CONTROL_DATA_PUSH_LAUNCH_TYPE,
-                               &value);
-    if (value) {
-        if (!strcmp(value, EXTRA_DATA_FROM_NOTIFICATION))
-            /* Add your code here when push messages arrive */
-        else if (!strcmp(value, EXTRA_DATA_FROM_REGISTRATION_CHANGE))
-            /* Add your code here when registration state is changed */
-    }
+    char *value = NULL;
+    app_control_get_extra_data(app_control, APP_CONTROL_DATA_PUSH_LAUNCH_TYPE,
+                               &value);
+    if (value) {
+        if (!strcmp(value, EXTRA_DATA_FROM_NOTIFICATION))
+            /* Add your code here when push messages arrive */
+        else if (!strcmp(value, EXTRA_DATA_FROM_REGISTRATION_CHANGE))
+            /* Add your code here when registration state is changed */
+    }
 }
      @@ -698,10 +698,10 @@ app_control(app_control_h app_control, void *data)

      You can request for unread notifications from the push service. The request can be performed after the connection to the push server when the application is launched.

       if (push_conn) {
-    int ret = push_service_request_unread_notification(push_conn);
-    if (ret != PUSH_SERVICE_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "ERROR: push_service_request_unread_notification() failed.");
+    int ret = push_service_request_unread_notification(push_conn);
+    if (ret != PUSH_SERVICE_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "ERROR: push_service_request_unread_notification() failed.");
 }

      The difference between the ALERT and SILENT actions is that the former shows an alert message in the quick panel and changes the badge count, while the latter does not. If the user clicks the alert message in the quick panel, the push service forcibly launches the application and delivers the notification through the app control callback function.

      @@ -720,11 +720,11 @@ if (push_conn) { push_service_notification_h noti; int ret; do { -    ret = push_service_get_unread_notification(push_conn, &noti); + ret = push_service_get_unread_notification(push_conn, &noti); -    /* Process the unread message noti */ + /* Process the unread message noti */ -    push_server_free_notification(&noti); + push_server_free_notification(&noti); } while (1); diff --git a/org.tizen.guides/html/native/messaging/push_server_n.htm b/org.tizen.guides/html/native/messaging/push_server_n.htm index 3033dfb..c80a6ca 100644 --- a/org.tizen.guides/html/native/messaging/push_server_n.htm +++ b/org.tizen.guides/html/native/messaging/push_server_n.htm @@ -30,7 +30,7 @@
    3. Sending Push Notifications
    4. Decorating Push Notifications
    5. Handling Error Codes
      6. - +

      Related Info

      • Push API for Mobile Native
        • @@ -139,31 +139,31 @@
      • Determine the type of push notification. -

        Since Tizen 3.0, you can determine the notification type. You can send a notification either to notify a user about urgent information or to deliver data to the application for update:

        +

        Since Tizen 3.0, you can determine the notification type. You can send a notification either to notify a user about urgent information or to deliver data to the application for update:

        • If you have an urgent message or data for the user, fill the message field with a proper action value: 
           {
-    "messages":
-    [{
-        ...
-        "message": "action=ALERT&badgeOption=INCREASE&badgeNumber=1&alertMessage=Hi",
-        "appData": "{id:asdf&passwd:1234}",
-        ...
-    ]}
+    "messages":
+    [{
+        ...
+        "message": "action=ALERT&badgeOption=INCREASE&badgeNumber=1&alertMessage=Hi",
+        "appData": "{id:asdf&passwd:1234}",
+        ...
+    ]}
 }
        • If you have data to send to the application but no need to notify the user, use the action field on the same level as the message field, instead of within the message field, and do not include the message field itself. In this case, the notification is delivered with the best effort. 
           {
-    "messages":
-    [{
-        ...
-        "action": "backgroundLaunch",
-        "appData": "{id:asdf&passwd:1234}",
-        ...
-    ]}
+    "messages":
+    [{
+        ...
+        "action": "backgroundLaunch",
+        "appData": "{id:asdf&passwd:1234}",
+        ...
+    ]}
 }
        @@ -210,13 +210,13 @@ -

        For example, to show a "Hi" message in the quick panel and increase the badge count by 1 when the notification arrives at the device, the message field of the notification must be the following:

        +

        For example, to show a "Hi" message in the quick panel and increase the badge count by 1 when the notification arrives at the device, the message field of the notification must be the following:

        -"badgeOption=INCREASE&badgeNumber=1&action=ALERT&alertMessage=Hi"
+"badgeOption=INCREASE&badgeNumber=1&action=ALERT&alertMessage=Hi"
        -

        The message field takes effect only when the application is not running (more precisely, when the application is not connected to the push service). If a notification with the above message field arrives at the device where the application is running, the push service delivers the notification directly to the application. It does not show the "Hi" message in the quick panel or increase the badge count.

        +

        The message field takes effect only when the application is not running (more precisely, when the application is not connected to the push service). If a notification with the above message field arrives at the device where the application is running, the push service delivers the notification directly to the application. It does not show the "Hi" message in the quick panel or increase the badge count.

        Since Tizen 3.0, the BACKGROUNDLAUNCH option is supported. When you send a notification to the device with the BACKGROUNDLAUNCH action value, the push service launches the application in the background (if it is not already running), and delivers the appData field to the application. The user cannot see that a notification is received, but they find out when they use the application the next time.

        @@ -236,12 +236,12 @@
      • Method: POST
      • Data: JSON
      • Description: Request a notification push from the push server to the push service
        • -
      • Note: The total request message body must be less than the system default value, 200 kb. If not, "3034 – error of too long chuned message data" is returned. The system default value can be changed as needed.
        • +
      • Note: The total request message body must be less than the system default value, 200 kb. If not, "3034 – error of too long chuned message data" is returned. The system default value can be changed as needed.
      • Header

        There are 2 required fields: appID and appSecret.

        -

        The fields are given when you register the application, and they are used for application authentication. If either is missing, the push server rejects the request and returns "3046 – error of application authentication" error. Put these 2 parameters on the request header.

        +

        The fields are given when you register the application, and they are used for application authentication. If either is missing, the push server rejects the request and returns "3046 – error of application authentication" error. Put these 2 parameters on the request header.

      • Arguments @@ -257,7 +257,7 @@ encoding Encoding defines how the regId is encoded.

        For most cases, the push server issues the regId as a hex string by default, but if third-party providers state that they use the base64 encoding for the regId at the application registration time, the regId is base64-encoded.

        -

        If the regId is base64-encoded, use the "base64" value for this field. Otherwise, leave this field blank to allow the push server to handle the regId as a hex string.

        +

        If the regId is base64-encoded, use the "base64" value for this field. Otherwise, leave this field blank to allow the push server to handle the regId as a hex string.

        • Optional
        • Type: string
        • Default: NULL
        @@ -295,7 +295,7 @@ action

        (since Tizen 3.0)

        - This message is delivered along with another urgent message, when the action value is "backgroundLaunch" and message field is NULL. + This message is delivered along with another urgent message, when the action value is "backgroundLaunch" and message field is NULL.
        • Optional
        • Type: string
          • @@ -373,16 +373,16 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
        • Example request: 
           {
-    "encoding": "base64" /* Optional */
-    "regID": "ab123456",
-    "requestID": "0000001",
-    "sender": "oscal", /* Optional */
-    "type": 0 /* Optional */
-    "message": "badgeOption=INCREASE&badgeNumber=1&action=ALERT
-                &alertMessage=Hi", /* Optional */
-    "appData": "{id:asdf&passwd:1234}", /* Optional, (Opaque) */
-    "sessionInfo": "002002", /* Optional */
-    "timeStamp": 1234567890, /* Optional */
+    "encoding": "base64" /* Optional */
+    "regID": "ab123456",
+    "requestID": "0000001",
+    "sender": "oscal", /* Optional */
+    "type": 0 /* Optional */
+    "message": "badgeOption=INCREASE&badgeNumber=1&action=ALERT
+                &alertMessage=Hi", /* Optional */
+    "appData": "{id:asdf&passwd:1234}", /* Optional, (Opaque) */
+    "sessionInfo": "002002", /* Optional */
+    "timeStamp": 1234567890, /* Optional */
 }
          • @@ -395,13 +395,13 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when the request is successful:

           {
-    "results":
-    [{
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }]
+    "results":
+    [{
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }]
 }
          @@ -409,13 +409,13 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when the request fails due to malformation:

           {
-    "results":
-    [{
-        "regID": "",
-        "requestID": "",
-        "statusCode": 3023,
-        "statusMsg": "error of json mapping exception"
-    }]
+    "results":
+    [{
+        "regID": "",
+        "requestID": "",
+        "statusCode": 3023,
+        "statusMsg": "error of json mapping exception"
+    }]
 }
          @@ -423,13 +423,13 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when the request fails due to abnormal data:

           {
-    "results":
-    [{
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "statusCode": 3008,
-        "statusMsg": "error of not registered regID"
-    }]
+    "results":
+    [{
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "statusCode": 3008,
+        "statusMsg": "error of not registered regID"
+    }]
 }
          @@ -452,7 +452,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
        • Data: JSON
        • Description: Request a notification push from the push server to the push service
        • Argument: See the single request
          • -
        • Note: The total request message body must be less than the system default value, 200 kb. If not, "3034 – error of too long chuned message data" is returned. The system default value can be changed as needed.
          • +
        • Note: The total request message body must be less than the system default value, 200 kb. If not, "3034 – error of too long chuned message data" is returned. The system default value can be changed as needed.
        • Example header: 
           appID: 1234567890987654
@@ -462,31 +462,31 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
 
        • Example request:
 
           {
-    "messages":
-    [{
-        "encoding": "base64" /* Optional */
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "sender": "oscal", /* Optional */
-        "type": 0 /* Optional */
-        "message": "example", /* Optional */
-        "appData": "{id:asdf&passwd:1234}", /* Optional, (Opaque) */
-        "reliableOption": "Transport", /* Optional */
-        "sessionInfo": "192.168.0.1-8080-12345567", /* Optional */
-        "timeStamp": 1234567890, /* Optional */
-    }
-    {
-        "encoding": "base64" /* Optional */
-        "regID": "ab234567",
-        "requestID": "0000002",
-        "sender": "oscal", /* Optional */
-        "type": 0 /* Optional */
-        "message": "example", /* Optional */
-        "appData": "{id:asdf&passwd:1234}", /* Optional, (Opaque) */
-        "reliableOption": "Transport", /* Optional */
-        "sessionInfo": "192.168.0.1-8080-12345567", /* Optional */
-        "timeStamp": 1234567890, /* Optional */
-    ]}
+    "messages":
+    [{
+        "encoding": "base64" /* Optional */
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "sender": "oscal", /* Optional */
+        "type": 0 /* Optional */
+        "message": "example", /* Optional */
+        "appData": "{id:asdf&passwd:1234}", /* Optional, (Opaque) */
+        "reliableOption": "Transport", /* Optional */
+        "sessionInfo": "192.168.0.1-8080-12345567", /* Optional */
+        "timeStamp": 1234567890, /* Optional */
+    }
+    {
+        "encoding": "base64" /* Optional */
+        "regID": "ab234567",
+        "requestID": "0000002",
+        "sender": "oscal", /* Optional */
+        "type": 0 /* Optional */
+        "message": "example", /* Optional */
+        "appData": "{id:asdf&passwd:1234}", /* Optional, (Opaque) */
+        "reliableOption": "Transport", /* Optional */
+        "sessionInfo": "192.168.0.1-8080-12345567", /* Optional */
+        "timeStamp": 1234567890, /* Optional */
+    ]}
 }
 
          
 
          • 
@@ -497,19 +497,19 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
 
          The following example shows a response message when the request is successful:
          
 
           {
-    "results":
-    [{
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }
-    {
-        "regID": "ab234567",
-        "requestID": "0000002",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }]
+    "results":
+    [{
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }
+    {
+        "regID": "ab234567",
+        "requestID": "0000002",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }]
 }
          • @@ -517,13 +517,13 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when the request fails due to malformation:

           {
-    "results":
-    [{
-        "regID": "",
-        "requestID": "",
-        "statusCode": 3023,
-        "statusMsg": "error of json mapping exception"
-    }]
+    "results":
+    [{
+        "regID": "",
+        "requestID": "",
+        "statusCode": 3023,
+        "statusMsg": "error of json mapping exception"
+    }]
 }
          @@ -531,18 +531,18 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when some parts of the multiple request have failed and the others have not:

           {
-    "results":
-    [{
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }
-    {
-        "regID": "ab234567",
-        "requestID": "0000002",
-        "statusCode": 3008,
-        "statusMsg": "error of not registered regID"+   }]
+    "results":
+    [{
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }
+    {
+        "regID": "ab234567",
+        "requestID": "0000002",
+        "statusCode": 3008,
+        "statusMsg": "error of not registered regID"+   }]
 }
          @@ -560,7 +560,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
        • Data: JSON
        • Description: Request a notification push from the push server to the push service
        • Argument: See the single request
          • -
        • Note: The total request message body must be less than the system default value, 200 kb. If not, "3034 – error of too long chuned message data" is returned. The system default value can be changed as needed.
          • +
        • Note: The total request message body must be less than the system default value, 200 kb. If not, "3034 – error of too long chuned message data" is returned. The system default value can be changed as needed.
        • Example header: 
           appID: 1234567890987654
@@ -570,18 +570,18 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
 
        • Example request:
 
           {
-    "messages":
-    [{
-        "encoding": "base64" /* Optional */
-        "regID": ["ab123456", "ab234567", "ab345678"]
-        "requestID": "0000001",
-        "sender": "oscal", /* Optional */
-        "type": 0 /* Optional */
-        "message": "example", /* Optional */
-        "appData": "{id:asdf&passwd:1234}", /* Optional */
-        "sessionInfo": "192.168.0.1-8080-12345567", /* Optional */
-        "timeStamp": 1234567890, /* Optional */
-    ]}
+    "messages":
+    [{
+        "encoding": "base64" /* Optional */
+        "regID": ["ab123456", "ab234567", "ab345678"]
+        "requestID": "0000001",
+        "sender": "oscal", /* Optional */
+        "type": 0 /* Optional */
+        "message": "example", /* Optional */
+        "appData": "{id:asdf&passwd:1234}", /* Optional */
+        "sessionInfo": "192.168.0.1-8080-12345567", /* Optional */
+        "timeStamp": 1234567890, /* Optional */
+    ]}
 }
 
          
 
          • 
@@ -592,25 +592,25 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=
 
          The following example shows a response message when the request is successful:
          
 
           {
-    "results":
-    [{
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }
-    {
-        "regID": "ab234567",
-        "requestID": "0000002",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }
-    {
-        "regID": "ab345678",
-        "requestID": "0000002",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }]
+    "results":
+    [{
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }
+    {
+        "regID": "ab234567",
+        "requestID": "0000002",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }
+    {
+        "regID": "ab345678",
+        "requestID": "0000002",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }]
 }
          • @@ -618,13 +618,13 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when the request fails due to malformation:

           {
-    "results":
-    [{
-        "regID": "",
-        "requestID": "",
-        "statusCode": 3023,
-        "statusMsg": "error of json mapping exception"
-    }]
+    "results":
+    [{
+        "regID": "",
+        "requestID": "",
+        "statusCode": 3023,
+        "statusMsg": "error of json mapping exception"
+    }]
 }
          @@ -632,25 +632,25 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows a response message when some parts of the multicast request have failed and the others have not:

           {
-    "results":
-    [{
-        "regID": "ab123456",
-        "requestID": "0000001",
-        "statusCode": 1000,
-        "statusMsg": "Success"
-    }
-    {
-        "regID": "ab234567",
-        "requestID": "0000001",
-        "statusCode": 3008,
-        "statusMsg": "error of not registered regID"
-    }
-    {
-        "regID": "ab345678",
-        "requestID": "0000001",
-        "statusCode": 3013,
-        "statusMsg": "error of impossible to enqueue"
-    }]
+    "results":
+    [{
+        "regID": "ab123456",
+        "requestID": "0000001",
+        "statusCode": 1000,
+        "statusMsg": "Success"
+    }
+    {
+        "regID": "ab234567",
+        "requestID": "0000001",
+        "statusCode": 3008,
+        "statusMsg": "error of not registered regID"
+    }
+    {
+        "regID": "ab345678",
+        "requestID": "0000001",
+        "statusCode": 3013,
+        "statusMsg": "error of impossible to enqueue"
+    }]
 }
          @@ -666,7 +666,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          Decorating Push Notifications

          Since Tizen 3.0, you can decorate push notifications you send from the application server to Tizen devices. For example, you can add images and sounds to the notifications. The push service creates a notification using the resources from the application and notifies the user. You can compose the push message using a set of REST APIs.

          To decorate push notifications, you have to understand the notification functions. In addition to the existing message field, more fields are provided. For more details about the functions to use to create a notification, see the Notification API (in mobile and wearable applications). When you include a key and value in the message field, the push service creates a notification as the application creates a notification using the Notification API.

          -

          Prepare all the resource files under the /shared/res folder in your application, and you can directly address the resource files. For example, imageTypeIcon=image.png means that the /share/res/image.png image is displayed as an icon in the notification panel. You can perform the same action by calling the notification_set_image(noti, NOTIFICATION_IMAGE_TYPE_ICON, "image.png") function.

          +

          Prepare all the resource files under the /shared/res folder in your application, and you can directly address the resource files. For example, imageTypeIcon=image.png means that the /share/res/image.png image is displayed as an icon in the notification panel. You can perform the same action by calling the notification_set_image(noti, NOTIFICATION_IMAGE_TYPE_ICON, "image.png") function.

          The following table lists the additional key and value pairs for the message field in notifications.

          Table: Additional message field key and value pairs for notification

          @@ -682,153 +682,153 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc= imageTypeIcon Image file path

          (for example, image.png)

          notification_set_image() - (noti, NOTIFICATION_IMAGE_TYPE_ICON, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_ICON, "image.png") imageTypeIconForIndicator - (noti, NOTIFICATION_IMAGE_TYPE_ICON_FOR_INDICATOR, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_ICON_FOR_INDICATOR, "image.png") imageTypeIconForLock - (noti, NOTIFICATION_IMAGE_TYPE_ICON_FOR_LOCK , "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_ICON_FOR_LOCK , "image.png") imageTypeThumbnail - (noti, NOTIFICATION_IMAGE_TYPE_THUMBNAIL, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_THUMBNAIL, "image.png") imageTypeThumbnailForLock - (noti, NOTIFICATION_IMAGE_TYPE_THUMBNAIL_FOR_LOCK, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_THUMBNAIL_FOR_LOCK, "image.png") imageTypeIconSub - (noti, NOTIFICATION_IMAGE_TYPE_ICON_SUB, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_ICON_SUB, "image.png") imageTypeBackground - (noti, NOTIFICATION_IMAGE_TYPE_BACKGROUND, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BACKGROUND, "image.png") imageTypeList1 - (noti, NOTIFICATION_IMAGE_TYPE_LIST_1, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_LIST_1, "image.png") imageTypeList2 - (noti, NOTIFICATION_IMAGE_TYPE_LIST_2, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_LIST_2, "image.png") imageTypeList3 - (noti, NOTIFICATION_IMAGE_TYPE_LIST_3, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_LIST_3, "image.png") imageTypeList4 - (noti, NOTIFICATION_IMAGE_TYPE_LIST_4, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_LIST_4, "image.png") imageTypeList5 - (noti, NOTIFICATION_IMAGE_TYPE_LIST_5, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_LIST_5, "image.png") imageTypeButton1 - (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_1, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_1, "image.png") imageTypeButton2 - (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_2, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_2, "image.png") imageTypeButton3 - (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_3, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_3, "image.png") imageTypeButton4 - (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_4, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_4, "image.png") imageTypeButton5 - (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_5, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_5, "image.png") imageTypeButton6 - (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_6, "image.png") + (noti, NOTIFICATION_IMAGE_TYPE_BUTTON_6, "image.png") textTypeTitle Text message notification_set_text() - (noti, NOTIFICATION_TEXT_TYPE_TITLE, "text") + (noti, NOTIFICATION_TEXT_TYPE_TITLE, "text") textTypeContent - (noti, NOTIFICATION_TEXT_TYPE_CONTENT, "text") + (noti, NOTIFICATION_TEXT_TYPE_CONTENT, "text") textTypeContentForDisplayOptionIsOff - (noti, NOTIFICATION_TEXT_TYPE_CONTENT_FOR_DISPLAY_OPTION_IS_OFF, "text") + (noti, NOTIFICATION_TEXT_TYPE_CONTENT_FOR_DISPLAY_OPTION_IS_OFF, "text") textTypeEventCount - (noti, NOTIFICATION_TEXT_TYPE_EVENT_COUNT, "text") + (noti, NOTIFICATION_TEXT_TYPE_EVENT_COUNT, "text") textTypeInfo1 - (noti, NOTIFICATION_TEXT_TYPE_INFO_1, "text") + (noti, NOTIFICATION_TEXT_TYPE_INFO_1, "text") textTypeInfoSub1 - (noti, NOTIFICATION_TEXT_TYPE_INFO_SUB_1, "text") + (noti, NOTIFICATION_TEXT_TYPE_INFO_SUB_1, "text") textTypeInfo2 - (noti, NOTIFICATION_TEXT_TYPE_INFO_2, "text") + (noti, NOTIFICATION_TEXT_TYPE_INFO_2, "text") textTypeInfoSub2 - (noti, NOTIFICATION_TEXT_TYPE_INFO_SUB_2, "text") + (noti, NOTIFICATION_TEXT_TYPE_INFO_SUB_2, "text") textTypeInfo3 - (noti, NOTIFICATION_TEXT_TYPE_INFO_3, "text") + (noti, NOTIFICATION_TEXT_TYPE_INFO_3, "text") textTypeInfoSub3 - (noti, NOTIFICATION_TEXT_TYPE_INFO_SUB_3, "text") + (noti, NOTIFICATION_TEXT_TYPE_INFO_SUB_3, "text") textTypeGroupTitle - (noti, NOTIFICATION_TEXT_TYPE_GROUP_TITLE, "text") + (noti, NOTIFICATION_TEXT_TYPE_GROUP_TITLE, "text") textTypeGroupContent - (noti, NOTIFICATION_TEXT_TYPE_GROUP_CONTENT, "text") + (noti, NOTIFICATION_TEXT_TYPE_GROUP_CONTENT, "text") textTypeGroupContentForDisplayOptionIsOff - (noti, NOTIFICATION_TEXT_TYPE_GROUP_CONTENT_FOR_DISPLAY_OPTION_IS_OFF, "text") + (noti, NOTIFICATION_TEXT_TYPE_GROUP_CONTENT_FOR_DISPLAY_OPTION_IS_OFF, "text") textTypeButton1 - (noti, NOTIFICATION_TEXT_TYPE_BUTTON_1, "text") + (noti, NOTIFICATION_TEXT_TYPE_BUTTON_1, "text") textTypeButton2 - (noti, NOTIFICATION_TEXT_TYPE_BUTTON_2, "text") + (noti, NOTIFICATION_TEXT_TYPE_BUTTON_2, "text") textTypeButton3 - (noti, NOTIFICATION_TEXT_TYPE_BUTTON_3, "text") + (noti, NOTIFICATION_TEXT_TYPE_BUTTON_3, "text") textTypeButton4 - (noti, NOTIFICATION_TEXT_TYPE_BUTTON_4, "text") + (noti, NOTIFICATION_TEXT_TYPE_BUTTON_4, "text") textTypeButton5 - (noti, NOTIFICATION_TEXT_TYPE_BUTTON_5, "text") + (noti, NOTIFICATION_TEXT_TYPE_BUTTON_5, "text") textTypeButton6 - (noti, NOTIFICATION_TEXT_TYPE_BUTTON_6, "text") + (noti, NOTIFICATION_TEXT_TYPE_BUTTON_6, "text") soundTypeNone @@ -839,7 +839,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc= soundTypeUserData Sound file path - (noti, NOTIFICATION_SOUND_TYPE_USER_DATA, "sound_path") + (noti, NOTIFICATION_SOUND_TYPE_USER_DATA, "sound_path") vibrationTypeNone @@ -850,7 +850,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc= vibrationTypeUserData Vibration file path - (noti, NOTIFICATION_VIBRATION_TYPE_USER_DATA, "vib_path") + (noti, NOTIFICATION_VIBRATION_TYPE_USER_DATA, "vib_path") ledOpOn @@ -951,7 +951,7 @@ appSecret: dYo/o/m11gmWmjs7+5f+2zLNVOc=

          The following example shows the message field for an active notification with 3 buttons:

          -"message":"setAutoRemove=true&
+"message":"setAutoRemove=true&
 textTypeButton1=Connect&textTypeButton2=Hold&textTypeButton3=Cancel&
 eventTypeClickOnButton1=test,connect& eventTypeClickOnButton2=test,hold&
 eventTypeClickOnButton3=test,cancel& eventTypeClickOnIcon=test,icon&
@@ -961,39 +961,39 @@ imageTypeIcon=icon.png&imageTypeIconForIndicator=indicator.png&imageType
 imageTypeIconSub=sub.png &imageTypeBackground=background.png& soundTypeUserData=test.wav&
 setDisplayApplist=notificationTray|ticker|lock|indicator|active|all&lyNotiEventSingle=true&
 textTypeContentForDisplayOptionIsOff=contentoptionoff& textTypeEventCount=34&textTypeInfo1=Test
-notification&setTime=true&setTimeToText=true"
+notification&setTime=true&setTimeToText=true"

          The following figure shows a decorated push notification.

          -

          Figure: Decorated notification

          +

          Figure: Decorated notification

          Decorated notification

          If the user presses any of the 3 buttons, the app_control() callback of your application is called. Use the following code for further actions:

          -#define KEY_FROM_ACTIVE_NOTICATION "test"
+#define KEY_FROM_ACTIVE_NOTICATION "test"
 
 static void
 app_control(app_control_h app_control, void *data)
 {
-    char *value = NULL;
-    app_control_get_extra_data(app_control, KEY_FROM_ACTIVE_NOTICATION, &value);
-    if (value) {
-        if (!strcmp(value, "connect"))
-            /* Add code here to react to Connect button press */
-        else if (!strcmp(value, "hold"))
-            /* Add code here to react to Hold button press */
-        else if (!strcmp(value, "cancel"))
-            /* Add code here to react to Cancel button press */
-    }
-    app_control_get_extra_data(app_control, APP_CONTROL_DATA_PUSH_LAUNCH_TYPE, &value);
-    if (value) {
-        if (!strcmp(value, EXTRA_DATA_FROM_NOTIFICATION))
-            /* Add code here to react to arriving push messages */
-        else if (!strcmp(value, EXTRA_DATA_FROM_REGISTRATION_CHANGE))
-            /* Add code here to react to registration state changes */
-    }
-    /* Add code here to react to registration state changes */
+    char *value = NULL;
+    app_control_get_extra_data(app_control, KEY_FROM_ACTIVE_NOTICATION, &value);
+    if (value) {
+        if (!strcmp(value, "connect"))
+            /* Add code here to react to Connect button press */
+        else if (!strcmp(value, "hold"))
+            /* Add code here to react to Hold button press */
+        else if (!strcmp(value, "cancel"))
+            /* Add code here to react to Cancel button press */
+    }
+    app_control_get_extra_data(app_control, APP_CONTROL_DATA_PUSH_LAUNCH_TYPE, &value);
+    if (value) {
+        if (!strcmp(value, EXTRA_DATA_FROM_NOTIFICATION))
+            /* Add code here to react to arriving push messages */
+        else if (!strcmp(value, EXTRA_DATA_FROM_REGISTRATION_CHANGE))
+            /* Add code here to react to registration state changes */
+    }
+    /* Add code here to react to registration state changes */
 }

          Since Tizen 3.0, you can use a notification template to reuse well-decorated notification content without having to define it from scratch each time. When you want to use the same notification multiple times, you can make and save a template for it. Use the notification_save_as_template() function to save the notification handle. For more information on the function, see the Notification API (in mobile and wearable applications).

          @@ -1015,7 +1015,7 @@ app_control(app_control_h app_control, void *data)

          The following example shows how to use the template key in the message field:

          -"message":"template=noti_template"
+"message":"template=noti_template"

          Handling Error Codes

          diff --git a/org.tizen.guides/html/native/migration_guide_n.htm b/org.tizen.guides/html/native/migration_guide_n.htm index ed3282c..64bcbd9 100644 --- a/org.tizen.guides/html/native/migration_guide_n.htm +++ b/org.tizen.guides/html/native/migration_guide_n.htm @@ -5,20 +5,20 @@ - + - Migration Guide from 2.3 to 2.4 - + Migration Guide from 2.3 to 2.4 + - +

          Mobile native Wearable native

          - +

          Dependencies

          -
          +
          -

          Migration Guide from 2.3 to 2.4

          - +

          Migration Guide from 2.3 to 2.4

          +

          Tizen 2.4 introduces new APIs for applications and modifies the behavior of some APIs to improve the quality of the platform. The following sections define the issues you must consider to make your application conform to Tizen 2.4 Application Framework APIs.

          New Background Application Policy

          Since Tizen 2.4, the application on the background goes into a suspended state.

          In the suspended state, the application process is executed with limited CPU resources. In other words, the platform does not allow the running of the background applications, except for some exceptional applications (such as Media and Download) that necessarily work on the background. In this case, the application can designate their background category as an allowed category to avoid going into the suspended state.

          -

          For more information, and a list of background categories that allow the application to run on the background, see Background Categories.

          - +

          For more information, and a list of background categories that allow the application to run on the background, see Background Categories.

          +

          You can receive an event when the background application goes to the suspended state. Pass APP_EVENT_SUSPENDED_STATE_CHANGED as event_type to the ui_app_add_event_handler() or service_app_add_event_handler() function to handle the suspended event. You must release the resources properly when your application goes to the suspended state.

          - - + +

          Changes in the Alarm API for Reducing Power Consumption

          Since Tizen 2.4, the Alarm API is changed to reduce the power consumption of the device:

          @@ -83,7 +83,7 @@

        For more information, see Managing Application Groups.

        - + diff --git a/org.tizen.guides/html/native/notification/attach_panel_n.htm b/org.tizen.guides/html/native/notification/attach_panel_n.htm index 057837e..3d7dc7c 100644 --- a/org.tizen.guides/html/native/notification/attach_panel_n.htm +++ b/org.tizen.guides/html/native/notification/attach_panel_n.htm @@ -5,20 +5,20 @@ - + - Attach Panel - + Attach Panel + - +

        Mobile native

        - +

        Dependencies

          @@ -39,8 +39,8 @@
        -

        Attach Panel

        - +

        Attach Panel

        +

        The attach panel allows the device user to attach various content into an application that contains an attach panel. The user can attach images, take pictures, record voice, and select files on the attach panel.

        This feature is supported in mobile applications only.

        @@ -56,7 +56,7 @@

        Figure: Attach panel

        Attach panel

        -

        The attach panel has UI components and it manages user interactions on its interface. The layout component keeps on the tabbar and scroller components, which are connected to show the content synchronously. The scroller component has pages to display the content of, for example, images, camera, and voice recorder. Some content is shown as a page on the panel, while others can be launched from the panel's More tab using application controls.

        +

        The attach panel has UI components and it manages user interactions on its interface. The layout component keeps on the tabbar and scroller components, which are connected to show the content synchronously. The scroller component has pages to display the content of, for example, images, camera, and voice recorder. Some content is shown as a page on the panel, while others can be launched from the panel's More tab using application controls.

        The attach panel has half and full modes. The mode can be changed by swiping up and down the page.

        Figure: Attach panel modes

        @@ -76,7 +76,7 @@
      • Voice

        You can attach a voice recording.

        • -
      • More tab +
      • More tab

        The More tab shows the icons of the applications, for example, video, audio, calendar, contact, myfiles, and video recorder, that can be launched by clicking the applicable icon.

      @@ -94,14 +94,14 @@

      To use the Attach panel API, the application has to request permission by adding the following privileges to the tizen-manifest.xml file:

       <privileges>
-   <!--To add the image viewer and camera UI gadget in the attach panel-->
-   <privilege>http://tizen.org/privilege/mediastorage</privilege>
-   <!--To add the camera UI gadget in the attach panel-->
-   <privilege>http://tizen.org/privilege/camera</privilege>
-   <!--To add the voice recorder UI gadget in the attach panel-->
-   <privilege>http://tizen.org/privilege/recorder</privilege>
-   <!--To launch apps from the More tab-->
-   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
+   <!--To add the image viewer and camera UI gadget in the attach panel-->
+   <privilege>http://tizen.org/privilege/mediastorage</privilege>
+   <!--To add the camera UI gadget in the attach panel-->
+   <privilege>http://tizen.org/privilege/camera</privilege>
+   <!--To add the voice recorder UI gadget in the attach panel-->
+   <privilege>http://tizen.org/privilege/recorder</privilege>
+   <!--To launch apps from the More tab-->
+   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
 </privileges>
      @@ -116,45 +116,45 @@

      To create and manage an attach panel, you must create variables for a conformant and the attach panel.

       static struct {
-    Evas_Object *conformant;
-    attach_panel_h attach_panel;
+    Evas_Object *conformant;
+    attach_panel_h attach_panel;
 } s_info =
 {
-    .conformant = NULL,
-    .attach_panel = NULL,
+    .conformant = NULL,
+    .attach_panel = NULL,
 };
 
 static void
 _create_conformant(Evas_Object *win)
 {
-    Evas_Object *conformant = NULL;
-    conformant = elm_conformant_add(win);
-    evas_object_size_hint_weight_set(conformant, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-    elm_win_resize_object_add(win, conformant);
-    elm_win_conformant_set(win, EINA_TRUE);
-    evas_object_show(conformant);
-
-    s_info.conformant = conformant;
+    Evas_Object *conformant = NULL;
+    conformant = elm_conformant_add(win);
+    evas_object_size_hint_weight_set(conformant, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+    elm_win_resize_object_add(win, conformant);
+    elm_win_conformant_set(win, EINA_TRUE);
+    evas_object_show(conformant);
+
+    s_info.conformant = conformant;
 }

    Creating an Attach Panel

    - +

    To create an attach panel:

    1. Create the attach panel using the attach_panel_create() function.

      When the attach panel is created, its state is hidden by default. To show the created panel, use the attach_panel_show() function.

      - + 
       attach_panel_h attach_panel = NULL;
 int ret = ATTACH_PANEL_ERROR_NONE;
 
 ret = attach_panel_create(s_info.conformant, &attach_panel);
 if (ret != ATTACH_PANEL_ERROR_NONE || !attach_panel)
-    /* Error handling */
+    /* Error handling */
 attach_panel_show(attach_panel);
 s_info.attach_panel = attach_panel;
      @@ -168,28 +168,28 @@ bundle *extra_data = NULL; extra_data = bundle_create(); if (!extra_data) -    /* Error handling */ + /* Error handling */ -bundle_add_str(extra_data, http://tizen.org/appcontrol/data/total_count, "3"); +bundle_add_str(extra_data, http://tizen.org/appcontrol/data/total_count, "3"); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_IMAGE, extra_data); + ATTACH_PANEL_CONTENT_CATEGORY_IMAGE, extra_data); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_CAMERA, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_CAMERA, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_VOICE, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_VOICE, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_VIDEO, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_VIDEO, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_AUDIO, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_AUDIO, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_CALENDAR, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_CALENDAR, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_CONTACT, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_CONTACT, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_MYFILES, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_MYFILES, NULL); attach_panel_add_content_category(s_info.attach_panel, -                                  ATTACH_PANEL_CONTENT_CATEGORY_VIDEO_RECORDER, NULL); + ATTACH_PANEL_CONTENT_CATEGORY_VIDEO_RECORDER, NULL); attach_panel_show(s_info.attach_panel); bundle_free(extra_data); @@ -203,55 +203,55 @@ bundle_free(extra_data); 
       static void
 _result_cb(attach_panel_h attach_panel,
-           attach_panel_content_category_e content_category,
-           app_control_h result, app_control_result_e result_code,
-           void *data)                                 
+           attach_panel_content_category_e content_category,
+           app_control_h result, app_control_result_e result_code,
+           void *data)
 {
-    char **select = NULL;
-    int i = 0;
-    int length = 0;
-    int ret = APP_CONTROL_ERROR_NONE;
-    if (!result)
-        /* Error handling */
-    if (APP_CONTROL_RESULT_SUCCEEDED != result_code)
-        /* Error handling */
-    ret = app_control_get_extra_data_array(result,
-                                           "http://tizen.org/appcontrol/data/selected",
-                                           &select, &length);
-    if (APP_CONTROL_ERROR_NONE != ret || !select)
-        /* Error handling */
-
-    for (; i < length; i++) {
-        printf("path is %s, %d\n", select[i], length);
-        free(select[i]);
-    }
-    free(select);
+    char **select = NULL;
+    int i = 0;
+    int length = 0;
+    int ret = APP_CONTROL_ERROR_NONE;
+    if (!result)
+        /* Error handling */
+    if (APP_CONTROL_RESULT_SUCCEEDED != result_code)
+        /* Error handling */
+    ret = app_control_get_extra_data_array(result,
+                                           "http://tizen.org/appcontrol/data/selected",
+                                           &select, &length);
+    if (APP_CONTROL_ERROR_NONE != ret || !select)
+        /* Error handling */
+
+    for (; i < length; i++) {
+        printf("path is %s, %d\n", select[i], length);
+        free(select[i]);
+    }
+    free(select);
 }
 
 static void
 _event_cb(attach_panel_h attach_panel, attach_panel_event_e event,
-          void *event_info, void *data)
+          void *event_info, void *data)
 {
-    int ret = 0;
-    if (!)
-        /* Error handling */
-    switch (event) {
-    case ATTACH_PANEL_EVENT_SHOW_START:
-        break;
-    case ATTACH_PANEL_EVENT_SHOW_FINISH:
-        break;
-    case ATTACH_PANEL_EVENT_HIDE_START:
-        break;
-    case ATTACH_PANEL_EVENT_HIDE_FINISH:
-        break;
-    }
+    int ret = 0;
+    if (!)
+        /* Error handling */
+    switch (event) {
+    case ATTACH_PANEL_EVENT_SHOW_START:
+        break;
+    case ATTACH_PANEL_EVENT_SHOW_FINISH:
+        break;
+    case ATTACH_PANEL_EVENT_HIDE_START:
+        break;
+    case ATTACH_PANEL_EVENT_HIDE_FINISH:
+        break;
+    }
 }
 
 static int
 app_control(void *data)
 {
-    attach_panel_set_result_cb(s_info.attach_panel, _result_cb, NULL);
-    attach_panel_set_event_cb(s_info.attach_panel, _event_cb, NULL);
+    attach_panel_set_result_cb(s_info.attach_panel, _result_cb, NULL);
+    attach_panel_set_event_cb(s_info.attach_panel, _event_cb, NULL);
 }
      2. @@ -263,30 +263,30 @@ app_control(void *data) bool visible = false; if (s_info.attach_panel) { -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_IMAGE); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_CAMERA); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_VOICE); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_VIDEO); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_AUDIO); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_CALENDAR); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_CONTACT); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_MYFILES); -    attach_panel_remove_content_category(s_info.attach_panel, -                                         ATTACH_PANEL_CONTENT_CATEGORY_VIDEO_RECORDER); - -    attach_panel_unset_result_cb(s_info.attach_panel); -    attach_panel_unset_event_cb(s_info.attach_panel); - -    attach_panel_destroy(s_info.attach_panel); -    s_info.attach_panel = NULL; + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_IMAGE); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_CAMERA); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_VOICE); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_VIDEO); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_AUDIO); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_CALENDAR); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_CONTACT); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_MYFILES); + attach_panel_remove_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_VIDEO_RECORDER); + + attach_panel_unset_result_cb(s_info.attach_panel); + attach_panel_unset_event_cb(s_info.attach_panel); + + attach_panel_destroy(s_info.attach_panel); + s_info.attach_panel = NULL; } @@ -294,8 +294,8 @@ if (s_info.attach_panel) {

      Managing an Attach Panel

      - - + +

      To manage an attach panel:

        @@ -305,19 +305,19 @@ if (s_info.attach_panel) { static void _reset_bundle(void *data) { -    bundle *extra_data = NULL; -    int ret = APP_CONTROL_ERROR_NONE; - -    extra_data = bundle_create(); -    if (!extra_data) -        /* Error handling */ - -    bundle_add_str(extra_data, http://tizen.org/appcontrol/data/total_count, "5"); -    ret = attach_panel_set_extra_data(s_info.attach_panel, -                                      ATTACH_PANEL_CONTENT_CATEGORY_IMAGE, extra_data); -    if (ATTACH_PANEL_ERROR_NONE != ret) -        /* Error handling */ -    bundle_free(extra_data); + bundle *extra_data = NULL; + int ret = APP_CONTROL_ERROR_NONE; + + extra_data = bundle_create(); + if (!extra_data) + /* Error handling */ + + bundle_add_str(extra_data, http://tizen.org/appcontrol/data/total_count, "5"); + ret = attach_panel_set_extra_data(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_IMAGE, extra_data); + if (ATTACH_PANEL_ERROR_NONE != ret) + /* Error handling */ + bundle_free(extra_data); }
      • To show or hide the attach panel, use the attach_panel_show() and attach_panel_hide() functions: @@ -327,15 +327,15 @@ attach_panel_h attach_panel; int ret = ATTACH_PANEL_ERROR_NONE; if (s_info.attach_panel) { -    attach_panel_hide(s_info.attach_panel); + attach_panel_hide(s_info.attach_panel); } else { -    ret = attach_panel_create(s_info.conformant, &attach_panel); -    if (ret != ATTACH_PANEL_ERROR_NONE || !attach_panel) -        /* Error handling */ -    attach_panel_add_content_category(s_info.attach_panel, -                                      ATTACH_PANEL_CONTENT_CATEGORY_CAMERA, NULL); -    attach_panel_show(attach_panel); -    s_info.attach_panel = attach_panel; + ret = attach_panel_create(s_info.conformant, &attach_panel); + if (ret != ATTACH_PANEL_ERROR_NONE || !attach_panel) + /* Error handling */ + attach_panel_add_content_category(s_info.attach_panel, + ATTACH_PANEL_CONTENT_CATEGORY_CAMERA, NULL); + attach_panel_show(attach_panel); + s_info.attach_panel = attach_panel; }
      • To know whether the attach panel is visible, use the attach_panel_get_visibility() function. It fills the second parameter with a Boolean value that shows whether the panel is visible. @@ -344,11 +344,11 @@ if (s_info.attach_panel) { bool visible = false; if (s_info.attach_panel) { -    attach_panel_get_visibility(s_info.attach_panel, &visible); -    if (visible) -        attach_panel_hide(s_info.attach_panel); -    else -        attach_panel_show(s_info.attach_panel); + attach_panel_get_visibility(s_info.attach_panel, &visible); + if (visible) + attach_panel_hide(s_info.attach_panel); + else + attach_panel_show(s_info.attach_panel); }
      @@ -375,4 +375,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/notification/minicontrol_n.htm b/org.tizen.guides/html/native/notification/minicontrol_n.htm index 32af396..05938fc 100644 --- a/org.tizen.guides/html/native/notification/minicontrol_n.htm +++ b/org.tizen.guides/html/native/notification/minicontrol_n.htm @@ -5,20 +5,20 @@ - + - Minicontrol Window - + Minicontrol Window + - +

      Mobile native

      - +

      Dependencies

        @@ -58,8 +58,8 @@
      -

      Figure: Minicontrol on a quick panel (left) and lock screen (right)

      -

      Minicontrol on a quick panel (left) and lock screen (right) Minicontrol on a quick panel (left) and lock screen (right)

      +

      Figure: Minicontrol on a quick panel (left) and lock screen (right)

      +

      Minicontrol on a quick panel (left) and lock screen (right) Minicontrol on a quick panel (left) and lock screen (right)

      Prerequisites

      @@ -68,7 +68,7 @@
    2. To use the Minicontrol API, the application has to request permission by adding the following privilege to the tizen-manifest.xml file: 
       <privileges>
-   <privilege>http://tizen.org/privilege/minicontrol.provider</privilege>
+   <privilege>http://tizen.org/privilege/minicontrol.provider</privilege>
 </privileges>
      3. @@ -90,8 +90,8 @@ 
       Evas_Object *win;
 
-win = minicontrol_create_window("mini-sample",
-                                MINICONTROL_TARGET_VIEWER_QUICK_PANEL, NULL);
+win = minicontrol_create_window("mini-sample",
+                                MINICONTROL_TARGET_VIEWER_QUICK_PANEL, NULL);
 evas_object_resize(win, 480, 140);
 evas_object_show(win);
      @@ -101,7 +101,7 @@ evas_object_show(win); 
       label = elm_label_add(win);
-elm_object_text_set(label, "mini-sample");
+elm_object_text_set(label, "mini-sample");
 evas_object_resize(label, 480, 140);
 evas_object_show(label);
      @@ -115,7 +115,7 @@ evas_object_show(label); 
       button = elm_button_add(win);
-elm_object_text_set(button, "Click to hide.");
+elm_object_text_set(button, "Click to hide.");
 evas_object_move(button, 0, 50);
 evas_object_resize(button, 200, 50);
 evas_object_show(button);
@@ -124,7 +124,7 @@ evas_object_show(button);
 
      Add an event handler callback function:
      
 
 
      -evas_object_smart_callback_add(button, "clicked", _button_clicked_cb, win);
+evas_object_smart_callback_add(button, "clicked", _button_clicked_cb, win);
 
      
 
    3. 
 
      Define the callback function for hiding the quick panel:
      
@@ -133,13 +133,13 @@ evas_object_smart_callback_add(button, "clicked", _button_clicked_cb,
 static void
 _button_clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    Evas_Object *win = data;
-    minicontrol_send_event(win, MINICONTROL_PROVIDER_EVENT_REQUEST_HIDE, NULL);
+    Evas_Object *win = data;
+    minicontrol_send_event(win, MINICONTROL_PROVIDER_EVENT_REQUEST_HIDE, NULL);
 }
    -

    Figure: Minicontrol button for hiding the quick panel

    +

    Figure: Minicontrol button for hiding the quick panel

    Minicontrol button for hiding the quick panel

    @@ -164,4 +164,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + \ No newline at end of file diff --git a/org.tizen.guides/html/native/notification/noti_n.htm b/org.tizen.guides/html/native/notification/noti_n.htm index 61a2f3f..cc87236 100644 --- a/org.tizen.guides/html/native/notification/noti_n.htm +++ b/org.tizen.guides/html/native/notification/noti_n.htm @@ -5,7 +5,7 @@ - + @@ -61,7 +61,7 @@

    Notifications

    An application can use notifications to keep the user informed of important information.

    - +

    The main features of the Notification API include:

    -

    Figure: Notification and on-going areas

    +

    Figure: Notification and on-going areas

    Notification and on-going areas

    Active Notifications

    An active notification is displayed on the upper side of the screen. You can add several buttons for user interaction.

    -

    Figure: Active notification

    +

    Figure: Active notification

    Active notification

    - +

    Indicator Notifications

    The indicator type notification is displayed for a few seconds in the indicator area. Only a simple string and icon can be displayed.

    @@ -130,16 +130,16 @@

    Notification Layouts

    The following notification layouts are provided:

    - - +

    Notifications and Content Sharing

    @@ -49,7 +49,7 @@

    A minicontrol is a small application view that can be shown in other applications, or the quick panel or lock screen. You can create a minicontrol and display it in the quick panel or lock screen. You can also host minicontrols in your application.

    - +
    diff --git a/org.tizen.guides/html/native/performance/performance_cover_n.htm b/org.tizen.guides/html/native/performance/performance_cover_n.htm index b9ebb64..3789ffc 100644 --- a/org.tizen.guides/html/native/performance/performance_cover_n.htm +++ b/org.tizen.guides/html/native/performance/performance_cover_n.htm @@ -5,13 +5,13 @@ - + - Performance + Performance @@ -27,7 +27,7 @@
  • Tizen 3.0 and Higher for Wearable
    • - +

    Performance

    @@ -41,7 +41,7 @@

    You can use the T-trace tool to insert tracepoints in the application and perform trace operations. The tracepoints allow the framework to write application traces to the system trace buffer to align them with the T-trace traces from the Tizen platform.

    - +
    diff --git a/org.tizen.guides/html/native/performance/tracepoints_n.htm b/org.tizen.guides/html/native/performance/tracepoints_n.htm index 7ac478a..15b38ff 100644 --- a/org.tizen.guides/html/native/performance/tracepoints_n.htm +++ b/org.tizen.guides/html/native/performance/tracepoints_n.htm @@ -20,18 +20,18 @@

    Mobile native Wearable native

    - +

    Dependencies

    • Tizen 2.4 and Higher for Mobile
    • Tizen 3.0 and Higher for Wearable
      • -
    +

    Content

    +

    Related Info

    • T-trace API for Mobile Native
      • @@ -46,11 +46,11 @@

      You can perform trace operations in Tizen native applications with the T-trace tool. The tool allows you to generate traces and visualize them.

      -

      With the T-trace API, you can create custom tracepoints in your application. The tracepoints allow the framework to write application traces to the system trace buffer to align them with the T-trace traces from the Tizen platform.

      - +

      With the T-trace API, you can create custom tracepoints in your application. The tracepoints allow the framework to write application traces to the system trace buffer to align them with the T-trace traces from the Tizen platform.

      +

      Figure: T-trace architecture

      -

      - T-trace architecture +

      + T-trace architecture

      The following T-trace function types are provided for application-level tracepoints:

      @@ -58,8 +58,8 @@
    • Synchronous tracing functions: trace_begin() and trace_end()
    • Asynchronous tracing functions: trace_async_begin() and trace_async_end()
    • Counter tracking function: trace_update_counter()
      • -
    - + +

    Prerequisites

    To enable your application to use the T-trace functionality:

    @@ -79,7 +79,7 @@ -

    Inserting Tracepoints

    +

    Inserting Tracepoints

    To insert tracepoints:

    @@ -91,12 +91,12 @@ int main(void) { -    int integer = 12; -    trace_begin("event name: %d", integer); + int integer = 12; + trace_begin("event name: %d", integer); -    trace_end(); + trace_end(); -    return 0; + return 0; } @@ -107,33 +107,33 @@ main(void) void function1() { -    int cookies_f1 = 123; + int cookies_f1 = 123; -    trace_async_begin(cookies_f1, "event name"); + trace_async_begin(cookies_f1, "event name"); } void function2() { -    int cookies_f2 = 123; + int cookies_f2 = 123; -    trace_async_end(cookies_f2, "event name"); + trace_async_end(cookies_f2, "event name"); }
  • Track the trace counter. -

    To track the change of an integer counter on your application, use the trace_update_counter() function:

    +

    To track the change of an integer counter on your application, use the trace_update_counter() function:

     void
 function2(int count)
 {
-    trace_update_counter(count, "event_name");
+    trace_update_counter(count, "event_name");
 }
    • - +
    diff --git a/org.tizen.guides/html/native/personal/account_n.htm b/org.tizen.guides/html/native/personal/account_n.htm index 8c31402..4ac3f9c 100644 --- a/org.tizen.guides/html/native/personal/account_n.htm +++ b/org.tizen.guides/html/native/personal/account_n.htm @@ -28,7 +28,7 @@

    Content

    @@ -868,7 +868,7 @@ int ret; int id; /* Account 1 */ -Create_Account(&account, "Security 1", "Invalid", "NOBODY", "anony@mous.not"); +Create_Account(&account, "Security 1", "Invalid", "NOBODY", "anony@mous.not"); account_set_secret(account, ACCOUNT_SECRECY_INVALID); @@ -876,13 +876,13 @@ account_get_secret(account, &secret); account_insert_to_db(account, &id); -sprintf(buf, "Account 1 secret: %d\n", secret); +sprintf(buf, "Account 1 secret: %d\n", secret); account_destroy(account); /* Account 2 */ -Create_Account(&account, "Security 2", "Invisible", " NOBODY", "anony1@mous.not"); +Create_Account(&account, "Security 2", "Invisible", " NOBODY", "anony1@mous.not"); account_set_secret(account, ACCOUNT_SECRECY_INVISIBLE); @@ -890,13 +890,13 @@ account_get_secret(account, &secret); account_insert_to_db(account, &id); -sprintf(buf, "Account 2 secret: %d\n", secret); +sprintf(buf, "Account 2 secret: %d\n", secret); account_destroy(account); /* Account 3 */ -Create_Account(&account, "Secret 3", "Visible", " NOBODY", "anony2@mous.not"); +Create_Account(&account, "Secret 3", "Visible", " NOBODY", "anony2@mous.not"); ret = account_set_secret(account, ACCOUNT_SECRECY_VISIBLE); @@ -904,7 +904,7 @@ ret = account_get_secret(account, &secret); ret = account_insert_to_db(account, &id); -sprintf(buf, "Account 3 secret: %d\n", secret); +sprintf(buf, "Account 3 secret: %d\n", secret); account_destroy(account); @@ -956,17 +956,17 @@ account_subscribe_notification(account_subscribe, _account_event_cb, NULL);
  • Create an account. Accounts are created and then their handles are destroyed. The package name is obtained from the second account. 
    -Create_Account(&account, "Updater", "Updated?", "ToUpdate", "not.up@to.date");
+Create_Account(&account, "Updater", "Updated?", "ToUpdate", "not.up@to.date");
 account_insert_to_db(account, &id);
 
 Show_Account(account);
 account_destroy(account);
 
-Create_Account(&account, "Another", "Updated?", "ToUpdate", "not.up@to.date");
+Create_Account(&account, "Another", "Updated?", "ToUpdate", "not.up@to.date");
 account_insert_to_db(account, &id);
 
 account_get_package_name(account, &package_name);
-sprintf(buf, "Package_name: %s\n", package_name);
+sprintf(buf, "Package_name: %s\n", package_name);
 
 Show_Account(account);
 account_destroy(account);
@@ -986,7 +986,7 @@ account_destroy(account);
 
     account_create(&account);
 account_query_account_by_account_id(id, &account);
-account_set_display_name(account, "Updated!");
+account_set_display_name(account, "Updated!");
 account_update_to_db_by_id(account, id);
 account_destroy(account);
 
    
@@ -1004,8 +1004,8 @@ account_destroy(account);
 
     account_create(&account);
 account_query_account_by_account_id(id, &account);
-account_set_display_name(account, "Updated!");
-account_update_to_db_by_user_name(account, "Another", package_name);
+account_set_display_name(account, "Updated!");
+account_update_to_db_by_user_name(account, "Another", package_name);
 account_destroy(account);
    • @@ -1016,11 +1016,11 @@ account_destroy(account); bool _account_event_cb(const char *event_type, int account_id, void *user_data) { -    char buf[200]; + char buf[200]; -    sprintf(buf, "ACCOUNT EVENT: %s, %d\n", event_type, account_id); + sprintf(buf, "ACCOUNT EVENT: %s, %d\n", event_type, account_id); -    return true; + return true; } @@ -1057,7 +1057,7 @@ account_type_create(&account_type); -
  • Get the type information. +
  • Get the type information.

    If the account type with a specified ID exists, you can get it from the database with the account_query_by_app_id() function.

    It is possible to set, for example:

    @@ -1072,21 +1072,21 @@ account_type_create(&account_type); 
     int multiple_account_support = -1;
-char *your_app_id = "com.tizen.example"; /* App ID for retrieving account types */
+char *your_app_id = "com.tizen.example"; /* App ID for retrieving account types */
 char *app_id = NULL;
 char *provider_feature = NULL;
 char *icon_path = NULL;
 
 if (account_type_query_app_id_exist(your_app_id)) {
-    account_type_query_by_app_id(your_app_id, &account_type);
+    account_type_query_by_app_id(your_app_id, &account_type);
 
-    account_type_get_app_id(account_type, &app_id);
+    account_type_get_app_id(account_type, &app_id);
 
-    account_type_get_multiple_account_support(account_type, &multiple_account_support);
+    account_type_get_multiple_account_support(account_type, &multiple_account_support);
 
-    account_type_get_icon_path(account_type, &icon_path);
+    account_type_get_icon_path(account_type, &icon_path);
 
-    account_type_get_provider_feature(account_type, &provider_feature);
+    account_type_get_provider_feature(account_type, &provider_feature);
 }
    • @@ -1105,11 +1105,11 @@ account_type_query_label_by_app_id(_account_label_cb, type_id, NULL); bool _account_label_cb(char *app_id, char *label, char *locale, void *user_data) { -    char buf[200]; + char buf[200]; -    sprintf(buf, "Get Label ID: %s LABEL: %s LOCALE %s\n", app_id, label, locale); + sprintf(buf, "Get Label ID: %s LABEL: %s LOCALE %s\n", app_id, label, locale); -    return true; + return true; } @@ -1119,16 +1119,16 @@ _account_label_cb(char *app_id, char *label, char *locale, void *user_data) bool _account_type_cb(account_type_h account_type, void *user_data) { -    char * id; -    int support; -    char buf[200]; + char * id; + int support; + char buf[200]; -    account_type_get_app_id(account_type, &id); + account_type_get_app_id(account_type, &id); -    account_type_get_multiple_account_support(account_type, &support); -    sprintf(buf, "Account Type ID: %s Multiple support %d:\n", id, support); + account_type_get_multiple_account_support(account_type, &support); + sprintf(buf, "Account Type ID: %s Multiple support %d:\n", id, support); -    return true; + return true; } @@ -1143,7 +1143,7 @@ free(icon_path); account_type_destroy(account_type); - + diff --git a/org.tizen.guides/html/native/personal/authentication_n.htm b/org.tizen.guides/html/native/personal/authentication_n.htm index eb19f0b..ca3d527 100644 --- a/org.tizen.guides/html/native/personal/authentication_n.htm +++ b/org.tizen.guides/html/native/personal/authentication_n.htm @@ -26,11 +26,11 @@
  • Tizen 3.0 and Higher for Wearable
    • - +
    - -

    Authentication and Authorization

    + +

    Authentication and Authorization

    The authentication and authorization features introduce how you can obtain access tokens using OAuth 2.0, and authenticate users using the FIDO framework.

    @@ -43,7 +43,7 @@

    You can obtain an access token by using the OAuth 2.0 authorization. The OAuth 2.0 authorization framework enables you to obtain limited access to an HTTP service, either on behalf of a resource owner by orchestrating an approval interaction between the resource owner and the HTTP service, or by allowing you to obtain access on your own behalf.

    - +
    diff --git a/org.tizen.guides/html/native/personal/calendar_n.htm b/org.tizen.guides/html/native/personal/calendar_n.htm index cc04581..786ea5a 100644 --- a/org.tizen.guides/html/native/personal/calendar_n.htm +++ b/org.tizen.guides/html/native/personal/calendar_n.htm @@ -32,7 +32,7 @@
  • Event Instances and Reminders
  • Filters and Queries
  • Database Change Notifications
    • -
  • vCalendar
    • +
  • vCalendar
  • Prerequisites
  • Events
      @@ -74,13 +74,13 @@

      Calendar

      - +

      A calendar is a system of organizing days for social purposes. It is composed of records, such as events and todos. The records consist of subrecords, such as alarms, attendees, or extensions. For example, if an event is recurring, separate instances are generated for each time the event occurs.

      The calendar information is stored in a calendar database. To manage the information in the database, you must connect to the calendar service. The calendar service module works in a way similar to a client-service architecture. In this architecture, the Tizen application is the client side and has to connect to the service before using calendar service APIs.

      - +

      The following figure illustrates the calendar model.

      -

      Figure: Calendar model

      +

      Figure: Calendar model

      Calendar model

      The main features of the Calendar API include:

      @@ -105,17 +105,17 @@

    The calendar service supports vCalendars.

    - -

    The following figure illustrates the different Calendar entities and their relationships.

    -

    Figure: Calendar entities

    +

    The following figure illustrates the different Calendar entities and their relationships.

    + +

    Figure: Calendar entities

    Calendar entities

    Records

    A record represents an actual record in the internal database, but you can consider it as a structure describing a single but complex entity, such as a calendar event or a time zone.

    -

    A record has many properties, for example, a todo record has the todo description, priority, progress, creation time, last modified and completed time, and many other properties. A record can also contain an identifier field, which holds an ID of another record. Setting this field's value establishes a relation between the records, for example, a calendar event contains the ID of a calendar book to which it belongs.

    +

    A record has many properties, for example, a todo record has the todo description, priority, progress, creation time, last modified and completed time, and many other properties. A record can also contain an identifier field, which holds an ID of another record. Setting this field's value establishes a relation between the records, for example, a calendar event contains the ID of a calendar book to which it belongs.

    To use a record, you must obtain its handle. You can use many methods to obtain the handle, for example, you can create a new record or use an existing record ID:

    @@ -148,23 +148,23 @@ calendar_record_create(_calendar_event._uri, &record);
  • Views and properties -

    Generic access functions can be used (according to data-view declarations) to access calendar views. A data-view is almost the same as a database "VIEW", which limits access and guarantees performance. A "record" represents a single row of the data-views.

    +

    Generic access functions can be used (according to data-view declarations) to access calendar views. A data-view is almost the same as a database "VIEW", which limits access and guarantees performance. A "record" represents a single row of the data-views.

    -

    Table: Calendar views

    - - - - - - - +

    Table: Calendar views

    +
    Editable viewRead-only view
    + + + + + + +_calendar_extended_property - - -
    Editable viewRead-only view
    _calendar_book
    _calendar_event
    _calendar_todo
    _calendar_timezone
    _calendar_attendee
    _calendar_alarm
    -_calendar_extended_property    		 _calendar_updated_info
    _calendar_event_calendar_book
    _calendar_todo_calendar_book
    @@ -173,26 +173,26 @@ calendar_record_create(_calendar_event._uri, &record); _calendar_instance_localtime_calendar_book
    _calendar_instance_utime_calendar_book_extended
    _calendar_instance_localtime_calendar_book_extended
    + + +

    The _calendar_updated_info view is used when identifying record changes depending on the version. The other read-only views are a combination of editable views for UI convenience:

    • _calendar_event + _calendar_book = _calendar_event_calendar_book
    • _calendar_instance_utime + _calendar_book = _calendar_instance_utime_calendar_book
    • _calendar_event + _calendar_book + _calendar_attendee = _calendar_event_calendar_book_attendee
    - +
    Note The _calendar_instance_utime and _calendar_instance_localtime views are not available as editable views, but can be used in combination with other views in read-only views.
    - +

    The record types that have *_id as their property hold identifiers of other records. For example, the attendee and alarm views hold the ID of their corresponding events or todos in the event_id or todo_id property (as children of the corresponding event or todo records).

    The record type properties are other records. For example, an event record has attendee and alarm record properties, which means that records of those types can be children of the event type records. The following figure illustrates macros in a calendar_view.h header file.

    - -

    Figure: Properties

    -

    Properties

    + +

    Figure: Properties

    +

    Properties

    The calendar service uses a version system in the following APIs:

    @@ -206,45 +206,45 @@ calendar_db_get_changes_exception_by_version(..., int calendar_db_version, ...)
 
    To get the current version, the calendar_db_get_current_version() function is used. The calendar_db_get_changes_by_version() function retrieves the modified record list. The calendar_db_get_changes_exception_by_version() function is used to get modified instances in a recurring event.
  • Basic types -

    Records contain properties of basic types: integer, lli (long integer, long long int), double, string, bool, and time. The time type holds either a long long int, or 3 integers (year, month, day).

    +

    Records contain properties of basic types: integer, lli (long integer, long long int), double, string, bool, and time. The time type holds either a long long int, or 3 integers (year, month, day).

    The following table lists the setter and getter functions for each type.

    -

    Table: Setter and getter functions

    - - - - - +

    Table: Setter and getter functions

    +
    PropertySetter
    + + + + - - - + + + - - - + + + - - + + - - + + - - + + - - -
    PropertySetter Getter
    integer
    integer calendar_record_set_int() calendar_record_get_int()
    long long integer
    long long integer calendar_record_set_lli() calendar_record_get_lli()
    double
    double calendar_record_set_double() calendar_record_get_double()
    string
    string calendar_record_set_str() calendar_record_get_str()
    calendar_time_s
    calendar_time_s calendar_record_set_caltime() calendar_record_get_caltime()
    - + + + +

    These functions also require specifying which property to get and set, and for this, every getter and setter function needs a record and property ID. Create a property ID by combining the data-view and property name. For example, the property ID of an event summary property is _calendar_event.summary.

    The following example sets the summary property of an event record:

    @@ -255,21 +255,21 @@ calendar_record_h event = NULL; calendar_record_create(_calendar_event._uri, &event); /* Set event summary to the _calendar_event view */ -calendar_record_set_str(event, _calendar_event.summary, "Meeting"); +calendar_record_set_str(event, _calendar_event.summary, "Meeting");

    The calendar time structure property, calendar_caltime_s, is defined as follows:

     struct _calendar_time_s {
-    calendar_time_type_e type;
-    union {
-        long long int utime;
-        struct {
-            int year;
-            int month;
-            int mday;
-        } date;
-    } time;
+    calendar_time_type_e type;
+    union {
+        long long int utime;
+        struct {
+            int year;
+            int month;
+            int mday;
+        } date;
+    } time;
 };
 typedef struct _calendar_time_s calendar_time_s;
    @@ -280,7 +280,7 @@ typedef struct _calendar_time_s calendar_time_s; - + @@ -292,7 +292,7 @@ typedef struct _calendar_time_s calendar_time_s; + @@ -312,36 +312,36 @@ typedef struct _calendar_time_s calendar_time_s; long long int _time_convert_itol(char *tzid, int y, int mon, int d, int h, int min, int s) { -    int ret = 0; -    i18n_uchar utf16_timezone[64] = {0}; -    i18n_ustring_copy_ua_n(utf16_timezone, tzid, -                           sizeof(utf16_timezone)/sizeof(i18n_uchar)); + int ret = 0; + i18n_uchar utf16_timezone[64] = {0}; + i18n_ustring_copy_ua_n(utf16_timezone, tzid, + sizeof(utf16_timezone)/sizeof(i18n_uchar)); -    i18n_ucalendar_h ucal = NULL; -    char *loc_default = NULL; + i18n_ucalendar_h ucal = NULL; + char *loc_default = NULL; -    i18n_ulocale_get_default((const char **)&loc_default); -    ret = i18n_ucalendar_create(utf16_timezone, -1, loc_default, -                                I18N_UCALENDAR_GREGORIAN, &ucal); -    if (I18N_ERROR_NONE != ret) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "i18n_ucalendar_create() failed (%d)\n", ret); + i18n_ulocale_get_default((const char **)&loc_default); + ret = i18n_ucalendar_create(utf16_timezone, -1, loc_default, + I18N_UCALENDAR_GREGORIAN, &ucal); + if (I18N_ERROR_NONE != ret) { + dlog_print(DLOG_DEBUG, LOG_TAG, "i18n_ucalendar_create() failed (%d)\n", ret); -        return -1; -    } + return -1; + } -    i18n_ucalendar_set_date_time(ucal, y, mon - 1, d, h, min, s); + i18n_ucalendar_set_date_time(ucal, y, mon - 1, d, h, min, s); -    i18n_udate date; -    ret = i18n_ucalendar_get_milliseconds(ucal, &date); -    if (I18N_ERROR_NONE != ret) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "i18n_ucalendar_create() failed (%d)\n", ret); -        i18n_ucalendar_destroy(ucal); + i18n_udate date; + ret = i18n_ucalendar_get_milliseconds(ucal, &date); + if (I18N_ERROR_NONE != ret) { + dlog_print(DLOG_DEBUG, LOG_TAG, "i18n_ucalendar_create() failed (%d)\n", ret); + i18n_ucalendar_destroy(ucal); -        return -1; -    } -    i18n_ucalendar_destroy(ucal); + return -1; + } + i18n_ucalendar_destroy(ucal); -    return ms2sec(date); + return ms2sec(date); } @@ -351,21 +351,21 @@ calendar_time_s st = {0}; calendar_time_s et = {0}; st.type = CALENDAR_TIME_UTIME; -st.time.utime = _time_convert_itol("Asia/Seoul", 2012, 9, 15, 11, 0, 0); +st.time.utime = _time_convert_itol("Asia/Seoul", 2012, 9, 15, 11, 0, 0); et.type = CALENDAR_TIME_UTIME; -et.time.utime = _time_convert_itol("Asia/Seoul", 2012, 9, 15, 12, 0, 0); +et.time.utime = _time_convert_itol("Asia/Seoul", 2012, 9, 15, 12, 0, 0); /* Create an event record */ /* Set local time zone of start time */ -calendar_record_set_str(event, _calendar_event.start_tzid, "Asia/Seoul"); +calendar_record_set_str(event, _calendar_event.start_tzid, "Asia/Seoul"); /* Set start time */ calendar_record_set_caltime(event, _calendar_event.start_time, st); /* Set local time zone of end time */ -calendar_record_set_str(event, _calendar_event.end_tzid, "Asia/Seoul"); +calendar_record_set_str(event, _calendar_event.end_tzid, "Asia/Seoul"); /* Set end time */ calendar_record_set_caltime(event, _calendar_event.end_time, et); @@ -375,7 +375,7 @@ calendar_record_set_caltime(event, _calendar_event.end_time, et); -

    Child Records

    +

    Child Records

    A certain record type can be a parent of other records. For example, the attendee records can hold an event identifier in their event_id property. The event is the parent record of the attendee child records.

    The following code example creates an event and inserts an attendee record into it as a child record:

    @@ -390,7 +390,7 @@ calendar_record_create(_calendar_event._uri, &event); /* Attendee record can be a child record of the event record */ calendar_record_create(_calendar_attendee._uri, &attendee); -calendar_record_set_str(attendee, _calendar_attendee.name, "John"); +calendar_record_set_str(attendee, _calendar_attendee.name, "John"); calendar_record_add_child_record(event, _calendar_event.calendar_attendee, attendee); /* Insert event into the database */ @@ -403,28 +403,28 @@ calendar_record_destroy(event, true);

    A calendar book is a placeholder for other calendar records. Every event and todo must belong to a calendar book. There are 3 built-in calendar books, as shown in the following table.

    -

    Table: Calendar books

    -
    IdentifierIdentifier Type Name PurposeUTC time is used to describe non-all-day events.

    For non-all-day events, you must convert local time to UTC time. The local time zone identifier must be stored in the record, in the corresponding property.

    For example, when setting the start time of an event, the local time zone must be stored in the start_tzid property.

    -
    CALENDAR_TIME_LOCALTIME
    - - - - - - - - - - - - - - - - - - -
    BookDescription
    DEFAULT_EVENT_CALENDAR_BOOK_IDEvent book
    DEFAULT_TODO_CALENDAR_BOOK_IDTodo book
    DEFAULT_BIRTHDAY_CALENDAR_BOOK_IDBirthday book
    - +

    Table: Calendar books

    + + + + + + + + + + + + + + + + + + + +
    BookDescription
    DEFAULT_EVENT_CALENDAR_BOOK_IDEvent book
    DEFAULT_TODO_CALENDAR_BOOK_IDTodo book
    DEFAULT_BIRTHDAY_CALENDAR_BOOK_IDBirthday book
    + The following code example sets a calendar book ID for an event: 
     calendar_record_h event = NULL;
@@ -443,7 +443,7 @@ calendar_db_insert_record(event, &event_id);
 calendar_record_destroy(event, true);
    - +

    To receive a list of existing calendar books, use the following code:

     calendar_list_h calendar_book_list = NULL;
@@ -455,112 +455,112 @@ calendar_db_get_all_records(_calendar_calendar_book._uri, 0, 0, &calendar_bo
 
    Event Instances and Reminders
    
 
    An event record describes various properties, such as description, categories, and priority. It also contains information on when the event takes place. In a recurring event, there are more than 1 instance of the event. Each instance has its corresponding instance record.
    
 
    If an event is inserted with rrule (recurrence rule), alarm, and attendee, its data is saved to each relevant database. Generated instances based on the rrule are also stored in the instance database.
    
- 
-  
    Figure: Views and databases for event instances
     
-  
    Views and databases for event instances
      
+
+  
    Figure: Views and databases for event instances
    
+  
    Views and databases for event instances
    
 
 
    The following table illustrates an example of a recurring event and its instances.
    
 
-   
    Table: Event and instance example
     
- 
-    
-     
-      
-      
-     
-     
+   
    Table: Event and instance example
    
+
    EventInstances
    
+   
+    
+     
+     
+    
+     
+
  • Count set to 3
    •  
-     
-    
-  
    EventInstances
    
      Recurrence rules:
 	 
    • Start date on 2012-10-09 (Tuesday)
      • 
 	 
    • Frequency set to WEEKLY
      • 
 
    • Interval set to 1
      • 
-
    • Count set to 3
    		
      2012-10-09 Tuesday
 
    2012-10-16 Tuesday
    
-
    2012-10-22 Tuesday
     
+
    2012-10-22 Tuesday
    
+    
+   
+  
 
    The recurrence model in the Calendar API is compliant with the iCalendar specification. The following event properties have the same functionality as their corresponding values in iCalendar:
    
  
    
-     Table: Recurrence rules 
-   
     
- 
-    
-     
-      
-      
-     
-     
-      
-      
-     
-      
-      
-      
-     
-      
-      
-      
-     
-      
-      
-      
-     
-      
-      
-      
-     
-      
-      
-      
-     
-      
-      
-      
-     
-      
-      
-      
+     Table: Recurrence rules
+   
    
+
    Recurrence rule propertyDescription
    freqYearly, monthly, weekly, or daily
    countUntil count. If the count is 3, 3 instances are generated.
    intervalInterval is a positive integer representing how often the recurrence rule repeats
    bydayMO, TU, WE, TH, FR, SA, or SU
    bymonthdayDays of the month
    byyeardayDays of the year
    byweeknoOrdinals specifying weeks of the year
    bymonthMonths of the year
    
+   
+    
+     
+     
+    
+    
+     
+     
-      
-      
-      
-     	
-      
-      
-      
-     	
-    
-  
    Recurrence rule propertyDescription
    freqYearly, monthly, weekly, or daily
     
    bysetposValues which correspond to the nth occurrence within the set of events
    wkstDay on which the workweek starts
     
-
-
    When you have a recurring event, you can remove a specific recurrence instance from it, or add exceptions to the recurrence.
      
-  
+     
+     count
+     Until count. If the count is 3, 3 instances are generated.
+    
+     
+     interval
+     Interval is a positive integer representing how often the recurrence rule repeats
+    
+     
+     byday
+     MO, TU, WE, TH, FR, SA, or SU
+    
+     
+     bymonthday
+     Days of the month
+    
+     
+     byyearday
+     Days of the year
+    
+     
+     byweekno
+     Ordinals specifying weeks of the year
+    
+     
+     bymonth
+     Months of the year
+    
+     
+     bysetpos
+     Values which correspond to the nth occurrence within the set of events
+    
+     
+     wkst
+     Day on which the workweek starts
+    
+   
+  
+
+
    When you have a recurring event, you can remove a specific recurrence instance from it, or add exceptions to the recurrence.
    
+
 
    Exceptions
    
 
    If 1 of the instances of a recurring event is modified (such as its summary or date) or deleted, it is called an exception. For example, if the second instance date is modified from 16th to 17th, 17th is the exception.
    
 
 
-   
    Table: Exception example
     
- 
-    
-     
-      
+   
    Table: Exception example
    
+
    Event
    
+   
+    
+     
-	  	 
-     
-     
+	 
+    
+      
+ 
+
    2012-10-22 Tuesday
    
-     
-    
-  
    Event
      InstancesExceptions
    Exceptions
    
      Recurrence rules:
 	 
    • Start date on 2012-10-09 (Tuesday)
      • 
 	 
    • Frequency set to WEEKLY
      • 
 
    • Interval set to 1
      • 
 
    • Count set to 3
    
-    		
      2012-10-09 Tuesday
 
    2012-10-16 Tuesday > modified
    
-
    2012-10-22 Tuesday
    		
 2012-10-17 Tuesday
     
+    
+   
+  
 
 
    To get the changes in an exception, use the calendar_db_get_changes_exception_by_version() function. The instances and exceptions are deleted together when the original event is deleted.
    
 
@@ -568,8 +568,8 @@ calendar_db_get_all_records(_calendar_calendar_book._uri, 0, 0, &calendar_bo
 
    Reminders
    
 
 
    The following figure illustrates how the alarm process works.
    
- 
-  
    Figure: Alarm process
     
+
+  
    Figure: Alarm process
    
   
    Alarm process
    
 
 
    To get a reminder when an alarm is triggered, the application must set the reminder mime name. After the reminder mime name is set, insert an alarm as a child of an event record:
    
@@ -596,22 +596,22 @@ calendar_record_add_child_record(event, _calendar_event.calendar_alarm, alarm);
 
  • Filtering
 
 
    The operator precedence in filters is determined by the order in which the conditions and filters are added. The following table shows an example of how the operator precedence works.
    
-   
    Table: Filter conditions
     
- 
-    
-     
-      
-      
-     
-     
+   
    Table: Filter conditions
    
+
    ConditionResult
    
+   
+    
+     
+     
+    
+     
-      
-     
-      
+Condition C3
+     
+    
+     
  AND
    
  F1
    
  AND
    
- F2 
+ F2 
-     
-    
-  
    ConditionResult
    
      Condition C1
    
 OR
    
 Condition C2
    
 AND
    
-Condition C3    		(C1 OR C2) AND C3
    (C1 OR C2) AND C3
    
      Filter F1:
    
  Condition C1
    
  OR
    
@@ -627,30 +627,30 @@ Condition C3    		
      (C5 AND F1) AND F2
    
-Meaning (C5 AND (C1 OR C2)) AND (C3 OR C4)
     
-  
-  
    The following code creates a filter, accepting events with high priority or those that include the word "meeting" in their description.
    
+Meaning (C5 AND (C1 OR C2)) AND (C3 OR C4)
+    
+   
+  
+
+  
    The following code creates a filter, accepting events with high priority or those that include the word "meeting" in their description.
    
 
     calendar_filter_h filter = NULL;
 
 /* Create a filter returning event type records */
 calendar_filter_create(_calendar_event._uri, &filter);
 
-/* Add a 'priority equals high' condition */
+/* Add a 'priority equals high' condition */
 calendar_filter_add_int(filter, _calendar_event.priority, CALENDAR_MATCH_EQUAL,
-                        CALENDAR_EVENT_PRIORITY_HIGH);
+                        CALENDAR_EVENT_PRIORITY_HIGH);
 
 /* Add OR operator */
 calendar_filter_add_operator(filter, CALENDAR_FILTER_OPERATOR_OR);
 
-/* Add a 'description contains "meeting"' condition */
+/* Add a 'description contains "meeting"' condition */
 calendar_filter_add_str(filter, _calendar_event.description,
-                        CALENDAR_MATCH_CONTAINS, "meeting");
+                        CALENDAR_MATCH_CONTAINS, "meeting");
 
    
 
 
    Insert the filter into the query and execute the query:
    
@@ -680,7 +680,7 @@ calendar_list_destroy(list, true);
 
  • Projection querying
 
    A projection allows you to query the data for just those specific properties of a record that you actually need, at lower latency and cost than retrieving the entire set of properties.
    
 
-
    The following example code creates a filter that gets only the event ID, summary, and start time from the records with the "test" (string filter) in their summary. Create a query, and add a filter to it; the results are received in a list.
    
+
    The following example code creates a filter that gets only the event ID, summary, and start time from the records with the "test" (string filter) in their summary. Create a query, and add a filter to it; the results are received in a list.
    
 
 
     calendar_query_h query = NULL;
@@ -690,7 +690,7 @@ calendar_filter_h filter = NULL;
 calendar_query_create(_calendar_event_calendar_book_attendee._uri, &query);
 calendar_filter_create(_calendar_event_calendar_book_attendee._uri, &filter);
 calendar_filter_add_str(filter, _calendar_event.summary,
-                        CALENDAR_MATCH_CONTAINS, "test");
+                        CALENDAR_MATCH_CONTAINS, "test");
 calendar_query_set_filter(query, filter);
 
 /* Set projection */
@@ -777,8 +777,8 @@ calendar_list_destroy(list, true);
 
    To use the Calendar API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:
    
 
     <privileges>
-   <privilege>http://tizen.org/privilege/calendar.read</privilege>
-   <privilege>http://tizen.org/privilege/calendar.write</privilege>
+   <privilege>http://tizen.org/privilege/calendar.read</privilege>
+   <privilege>http://tizen.org/privilege/calendar.write</privilege>
 </privileges>
 
    
 
    • 
@@ -797,14 +797,14 @@ calendar_list_destroy(list, true);
 int error_code;
 error_code = calendar_connect();
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_connect failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_connect failed: %x\n", error_code);

    When the calendar service is no longer needed, disconnect from the service using the calendar_disconnect() function:

     error_code = calendar_disconnect();
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_disconnect failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_disconnect failed: %x\n", error_code);
    • @@ -826,7 +826,7 @@ if (error_code != CALENDAR_ERROR_NONE) calendar_record_h event = NULL; error_code = calendar_record_create(_calendar_event._uri, &event); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_record_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_record_create failed: %x\n", error_code);
    @@ -843,9 +843,9 @@ if (error_code != CALENDAR_ERROR_NONE)

    Set the subject.

    To set the subject for the event, use the calendar_record_set_str() function with the _calendar_event.summary property as the second parameter:

    -error_code = calendar_record_set_str(event, _calendar_event.summary, "summary");
+error_code = calendar_record_set_str(event, _calendar_event.summary, "summary");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
  • @@ -853,9 +853,9 @@ if (error_code != CALENDAR_ERROR_NONE)

    To set the description for the event, use the calendar_record_set_str() function with the _calendar_event.description property as the second parameter:

     error_code = calendar_record_set_str(event, _calendar_event.description,
-                                     "description");
+                                     "description");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
  • @@ -863,13 +863,13 @@ if (error_code != CALENDAR_ERROR_NONE)

    To set the time zone for the event start and end times, use the calendar_record_set_str() function with the _calendar_event.start_tzid and _calendar_event.end_tzid properties as the second parameter. If you do not set the time zone, the system uses UTC.

     error_code = calendar_record_set_str(event, _calendar_event.start_tzid,
-                                     "Asia/Seoul");
+                                     "Asia/Seoul");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set start_tzid failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set start_tzid failed: %x\n", error_code);
 
-error_code = calendar_record_set_str(event, _calendar_event.end_tzid, "Asia/Seoul");
+error_code = calendar_record_set_str(event, _calendar_event.end_tzid, "Asia/Seoul");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set end_tzid failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set end_tzid failed: %x\n", error_code);
  • @@ -880,16 +880,16 @@ calendar_time_s starttime = {0}; starttime.type = CALENDAR_TIME_UTIME; starttime.time.utime = 1404036000; /* 2014/06/29 10:00:00 UTC */ error_code = calendar_record_set_caltime(event, _calendar_event.start_time, -                                         starttime); + starttime); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "set start_time failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "set start_time failed: %x\n", error_code); calendar_time_s endtime = {0}; endtime.type = CALENDAR_TIME_UTIME; endtime.time.utime = 1404036000 + 3600; /* 2014/06/29 11:00:00 UTC */ error_code = calendar_record_set_caltime(event, _calendar_event.end_time, endtime); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "set end_time failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "set end_time failed: %x\n", error_code);

    The calendar_time_s structure (in mobile and wearable applications) has 2 types.

    • @@ -901,19 +901,19 @@ if (error_code != CALENDAR_ERROR_NONE)

    In the following example, the event is set to occur every month on the 3rd, 4th, and 5th day:

     error_code = calendar_record_set_int(event, _calendar_event.freq,
-                                     CALENDAR_RECURRENCE_MONTHLY);
+                                     CALENDAR_RECURRENCE_MONTHLY);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set freq failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set freq failed: %x\n", error_code);
 
 error_code = calendar_record_set_int(event, _calendar_event.interval, 1);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set interval failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set interval failed: %x\n", error_code);
 
 error_code =
-    calendar_record_set_str(event, _calendar_event.bymonthday, "3,4,5");
+    calendar_record_set_str(event, _calendar_event.bymonthday, "3,4,5");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "set bymonthday failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "set bymonthday failed: %x\n", error_code);
  • @@ -921,14 +921,14 @@ if (error_code != CALENDAR_ERROR_NONE)

    In the following example, the event is set to occur a total of 8 times:

     error_code = calendar_record_set_int(event, _calendar_event.range_type,
-                                     CALENDAR_RANGE_COUNT);
+                                     CALENDAR_RANGE_COUNT);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "set range_type failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "set range_type failed: %x\n", error_code);
 
 error_code = calendar_record_set_int(event, _calendar_event.count, 8);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set count failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set count failed: %x\n", error_code);
    • @@ -948,18 +948,18 @@ error_code += calendar_record_create(_calendar_alarm._uri, &alarm); /* Set the properties */ error_code += calendar_record_set_int(alarm, _calendar_alarm.tick_unit, -                                      CALENDAR_ALARM_TIME_UNIT_SPECIFIC); + CALENDAR_ALARM_TIME_UNIT_SPECIFIC); ct.type = CALENDAR_TIME_UTIME; ct.time.utime = 1404036000 - 60; /* 60 sec before starttime (1404036000) */ error_code += calendar_record_set_caltime(alarm, _calendar_alarm.alarm_time, ct); /* Add to the event as a child record */ error_code += calendar_record_add_child_record(event, -                                               _calendar_event.calendar_alarm, -                                               alarm); + _calendar_event.calendar_alarm, + alarm); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "adding the alarm failed \n"); + dlog_print(DLOG_ERROR, LOG_TAG, "adding the alarm failed \n");

    The calendar_alarm_time_unit_type_e enumeration (in mobile and wearable applications) defines the available alarm tick units.

    @@ -980,15 +980,15 @@ error_code = CALENDAR_ERROR_NONE; error_code += calendar_record_create(_calendar_attendee._uri, &attendee); /* Set the attendee properties */ -error_code += calendar_record_set_str(attendee, _calendar_attendee.name, "John"); +error_code += calendar_record_set_str(attendee, _calendar_attendee.name, "John"); /* Add to the event as a child record */ error_code += calendar_record_add_child_record(event, -                                               _calendar_event.calendar_attendee, -                                               attendee); + _calendar_event.calendar_attendee, + attendee); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "adding the attendee failed \n"); + dlog_print(DLOG_ERROR, LOG_TAG, "adding the attendee failed \n"); @@ -1002,10 +1002,10 @@ if (error_code != CALENDAR_ERROR_NONE) int id = -1; error_code = calendar_db_insert_record(event, &id); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_db_insert_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_insert_record failed: %x\n", error_code); -dlog_print(DLOG_ERROR, LOG_TAG, "id: %d\n", id); +dlog_print(DLOG_ERROR, LOG_TAG, "id: %d\n", id); @@ -1031,7 +1031,7 @@ calendar_record_h record; const int event_id = ...; /* Get the event ID */ error_code = calendar_db_get_record(_calendar_event._uri, event_id, &record); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); @@ -1056,8 +1056,8 @@ calendar_record_destroy(record, true); calendar_list_h list = NULL; error_code = calendar_db_get_all_records(_calendar_event._uri, 0, 0, &list); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_db_get_all_records failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_get_all_records failed: %x\n", error_code);
  • @@ -1071,8 +1071,8 @@ calendar_query_h query = NULL; error_code = calendar_query_create(_calendar_event._uri, &query); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_query_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_query_create failed: %x\n", error_code);
  • @@ -1082,39 +1082,39 @@ calendar_filter_h filter = NULL; error_code = calendar_filter_create(_calendar_event._uri, &filter); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_filter_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_filter_create failed: %x\n", error_code);

  • Add a filtering condition using the calendar_filter_add_XXX() function.

    -

    The following example adds a string-based filtering condition that retrieves the events whose summary field contains the string "summary to find":

    +

    The following example adds a string-based filtering condition that retrieves the events whose summary field contains the string "summary to find":

     error_code =
-    calendar_filter_add_str(filter, _calendar_event.summary,
-                            CALENDAR_MATCH_CONTAINS, "summary to find");
+    calendar_filter_add_str(filter, _calendar_event.summary,
+                            CALENDAR_MATCH_CONTAINS, "summary to find");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x\n", error_code);

  • To add more conditions, define an operator between the conditions.

    -

    The following example first adds an AND operator and then a string-based filtering condition that retrieves the events whose description field contains the string "description to find".

    -

    The combination of the AND operator and the 2 conditions means that the filter only retrieves the events that contain "summary to find" in their summary and "description to find" in their description.

    +

    The following example first adds an AND operator and then a string-based filtering condition that retrieves the events whose description field contains the string "description to find".

    +

    The combination of the AND operator and the 2 conditions means that the filter only retrieves the events that contain "summary to find" in their summary and "description to find" in their description.

     error_code =
-    calendar_filter_add_operator(filter, CALENDAR_FILTER_OPERATOR_AND);
+    calendar_filter_add_operator(filter, CALENDAR_FILTER_OPERATOR_AND);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_filter_add_operator failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_filter_add_operator failed: %x\n", error_code);
 
 error_code = calendar_filter_add_str(filter, _calendar_event.description,
-                                     CALENDAR_MATCH_CONTAINS,
-                                     "description to find");
+                                     CALENDAR_MATCH_CONTAINS,
+                                     "description to find");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x\n", error_code);

    You can also create a filter with integer and time conditions. For example, to filter all-day events that start after January 1st, 2016:

    @@ -1124,11 +1124,11 @@ time_to_compare.time.date.mday = 1;
 time_to_compare.time.date.month = 1;
 time_to_compare.time.date.year = 2016;
 error_code = calendar_filter_add_caltime(filter, _calendar_event.start_time,
-                                         CALENDAR_MATCH_GREATER_THAN,
-                                         time_to_compare);
+                                         CALENDAR_MATCH_GREATER_THAN,
+                                         time_to_compare);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x\n", error_code);

    The type parameter of the calendar_time_s structure (in mobile and wearable applications) determines whether the event is an all-day event (CALENDAR_TIME_LOCALTIME) or a non-all-day event (CALENDAR_TIME_UTIME).

    To retrieve the specified time period, use 2 conditions using CALENDAR_MATCH_GREATER_THAN and CALENDAR_MATCH_LESS_THAN with the operator CALENDAR_FILTER_OPERATOR_AND. You can also use CALENDAR_MATCH_EQUAL to set an equality condition.

    @@ -1138,8 +1138,8 @@ if (error_code != CALENDAR_ERROR_NONE) 
     error_code = calendar_query_set_filter(query, filter);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_query_set_filter failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_query_set_filter failed: %x\n", error_code);
  • @@ -1147,9 +1147,9 @@ if (error_code != CALENDAR_ERROR_NONE) 
     error_code = calendar_db_get_records_with_query(query, 0, 0, &list);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_db_get_records_with_query failed: %x\n",
-               error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_db_get_records_with_query failed: %x\n",
+               error_code);

    The third parameter defines a limit for the number of results. If you set it to 0, the list returns all events matching the query.

    • @@ -1180,13 +1180,13 @@ calendar_query_destroy(query); 
     calendar_record_h record;
 while (calendar_list_get_current_record_p(list, &record) == CALENDAR_ERROR_NONE) {
-    char* summary;
-    calendar_record_get_str_p(record, _calendar_event.summary, &summary);
-    dlog_print(DLOG_ERROR, LOG_TAG, "summary: %s\n", summary);
+    char* summary;
+    calendar_record_get_str_p(record, _calendar_event.summary, &summary);
+    dlog_print(DLOG_ERROR, LOG_TAG, "summary: %s\n", summary);
 
-    error_code = calendar_list_next(list);
-    if (error_code != CALENDAR_ERROR_NONE)
-        break;
+    error_code = calendar_list_next(list);
+    if (error_code != CALENDAR_ERROR_NONE)
+        break;
 }
    @@ -1196,24 +1196,24 @@ while (calendar_list_get_current_record_p(list, &record) == CALENDAR_ERROR_N calendar_gl_event_data_t *gl_event_data = NULL; calendar_record_h record = NULL; while (calendar_list_get_current_record_p(list, &record) == CALENDAR_ERROR_NONE) { -    gl_event_data = _create_gl_event_data(record); -    /* You can get, for example, summary: */ -    /* gl_event_data->summary */ + gl_event_data = _create_gl_event_data(record); + /* You can get, for example, summary: */ + /* gl_event_data->summary */ -    _free_gl_event_data(gl_event_data); + _free_gl_event_data(gl_event_data); -    error_code = calendar_list_next(list); -    if (error_code != CALENDAR_ERROR_NONE) -        break; + error_code = calendar_list_next(list); + if (error_code != CALENDAR_ERROR_NONE) + break; }

    Define the calendar_gl_event_data_t structure and the functions for using the structure:

     struct _calendar_gl_event_data {
-    int id;
-    char *summary;
-    char *description;
-    calendar_time_s start_time;
+    int id;
+    char *summary;
+    char *description;
+    calendar_time_s start_time;
 };
 typedef struct _calendar_gl_event_data calendar_gl_event_data_t;
 
@@ -1221,62 +1221,62 @@ typedef struct _calendar_gl_event_data calendar_gl_event_data_t;
 static void
 _free_gl_event_data(calendar_gl_event_data_t *gl_event_data)
 {
-    if (NULL == gl_event_data)
-        return;
+    if (NULL == gl_event_data)
+        return;
 
-    free(gl_event_data->summary);
-    free(gl_event_data->description);
-    free(gl_event_data);
+    free(gl_event_data->summary);
+    free(gl_event_data->description);
+    free(gl_event_data);
 }
 
 /* Create the structure for an event */
 static calendar_gl_event_data_t*
 _create_gl_event_data(calendar_record_h record)
 {
-    calendar_gl_event_data_t *gl_event_data;
-    int error_code;
-
-    gl_event_data = malloc(sizeof(calendar_gl_event_data_t));
-    memset(gl_event_data, 0x0, sizeof(calendar_gl_event_data_t));
-
-    error_code = calendar_record_get_str(record, _calendar_event.summary,
-                                         &gl_event_data->summary);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get summary failed: %i\n", error_code);
-        _free_gl_event_data(gl_event_data);
-
-        return NULL;
-    }
-
-    error_code = calendar_record_get_str(record, _calendar_event.description,
-                                         &gl_event_data->description);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "get description failed: %i\n", error_code);
-        _free_gl_event_data(gl_event_data);
-
-        return NULL;
-    }
-
-    error_code = calendar_record_get_int(record, _calendar_event.id,
-                                         &gl_event_data->id);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get id failed: %i\n", error_code);
-        _free_gl_event_data(gl_event_data);
-
-        return NULL;
-    }
-
-    error_code = calendar_record_get_caltime(record, _calendar_event.start_time,
-                                             &gl_event_data->start_time);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get start_time failed: %i\n", error_code);
-        _free_gl_event_data(gl_event_data);
-
-        return NULL;
-    }
-
-    return gl_event_data;
+    calendar_gl_event_data_t *gl_event_data;
+    int error_code;
+
+    gl_event_data = malloc(sizeof(calendar_gl_event_data_t));
+    memset(gl_event_data, 0x0, sizeof(calendar_gl_event_data_t));
+
+    error_code = calendar_record_get_str(record, _calendar_event.summary,
+                                         &gl_event_data->summary);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get summary failed: %i\n", error_code);
+        _free_gl_event_data(gl_event_data);
+
+        return NULL;
+    }
+
+    error_code = calendar_record_get_str(record, _calendar_event.description,
+                                         &gl_event_data->description);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "get description failed: %i\n", error_code);
+        _free_gl_event_data(gl_event_data);
+
+        return NULL;
+    }
+
+    error_code = calendar_record_get_int(record, _calendar_event.id,
+                                         &gl_event_data->id);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get id failed: %i\n", error_code);
+        _free_gl_event_data(gl_event_data);
+
+        return NULL;
+    }
+
+    error_code = calendar_record_get_caltime(record, _calendar_event.start_time,
+                                             &gl_event_data->start_time);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get start_time failed: %i\n", error_code);
+        _free_gl_event_data(gl_event_data);
+
+        return NULL;
+    }
+
+    return gl_event_data;
 }

    To access a specific event detail in a child record, retrieve the child record.

    @@ -1306,7 +1306,7 @@ calendar_record_h record; const int event_id = ...; /* Get the event ID */ error_code = calendar_db_get_record(_calendar_event._uri, event_id, &record); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code);

    You can also retrieve the event using a search function, such as calendar_db_get_records_with_query().

    @@ -1317,14 +1317,14 @@ if (error_code != CALENDAR_ERROR_NONE)

    Set the properties you want to update.

    The following example sets a new subject and description for the event:

    -error_code = calendar_record_set_str(record, _calendar_event.summary, "summary updated");
+error_code = calendar_record_set_str(record, _calendar_event.summary, "summary updated");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
 
 error_code = calendar_record_set_str(record, _calendar_event.description,
-                                     "description updated");
+                                     "description updated");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
    @@ -1333,8 +1333,8 @@ if (error_code != CALENDAR_ERROR_NONE) 
     error_code = calendar_db_update_record(record);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_db_update_record failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_db_update_record failed: %x\n", error_code);
    @@ -1355,7 +1355,7 @@ calendar_record_destroy(record, true); int event_id = ...; /* Get the event ID */ error_code = calendar_db_delete_record(_calendar_event._uri, event_id); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_delete_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_delete_record failed: %x\n", error_code);

    Removing an Instance from a Recurring Event

    @@ -1370,7 +1370,7 @@ if (error_code != CALENDAR_ERROR_NONE)

    • Frequency: CALENDAR_RECURRENCE_MONTHLY

    • Interval: 1

      • -

    • Days of the month: "3, 4, 5"

      • +

    • Days of the month: "3, 4, 5"

    • Range type: CALENDAR_RANGE_COUNT

    • Count: 8

    @@ -1379,9 +1379,9 @@ int error_code = CALENDAR_ERROR_NONE; calendar_record_h event = NULL; error_code += calendar_record_create(_calendar_event._uri, &event); -error_code += calendar_record_set_str(event, _calendar_event.summary, "test"); -error_code += calendar_record_set_str(event, _calendar_event.start_tzid, "Asia/Seoul"); -error_code += calendar_record_set_str(event, _calendar_event.end_tzid, "Asia/Seoul"); +error_code += calendar_record_set_str(event, _calendar_event.summary, "test"); +error_code += calendar_record_set_str(event, _calendar_event.start_tzid, "Asia/Seoul"); +error_code += calendar_record_set_str(event, _calendar_event.end_tzid, "Asia/Seoul"); calendar_time_s st = {0}; st.type = CALENDAR_TIME_UTIME; @@ -1394,16 +1394,16 @@ et.time.utime = 1354582800; error_code += calendar_record_set_caltime(event, _calendar_event.end_time, et); error_code += calendar_record_set_int(event, _calendar_event.freq, -                                      CALENDAR_RECURRENCE_MONTHLY); + CALENDAR_RECURRENCE_MONTHLY); error_code += calendar_record_set_int(event, _calendar_event.interval, 1); -error_code += calendar_record_set_str(event, _calendar_event.bymonthday, "3,4,5"); +error_code += calendar_record_set_str(event, _calendar_event.bymonthday, "3,4,5"); error_code += calendar_record_set_int(event, _calendar_event.range_type, -                                      CALENDAR_RANGE_COUNT); + CALENDAR_RANGE_COUNT); error_code += calendar_record_set_int(event, _calendar_event.count, 8); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "creating the event failed: \n"); + dlog_print(DLOG_ERROR, LOG_TAG, "creating the event failed: \n");

    The event has 8 instances:

    Table: Event instances

    @@ -1439,9 +1439,9 @@ if (error_code != CALENDAR_ERROR_NONE)

    Create the exception by setting the exdate property.

    In vCalendar 2.0 (RFC 2445), the exdate property is used to identify a deleted instance. If multiple instances are deleted, datetimes are added with a comma (for example, 20121104T010000Z, 20121105T010000Z, 20121203T010000Z).

    -error_code = calendar_record_set_str(event, _calendar_event.exdate, "20121104T010000Z");
+error_code = calendar_record_set_str(event, _calendar_event.exdate, "20121104T010000Z");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set exdate failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set exdate failed: %x\n", error_code);
    @@ -1451,8 +1451,8 @@ if (error_code != CALENDAR_ERROR_NONE) int event_id; error_code = calendar_db_insert_record(event, &event_id); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_db_insert_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_insert_record failed: %x\n", error_code); calendar_record_destroy(event, true); @@ -1477,12 +1477,12 @@ error_code = CALENDAR_ERROR_NONE; error_code += calendar_record_clone(event, &clone); error_code += calendar_record_set_int(clone, _calendar_event.original_event_id, -                                      event_id); + event_id); error_code += calendar_record_set_str(clone, _calendar_event.recurrence_id, -                                      "20121005T010000Z"); + "20121005T010000Z"); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "cloning the event failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "cloning the event failed: %x\n", error_code); @@ -1496,8 +1496,8 @@ if (error_code != CALENDAR_ERROR_NONE) int exdate_event_id = 0; error_code = calendar_db_insert_record(clone, &exdate_event_id); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_db_insert_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_insert_record failed: %x\n", error_code); calendar_record_destroy(clone, true); calendar_record_destroy(event, true); @@ -1516,10 +1516,10 @@ calendar_record_destroy(event, true);

    Register a callback using the calendar_db_add_changed_cb() function:

     error_code = calendar_db_add_changed_cb(_calendar_event._uri, _event_changed_callback,
-                                        NULL);
+                                        NULL);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_db_add_changed_cb failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_db_add_changed_cb failed: %x\n", error_code);
    @@ -1532,26 +1532,26 @@ static calendar_gl_event_data_t *_gl_event_data = ...; static void _event_changed_callback(const char *view_uri, void *user_data) { -    if (0 != strcmp(view_uri, _calendar_event._uri)) -        return; + if (0 != strcmp(view_uri, _calendar_event._uri)) + return; -    if (NULL == _gl_event_data) -        return; + if (NULL == _gl_event_data) + return; -    int event_id = _gl_event_data->id; -    _free_gl_event_data(_gl_event_data); -    _gl_event_data = NULL; + int event_id = _gl_event_data->id; + _free_gl_event_data(_gl_event_data); + _gl_event_data = NULL; -    calendar_record_h record = NULL; -    int error_code; -    error_code = calendar_db_get_record(_calendar_event._uri, event_id, &record); -    if (error_code != CALENDAR_ERROR_NONE) -        return; + calendar_record_h record = NULL; + int error_code; + error_code = calendar_db_get_record(_calendar_event._uri, event_id, &record); + if (error_code != CALENDAR_ERROR_NONE) + return; -    _gl_event_data = _create_gl_event_data(record); -    /* Use _gl_event_data */ + _gl_event_data = _create_gl_event_data(record); + /* Use _gl_event_data */ -    calendar_record_destroy(record, true); + calendar_record_destroy(record, true); } @@ -1574,7 +1574,7 @@ _event_changed_callback(const char *view_uri, void *user_data) calendar_record_h todo = NULL; error_code = calendar_record_create(_calendar_todo._uri, &todo); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_record_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_record_create failed: %x\n", error_code);
    @@ -1591,9 +1591,9 @@ if (error_code != CALENDAR_ERROR_NONE)

    Set the subject.

    To set the subject for the todo, use the calendar_record_set_str() function with the _calendar_todo.summary property as the second parameter:

    -error_code = calendar_record_set_str(todo, _calendar_todo.summary, "summary");
+error_code = calendar_record_set_str(todo, _calendar_todo.summary, "summary");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
  • @@ -1601,9 +1601,9 @@ if (error_code != CALENDAR_ERROR_NONE)

    To set the description for the todo, use the calendar_record_set_str() function with the _calendar_todo.description property as the second parameter:

     error_code = calendar_record_set_str(todo, _calendar_todo.description,
-                                     "description");
+                                     "description");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
  • @@ -1616,7 +1616,7 @@ duetime.time.utime = 1404036000; /* 2014/06/29 11:00:00 UTC */ error_code = calendar_record_set_caltime(todo, _calendar_todo.due_time, duetime); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "set due_time failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "set due_time failed: %x\n", error_code);
  • @@ -1624,9 +1624,9 @@ if (error_code != CALENDAR_ERROR_NONE)

    To set the status for the todo, use the calendar_record_set_int() function with the _calendar_todo.todo_status property as the second parameter. The calendar_todo_status_e enumeration (in mobile and wearable applications) defines the possible status values.

     error_code = calendar_record_set_int(todo, _calendar_todo.todo_status,
-                                     CALENDAR_TODO_STATUS_COMPLETED);
+                                     CALENDAR_TODO_STATUS_COMPLETED);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set todo_status failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set todo_status failed: %x\n", error_code);
    • @@ -1640,8 +1640,8 @@ if (error_code != CALENDAR_ERROR_NONE) int id; error_code = calendar_db_insert_record(todo, &id); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_db_insert_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_insert_record failed: %x\n", error_code); @@ -1667,7 +1667,7 @@ calendar_record_h record; const int todo_id = ...; /* Get the todo ID */ error_code = calendar_db_get_record(_calendar_todo._uri, todo_id, &record); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); @@ -1693,8 +1693,8 @@ calendar_record_destroy(record, true); calendar_list_h list = NULL; error_code = calendar_db_get_all_records(_calendar_todo._uri, 0, 0, &list); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_db_get_all_records failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_get_all_records failed: %x\n", error_code);
  • @@ -1708,8 +1708,8 @@ calendar_query_h query = NULL; error_code = calendar_query_create(_calendar_todo._uri, &query); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_query_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_query_create failed: %x\n", error_code);
  • @@ -1719,49 +1719,49 @@ calendar_filter_h filter = NULL; error_code = calendar_filter_create(_calendar_todo._uri, &filter); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_filter_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_filter_create failed: %x\n", error_code);

  • Add a filtering condition using the calendar_filter_add_XXX() function.

    -

    The following example adds a string-based filtering condition that retrieves the todos whose summary field contains the string "summary to find":

    +

    The following example adds a string-based filtering condition that retrieves the todos whose summary field contains the string "summary to find":

     error_code =
-    calendar_filter_add_str(filter, _calendar_todo.summary,
-                            CALENDAR_MATCH_CONTAINS, "summary to find");
+    calendar_filter_add_str(filter, _calendar_todo.summary,
+                            CALENDAR_MATCH_CONTAINS, "summary to find");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x\n", error_code);

  • To add more conditions, define an operator between the conditions.

    -

    The following example first adds an AND operator and then a string-based filtering condition that retrieves the todos whose description field contains the string "description to find".

    -

    The combination of the AND operator and the 2 conditions means that the filter only retrieves the todos that contain "summary to find" in their summary and "description to find" in their description.

    +

    The following example first adds an AND operator and then a string-based filtering condition that retrieves the todos whose description field contains the string "description to find".

    +

    The combination of the AND operator and the 2 conditions means that the filter only retrieves the todos that contain "summary to find" in their summary and "description to find" in their description.

     error_code =
-    calendar_filter_add_operator(filter, CALENDAR_FILTER_OPERATOR_AND);
+    calendar_filter_add_operator(filter, CALENDAR_FILTER_OPERATOR_AND);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_filter_add_operator failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_filter_add_operator failed: %x\n", error_code);
 
 error_code = calendar_filter_add_str(filter, _calendar_todo.description,
-                                     CALENDAR_MATCH_CONTAINS,
-                                     "description to find");
+                                     CALENDAR_MATCH_CONTAINS,
+                                     "description to find");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x\n", error_code);

    You can also create a filter with integer and time conditions. For example, to filter all completed todos:

     error_code =
-    calendar_filter_add_int(filter, _calendar_todo.todo_status,
-                            CALENDAR_MATCH_EQUAL,
-                            CALENDAR_TODO_STATUS_COMPLETED);
+    calendar_filter_add_int(filter, _calendar_todo.todo_status,
+                            CALENDAR_MATCH_EQUAL,
+                            CALENDAR_TODO_STATUS_COMPLETED);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x\n", error_code);
  • @@ -1769,8 +1769,8 @@ if (error_code != CALENDAR_ERROR_NONE) 
     error_code = calendar_query_set_filter(query, filter);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_query_set_filter failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_query_set_filter failed: %x\n", error_code);
  • @@ -1778,9 +1778,9 @@ if (error_code != CALENDAR_ERROR_NONE) 
     error_code = calendar_db_get_records_with_query(query, 0, 0, &list);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_db_get_records_with_query failed: %x\n",
-               error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_db_get_records_with_query failed: %x\n",
+               error_code);

    The third parameter defines a limit for the number of results. If you set it to 0, the list returns all todos matching the query.

    • @@ -1807,18 +1807,18 @@ calendar_query_destroy(query); Note Some functions have the _p postfix. The postfix means that the returned value must not be freed by the application, as it is a pointer to the data in an existing record.
    - +

    The following example iterates through the list and retrieves the summary of each todo:

     calendar_record_h record;
 while (calendar_list_get_current_record_p(list, &record) == CALENDAR_ERROR_NONE) {
-    char* summary;
-    calendar_record_get_str_p(record, _calendar_todo.summary, &summary);
-    dlog_print(DLOG_ERROR, LOG_TAG, "summary: %s\n", summary);
+    char* summary;
+    calendar_record_get_str_p(record, _calendar_todo.summary, &summary);
+    dlog_print(DLOG_ERROR, LOG_TAG, "summary: %s\n", summary);
 
-    error_code = calendar_list_next(list);
-    if (error_code != CALENDAR_ERROR_NONE)
-        break;
+    error_code = calendar_list_next(list);
+    if (error_code != CALENDAR_ERROR_NONE)
+        break;
 }
    @@ -1828,24 +1828,24 @@ while (calendar_list_get_current_record_p(list, &record) == CALENDAR_ERROR_N calendar_gl_todo_data_t *gl_todo_data = NULL; calendar_record_h record = NULL; while (calendar_list_get_current_record_p(list, &record) == CALENDAR_ERROR_NONE) { -    gl_todo_data = _create_gl_todo_data(record); -    /* You can get, for example, summary: */ -    /* gl_todo_data->summary */ + gl_todo_data = _create_gl_todo_data(record); + /* You can get, for example, summary: */ + /* gl_todo_data->summary */ -    _free_gl_todo_data(gl_todo_data); + _free_gl_todo_data(gl_todo_data); -    error_code = calendar_list_next(list); -    if (error_code != CALENDAR_ERROR_NONE) -        break; + error_code = calendar_list_next(list); + if (error_code != CALENDAR_ERROR_NONE) + break; }

    Define the calendar_gl_todo_data_t structure and the functions for using the structure:

     struct _calendar_gl_todo_data {
-    int id;
-    char *summary;
-    char *description;
-    calendar_time_s due_time;
+    int id;
+    char *summary;
+    char *description;
+    calendar_time_s due_time;
 };
 typedef struct _calendar_gl_todo_data calendar_gl_todo_data_t;
 
@@ -1853,62 +1853,62 @@ typedef struct _calendar_gl_todo_data calendar_gl_todo_data_t;
 static void
 _free_gl_todo_data(calendar_gl_todo_data_t *gl_todo_data)
 {
-    if (NULL == gl_todo_data)
-        return;
+    if (NULL == gl_todo_data)
+        return;
 
-    free(gl_todo_data->summary);
-    free(gl_todo_data->description);
-    free(gl_todo_data);
+    free(gl_todo_data->summary);
+    free(gl_todo_data->description);
+    free(gl_todo_data);
 }
 
 /* Create the structure for a todo */
 static calendar_gl_todo_data_t*
 _create_gl_todo_data(calendar_record_h record)
 {
-    calendar_gl_todo_data_t *gl_todo_data;
-    int error_code;
-
-    gl_todo_data = malloc(sizeof(calendar_gl_todo_data_t));
-    memset(gl_todo_data, 0x0, sizeof(calendar_gl_todo_data_t));
-
-    error_code = calendar_record_get_str(record, _calendar_todo.summary,
-                                         &gl_todo_data->summary);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get summary failed: %x\n", error_code);
-        _free_gl_todo_data(gl_todo_data);
-
-        return NULL;
-    }
-
-    error_code = calendar_record_get_str(record, _calendar_todo.description,
-                                         &gl_todo_data->description);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "get description failed: %x\n", error_code);
-        _free_gl_todo_data(gl_todo_data);
-
-        return NULL;
-    }
-
-    error_code = calendar_record_get_int(record, _calendar_todo.id,
-                                         &gl_todo_data->id);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get id failed: %x\n", error_code);
-        _free_gl_todo_data(gl_todo_data);
-
-        return NULL;
-    }
-
-    error_code = calendar_record_get_caltime(record, _calendar_todo.due_time,
-                                             &gl_todo_data->due_time);
-    if (error_code != CALENDAR_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get due_time failed: %x\n", error_code);
-        _free_gl_todo_data(gl_todo_data);
-
-        return NULL;
-    }
-
-    return gl_todo_data;
+    calendar_gl_todo_data_t *gl_todo_data;
+    int error_code;
+
+    gl_todo_data = malloc(sizeof(calendar_gl_todo_data_t));
+    memset(gl_todo_data, 0x0, sizeof(calendar_gl_todo_data_t));
+
+    error_code = calendar_record_get_str(record, _calendar_todo.summary,
+                                         &gl_todo_data->summary);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get summary failed: %x\n", error_code);
+        _free_gl_todo_data(gl_todo_data);
+
+        return NULL;
+    }
+
+    error_code = calendar_record_get_str(record, _calendar_todo.description,
+                                         &gl_todo_data->description);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "get description failed: %x\n", error_code);
+        _free_gl_todo_data(gl_todo_data);
+
+        return NULL;
+    }
+
+    error_code = calendar_record_get_int(record, _calendar_todo.id,
+                                         &gl_todo_data->id);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get id failed: %x\n", error_code);
+        _free_gl_todo_data(gl_todo_data);
+
+        return NULL;
+    }
+
+    error_code = calendar_record_get_caltime(record, _calendar_todo.due_time,
+                                             &gl_todo_data->due_time);
+    if (error_code != CALENDAR_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get due_time failed: %x\n", error_code);
+        _free_gl_todo_data(gl_todo_data);
+
+        return NULL;
+    }
+
+    return gl_todo_data;
 }

    To access a specific todo detail in a child record, retrieve the child record.

    @@ -1938,7 +1938,7 @@ calendar_record_h record; const int todo_id = ...; /* Get the todo ID */ error_code = calendar_db_get_record(_calendar_todo._uri, todo_id, &record); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code);

    You can also retrieve the todo using a search function, such as calendar_db_get_records_with_query().

    @@ -1949,14 +1949,14 @@ if (error_code != CALENDAR_ERROR_NONE)

    Set the properties you want to update.

    The following example sets a new subject and description for the todo:

    -error_code = calendar_record_set_str(record, _calendar_todo.summary, "summary updated");
+error_code = calendar_record_set_str(record, _calendar_todo.summary, "summary updated");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set summary failed: %x\n", error_code);
 
 error_code = calendar_record_set_str(record, _calendar_todo.description,
-                                     "description updated");
+                                     "description updated");
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set description failed: %x\n", error_code);
    @@ -1965,8 +1965,8 @@ if (error_code != CALENDAR_ERROR_NONE) 
     error_code = calendar_db_update_record(record);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_db_update_record failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_db_update_record failed: %x\n", error_code);
    @@ -1987,7 +1987,7 @@ calendar_record_destroy(record, true); int todo_id = ...; /* Get the todo ID */ error_code = calendar_db_delete_record(_calendar_todo._uri, todo_id); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_delete_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_delete_record failed: %x\n", error_code);

    Monitoring Todo Changes

    @@ -2000,10 +2000,10 @@ if (error_code != CALENDAR_ERROR_NONE)

    Register a callback using the calendar_db_add_changed_cb() function:

     error_code = calendar_db_add_changed_cb(_calendar_todo._uri, _todo_changed_callback,
-                                        NULL);
+                                        NULL);
 if (error_code != CALENDAR_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "calendar_db_add_changed_cb failed: %x\n", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "calendar_db_add_changed_cb failed: %x\n", error_code);
    @@ -2016,26 +2016,26 @@ static calendar_gl_todo_data_t *_gl_todo_data = ...; static void _todo_changed_callback(const char *view_uri, void *user_data) { -    if (0 != strcmp(view_uri, _calendar_todo._uri)) -        return; + if (0 != strcmp(view_uri, _calendar_todo._uri)) + return; -    if (NULL == _gl_todo_data) -        return; + if (NULL == _gl_todo_data) + return; -    int todo_id = _gl_todo_data->id; -    _free_gl_todo_data(_gl_todo_data); -    _gl_todo_data = NULL; + int todo_id = _gl_todo_data->id; + _free_gl_todo_data(_gl_todo_data); + _gl_todo_data = NULL; -    calendar_record_h record = NULL; -    calendar_error_e error_code; -    error_code = calendar_db_get_record(_calendar_todo._uri, todo_id, &record); -    if (error_code != CALENDAR_ERROR_NONE) -        return; + calendar_record_h record = NULL; + calendar_error_e error_code; + error_code = calendar_db_get_record(_calendar_todo._uri, todo_id, &record); + if (error_code != CALENDAR_ERROR_NONE) + return; -    _gl_todo_data = _create_gl_todo_data(record); -    /* Use _gl_todo_data */ + _gl_todo_data = _create_gl_todo_data(record); + /* Use _gl_todo_data */ -    calendar_record_destroy(record, true); + calendar_record_destroy(record, true); } @@ -2055,7 +2055,7 @@ int event_id = ...; /* Get the event ID */ calendar_record_h record = NULL; error_code = calendar_db_get_record(_calendar_event._uri, event_id, &record); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_db_get_record failed: %x\n", error_code); @@ -2067,16 +2067,16 @@ calendar_list_h list = NULL; error_code = calendar_list_create(&list); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_list_create failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_list_create failed: %x\n", error_code); error_code = calendar_list_add(list, record); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "calendar_list_add failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "calendar_list_add failed: %x\n", error_code); error_code = calendar_vcalendar_make_from_records(list, &vcalendar_stream); if (error_code != CALENDAR_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "calendar_vcalendar_make_from_records failed: %x\n", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_vcalendar_make_from_records failed: %x\n", error_code); @@ -2101,16 +2101,16 @@ calendar_list_destroy(list, true); 
     char vcalendar_file_path[512] = {0};
 char *resource_path = app_get_resource_path();
-snprintf(vcalendar_file_path, sizeof(vcalendar_file_path), "%s/%s",
-         resource_path, "vcalendar.ics");
+snprintf(vcalendar_file_path, sizeof(vcalendar_file_path), "%s/%s",
+         resource_path, "vcalendar.ics");
 free(resource_path);
 
 error_code = calendar_vcalendar_parse_to_calendar_foreach(/* vCalendar file path */
-                                                          vcalendar_file_path,
-                                                          /* Callback to invoke */
-                                                          _vcalendar_parse_cb,
-                                                          /* User data for callback */
-                                                          NULL);
+                                                          vcalendar_file_path,
+                                                          /* Callback to invoke */
+                                                          _vcalendar_parse_cb,
+                                                          /* User data for callback */
+                                                          NULL);
    @@ -2121,21 +2121,21 @@ error_code = calendar_vcalendar_parse_to_calendar_foreach(/* vCalendar file path static bool _vcalendar_parse_cb(calendar_record_h record, void *user_data) { -    if (NULL == record) -        return false; + if (NULL == record) + return false; -    int id = -1; -    error_code = calendar_db_insert_record(record, &id); -    if (error_code != CALENDAR_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, -                   "calendar_db_insert_record failed: %x\n", error_code); + int id = -1; + error_code = calendar_db_insert_record(record, &id); + if (error_code != CALENDAR_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, + "calendar_db_insert_record failed: %x\n", error_code); -        return false; -    } -    dlog_print(DLOG_ERROR, LOG_TAG, "inserted id: %d\n", id); -    /* Use record */ + return false; + } + dlog_print(DLOG_ERROR, LOG_TAG, "inserted id: %d\n", id); + /* Use record */ -    return true; + return true; } diff --git a/org.tizen.guides/html/native/personal/contacts_n.htm b/org.tizen.guides/html/native/personal/contacts_n.htm index 7d60b9e..84ce009 100644 --- a/org.tizen.guides/html/native/personal/contacts_n.htm +++ b/org.tizen.guides/html/native/personal/contacts_n.htm @@ -113,7 +113,7 @@

    Contacts

    You can help the user to manage their contact information, such as address books, groups, persons, and phone logs. Since the contact information is stored in a contacts database, you must connect to the contact service to manage the information.

    - +

    The following figure illustrates the structure of the contact information in the database:

    - +

    The contact service supports vCards, allowing you to import contact information from a vCard or export it to a vCard format. You can also import contacts from the device SIM card to the contacts database.

    - +

    The following figure illustrates the different entities and their relationships in the contact service.

    Figure: Contact entities

    Contact entities

    - - + +

    Links Between Contacts and Persons

    Each contact is linked to at least 1 person, which is a kind of virtual contact that can be used to combine the details when multiple contacts from different address books represent the same individual.

    The linking between contacts and persons functions as follows:

    @@ -196,7 +196,7 @@

    Unlinking a contact

    - +

    Records

    @@ -218,7 +218,7 @@ contacts_record_create(_contacts_contact._uri, &contact); contacts_record_h name = NULL; /* Create a name record and receive a handle for it */ contacts_record_create(_contacts_name._uri, &name); -contacts_record_set_str(name, _contacts_name.first, "first name"); +contacts_record_set_str(name, _contacts_name.first, "first name"); contacts_record_add_child_record(contact, _contacts_contact.name, name); @@ -231,7 +231,7 @@ contacts_db_insert_record(contact, &contact_id); contacts_record_destroy(contact, true); /* Contact is no longer usable */ /* Retrieve the record; contact is now a handle to the same record as before */ -contacts_db_get_record(_contacts_contact._uri, contact_id, &contact); +contacts_db_get_record(_contacts_contact._uri, contact_id, &contact); char *display_name = NULL; contacts_record_get_str(contact, _contacts_contact.display_name, &display_name); contacts_record_destroy(contact, true); /* Contact is no longer usable */ @@ -247,11 +247,11 @@ int i = 0; contacts_db_get_record(_contacts_contact._uri, contact_id, &contact); contacts_record_get_child_record_count(contact, _contacts_contact.address, &address_num); for (i = 0; i < address_num; i++) { -    contacts_record_h address = NULL; -    /* Get the address record handle */ -    contacts_record_get_child_record_at_p(contact, _contacts_contact.address, -                                          i, &address); -    contacts_record_set_str(address, _contacts_address.country, "Korea"); + contacts_record_h address = NULL; + /* Get the address record handle */ + contacts_record_get_child_record_at_p(contact, _contacts_contact.address, + i, &address); + contacts_record_set_str(address, _contacts_address.country, "Korea"); } contacts_db_update_record(contact); contacts_record_destroy(contact, true); @@ -271,7 +271,7 @@ contacts_record_destroy(contact, true);
  • Views

    Views are provided to access and handle entities. A data-view is a structure, which has property elements. For example, the _contacts_contact view describes the properties of the contact record. Its properties include, for example, name, company, and nickname of the contact. The property elements have their data types and names. The generic access functions, such as contacts_db_insert_record() and contacts_record_get_int(), can be used to access the contact views.

    -

    The record types that have *_id as their property, hold identifiers of other records. For example, the name, number, and email views hold the ID of their corresponding contacts in the contact_id property as children of the corresponding contact records. A data-view is almost the same as a database "VIEW", which limits access and guarantees performance. A "record" represents a single row of the data-views.

    +

    The record types that have *_id as their property, hold identifiers of other records. For example, the name, number, and email views hold the ID of their corresponding contacts in the contact_id property as children of the corresponding contact records. A data-view is almost the same as a database "VIEW", which limits access and guarantees performance. A "record" represents a single row of the data-views.

    The property type record means that the parent record can have child records. For example, a contact record has name, number, and email properties, which means that records of those types can be children of the contact type records. The following figure illustrates macros in a contacts_view.h header file.

    @@ -328,12 +328,12 @@ contacts_record_destroy(contact, true); 
     char *resource_path = app_get_resource_path();
 char ringtone_path[1024];
-snprintf(ringtone_path, sizeof(ringtone_path), "%s/ringtone.mp3", resource_path);
+snprintf(ringtone_path, sizeof(ringtone_path), "%s/ringtone.mp3", resource_path);
 free(resource_path);
 contacts_record_set_str(contact, _contacts_contact.ringtone_path, ringtone_path);

    With a record handle, you can access all records of a specific type related to the given record.

    - +
    Note The string getter functions have the _p postfix. It means that the returned value should not be freed by the application, as it is a pointer to data in an existing record. @@ -374,13 +374,13 @@ contacts_record_create(_contacts_contact._uri, &contact); contacts_record_create(_contacts_image._uri, &image); char *resource_path = app_get_resource_path(); char caller_id_path[1024]; -snprintf(caller_id_path, sizeof(caller_id_path), "%s/caller_id.jpg", resource_path); +snprintf(caller_id_path, sizeof(caller_id_path), "%s/caller_id.jpg", resource_path); free(resource_path); contacts_record_set_str(image, _contacts_image.path, caller_id_path); contacts_record_add_child_record(contact, _contacts_contact.image, image); contacts_record_create(_contacts_address._uri, &address); -contacts_record_set_str(address, _contacts_address.country, "Korea"); +contacts_record_set_str(address, _contacts_address.country, "Korea"); contacts_record_add_child_record(contact, _contacts_contact.address, address); /* Insert contact to the database */ @@ -392,12 +392,12 @@ contacts_record_destroy(contact, true); Note For an application to insert private images in contacts, the following conditions apply:
    • The application must have the http://tizen.org/privilege/contact.write privilege to use the database modifying functions, such as contacts_db_insert_record().
      • -
    • The application's private directory and files must have the read permission of others, such as 644. SMACK protects the read permission from the other applications.
      • +
    • The application's private directory and files must have the read permission of others, such as 644. SMACK protects the read permission from the other applications.
    • The application can erase the image after destroying the contact record using the contacts_record_destroy() function.
    -

    Identifiers can be used to establish a relationship between 2 records. The following code example sets an address record's contact_id property to the ID of the contact. The contact_id relates between the address record and the contact which is identified by the contact_id. After the ID is set, the address becomes one of the addresses connected to the contact. The address is now the contact's child record, and the contact is the parent record.

    +

    Identifiers can be used to establish a relationship between 2 records. The following code example sets an address record's contact_id property to the ID of the contact. The contact_id relates between the address record and the contact which is identified by the contact_id. After the ID is set, the address becomes one of the addresses connected to the contact. The address is now the contact's child record, and the contact is the parent record.

     int contact_id = ... /* Acquire the ID of the created contact */
@@ -411,7 +411,7 @@ contacts_db_insert_record(address, &address_id);
    - +

    Contact Lists and Batch Operations

    The contact service provides functions which can handle lists of records with the same type. The list concept is based on a standard doubly-linked list.

    @@ -462,12 +462,12 @@ contacts_list_h list = NULL; contacts_record_h record = NULL; contacts_db_get_all_records(_contacts_person._uri, 0, 0, &list); do { -    contacts_list_get_current_record_p(list, &record); -    if (NULL == record) -        break; -    char *name = NULL; -    contacts_record_get_str_p(record, _contacts_person.display_name, &name); -    dlog_print(DLOG_DEBUG, LOG_TAG, "name=%s", name); + contacts_list_get_current_record_p(list, &record); + if (NULL == record) + break; + char *name = NULL; + contacts_record_get_str_p(record, _contacts_person.display_name, &name); + dlog_print(DLOG_DEBUG, LOG_TAG, "name=%s", name); } while (CONTACTS_ERROR_NONE == contacts_list_next(list)); contacts_list_destroy(list, true); /* Destroy child records automatically */ @@ -480,11 +480,11 @@ contacts_list_destroy(list, true); /* Destroy child records automatically */ 
     contacts_record_h group1 = NULL;
 contacts_record_create(_contacts_group._uri, &group1);
-contacts_record_set_str(group1, _contacts_group.name, "group test1");
+contacts_record_set_str(group1, _contacts_group.name, "group test1");
 
 contacts_record_h group2 = NULL;
 contacts_record_create(_contacts_group._uri, &group2);
-contacts_record_set_str(group2, _contacts_group.name, "group test2");
+contacts_record_set_str(group2, _contacts_group.name, "group test2");
 
 contacts_list_h list = NULL;
 contacts_list_create(&list);
@@ -562,10 +562,10 @@ free(ids);
 
    The following example creates a composite filter with the OR operator.
    
 
     contacts_filter_add_str(filter1, _contacts_person.display_name,
-                        CONTACTS_MATCH_CONTAINS, "1234");
+                        CONTACTS_MATCH_CONTAINS, "1234");
 contacts_filter_add_operator(filter1, CONTACTS_FILTER_OPERATOR_OR);
 contacts_filter_add_str(filter1, _contacts_person.display_name,
-                        CONTACTS_MATCH_CONTAINS, "5678");
+                        CONTACTS_MATCH_CONTAINS, "5678");
  • @@ -574,10 +574,10 @@ contacts_filter_add_str(filter1, _contacts_person.display_name,

    The following example creates a joined filter with the AND operator.

     contacts_filter_add_str(filter1, _contacts_person.display_name,
-                        CONTACTS_MATCH_CONTAINS, "1234");
+                        CONTACTS_MATCH_CONTAINS, "1234");
 contacts_filter_add_operator(filter1, CONTACTS_FILTER_OPERATOR_OR);
 contacts_filter_add_str(filter1, _contacts_person.display_name,
-                        CONTACTS_MATCH_CONTAINS, "5678");
+                        CONTACTS_MATCH_CONTAINS, "5678");
 
 contacts_filter_add_bool(filter2, _contacts_person.is_favorite, true);
 
@@ -629,7 +629,7 @@ Condition C3
    • -

    The following example creates a filter which accepts addresses with their contact's ID equal to a given ID (integer filter), or their country property equal to "Korea" (string filter). To get the filtered results, create a query and add the filter to it. The results are received in a list.

    +

    The following example creates a filter which accepts addresses with their contact's ID equal to a given ID (integer filter), or their country property equal to "Korea" (string filter). To get the filtered results, create a query and add the filter to it. The results are received in a list.

     contacts_filter_h filter = NULL;
 contacts_list_h list = NULL;
@@ -637,10 +637,10 @@ contacts_query_h query = NULL;
 
 contacts_filter_create(_contacts_address._uri, &filter);
 contacts_filter_add_int(filter, _contacts_address.contact_id,
-                        CONTACTS_MATCH_EQUAL, id);
+                        CONTACTS_MATCH_EQUAL, id);
 contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_OR);
 contacts_filter_add_str(filter, _contacts_address.country,
-                        CONTACTS_MATCH_EXACTLY, "Korea");
+                        CONTACTS_MATCH_EXACTLY, "Korea");
 contacts_query_create(_contacts_address._uri, &query);
 contacts_query_set_filter(query, filter);
 
@@ -661,7 +661,7 @@ contacts_list_destroy(list, true);
 
    The following example sorts the query results by the person ID:
    
 
     contacts_filter_add_str(filter, _contacts_person.display_name,
-                        CONTACTS_MATCH_CONTAINS, "Joe");
+                        CONTACTS_MATCH_CONTAINS, "Joe");
 contacts_query_set_filter(query, filter);
 contacts_query_set_sort(query, _contacts_person.id, true);
 
@@ -676,22 +676,22 @@ contacts_list_destroy(person_list, true);
 
 
    Projection allows you to query data for specific properties of a record, at lower latency and cost than retrieving all properties. To use projection, use the contacts_query_set_projection() function.
    
 
-
    The following example creates a filter which gets only the person ID, display name, and image thumbnail path from the person records which have "test" (string filter) as the vibration path. Create a query and add the filter to it; the results are received in a list.
    
+
    The following example creates a filter which gets only the person ID, display name, and image thumbnail path from the person records which have "test" (string filter) as the vibration path. Create a query and add the filter to it; the results are received in a list.
    
 
     contacts_filter_add_str(filter, _contacts_person.vibration,
-                        CONTACTS_MATCH_CONTAINS, "test");
+                        CONTACTS_MATCH_CONTAINS, "test");
 contacts_query_set_filter(query, filter);
 
 /* Set projections */
 unsigned int person_projection[] =
 {
-    _contacts_person.id,
-    _contacts_person.display_name,
-    _contacts_person.image_thumbnail_path,
+    _contacts_person.id,
+    _contacts_person.display_name,
+    _contacts_person.image_thumbnail_path,
 };
 
 contacts_query_set_projection(query, person_projection,
-                              sizeof(person_projection)/sizeof(int));
+                              sizeof(person_projection)/sizeof(int));
 
 contacts_db_get_records_with_query(query, 0, 0, &person_list);
 
@@ -710,8 +710,8 @@ contacts_list_destroy(person_list, true);
 
     unsigned int projection[] =
 {
-    _contacts_person_number.person_id,
-    _contacts_person_number.display_name,
+    _contacts_person_number.person_id,
+    _contacts_person_number.display_name,
 };
 contacts_filter_create(_contacts_person_number._uri, &filter);
 contacts_filter_add_bool(filter, _contacts_person_number.has_phonenumber, true);
@@ -740,10 +740,10 @@ contacts_filter_destroy(filter);
 
    Clients wait for contact change notifications on the client side. If the contact is changed by another module, the server publishes a notification. The notification module broadcasts to the subscribed modules and a user callback function is called with the user data. The following example registers a person change notification callback:
    
 
 
    -static void 
+static void
 __person_changed_cb(const char *view_uri, void *user_data)
 {
-    /* Jobs for the callback function */
+    /* Jobs for the callback function */
 }
 /* Add a change notification callback */
 contacts_db_add_changed_cb(_contacts_person._uri, __person_changed_cb, NULL);
@@ -777,18 +777,18 @@ contacts_list_destroy(list, true);
 static bool
 __vcard_parse_cb(contacts_record_h record, void *user_data)
 {
-    int id = 0;
-    contacts_db_insert_record(record, &id);
+    int id = 0;
+    contacts_db_insert_record(record, &id);
 
-    /* Return false to break out of the loop */
-    /* Return true to continue with the next iteration of the loop */
-    return true;
+    /* Return false to break out of the loop */
+    /* Return true to continue with the next iteration of the loop */
+    return true;
 }
 
 /* Parse the vCard from a file */
 char *resource_path = app_get_resource_path();
 char vcard_path[1024];
-snprintf(vcard_path, sizeof(vcard_path), "%s/vcard.vcf", resource_path);
+snprintf(vcard_path, sizeof(vcard_path), "%s/vcard.vcf", resource_path);
 free(resource_path);
 contacts_vcard_parse_to_contact_foreach(vcard_path, __vcard_parse_cb, NULL);
 
    
@@ -820,10 +820,10 @@ contacts_record_destroy(contact, true);
 
    To use the Contacts API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file:
    
 
     <privileges>
-   <privilege>http://tizen.org/privilege/contact.read</privilege>
-   <privilege>http://tizen.org/privilege/contact.write</privilege>
-   <privilege>http://tizen.org/privilege/callhistory.read</privilege>
-   <privilege>http://tizen.org/privilege/callhistory.write</privilege>
+   <privilege>http://tizen.org/privilege/contact.read</privilege>
+   <privilege>http://tizen.org/privilege/contact.write</privilege>
+   <privilege>http://tizen.org/privilege/callhistory.read</privilege>
+   <privilege>http://tizen.org/privilege/callhistory.write</privilege>
 </privileges>
 
    
 
@@ -881,7 +881,7 @@ error_code = contacts_record_create(_contacts_contact._uri, &contact);
 
    Set the contact properties:
    
 
      
 
    • 
-
      To set the contact's name:
      
+
      To set the contact's name:
      
 
        
 
      1. 
 
        Create a name record using the contacts_record_create() function with the _contacts_name._uri property as the first parameter:
        
@@ -892,22 +892,22 @@ error_code = contacts_record_create(_contacts_name._uri, &name);
 
    
 
 
  • 
-
    Set the contact's first name using the contacts_record_set_str() function with the _contacts_name.first property as the second parameter:
    
+
    Set the contact's first name using the contacts_record_set_str() function with the _contacts_name.first property as the second parameter:
    
 
    -error_code = contacts_record_set_str(name, _contacts_name.first, "John");
+error_code = contacts_record_set_str(name, _contacts_name.first, "John");
 
    
 
    • 
 
  • 
-
    Set the contact's last name using the contacts_record_set_str() function with the _contacts_name.last property as the second parameter:
    
+
    Set the contact's last name using the contacts_record_set_str() function with the _contacts_name.last property as the second parameter:
    
 
    -error_code = contacts_record_set_str(name, _contacts_name.last, "Smith");
+error_code = contacts_record_set_str(name, _contacts_name.last, "Smith");
 
    
 
    • 
 
  • 
 
    Set the name record as a child record of the contact record using the contacts_record_add_child_record() function with the _contacts_contact.name property as the second parameter:
    
 
     error_code = contacts_record_add_child_record(contact,
-                                              _contacts_contact.name, name);
+                                              _contacts_contact.name, name);
 
    
 
    • 
 
@@ -929,17 +929,17 @@ error_code = contacts_record_create(_contacts_image._uri, &image);
 char *resource_path = app_get_resource_path();
 char caller_id_path[1024];
 snprintf(caller_id_path, sizeof(caller_id_path),
-         "%s/caller_id.jpg", resource_path);
+         "%s/caller_id.jpg", resource_path);
 free(resource_path);
 error_code = contacts_record_set_str(image, _contacts_image.path,
-                                     caller_id_path);
+                                     caller_id_path);
 
    
 
 
  • 
 
    Set the image record as a child record of the contact record using the contacts_record_add_child_record() function with the _contacts_contact.image property as the second parameter:
    
 
     error_code = contacts_record_add_child_record(contact,
-                                              _contacts_contact.image, image);
+                                              _contacts_contact.image, image);
 
    
 
    • 
 
@@ -949,7 +949,7 @@ error_code = contacts_record_add_child_record(contact,
         Note
         To set private images for contacts, the application must meet the following conditions:
                 
      
-                    
    • The application's private directory and files must have the read permission for others, such as 644. SMACK protects the read permission from other applications.
      • 
+                    
    • The application's private directory and files must have the read permission for others, such as 644. SMACK protects the read permission from other applications.
      • 
                     
    • The application must delete the image after destroying the contact record (using the contacts_record_destroy() function).
      •
    @@ -985,21 +985,21 @@ error_code = contacts_record_set_int(event, _contacts_event.date, int_date);

    Set the event type to birthday using the contacts_record_set_int() function with the _contacts_event.type property as the second parameter and the CONTACTS_EVENT_TYPE_BIRTH enumerator as the third parameter:

     error_code = contacts_record_set_int(event, _contacts_event.type,
-                                     CONTACTS_EVENT_TYPE_BIRTH);
+                                     CONTACTS_EVENT_TYPE_BIRTH);

  • Set the event record as a child record of the contact record using the contacts_record_add_child_record() function with the _contacts_contact.event property as the second parameter:

     error_code = contacts_record_add_child_record(contact,
-                                              _contacts_contact.event,
-                                              event);
+                                              _contacts_contact.event,
+                                              event);
  • -

    To set the contact's phone number:

    +

    To set the contact's phone number:

    1. Create a phone number record using the contacts_record_create() function with the _contacts_number._uri property as the first parameter:

      @@ -1013,15 +1013,15 @@ error_code = contacts_record_create(_contacts_number._uri, &number);

      Set the phone number using the contacts_record_set_str() function with the _contacts_number.number property as the second parameter:

       error_code = contacts_record_set_str(number, _contacts_number.number,
-                                     "+8210-1234-5678");
+                                     "+8210-1234-5678");

    2. Set the phone number record as a child record of the contact record using the contacts_record_add_child_record() function with the _contacts_contact.number property as the second parameter:

       error_code = contacts_record_add_child_record(contact,
-                                              _contacts_contact.number,
-                                              number);
+                                              _contacts_contact.number,
+                                              number);
    @@ -1118,22 +1118,22 @@ error_code = contacts_filter_create(_contacts_person._uri, &filter);

  • Add a filtering condition using a contacts_filter_add_XXX() function.

    -

    The following example adds a string-based filtering condition that retrieves the persons whose display name contains the string "John":

    +

    The following example adds a string-based filtering condition that retrieves the persons whose display name contains the string "John":

     error_code = contacts_filter_add_str(filter, _contacts_person.display_name,
-                                     CONTACTS_MATCH_CONTAINS, "John");
+                                     CONTACTS_MATCH_CONTAINS, "John");

  • To add more conditions, define an operator between the conditions.

    The following example first adds an AND operator and then a bool-based filtering condition that retrieves the persons who are set as favorites.

    -

    The combination of the AND operator and the 2 conditions means that the filter only retrieves the persons whose display name contains the string "John" and who are set as favorites.

    +

    The combination of the AND operator and the 2 conditions means that the filter only retrieves the persons whose display name contains the string "John" and who are set as favorites.

     error_code = contacts_filter_add_operator(filter,
-                                          CONTACTS_FILTER_OPERATOR_AND);
+                                          CONTACTS_FILTER_OPERATOR_AND);
 
 error_code = contacts_filter_add_bool(filter, _contacts_person.is_favorite,
-                                      true);
+                                      true);
  • @@ -1160,12 +1160,12 @@ contacts_query_destroy(query);

  • To retrieve a list of persons matching a search keyword, use the contacts_db_search_records() function with the search keyword as the second parameter.

    -

    The following example shows how to find all person records that contain the keyword "John":

    +

    The following example shows how to find all person records that contain the keyword "John":

     contacts_list_h list = NULL;
 
-error_code = contacts_db_search_records(_contacts_person._uri, "John",
-                                        0, 0, &list);
+error_code = contacts_db_search_records(_contacts_person._uri, "John",
+                                        0, 0, &list);
    • @@ -1183,19 +1183,19 @@ error_code = contacts_db_search_records(_contacts_person._uri, "John", Note Some functions have the _p postfix. The postfix means that the returned value must not be freed by the application, as it is a pointer to the data in an existing record. - +

    The following example iterates through the list and retrieves the display name of each person:

     contacts_record_h record;
 while (contacts_list_get_current_record_p(list, &record)
-       == CONTACTS_ERROR_NONE) {
-    char *display_name;
-    error_code = contacts_record_get_str_p(record,
-                                           _contacts_person.display_name,
-                                           &display_name);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "display_name: %s", display_name);
-
-    error_code = contacts_list_next(list);
+       == CONTACTS_ERROR_NONE) {
+    char *display_name;
+    error_code = contacts_record_get_str_p(record,
+                                           _contacts_person.display_name,
+                                           &display_name);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "display_name: %s", display_name);
+
+    error_code = contacts_list_next(list);
 }
    @@ -1205,23 +1205,23 @@ while (contacts_list_get_current_record_p(list, &record) contacts_gl_person_data_t *gl_person_data = NULL; contacts_record_h record; while (contacts_list_get_current_record_p(list, &record) -       == CONTACTS_ERROR_NONE) { -    gl_person_data = _create_gl_person_data(record); -    /* You can get, for example, display name: */ -    /* gl_person_data->display_name */ + == CONTACTS_ERROR_NONE) { + gl_person_data = _create_gl_person_data(record); + /* You can get, for example, display name: */ + /* gl_person_data->display_name */ -    _free_gl_person_data(gl_person_data); + _free_gl_person_data(gl_person_data); -    error_code = contacts_list_next(list); + error_code = contacts_list_next(list); }

    Define the contacts_gl_person_data_t structure and the functions for using the structure:

     struct _contacts_gl_person_data {
-    int id;
-    char *display_name;
-    char *default_phone_number;
-    contacts_list_h associated_contacts;
+    int id;
+    char *display_name;
+    char *default_phone_number;
+    contacts_list_h associated_contacts;
 };
 typedef struct _contacts_gl_person_data contacts_gl_person_data_t;
 
@@ -1229,75 +1229,75 @@ typedef struct _contacts_gl_person_data contacts_gl_person_data_t;
 static void
 _free_gl_person_data(contacts_gl_person_data_t *gl_person_data)
 {
-    if (NULL == gl_person_data)
-        return;
+    if (NULL == gl_person_data)
+        return;
 
-    free(gl_person_data->display_name);
-    free(gl_person_data->default_phone_number);
-    contacts_list_destroy(gl_person_data->associated_contacts, true);
-    free(gl_person_data);
+    free(gl_person_data->display_name);
+    free(gl_person_data->default_phone_number);
+    contacts_list_destroy(gl_person_data->associated_contacts, true);
+    free(gl_person_data);
 }
 
 /* Create the structure for a person */
 static contacts_gl_person_data_t*
 _create_gl_person_data(contacts_record_h record)
 {
-    contacts_gl_person_data_t *gl_person_data;
-
-    gl_person_data = malloc(sizeof(contacts_gl_person_data_t));
-    memset(gl_person_data, 0x0, sizeof(contacts_gl_person_data_t));
-    if (contacts_record_get_int(record, _contacts_person.id,
-                                &gl_person_data->id) != CONTACTS_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get person id failed ");
-        _free_gl_person_data(gl_person_data);
-
-        return NULL;
-    }
-    if (false == _get_display_name(record, &gl_person_data->display_name)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "_get_display_name() failed ");
-        _free_gl_person_data(gl_person_data);
-
-        return NULL;
-    }
-    if (false == _get_default_phone_number(record,
-                                           &gl_person_data->default_phone_number)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "_get_default_phone_number() failed ");
-        _free_gl_person_data(gl_person_data);
-
-        return NULL;
-    }
-    if (false == _get_associated_contacts(record,
-                                          &gl_person_data->associated_contacts)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "_get_associated_contacts() failed ");
-        _free_gl_person_data(gl_person_data);
-
-        return NULL;
-    }
-    _print_phone_numbers(gl_person_data->associated_contacts);
-    _print_events(gl_person_data->associated_contacts);
-
-    return gl_person_data;
+    contacts_gl_person_data_t *gl_person_data;
+
+    gl_person_data = malloc(sizeof(contacts_gl_person_data_t));
+    memset(gl_person_data, 0x0, sizeof(contacts_gl_person_data_t));
+    if (contacts_record_get_int(record, _contacts_person.id,
+                                &gl_person_data->id) != CONTACTS_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get person id failed ");
+        _free_gl_person_data(gl_person_data);
+
+        return NULL;
+    }
+    if (false == _get_display_name(record, &gl_person_data->display_name)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "_get_display_name() failed ");
+        _free_gl_person_data(gl_person_data);
+
+        return NULL;
+    }
+    if (false == _get_default_phone_number(record,
+                                           &gl_person_data->default_phone_number)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "_get_default_phone_number() failed ");
+        _free_gl_person_data(gl_person_data);
+
+        return NULL;
+    }
+    if (false == _get_associated_contacts(record,
+                                          &gl_person_data->associated_contacts)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "_get_associated_contacts() failed ");
+        _free_gl_person_data(gl_person_data);
+
+        return NULL;
+    }
+    _print_phone_numbers(gl_person_data->associated_contacts);
+    _print_events(gl_person_data->associated_contacts);
+
+    return gl_person_data;
 }

    Define the functions for retrieving the person details:

    @@ -2435,7 +2435,7 @@ int speeddial_id = ...; /* Get the speed dial ID */ int error_code; error_code = contacts_db_get_record(_contacts_speeddial._uri, speeddial_id, -                                    &speeddial); + &speeddial); @@ -2489,8 +2489,8 @@ error_code = contacts_filter_create(_contacts_speeddial._uri, &filter);

    The following example adds an integer-based filtering condition that retrieves only speed dials whose number is less than 3:

     error_code = contacts_filter_add_int(filter,
-                                     _contacts_speeddial.speeddial_number,
-                                     CONTACTS_MATCH_LESS_THAN, 3);
+                                     _contacts_speeddial.speeddial_number,
+                                     CONTACTS_MATCH_LESS_THAN, 3);
  • @@ -2499,11 +2499,11 @@ error_code = contacts_filter_add_int(filter,

    The combination of the OR operator and the 2 conditions means that the filter only retrieves speed dials whose number is less than 3 or greater than 15.

     error_code = contacts_filter_add_operator(filter,
-                                          CONTACTS_FILTER_OPERATOR_OR);
+                                          CONTACTS_FILTER_OPERATOR_OR);
 
 error_code = contacts_filter_add_int(filter,
-                                     _contacts_speeddial.speeddial_number,
-                                     CONTACTS_MATCH_GREATER_THAN, 15);
+                                     _contacts_speeddial.speeddial_number,
+                                     CONTACTS_MATCH_GREATER_THAN, 15);
  • @@ -2547,16 +2547,16 @@ contacts_query_destroy(query); 
     contacts_record_h record;
 while (contacts_list_get_current_record_p(list, &record)
-       == CONTACTS_ERROR_NONE) {
-    int number;
-    error_code = contacts_record_get_int(record,
-                                         _contacts_speeddial.speeddial_number,
-                                         &number);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "speed dial number: %d", number);
-
-    error_code = contacts_list_next(list);
-    if (error_code != CONTACTS_ERROR_NONE)
-        break;
+       == CONTACTS_ERROR_NONE) {
+    int number;
+    error_code = contacts_record_get_int(record,
+                                         _contacts_speeddial.speeddial_number,
+                                         &number);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "speed dial number: %d", number);
+
+    error_code = contacts_list_next(list);
+    if (error_code != CONTACTS_ERROR_NONE)
+        break;
 }
    • @@ -2566,23 +2566,23 @@ while (contacts_list_get_current_record_p(list, &record) contacts_gl_speeddial_data_t *gl_speeddial_data = NULL; contacts_record_h record; while (contacts_list_get_current_record_p(list, &record) -       == CONTACTS_ERROR_NONE) { -    gl_speeddial_data = _create_gl_speeddial_data(record); + == CONTACTS_ERROR_NONE) { + gl_speeddial_data = _create_gl_speeddial_data(record); -    _free_gl_speeddial_data(gl_speeddial_data); + _free_gl_speeddial_data(gl_speeddial_data); -    error_code = contacts_list_next(list); -    if (error_code != CONTACTS_ERROR_NONE) -        break; + error_code = contacts_list_next(list); + if (error_code != CONTACTS_ERROR_NONE) + break; }

    Define the contacts_gl_speeddial_data_t structure and the functions for using the structure:

     struct _contacts_gl_speeddial_data {
-    int speeddial_number;
-    char *number;
-    char *display_name;
-    char *image_thumbnail_path;
+    int speeddial_number;
+    char *number;
+    char *display_name;
+    char *image_thumbnail_path;
 };
 typedef struct _contacts_gl_speeddial_data contacts_gl_speeddial_data_t;
 
@@ -2590,60 +2590,60 @@ typedef struct _contacts_gl_speeddial_data contacts_gl_speeddial_data_t;
 static void
 _free_gl_speeddial_data(contacts_gl_speeddial_data_t *gl_speeddial_data)
 {
-    if (NULL == gl_speeddial_data)
-        return;
+    if (NULL == gl_speeddial_data)
+        return;
 
-    free(gl_speeddial_data->number);
-    free(gl_speeddial_data->display_name);
-    free(gl_speeddial_data->image_thumbnail_path);
-    free(gl_speeddial_data);
+    free(gl_speeddial_data->number);
+    free(gl_speeddial_data->display_name);
+    free(gl_speeddial_data->image_thumbnail_path);
+    free(gl_speeddial_data);
 }
 
 /* Create the structure for a speed dial */
 static contacts_gl_speeddial_data_t*
 _create_gl_speeddial_data(contacts_record_h record)
 {
-    contacts_gl_speeddial_data_t *gl_speeddial_data;
-    int error_code;
-
-    gl_speeddial_data = malloc(sizeof(contacts_gl_speeddial_data_t));
-    memset(gl_speeddial_data, 0x0, sizeof(contacts_gl_speeddial_data_t));
-
-    if (CONTACTS_ERROR_NONE
-        != contacts_record_get_int(record, _contacts_speeddial.speeddial_number,
-                                   &gl_speeddial_data->speeddial_number)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get speed dial number failed ");
-        _free_gl_speeddial_data(gl_speeddial_data);
-
-        return NULL;
-    }
-    if (CONTACTS_ERROR_NONE
-        != contacts_record_get_str(record, _contacts_speeddial.number,
-                                   &gl_speeddial_data->number)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get contact number failed ");
-        _free_gl_speeddial_data(gl_speeddial_data);
-
-        return NULL;
-    }
-    if (CONTACTS_ERROR_NONE
-        != contacts_record_get_str(record, _contacts_speeddial.display_name,
-                                   &gl_speeddial_data->display_name)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get display name failed ");
-        _free_gl_speeddial_data(gl_speeddial_data);
-
-        return NULL;
-    }
-    if (CONTACTS_ERROR_NONE
-        != contacts_record_get_str(record,
-                                   _contacts_speeddial.image_thumbnail_path,
-                                   &gl_speeddial_data->image_thumbnail_path)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get thumbnail failed ");
-        _free_gl_speeddial_data(gl_speeddial_data);
-
-        return NULL;
-    }
-
-    return gl_speeddial_data;
+    contacts_gl_speeddial_data_t *gl_speeddial_data;
+    int error_code;
+
+    gl_speeddial_data = malloc(sizeof(contacts_gl_speeddial_data_t));
+    memset(gl_speeddial_data, 0x0, sizeof(contacts_gl_speeddial_data_t));
+
+    if (CONTACTS_ERROR_NONE
+        != contacts_record_get_int(record, _contacts_speeddial.speeddial_number,
+                                   &gl_speeddial_data->speeddial_number)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get speed dial number failed ");
+        _free_gl_speeddial_data(gl_speeddial_data);
+
+        return NULL;
+    }
+    if (CONTACTS_ERROR_NONE
+        != contacts_record_get_str(record, _contacts_speeddial.number,
+                                   &gl_speeddial_data->number)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get contact number failed ");
+        _free_gl_speeddial_data(gl_speeddial_data);
+
+        return NULL;
+    }
+    if (CONTACTS_ERROR_NONE
+        != contacts_record_get_str(record, _contacts_speeddial.display_name,
+                                   &gl_speeddial_data->display_name)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get display name failed ");
+        _free_gl_speeddial_data(gl_speeddial_data);
+
+        return NULL;
+    }
+    if (CONTACTS_ERROR_NONE
+        != contacts_record_get_str(record,
+                                   _contacts_speeddial.image_thumbnail_path,
+                                   &gl_speeddial_data->image_thumbnail_path)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get thumbnail failed ");
+        _free_gl_speeddial_data(gl_speeddial_data);
+
+        return NULL;
+    }
+
+    return gl_speeddial_data;
 }
    @@ -2673,7 +2673,7 @@ int speeddial_number = ...; /* Get the speed dial number */ contacts_record_h speeddial = NULL; error_code = contacts_db_get_record(_contacts_speeddial._uri, speeddial_number, -                                    &speeddial); + &speeddial);

    You can also retrieve the speed dial using a search function, such as contacts_db_get_records_with_query().

    @@ -2685,9 +2685,9 @@ error_code = contacts_db_get_record(_contacts_speeddial._uri, speeddial_number, int number_id = ...; /* Get the number ID */ error_code = contacts_record_set_int(speeddial, _contacts_speeddial.number_id, -                                     number_id); + number_id); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "get number ID failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "get number ID failed: %x", error_code); @@ -2733,7 +2733,7 @@ contacts_record_h log; error_code = contacts_record_create(_contacts_phone_log._uri, &log); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "contacts_record_create failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "contacts_record_create failed: %x", error_code); @@ -2744,9 +2744,9 @@ if (error_code != CONTACTS_ERROR_NONE)

    To set the log type, use the contacts_record_set_int() function with the _contacts_phone_log.log_type property as the second parameter. The third parameter defines the log type using the values of the contacts_phone_log_type_e enumeration (in mobile and wearable applications).

     error_code = contacts_record_set_int(log, _contacts_phone_log.log_type,
-                                     CONTACTS_PLOG_TYPE_VOICE_INCOMING);
+                                     CONTACTS_PLOG_TYPE_VOICE_INCOMING);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set log type failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set log type failed: %x", error_code);
    @@ -2754,9 +2754,9 @@ if (error_code != CONTACTS_ERROR_NONE)

    To set the log time (calculated as number of seconds since 1970-01-01 00:00:00 UTC), use the contacts_record_set_int() function with the _contacts_phone_log.log_time property as the second parameter:

     error_code = contacts_record_set_int(log, _contacts_phone_log.log_time,
-                                     (int)time(NULL));
+                                     (int)time(NULL));
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set log time failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set log time failed: %x", error_code);
  • @@ -2764,16 +2764,16 @@ if (error_code != CONTACTS_ERROR_NONE) 
     error_code = contacts_record_set_int(log, _contacts_phone_log.extra_data1, 37);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set duration failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set duration failed: %x", error_code);

  • To set the log address (in practice, the phone number or email address), use the contacts_record_set_str() function with the _contacts_phone_log.address property as the second parameter:

     error_code = contacts_record_set_str(log, _contacts_phone_log.address,
-                                     "+8231-1234-5678");
+                                     "+8231-1234-5678");
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "set address failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "set address failed: %x", error_code);
    • @@ -2789,8 +2789,8 @@ int added_log_id = -1; error_code = contacts_db_insert_record(log, &added_log_id); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "contacts_db_insert_record failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "contacts_db_insert_record failed: %x", error_code); @@ -2818,7 +2818,7 @@ int error_code; error_code = contacts_db_get_record(_contacts_phone_log._uri, log_id, &log); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "get log failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "get log failed: %x", error_code); @@ -2845,8 +2845,8 @@ contacts_list_h list = NULL; error_code = contacts_db_get_all_records(_contacts_phone_log._uri, 0, 0, &list); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "contacts_db_get_all_records failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "contacts_db_get_all_records failed: %x", error_code);
  • @@ -2860,8 +2860,8 @@ contacts_query_h query = NULL; error_code = contacts_query_create(_contacts_phone_log._uri, &query); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "contacts_query_create failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "contacts_query_create failed: %x", error_code);
  • @@ -2871,8 +2871,8 @@ contacts_filter_h filter = NULL; error_code = contacts_filter_create(_contacts_phone_log._uri, &filter); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, -               "contacts_filter_create failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, + "contacts_filter_create failed: %x", error_code);
  • @@ -2880,11 +2880,11 @@ if (error_code != CONTACTS_ERROR_NONE)

    The following example adds an integer-based filtering condition that retrieves any log whose type is CONTACTS_PLOG_TYPE_VOICE_INCOMING:

     error_code = contacts_filter_add_int(filter, _contacts_phone_log.log_type,
-                                     CONTACTS_MATCH_EQUAL,
-                                     CONTACTS_PLOG_TYPE_VOICE_INCOMING);
+                                     CONTACTS_MATCH_EQUAL,
+                                     CONTACTS_PLOG_TYPE_VOICE_INCOMING);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x", error_code);
  • @@ -2893,18 +2893,18 @@ if (error_code != CONTACTS_ERROR_NONE)

    The combination of the OR operator and the 2 conditions means that the filter only retrieves logs whose type is CONTACTS_PLOG_TYPE_VOICE_INCOMING or CONTACTS_PLOG_TYPE_VOICE_OUTGOING.

     error_code =
-    contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_OR);
+    contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_OR);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "contacts_filter_add_operator failed: %x",
-               error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "contacts_filter_add_operator failed: %x",
+               error_code);
 
 error_code = contacts_filter_add_int(filter, _contacts_phone_log.log_type,
-                                     CONTACTS_MATCH_EQUAL,
-                                     CONTACTS_PLOG_TYPE_VOICE_OUTGOING);
+                                     CONTACTS_MATCH_EQUAL,
+                                     CONTACTS_PLOG_TYPE_VOICE_OUTGOING);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "filter add condition failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "filter add condition failed: %x", error_code);
  • @@ -2912,8 +2912,8 @@ if (error_code != CONTACTS_ERROR_NONE) 
     error_code = contacts_query_set_filter(query, filter);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "contacts_query_set_filter failed: %x", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "contacts_query_set_filter failed: %x", error_code);
  • @@ -2921,9 +2921,9 @@ if (error_code != CONTACTS_ERROR_NONE) 
     error_code = contacts_db_get_records_with_query(query, 0, 0, &list);
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG,
-               "contacts_db_get_records_with_query failed: %x",
-               error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG,
+               "contacts_db_get_records_with_query failed: %x",
+               error_code);

    The third parameter defines a limit for the number of results. If you set it to 0, the list returns all logs matching the query.

    • @@ -2951,20 +2951,20 @@ contacts_query_destroy(query); Note Some functions have the _p postfix. The postfix means that the returned value must not be freed by the application, as it is a pointer to the data in an existing record. - +

    The following example iterates through the list and retrieves the type of each log:

     contacts_record_h record;
 while (contacts_list_get_current_record_p(list, &record)
-       == CONTACTS_ERROR_NONE) {
-    int type;
-    error_code = contacts_record_get_int(record, _contacts_phone_log.log_type,
-                                         &type);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "log type: %d", type);
-
-    error_code = contacts_list_next(list);
-    if (error_code != CONTACTS_ERROR_NONE)
-        break;
+       == CONTACTS_ERROR_NONE) {
+    int type;
+    error_code = contacts_record_get_int(record, _contacts_phone_log.log_type,
+                                         &type);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "log type: %d", type);
+
+    error_code = contacts_list_next(list);
+    if (error_code != CONTACTS_ERROR_NONE)
+        break;
 }
    @@ -2974,22 +2974,22 @@ while (contacts_list_get_current_record_p(list, &record) contacts_gl_log_data_t *gl_log_data = NULL; contacts_record_h record; while (contacts_list_get_current_record_p(list, &record) -       == CONTACTS_ERROR_NONE) { -    gl_log_data = _create_gl_log_data(record); + == CONTACTS_ERROR_NONE) { + gl_log_data = _create_gl_log_data(record); -    _free_gl_log_data(gl_log_data); -    error_code = contacts_list_next(list); -    if (error_code != CONTACTS_ERROR_NONE) -        break; + _free_gl_log_data(gl_log_data); + error_code = contacts_list_next(list); + if (error_code != CONTACTS_ERROR_NONE) + break; }

    Define the contacts_gl_log_data_t structure and the functions for using the structure:

     struct _contacts_gl_log_data {
-    int id;
-    char *address;
-    int log_type;
-    int log_time;
+    int id;
+    char *address;
+    int log_type;
+    int log_time;
 };
 typedef struct _contacts_gl_log_data contacts_gl_log_data_t;
 
@@ -2997,57 +2997,57 @@ typedef struct _contacts_gl_log_data contacts_gl_log_data_t;
 static void
 _free_gl_log_data(contacts_gl_log_data_t *gl_log_data)
 {
-    if (NULL == gl_log_data)
-        return;
+    if (NULL == gl_log_data)
+        return;
 
-    free(gl_log_data->address);
-    free(gl_log_data);
+    free(gl_log_data->address);
+    free(gl_log_data);
 }
 
 /* Create the structure for a log */
 static contacts_gl_log_data_t*
 _create_gl_log_data(contacts_record_h record)
 {
-    contacts_gl_log_data_t *gl_log_data;
-    int error_code;
-
-    gl_log_data = malloc(sizeof(contacts_gl_log_data_t));
-    memset(gl_log_data, 0x0, sizeof(contacts_gl_log_data_t));
-
-    if (CONTACTS_ERROR_NONE != contacts_record_get_int(record,
-                                                       _contacts_phone_log.id,
-                                                       &gl_log_data->id)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get log ID failed ");
-        _free_gl_log_data(gl_log_data);
-
-        return NULL;
-    }
-    if (CONTACTS_ERROR_NONE != contacts_record_get_str(record,
-                                                       _contacts_phone_log.address,
-                                                       &gl_log_data->address)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get log address failed ");
-        _free_gl_log_data(gl_log_data);
-
-        return NULL;
-    }
-    if (CONTACTS_ERROR_NONE
-        != contacts_record_get_int(record, _contacts_phone_log.log_type,
-                                   &gl_log_data->log_type)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get log type failed ");
-        _free_gl_log_data(gl_log_data);
-
-        return NULL;
-    }
-    if (CONTACTS_ERROR_NONE
-        != contacts_record_get_int(record, _contacts_phone_log.log_time,
-                                   &gl_log_data->log_time)) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "get log time failed ");
-        _free_gl_log_data(gl_log_data);
-
-        return NULL;
-    }
-
-    return gl_log_data;
+    contacts_gl_log_data_t *gl_log_data;
+    int error_code;
+
+    gl_log_data = malloc(sizeof(contacts_gl_log_data_t));
+    memset(gl_log_data, 0x0, sizeof(contacts_gl_log_data_t));
+
+    if (CONTACTS_ERROR_NONE != contacts_record_get_int(record,
+                                                       _contacts_phone_log.id,
+                                                       &gl_log_data->id)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get log ID failed ");
+        _free_gl_log_data(gl_log_data);
+
+        return NULL;
+    }
+    if (CONTACTS_ERROR_NONE != contacts_record_get_str(record,
+                                                       _contacts_phone_log.address,
+                                                       &gl_log_data->address)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get log address failed ");
+        _free_gl_log_data(gl_log_data);
+
+        return NULL;
+    }
+    if (CONTACTS_ERROR_NONE
+        != contacts_record_get_int(record, _contacts_phone_log.log_type,
+                                   &gl_log_data->log_type)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get log type failed ");
+        _free_gl_log_data(gl_log_data);
+
+        return NULL;
+    }
+    if (CONTACTS_ERROR_NONE
+        != contacts_record_get_int(record, _contacts_phone_log.log_time,
+                                   &gl_log_data->log_time)) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "get log time failed ");
+        _free_gl_log_data(gl_log_data);
+
+        return NULL;
+    }
+
+    return gl_log_data;
 }
    @@ -3072,7 +3072,7 @@ int log_id = ...; /* Get the log ID */ error_code = contacts_db_delete_record(_contacts_phone_log._uri, log_id); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "contacts_db_delete_record failed: %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "contacts_db_delete_record failed: %x", error_code);

    Creating a Record

    @@ -3113,15 +3113,15 @@ error_code = contacts_record_create(_contacts_address._uri, &haddress);

    The following example sets the country of the address:

     error_code = contacts_record_set_str(haddress, _contacts_address.country,
-                                     "Korea");
+                                     "Korea");

  • Add the address record as a child record to the contact record:

     error_code = contacts_record_add_child_record(hcontact,
-                                              _contacts_contact.address,
-                                              haddress);
+                                              _contacts_contact.address,
+                                              haddress);
    @@ -3176,7 +3176,7 @@ contacts_db_get_record(_contacts_contact._uri, ID, &record);

  • Retrieve direct record details.

    To retrieve details directly from the record, use a contacts_record_get_XXX() function. The specific function depends on the data type of the detail (property) you want to retrieve.

    -

    The following example uses the contacts_record_get_str() function to retrieve a contact's display name, which is a string value:

    +

    The following example uses the contacts_record_get_str() function to retrieve a contact's display name, which is a string value:

     char *d_name;
 contacts_record_get_str(record, _contacts_contact.display_name, d_name);
@@ -3192,7 +3192,7 @@ free(d_name);
 
     contacts_record_h child_record;
 contacts_record_get_child_record_at_p(record, _contacts_contact.name,
-                                      0, &child_record);
+                                      0, &child_record);
 
 /* From the child record, retrieve the first name using the name view */
 char *f_name = NULL;
@@ -3229,11 +3229,11 @@ char *number = gldata->number;
 
 /* Define the structure */
 struct _contact_gl_data {
-    int id;
-    char *first;
-    char *last;
-    char *number;
-    char *image_path;
+    int id;
+    char *first;
+    char *last;
+    char *number;
+    char *image_path;
 };
 typedef struct _contact_gl_data contact_gl_data_t;
 
@@ -3241,44 +3241,44 @@ typedef struct _contact_gl_data contact_gl_data_t;
 static contact_gl_data_t*
 _create_gl_data(contacts_record_h r_contact)
 {
-    contact_gl_data_t *data;
-    data = malloc(sizeof(contact_gl_data_t));
-    memset(data, 0x0, sizeof(contact_gl_data_t));
-
-    if (! _get_contact_id(r_contact, &data->id)) {
-        free(data);
-
-        return NULL;
-    }
-
-    if (!_get_contact_number(r_contact, &data->number)) {
-        free(data);
-
-        return NULL;
-    }
-    if (!_get_contact_first(r_contact, &data->first)) {
-        free(data->number);
-        free(data);
-
-        return NULL;
-    }
-    if (!_get_contact_last(r_contact, &data->last)) {
-        free(data->number);
-        free(data->first);
-        free(data);
-
-        return NULL;
-    }
-    if (!_get_contact_image(r_contact, &data->image_path)) {
-        free(data->number);
-        free(data->first);
-        free(data->last);
-        free(data);
-
-        return NULL;
-    }
-
-    return data;
+    contact_gl_data_t *data;
+    data = malloc(sizeof(contact_gl_data_t));
+    memset(data, 0x0, sizeof(contact_gl_data_t));
+
+    if (! _get_contact_id(r_contact, &data->id)) {
+        free(data);
+
+        return NULL;
+    }
+
+    if (!_get_contact_number(r_contact, &data->number)) {
+        free(data);
+
+        return NULL;
+    }
+    if (!_get_contact_first(r_contact, &data->first)) {
+        free(data->number);
+        free(data);
+
+        return NULL;
+    }
+    if (!_get_contact_last(r_contact, &data->last)) {
+        free(data->number);
+        free(data->first);
+        free(data);
+
+        return NULL;
+    }
+    if (!_get_contact_image(r_contact, &data->image_path)) {
+        free(data->number);
+        free(data->first);
+        free(data->last);
+        free(data);
+
+        return NULL;
+    }
+
+    return data;
 }
    • @@ -3308,170 +3308,170 @@ _create_gl_data(contacts_record_h r_contact) static bool _get_contact_id(contacts_record_h r_contact, int *id) { -    int error_code; + int error_code; -    error_code = contacts_record_get_int(r_contact, -                                         _contacts_contact.id, id); + error_code = contacts_record_get_int(r_contact, + _contacts_contact.id, id); -    return true; + return true; }
  • -

    To retrieve the contact's phone number, first check whether the contact has at least 1 phone number using the contacts_record_get_bool() function on the contact record with the _contacts_contact.has_phonenumber property. If the contact has 1 or more phone numbers, retrieve the numbers using the various Query (in mobile and wearable applications) and Filter (in mobile and wearable applications) functions from the Contacts API. The numbers are stored in the number child records (the _contacts_number view). After you are done, free any data returned by a function not containing the _p suffix.

    +

    To retrieve the contact's phone number, first check whether the contact has at least 1 phone number using the contacts_record_get_bool() function on the contact record with the _contacts_contact.has_phonenumber property. If the contact has 1 or more phone numbers, retrieve the numbers using the various Query (in mobile and wearable applications) and Filter (in mobile and wearable applications) functions from the Contacts API. The numbers are stored in the number child records (the _contacts_number view). After you are done, free any data returned by a function not containing the _p suffix.

    The following example checks whether the contact has any phone numbers. Then, it queries all phone numbers and filters the search so that only the numbers that are default numbers and belong to the specific contact are included in the search result.

     static bool
 _get_contact_number(contacts_record_h r_contact, char **number)
 {
-    int id;
-    int error_code;
-    contacts_record_h r_number;
-    contacts_query_h query = NULL;
-    contacts_filter_h filter = NULL;
-    contacts_list_h list = NULL;
+    int id;
+    int error_code;
+    contacts_record_h r_number;
+    contacts_query_h query = NULL;
+    contacts_filter_h filter = NULL;
+    contacts_list_h list = NULL;
 
-    if (!_get_contact_id(r_contact, &id))
-        return false;
+    if (!_get_contact_id(r_contact, &id))
+        return false;
 
-    bool has_number;
-    error_code = contacts_record_get_bool(r_contact,
-                                          _contacts_contact.has_phonenumber,
-                                          &has_number);
+    bool has_number;
+    error_code = contacts_record_get_bool(r_contact,
+                                          _contacts_contact.has_phonenumber,
+                                          &has_number);
 
-    error_code = contacts_query_create(_contacts_number._uri, &query);
+    error_code = contacts_query_create(_contacts_number._uri, &query);
 
-    unsigned int fields[] = {_contacts_number.number};
-    error_code = contacts_query_set_projection(query, fields, 1);
+    unsigned int fields[] = {_contacts_number.number};
+    error_code = contacts_query_set_projection(query, fields, 1);
 
-    error_code = contacts_filter_create(_contacts_number._uri, &filter);
+    error_code = contacts_filter_create(_contacts_number._uri, &filter);
 
-    error_code = contacts_filter_add_int(filter,
-                                         _contacts_number.contact_id,
-                                         CONTACTS_MATCH_EXACTLY, id);
+    error_code = contacts_filter_add_int(filter,
+                                         _contacts_number.contact_id,
+                                         CONTACTS_MATCH_EXACTLY, id);
 
-    error_code =
-        contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_AND);
+    error_code =
+        contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_AND);
 
-    error_code =
-        contacts_filter_add_bool(filter, _contacts_number.is_default, true);
+    error_code =
+        contacts_filter_add_bool(filter, _contacts_number.is_default, true);
 
-    error_code = contacts_query_set_filter(query, filter);
+    error_code = contacts_query_set_filter(query, filter);
 
-    error_code = contacts_db_get_records_with_query(query, 0, 1, &list);
+    error_code = contacts_db_get_records_with_query(query, 0, 1, &list);
 
-    error_code = contacts_list_get_current_record_p(list, &r_number);
+    error_code = contacts_list_get_current_record_p(list, &r_number);
 
-    error_code =
-        contacts_record_get_str(r_number, _contacts_number.number, number);
+    error_code =
+        contacts_record_get_str(r_number, _contacts_number.number, number);
 
-    contacts_query_destroy(query);
-    contacts_filter_destroy(filter);
-    contacts_list_destroy(list, true);
+    contacts_query_destroy(query);
+    contacts_filter_destroy(filter);
+    contacts_list_destroy(list, true);
 }
    -

    The following alternative example retrieves the contact's default phone number directly:

    +

    The following alternative example retrieves the contact's default phone number directly:

     static bool
 _get_contact_number(contacts_record_h r_contact, char **number)
 {
-    int error_code;
-    contacts_record_h r_number;
-
-    bool has_number;
-    error_code = contacts_record_get_bool(r_contact,
-                                          _contacts_contact.has_phonenumber,
-                                          &has_number);
-
-    if (!has_number) {
-        *number = NULL;
-
-        return true;
-    }
-
-    int i;
-    unsigned int count = 0;
-    bool is_default = false;
-    error_code =
-        contacts_record_get_child_record_count(contact,
-                                               _contacts_contact.number,
-                                               &count);
-
-    for (i = 0; i < count; i++) {
-        error_code =
-            contacts_record_get_child_record_at_p(r_contact,
-                                                  _contacts_contact.number,
-                                                  i, &r_number);
-        error_code = contacts_record_get_bool(r_number,
-                                              _contacts_number.is_default,
-                                              &is_default);
-        if (is_default) {
-            error_code = contacts_record_get_str(r_number,
-                                                 _contacts_number.number,
-                                                 number);
-
-            return true;
-        }
-    }
-    *number = NULL;
-
-    return false;
+    int error_code;
+    contacts_record_h r_number;
+
+    bool has_number;
+    error_code = contacts_record_get_bool(r_contact,
+                                          _contacts_contact.has_phonenumber,
+                                          &has_number);
+
+    if (!has_number) {
+        *number = NULL;
+
+        return true;
+    }
+
+    int i;
+    unsigned int count = 0;
+    bool is_default = false;
+    error_code =
+        contacts_record_get_child_record_count(contact,
+                                               _contacts_contact.number,
+                                               &count);
+
+    for (i = 0; i < count; i++) {
+        error_code =
+            contacts_record_get_child_record_at_p(r_contact,
+                                                  _contacts_contact.number,
+                                                  i, &r_number);
+        error_code = contacts_record_get_bool(r_number,
+                                              _contacts_number.is_default,
+                                              &is_default);
+        if (is_default) {
+            error_code = contacts_record_get_str(r_number,
+                                                 _contacts_number.number,
+                                                 number);
+
+            return true;
+        }
+    }
+    *number = NULL;
+
+    return false;
 }

    To retrieve a second number, change the third parameter of the contacts_record_get_child_record_at_p() function from 0 to 1.

  • -

    To retrieve the contact's name details, retrieve the name child record of the contact record using the contacts_record_get_child_record_at_p() function with the _contacts_contact.name property. From the child record, retrieve the name data using the contacts_record_get_str() function.

    -

    The following example retrieves the contact's first name from the name record:

    +

    To retrieve the contact's name details, retrieve the name child record of the contact record using the contacts_record_get_child_record_at_p() function with the _contacts_contact.name property. From the child record, retrieve the name data using the contacts_record_get_str() function.

    +

    The following example retrieves the contact's first name from the name record:

     static bool
 _get_contact_first(contacts_record_h r_contact, char **first)
 {
-    contacts_record_h r_name;
-    int error_code;
+    contacts_record_h r_name;
+    int error_code;
 
-    error_code =
-        contacts_record_get_child_record_at_p(r_contact,
-                                              _contacts_contact.name,
-                                              0, &r_name);
+    error_code =
+        contacts_record_get_child_record_at_p(r_contact,
+                                              _contacts_contact.name,
+                                              0, &r_name);
 
-    error_code = contacts_record_get_str(r_name, _contacts_name.first,
-                                         first);
+    error_code = contacts_record_get_str(r_name, _contacts_name.first,
+                                         first);
 }
    -

    The following example retrieves the contact's last name from the name record:

    +

    The following example retrieves the contact's last name from the name record:

     static bool
 _get_contact_last(contacts_record_h r_contact, char **last)
 {
-    contacts_record_h r_name;
-    int error_code;
+    contacts_record_h r_name;
+    int error_code;
 
-    error_code =
-        contacts_record_get_child_record_at_p(r_contact,
-                                              _contacts_contact.name,
-                                              0, &r_name);
+    error_code =
+        contacts_record_get_child_record_at_p(r_contact,
+                                              _contacts_contact.name,
+                                              0, &r_name);
 
-    error_code = contacts_record_get_str(r_name, _contacts_name.last, last);
+    error_code = contacts_record_get_str(r_name, _contacts_name.last, last);
 }
  • -

    To retrieve the contact's image, use the contacts_record_get_str() function on the contact record with the _contacts_contact.image_thumbnail_path property:

    +

    To retrieve the contact's image, use the contacts_record_get_str() function on the contact record with the _contacts_contact.image_thumbnail_path property:

     static bool
 _get_contact_image(contacts_record_h r_contact, char **image_path)
 {
-    int error_code;
+    int error_code;
 
-    error_code =
-        contacts_record_get_str(r_contact,
-                                _contacts_contact.image_thumbnail_path,
-                                image_path);
+    error_code =
+        contacts_record_get_str(r_contact,
+                                _contacts_contact.image_thumbnail_path,
+                                image_path);
 
-    dlog_print(DLOG_ERROR, LOG_TAG, "Thumb path: \'%s\'", *image_path);
+    dlog_print(DLOG_ERROR, LOG_TAG, "Thumb path: \'%s\'", *image_path);
 
-    return true;
+    return true;
 }
    • @@ -3525,38 +3525,38 @@ contacts_filter_create(_contacts_name._uri, &filter);

  • Add a filtering condition using a contacts_filter_add_XXX() function.

    -

    The following example adds a string-based filtering condition that retrieves name records where the last name starts with "Za":

    +

    The following example adds a string-based filtering condition that retrieves name records where the last name starts with "Za":

     contacts_filter_add_str(filter, _contacts_name.last_name,
-                        CONTACTS_MATCH_STARTSWITH, "Za");
+                        CONTACTS_MATCH_STARTSWITH, "Za");

    The available matching options (third parameter) for string-based filtering conditions are defined in the contacts_match_str_flag_e enumeration (in mobile and wearable applications).

  • To add more conditions, add a logical operator before each new condition using the contacts_filter_add_operator() function. The conditions and operators together define the filtering logic as a whole.

    -

    The following example first adds an AND operator and then a string-based filtering condition that retrieves name records where the last name ends with "ra".

    -

    The combination of the AND operator and the 2 conditions means that the filter only retrieves name records where the last name starts with "Za" and ends with "ra".

    +

    The following example first adds an AND operator and then a string-based filtering condition that retrieves name records where the last name ends with "ra".

    +

    The combination of the AND operator and the 2 conditions means that the filter only retrieves name records where the last name starts with "Za" and ends with "ra".

     contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_AND);
 
 contacts_filter_add_str(filter, _contacts_name.last_name,
-                        CONTACTS_MATCH_ENDSWITH, "ra");
+                        CONTACTS_MATCH_ENDSWITH, "ra");
  • -

    If you need to use a logical expression with brackets, such as "C1 AND C2 AND (C3 OR C4)", define the bracketed conditions in a separate filter, and add the new filter to the parent filter as a filtering condition using the contacts_filter_add_filter() function.

    +

    If you need to use a logical expression with brackets, such as "C1 AND C2 AND (C3 OR C4)", define the bracketed conditions in a separate filter, and add the new filter to the parent filter as a filtering condition using the contacts_filter_add_filter() function.

    The following example extends the previous example by first adding an AND operator and then a child filter with 2 string-based filtering conditions separated by an OR operator.

    -

    The combination of all the filtering conditions means that the parent filter only retrieves name records where (1) the last name starts with "Za" and ends with "ra" and (2) the first name starts with either "Ada" or "Igo".

    +

    The combination of all the filtering conditions means that the parent filter only retrieves name records where (1) the last name starts with "Za" and ends with "ra" and (2) the first name starts with either "Ada" or "Igo".

     contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_AND);
 
 contacts_filter_h n_filter = NULL;
 contacts_filter_create(_contacts_name._uri, &n_filter);
 contacts_filter_add_str(n_filter, _contacts_name.first_name,
-                        CONTACTS_MATCH_STARTSWITH, "Ada");
+                        CONTACTS_MATCH_STARTSWITH, "Ada");
 contacts_filter_add_operator(n_filter, CONTACTS_FILTER_OPERATOR_OR);
 contacts_filter_add_str(n_filter, _contacts_name.first_name,
-                        CONTACTS_MATCH_STARTSWITH, "Igo");
+                        CONTACTS_MATCH_STARTSWITH, "Igo");
 
 contacts_filter_add_filter(filter, n_filter);
    @@ -3580,9 +3580,9 @@ contacts_query_set_sort(query, _contacts_name.first, true);

    The following example limits the properties from the previous steps to the first and last name:

     unsigned my_projection[] = {_contacts_name.contact_id,
-                            _contacts_name.first, _contacts_name.last}
+                            _contacts_name.first, _contacts_name.last}
 contacts_query_set_projection(query, my_projection,
-                              sizeof(my_projection)/sizeof(int));
+                              sizeof(my_projection)/sizeof(int));

    The results of a filtered query can contain records that differ only in a few properties. After setting a projection to the filtered query, the results can contain identical records. To avoid these, use the contacts_query_set_distinct() function, which removes duplicates from the results:

    @@ -3622,16 +3622,16 @@ contacts_db_get_records_with_query(query, 0, 0, &list);
 
      
 
    • 
 
      To retrieve only basic details, use a contacts_record_get_XXX() function on the record.
      
-
      The following example use the contacts_record_get_str() function to retrieve a contact's display name:
      
+
      The following example use the contacts_record_get_str() function to retrieve a contact's display name:
      
 
       contacts_record_h record;
 
 while (contacts_list_get_current_record_p(list, &record) == 0) {
-    /* Get details */
-    char *disp_name;
-    contacts_record_get_str(record, _contacts_contact.display_name, &disp_name);
-    free(disp_name);
-    error_code = contacts_list_next(list);
+    /* Get details */
+    char *disp_name;
+    contacts_record_get_str(record, _contacts_contact.display_name, &disp_name);
+    free(disp_name);
+    error_code = contacts_list_next(list);
 }
 
      
 
      • 
@@ -3643,9 +3643,9 @@ contacts_record_h record;
 contact_gl_data_t *gldata = NULL;
 
 while (contacts_list_get_current_record_p(list, &record) == 0) {
-    gldata = _create_gl_data(record);
+    gldata = _create_gl_data(record);
 
-    error_code = contacts_list_next(list);
+    error_code = contacts_list_next(list);
 }
    • @@ -3657,19 +3657,19 @@ contacts_record_h record; contact_gl_data_t *gldata = NULL; while (contacts_list_get_current_record_p(list, &record) == 0) { -    int record_id; -    contacts_record_h c_record; + int record_id; + contacts_record_h c_record; -    /* Get the ID of the parent contact record */ -    contacts_record_get_int(record, _contacts_name.contact_id, &contact_id); + /* Get the ID of the parent contact record */ + contacts_record_get_int(record, _contacts_name.contact_id, &contact_id); -    /* Get the parent contact record */ -    contacts_db_get_record(_contacts_contact._uri, contact_id, &c_record); + /* Get the parent contact record */ + contacts_db_get_record(_contacts_contact._uri, contact_id, &c_record); -    /* Create the structure for the parent contact record */ -    gldata = _create_gl_data(c_record); + /* Create the structure for the parent contact record */ + gldata = _create_gl_data(c_record); -    error_code = contacts_list_next(list); + error_code = contacts_list_next(list); } @@ -3714,7 +3714,7 @@ contacts_list_add(list, record); int *ids = NULL; unsigned int count = 0; contacts_db_insert_records(list, &ids, &count); -dlog_print(DLOG_DEBUG, LOG_TAG, "%d records inserted", count); +dlog_print(DLOG_DEBUG, LOG_TAG, "%d records inserted", count); free(ids); @@ -3763,13 +3763,13 @@ error_code = contacts_record_get_int(record, _contacts_contact.id, &id); contacts_record h record1; int first_person_id; int error_code = contacts_record_get_int(record1, _contacts_contact.person_id, -                                         &first_person_id); + &first_person_id); /* Get the ID of the second person */ contacts_record h record2; int second_person_id; error_code = contacts_record_get_int(record2, _contacts_contact.person_id, -                                     &second_person_id); + &second_person_id); /* Link the persons */ contacts_person_link_person(first_person_id, second_person_id); @@ -3781,7 +3781,7 @@ int person_id = first_person_id;

  • Set the default properties for the linked person.

    Set the default properties from one of the associated contacts using the contacts_person_set_default_property() function. The first parameter uses the values of the contacts_person_property_e enumeration (in mobile and wearable applications), which defines the available default properties for a person.

    -

    For example, to set the person's default phone number based on the number of one of the associated contacts:

    +

    For example, to set the person's default phone number based on the number of one of the associated contacts:

    1. Retrieve the contact whose phone number you want to use.

    2. Retrieve the correct phone number record associated with the contact using the contacts_record_get_child_record_at_p() function.

      3. @@ -3797,7 +3797,7 @@ int error_code = -1; /* Get the phone number record */ contacts_record_h record_number; error_code = contacts_record_get_child_record_at_p(record, _contacts_contact.number, -                                                   0, &record_number); + 0, &record_number); /* Get the phone number ID */ int number_id; @@ -3806,7 +3806,7 @@ error_code = contacts_record_destroy(record_number, true); /* Set the phone number as the default for the person */ error_code = contacts_person_set_default_property(CONTACTS_PERSON_PROPERTY_NUMBER, -                                                  person_id, number_id); + person_id, number_id); @@ -3820,8 +3820,8 @@ error_code = contacts_person_set_default_property(CONTACTS_PERSON_PROPERTY_NUMBE 
       int person_email_number;
 error_code = contacts_person_get_default_property(CONTACTS_PERSON_PROPERTY_EMAIL,
-                                                  person_id,
-                                                  &person_email_number);
+                                                  person_id,
+                                                  &person_email_number);
    3. @@ -3829,7 +3829,7 @@ error_code = contacts_person_get_default_property(CONTACTS_PERSON_PROPERTY_EMAIL 
       contacts_record_h email_record;
 error_code = contacts_db_get_record(_contacts_email._uri, person_email_number,
-                                    &email_record);
+                                    &email_record);
    4. @@ -3837,7 +3837,7 @@ error_code = contacts_db_get_record(_contacts_email._uri, person_email_number, 
       char *default_email;
 error_code = contacts_record_get_str_p(email_record, _contacts_email.email,
-                                       &default_email);
+                                       &default_email);
 
 /* Use default_email */
 
@@ -3854,7 +3854,7 @@ int contact_id = ...; /* Get the contact ID */
 int unlinked_person_id;
 
 error_code = contacts_person_unlink_contact(person_id, contact_id,
-                                            &unlinked_person_id);
+                                            &unlinked_person_id);
      5. @@ -3872,10 +3872,10 @@ error_code = contacts_person_unlink_contact(person_id, contact_id, contacts_name_display_order_e display_order; contacts_setting_get_name_display_order(&display_order); /* Now you have the display order */ -sprintf("Display order: %s", -        display_order==CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST ? -        "CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST" : -        "CONTACTS_NAME_DISPLAY_ORDER_LASTFIRST"); +sprintf("Display order: %s", + display_order==CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST ? + "CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST" : + "CONTACTS_NAME_DISPLAY_ORDER_LASTFIRST"); @@ -3885,10 +3885,10 @@ sprintf("Display order: %s", contacts_name_sorting_order_e sorting_order; contacts_setting_get_name_sorting_order(&sorting_order); /* Now you have the sorting order */ -sprintf("Sorting order: %s", -        sorting_order==CONTACTS_NAME_SORTING_ORDER_FIRSTLAST ? -        "CONTACTS_NAME_SORTING_ORDER_FIRSTLAST" : -        "CONTACTS_NAME_SORTING_ORDER_LASTFIRST"); +sprintf("Sorting order: %s", + sorting_order==CONTACTS_NAME_SORTING_ORDER_FIRSTLAST ? + "CONTACTS_NAME_SORTING_ORDER_FIRSTLAST" : + "CONTACTS_NAME_SORTING_ORDER_LASTFIRST"); @@ -3912,22 +3912,22 @@ contacts_setting_set_name_sorting_order(CONTACTS_NAME_SORTING_ORDER_FIRSTLAST); 
       static void
 display_changed_cb(contacts_name_display_order_e name_display_order,
-                   void *user_data)
+                   void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "changed display order: %s",
-               name_display_order==CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST ?
-               "CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST" :
-               "CONTACTS_NAME_DISPLAY_ORDER_LASTFIRST");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "changed display order: %s",
+               name_display_order==CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST ?
+               "CONTACTS_NAME_DISPLAY_ORDER_FIRSTLAST" :
+               "CONTACTS_NAME_DISPLAY_ORDER_LASTFIRST");
 }
 
 static void
 sorting_changed_cb(contacts_name_sorting_order_e name_display_order,
-                   void *user_data)
+                   void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "changed sorting order: %s",
-               name_display_order==CONTACTS_NAME_SORTING_ORDER_FIRSTLAST ?
-               "CONTACTS_NAME_SORTING_ORDER_FIRSTLAST" :
-               "CONTACTS_NAME_SORTING_ORDER_LASTFIRST");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "changed sorting order: %s",
+               name_display_order==CONTACTS_NAME_SORTING_ORDER_FIRSTLAST ?
+               "CONTACTS_NAME_SORTING_ORDER_FIRSTLAST" :
+               "CONTACTS_NAME_SORTING_ORDER_LASTFIRST");
 }

      To track the changes, implement a timeout function after setting the callbacks.

      @@ -3949,7 +3949,7 @@ sorting_changed_cb(contacts_name_sorting_order_e name_display_order, 
       bool completed = false;
 contacts_sim_get_initialization_status(&completed);
-dlog_print(DLOG_DEBUG, LOG_TAG, "SIM %s completed", completed ? "" : "not ");
+dlog_print(DLOG_DEBUG, LOG_TAG, "SIM %s completed", completed ? "" : "not ");
      @@ -3988,7 +3988,7 @@ int error_code = contacts_sim_import_all_contacts();

    5. Retrieve the path to the source directory containing the vCard files you want to import.

      -

      The following example retrieves the path to the downloads directory of the device's internal storage:

      +

      The following example retrieves the path to the downloads directory of the device's internal storage:

       int internal_storage_id;
 char *vcf_path = NULL;
@@ -3996,43 +3996,43 @@ char *vcf_path = NULL;
 /* Handle the storages found on the device */
 static bool
 storage_cb(int storage_id, storage_type_e type, storage_state_e state,
-           const char *path, void *user_data)
+           const char *path, void *user_data)
 {
-    /* Check whether the storage is the device's internal storage */
-    if (type == STORAGE_TYPE_INTERNAL) {
-        /* Get the internal storage ID */
-        internal_storage_id = storage_id;
+    /* Check whether the storage is the device's internal storage */
+    if (type == STORAGE_TYPE_INTERNAL) {
+        /* Get the internal storage ID */
+        internal_storage_id = storage_id;
 
-        /* Internal storage found, end the callback loop */
-        return false;
-    }
+        /* Internal storage found, end the callback loop */
+        return false;
+    }
 
-    /* Internal storage not found, continue the callback loop */
-    return true;
+    /* Internal storage not found, continue the callback loop */
+    return true;
 }
 
 /* Get the source directory path */
 void
 get_storage_path()
 {
-    int error_code = 0;
-    char *path = NULL;
-
-    /* Get the storages available on the device */
-    /* Handle each storage in the storage_cb() callback */
-    error_code = storage_foreach_device_supported(storage_cb, NULL);
-
-    /*
-       Get the absolute path to the downloads directory
-       of the device's internal storage
-    */
-    error_code = storage_get_directory(internal_storage_id,
-                                       STORAGE_DIRECTORY_DOWNLOADS,
-                                       &path);
-    if (error_code != STORAGE_ERROR_NONE) {
-        vcf_path = strdup(path);
-        free(path);
-    }
+    int error_code = 0;
+    char *path = NULL;
+
+    /* Get the storages available on the device */
+    /* Handle each storage in the storage_cb() callback */
+    error_code = storage_foreach_device_supported(storage_cb, NULL);
+
+    /*
+       Get the absolute path to the downloads directory
+       of the device's internal storage
+    */
+    error_code = storage_get_directory(internal_storage_id,
+                                       STORAGE_DIRECTORY_DOWNLOADS,
+                                       &path);
+    if (error_code != STORAGE_ERROR_NONE) {
+        vcf_path = strdup(path);
+        free(path);
+    }
 }
      6. @@ -4048,63 +4048,63 @@ DIR *dir = opendir(vcf_path); struct dirent *pDirent = NULL; if (dir == NULL) { -    free(vcf_path); + free(vcf_path); -    return; + return; } if (dir) { -    while ((pDirent = readdir(dir)) != NULL) { -        /* -         If the directory entry is not a regular file, -         skip to the next directory entry -        */ -        if (pDirent->d_type != DT_REG) -            continue; - -        /* -         If the file is not a vCard file, -         skip to the next directory entry -        */ -        char *extension = strrchr(pDirent->d_name, '.'); -        if (!extension || strcmp(extension, ".vcf")) -            continue; -        dlog_print(DLOG_DEBUG, LOG_TAG, "file %s", pDirent->d_name); - -        /* Get the vCard file path */ -        char *file_path = malloc(strlen(vcf_path) + strlen(pDirent->d_name) + 4); -        sprintf(file_path, "%s/%s", vcf_path, pDirent->d_name); - -        /* -         If the vCard file does not contain any records, -         skip to the next directory entry -        */ -        int count; -        int error_code = contacts_vcard_get_entity_count(file_path, &count); -        if (count < 1) -            continue; - -        /* Calculate the vCard file size */ -        FILE *fp = fopen(file_path, "r"); -        if (fseek(fp, 0, 2) != 0) -            /* Error handling */ -        int bufsize = ftell(fp); -        rewind(fp); -        dlog_print(DLOG_DEBUG, LOG_TAG, "file size: %i", bufsize); -        if (bufsize < 1) -            return 1; - -        /* Create the vCard stream */ -        char *vcard_stream = malloc(sizeof(char) * (bufsize)); -        memset(vcard_stream, '\0', sizeof(vcard_stream)); -        if (fp != NULL) { -            char str[150]; -            while (fgets(str, 150, fp) != NULL) -                sprintf(vcard_stream + strlen(vcard_stream), "%s", str); -            fclose(fp); -        } else { -            return 1; -        } + while ((pDirent = readdir(dir)) != NULL) { + /* + If the directory entry is not a regular file, + skip to the next directory entry + */ + if (pDirent->d_type != DT_REG) + continue; + + /* + If the file is not a vCard file, + skip to the next directory entry + */ + char *extension = strrchr(pDirent->d_name, '.'); + if (!extension || strcmp(extension, ".vcf")) + continue; + dlog_print(DLOG_DEBUG, LOG_TAG, "file %s", pDirent->d_name); + + /* Get the vCard file path */ + char *file_path = malloc(strlen(vcf_path) + strlen(pDirent->d_name) + 4); + sprintf(file_path, "%s/%s", vcf_path, pDirent->d_name); + + /* + If the vCard file does not contain any records, + skip to the next directory entry + */ + int count; + int error_code = contacts_vcard_get_entity_count(file_path, &count); + if (count < 1) + continue; + + /* Calculate the vCard file size */ + FILE *fp = fopen(file_path, "r"); + if (fseek(fp, 0, 2) != 0) + /* Error handling */ + int bufsize = ftell(fp); + rewind(fp); + dlog_print(DLOG_DEBUG, LOG_TAG, "file size: %i", bufsize); + if (bufsize < 1) + return 1; + + /* Create the vCard stream */ + char *vcard_stream = malloc(sizeof(char) * (bufsize)); + memset(vcard_stream, '\0', sizeof(vcard_stream)); + if (fp != NULL) { + char str[150]; + while (fgets(str, 150, fp) != NULL) + sprintf(vcard_stream + strlen(vcard_stream), "%s", str); + fclose(fp); + } else { + return 1; + } @@ -4112,35 +4112,35 @@ if (dir) {

      Parse the vCard streams for contacts using the contacts_vcard_parse_to_contacts() function. The function returns a list of all contact records parsed from the stream.

      The following example first parses a list of contact records from the vCard stream and then iterates through the list inserting each record to the contact database:

      -        contacts_list_h contacts_list;
-        contacts_record_h record;
-
-        /* Get the contact list from the vCard stream */
-        error_code = contacts_vcard_parse_to_contacts(vcard_stream, &contacts_list);
-        if (error_code != 0)
-            dlog_print(DLOG_ERROR, LOG_TAG,
-                       "contacts_vcard_parse_to_contacts failed: %d",
-                       error_code);
-        free(vcard_stream);
-
-        /* Iterate through the contact list */
-        while (contacts_list_get_current_record_p(contacts_list, &record) == 0) {
-            int id = -1;
-            /* Add to the database */
-            error_code = contacts_db_insert_record(record, &id);
-            if (error_code != 0)
-                dlog_print(DLOG_ERROR, LOG_TAG, "contacts_db_insert_record failed");
-
-            /* Move to the next record */
-            error_code = contacts_list_next(contacts_list);
-        }
-        error_code = contacts_list_destroy(contacts_list, true);
-        if (error_code != 0)
-            dlog_print(DLOG_ERROR, LOG_TAG,
-                       "contacts_list_destroy failed: %d", error_code);
-        free(file_path);
-    }
-    closedir(dir);
+        contacts_list_h contacts_list;
+        contacts_record_h record;
+
+        /* Get the contact list from the vCard stream */
+        error_code = contacts_vcard_parse_to_contacts(vcard_stream, &contacts_list);
+        if (error_code != 0)
+            dlog_print(DLOG_ERROR, LOG_TAG,
+                       "contacts_vcard_parse_to_contacts failed: %d",
+                       error_code);
+        free(vcard_stream);
+
+        /* Iterate through the contact list */
+        while (contacts_list_get_current_record_p(contacts_list, &record) == 0) {
+            int id = -1;
+            /* Add to the database */
+            error_code = contacts_db_insert_record(record, &id);
+            if (error_code != 0)
+                dlog_print(DLOG_ERROR, LOG_TAG, "contacts_db_insert_record failed");
+
+            /* Move to the next record */
+            error_code = contacts_list_next(contacts_list);
+        }
+        error_code = contacts_list_destroy(contacts_list, true);
+        if (error_code != 0)
+            dlog_print(DLOG_ERROR, LOG_TAG,
+                       "contacts_list_destroy failed: %d", error_code);
+        free(file_path);
+    }
+    closedir(dir);
 }
      @@ -4157,13 +4157,13 @@ if (dir) { /* Get the vCard file path */ char *resource_path = app_get_resource_path(); char vcard_path[1024] = {0}; -snprintf(vcard_path, sizeof(vcard_path), "%s/vcard.vcf", resource_path); +snprintf(vcard_path, sizeof(vcard_path), "%s/vcard.vcf", resource_path); free(resource_path); /* Get the contacts from the vCard file */ int error_code = contacts_vcard_parse_to_contact_foreach(vcard_path, -                                                         _contacts_vcard_cb, -                                                         NULL); + _contacts_vcard_cb, + NULL);

      To check how many records are contained in a vCard file, use the contacts_vcard_get_entity_count() function.

      @@ -4176,10 +4176,10 @@ int error_code = contacts_vcard_parse_to_contact_foreach(vcard_path, bool _contacts_vcard_cb(contacts_record_h record, void *user_data) { -    int id = -1; -    int error_code = contacts_db_insert_record(record, &id); + int id = -1; + int error_code = contacts_db_insert_record(record, &id); -    return true; + return true; } @@ -4195,7 +4195,7 @@ _contacts_vcard_cb(contacts_record_h record, void *user_data)

    6. Define the location of the vCard file where the contacts are to be exported, and retrieve a list of all records using the contacts_db_get_all_records() function:

      -char file_path[] = "/path/contacts.vcf";
+char file_path[] = "/path/contacts.vcf";
 contacts_list_h list = NULL;
 error_code = contacts_db_get_all_records(_contacts_contact._uri, 0, 0, &list);
      @@ -4203,7 +4203,7 @@ error_code = contacts_db_get_all_records(_contacts_contact._uri, 0, 0, &list

    7. Open the vCard file for writing:

      -FILE *file = fopen(file_path, "w");
+FILE *file = fopen(file_path, "w");
      8. @@ -4220,11 +4220,11 @@ contacts_record_h contact; char *vcard_stream; while (contacts_list_get_current_record_p(list, &record) == 0) { -    error_code = contacts_vcard_make_from_contact(record, &vcard_stream); -    /* Save to file */ -    fwrite(vcard_stream, 1, strlen(vcard_stream), file); -    free(vcard_stream); -    error_code = contacts_list_next(list); + error_code = contacts_vcard_make_from_contact(record, &vcard_stream); + /* Save to file */ + fwrite(vcard_stream, 1, strlen(vcard_stream), file); + free(vcard_stream); + error_code = contacts_list_next(list); } fclose(file); contacts_list_destroy(list, true); diff --git a/org.tizen.guides/html/native/personal/context_n.htm b/org.tizen.guides/html/native/personal/context_n.htm index a54f40d..b117bbf 100644 --- a/org.tizen.guides/html/native/personal/context_n.htm +++ b/org.tizen.guides/html/native/personal/context_n.htm @@ -29,7 +29,7 @@
    8. Prerequisites
    9. Getting a Profile Data List
    10. Enumerating Profile Data Lists
      11. -
    11. History Data Types
      12. +
    12. History Data Types
    13. Filters and Attributes

      14. Related Info

      @@ -44,7 +44,7 @@

      Contextual Device Usage History Data

      -

      The Tizen platform collects data on the device usage. Based on this data, the applications can take advantage of the user's application usage patterns through statistical analysis.

      +

      The Tizen platform collects data on the device usage. Based on this data, the applications can take advantage of the user's application usage patterns through statistical analysis.

      This feature is supported in mobile applications only.

      @@ -80,7 +80,7 @@ context_history_get_list(handle, CONTEXT_HISTORY_FREQUENTLY_USED_APP, filter, &a

      To retrieve a contextual history profile:

        -
      1. Create 2 handles: 1 for using the Contextual History API and 1 for the filter: +
      2. Create 2 handles: 1 for using the Contextual History API and 1 for the filter: 
         /* Contextual History API handle */
 context_history_h handle;
@@ -101,7 +101,7 @@ context_history_filter_set_int(filter, CONTEXT_HISTORY_FILTER_TIME_SPAN, 14);
 
 /* Limiting the context to the applications used while a headphone is connected */
 context_history_filter_set_int(filter, CONTEXT_HISTORY_FILTER_AUDIO_JACK,
-                               CONTEXT_HISTORY_FILTER_AUDIO_JACK_CONNECTED);
+                               CONTEXT_HISTORY_FILTER_AUDIO_JACK_CONNECTED);
      3. Retrieve profile data based on the defined filter: @@ -121,7 +121,7 @@ context_history_filter_destroy(filter);

        The list retrieved using the context_history_get_list() function contains a sorted list of records, each of which consists of a key and value pair.

        To enumerate the list:

          -
        1. Check the number of records in the list. +
        2. Check the number of records in the list.

          In some cases, the retrieved list can contain less records than the result size set in the filter.

           int size;
@@ -136,21 +136,21 @@ char* app_id;
 context_history_record_h record;
 
 for (i = 0; i < size; ++i) {
-    /* Getting the current record */
-    context_history_list_get_current(list, &record);
+    /* Getting the current record */
+    context_history_list_get_current(list, &record);
 
-    /* Retrieving the application ID and the total use count from the record */
-    context_history_record_get_string(record, CONTEXT_HISTORY_APP_ID, &app_id);
-    context_history_record_get_int(record, CONTEXT_HISTORY_TOTAL_COUNT, &count);
+    /* Retrieving the application ID and the total use count from the record */
+    context_history_record_get_string(record, CONTEXT_HISTORY_APP_ID, &app_id);
+    context_history_record_get_int(record, CONTEXT_HISTORY_TOTAL_COUNT, &count);
 
-    /* Freeing the application ID string */
-    free(app_id);
+    /* Freeing the application ID string */
+    free(app_id);
 
-    /* Releasing the memory occupied by the record */
-    context_history_record_destroy(record);
+    /* Releasing the memory occupied by the record */
+    context_history_record_destroy(record);
 
-    /* Iterating to the next record */
-    context_history_list_move_next(list);
+    /* Iterating to the next record */
+    context_history_list_move_next(list);
 }
          3. @@ -180,7 +180,7 @@ context_history_destroy(handle); Application usage history: - +

          CONTEXT_HISTORY_RECENTLY_USED_APP

          CONTEXT_HISTORY_FREQUENTLY_USED_APP

          CONTEXT_HISTORY_RARELY_USED_APP

          @@ -192,7 +192,7 @@ context_history_destroy(handle);
          • Most recently or frequently used applications, in a descending order of the application use counts.
          • Most rarely used applications in removable applications, in an ascending order of the application use counts.
            • -
          • Peak time for applications, or the time period when the user most frequently uses an application during the day. +
          • Peak time for applications, or the time period when the user most frequently uses an application during the day.

            The result is a sorted list of hours of the day, in a descending order of the application use count in each one-hour time slot.

          • Common settings for applications, or the most common setting values regarding an application or any applications.
          @@ -295,7 +295,7 @@ context_history_destroy(handle); String Applications can get the statistics of the data logged while a specific Wi-Fi is connected, by setting the BSSID string of the target Wi-Fi AP. -

          The currently connected Wi-Fi AP's BSSID can be retrieved through the Wi-Fi Manager APIs. For more information, see the Wi-Fi guide.

          +

          The currently connected Wi-Fi AP's BSSID can be retrieved through the Wi-Fi Manager APIs. For more information, see the Wi-Fi guide.

          diff --git a/org.tizen.guides/html/native/personal/data_sync_n.htm b/org.tizen.guides/html/native/personal/data_sync_n.htm index b0cf8e0..0a43924 100644 --- a/org.tizen.guides/html/native/personal/data_sync_n.htm +++ b/org.tizen.guides/html/native/personal/data_sync_n.htm @@ -27,7 +27,7 @@

          Content

      - +

      The Sync Adapter API allows you to:

      • Register callbacks for receiving notifications about the sync job start and cancellation.
        • -
      • Start a sync operation with an app control, so that the application's daemon needs not to stay awake. +
      • Start a sync operation with an app control, so that the application's daemon needs not to stay awake.

        The Sync Adapter API allows you to use this mechanism without using the App Control API (in mobile and wearable applications) separately. In other words, when using the Sync Adapter API, you can use the App Control API indirectly.

        • @@ -132,12 +132,12 @@
      • To use the Sync Manager API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file: 
         <privileges>
-   <!--To set an alarm-->
-   <privilege>http://tizen.org/privilege/alarm.set</privilege>
-   <!--To use the calendar capability-->
-   <privilege>http://tizen.org/privilege/calendar.read</privilege>
-   <!--To use the contact capability-->
-   <privilege>http://tizen.org/privilege/contact.read</privilege>
+   <!--To set an alarm-->
+   <privilege>http://tizen.org/privilege/alarm.set</privilege>
+   <!--To use the calendar capability-->
+   <privilege>http://tizen.org/privilege/calendar.read</privilege>
+   <!--To use the contact capability-->
+   <privilege>http://tizen.org/privilege/contact.read</privilege>
 </privileges>
        • @@ -177,17 +177,17 @@ account_h account = NULL; int account_id = -1; account_create(&account); -account_set_user_name(account, "test_name"); -account_set_email_address(account, "test_email@samsung.com"); -account_set_package_name(account, "data-sync-module"); +account_set_user_name(account, "test_name"); +account_set_email_address(account, "test_email@samsung.com"); +account_set_package_name(account, "data-sync-module"); account_set_sync_support(account, ACCOUNT_SUPPORTS_SYNC); account_insert_to_db(account, &account_id); -const char *sync_job_name = "on_demand_sync_job"; +const char *sync_job_name = "on_demand_sync_job"; bundle *sync_job_user_data = NULL; sync_job_user_data = bundle_create(); -bundle_add_str(sync_job_user_data, "str", "String sync_job_user_data sample."); +bundle_add_str(sync_job_user_data, "str", "String sync_job_user_data sample."); int sync_job_id = -1; @@ -196,27 +196,27 @@ int sync_job_id = -1;
      • Add an on-demand sync job: 
         result = sync_manager_on_demand_sync_job(account, sync_job_name, SYNC_OPTION_NONE,
-                                         sync_job_user_data, &sync_job_id);
+                                         sync_job_user_data, &sync_job_id);

        This function can be used with various options, as shown in the following example. The SYNC_OPTION_NO_RETRY option means the sync job is not performed again when it fails. The SYNC_OPTION_EXPEDITED option means the other sync job is operated as soon as possible. The call with the OR structure lets the other sync job operate just once with priority.

        - + 
         result = sync_manager_on_demand_sync_job(account, sync_job_name2, SYNC_OPTION_NO_RETRY,
-                                         sync_job_user_data, &sync_job_id2);
+                                         sync_job_user_data, &sync_job_id2);
 result = sync_manager_on_demand_sync_job(account, sync_job_name3, SYNC_OPTION_EXPEDITED,
-                                         sync_job_user_data, &sync_job_id3);
+                                         sync_job_user_data, &sync_job_id3);
 result = sync_manager_on_demand_sync_job(account, sync_job_name4,
-                                         (SYNC_OPTION_NO_RETRY | SYNC_OPTION_EXPEDITED),
-                                         sync_job_user_data, &sync_job_id4);
+                                         (SYNC_OPTION_NO_RETRY | SYNC_OPTION_EXPEDITED),
+                                         sync_job_user_data, &sync_job_id4);

        This function can also be called like in the following example, because the account handle and user data are not mandatory:

         result = sync_manager_on_demand_sync_job(NULL, sync_job_name, SYNC_OPTION_NONE,
-                                         sync_job_user_data, &sync_job_id);
+                                         sync_job_user_data, &sync_job_id);
 result = sync_manager_on_demand_sync_job(account, sync_job_name2, SYNC_OPTION_NO_RETRY,
-                                         NULL, &sync_job_id2);
+                                         NULL, &sync_job_id2);
 result = sync_manager_on_demand_sync_job(NULL, sync_job_name3, SYNC_OPTION_EXPEDITED,
-                                         NULL, &sync_job_id3);
+                                         NULL, &sync_job_id3);

        If the on-demand sync job addition process succeeds, the SYNC_ERROR_NONE value is returned.

        • @@ -226,7 +226,7 @@ result = sync_manager_on_demand_sync_job(NULL, sync_job_name3, SYNC_OPTION_EXPED 
         result = sync_manager_remove_sync_job(sync_job_id);
 
-account_delete_from_db_by_package_name("data-sync-module");
+account_delete_from_db_by_package_name("data-sync-module");
 account_destroy(account);
 
 sync_adapter_unset_callbacks();
@@ -239,7 +239,7 @@ sync_adapter_unset_callbacks();
    - +

    Defining a Periodic Sync Job

    To inform periodically a service application of the time to operate a sync job with its sync interval:

    @@ -251,13 +251,13 @@ sync_adapter_unset_callbacks(); account_h account = NULL; int account_id = -1; account_create(&account); -account_set_user_name(account, "test_name"); -account_set_email_address(account, "test_email@samsung.com"); -account_set_package_name(account, "data-sync-module"); +account_set_user_name(account, "test_name"); +account_set_email_address(account, "test_email@samsung.com"); +account_set_package_name(account, "data-sync-module"); account_set_sync_support(account, ACCOUNT_SUPPORTS_SYNC); account_insert_to_db(account, &account_id); -const char *sync_job_name = "periodic_sync_job"; +const char *sync_job_name = "periodic_sync_job"; sync_period_e sync_period = SYNC_PERIOD_INTERVAL_30MIN; sync_period_e sync_period2 = SYNC_PERIOD_INTERVAL_1H; @@ -266,7 +266,7 @@ sync_period_e sync_period4 = SYNC_PERIOD_INTERVAL_6H; bundle *sync_job_user_data = NULL; sync_job_user_data = bundle_create(); -bundle_add_str(sync_job_user_data, "str", "String sync_job_user_data sample."); +bundle_add_str(sync_job_user_data, "str", "String sync_job_user_data sample."); int sync_job_id = -1; @@ -275,33 +275,33 @@ int sync_job_id = -1;

    This function operates the sync job with the given period interval.

     result = sync_manager_add_periodic_sync_job(account, sync_job_name, sync_period,
-                                            SYNC_OPTION_NONE, sync_job_user_data,
-                                            &sync_job_id);
+                                            SYNC_OPTION_NONE, sync_job_user_data,
+                                            &sync_job_id);

    This function can be used with various options, as shown in the following example. The SYNC_OPTION_NO_RETRY option means a sync job is not performed again when it fails. The SYNC_OPTION_EXPEDITED option means another sync job is operated as soon as possible. The call with the OR structure lets the other sync job operate just once with priority.

     result = sync_manager_add_periodic_sync_job(account, sync_job_name2, sync_period2,
-                                            SYNC_OPTION_NO_RETRY, sync_job_user_data,
-                                            &sync_job_id2);
+                                            SYNC_OPTION_NO_RETRY, sync_job_user_data,
+                                            &sync_job_id2);
 result = sync_manager_add_periodic_sync_job(account, sync_job_name3, sync_period3,
-                                            SYNC_OPTION_EXPEDITED, sync_job_user_data,
-                                            &sync_job_id3);
+                                            SYNC_OPTION_EXPEDITED, sync_job_user_data,
+                                            &sync_job_id3);
 result = sync_manager_add_periodic_sync_job(account, sync_job_name4, sync_period4,
-                                            (SYNC_OPTION_NO_RETRY
-                                             | SYNC_OPTION_EXPEDITED),
-                                            sync_job_user_data, &sync_job_id4);
+                                            (SYNC_OPTION_NO_RETRY
+                                             | SYNC_OPTION_EXPEDITED),
+                                            sync_job_user_data, &sync_job_id4);

    This function can also be called like in the following example, because the account handle and user data are not mandatory:

     result = sync_manager_add_periodic_sync_job(NULL, sync_job_name, sync_period,
-                                            SYNC_OPTION_NONE, sync_job_user_data,
-                                            &sync_job_id);
+                                            SYNC_OPTION_NONE, sync_job_user_data,
+                                            &sync_job_id);
 result = sync_manager_add_periodic_sync_job(account, sync_job_name2, sync_period2,
-                                            SYNC_OPTION_NO_RETRY, NULL,
-                                            &sync_job_id2);
+                                            SYNC_OPTION_NO_RETRY, NULL,
+                                            &sync_job_id2);
 result = sync_manager_add_periodic_sync_job(NULL, sync_job_name3, sync_period3,
-                                            SYNC_OPTION_EXPEDITED, NULL,
-                                            &sync_job_id3);
+                                            SYNC_OPTION_EXPEDITED, NULL,
+                                            &sync_job_id3);

    If the periodic sync job addition process succeeds, the SYNC_ERROR_NONE value is returned.

    • @@ -309,22 +309,22 @@ result = sync_manager_add_periodic_sync_job(NULL, sync_job_name3, sync_period3,
  • The sync_manager_add_periodic_sync_job() function can renew a registered periodic sync job by using the same sync_job_name as before: 
     result = sync_manager_add_periodic_sync_job(account, sync_job_name, sync_period,
-                                            SYNC_OPTION_NONE, sync_job_user_data,
-                                            &sync_job_id);
+                                            SYNC_OPTION_NONE, sync_job_user_data,
+                                            &sync_job_id);
 result = sync_manager_add_periodic_sync_job(account, sync_job_name, sync_period2,
-                                            SYNC_OPTION_EXPEDITED, sync_job_user_data2,
-                                            &sync_job_id);
+                                            SYNC_OPTION_EXPEDITED, sync_job_user_data2,
+                                            &sync_job_id);

    All the function parameters can be reset except sync_job_name and sync_job_id, which are used to manage a specific sync job.

  • When the periodic sync is no longer needed, remove it with the sync_manager_remove_sync_job() function with its sync_job_id. If you want to stop using the account too, clean up the account handle.

    At the end, unset the sync callbacks and release the resources with the sync_adapter_unset_callbacks() function.

    - + 
     result = sync_manager_remove_sync_job(sync_job_id);
 
-account_delete_from_db_by_package_name("data-sync-module");
+account_delete_from_db_by_package_name("data-sync-module");
 account_destroy(account);
 
 sync_adapter_unset_callbacks();
@@ -351,9 +351,9 @@ sync_adapter_unset_callbacks();
 account_h account = NULL;
 int account_id = -1;
 account_create(&account);
-account_set_user_name(account, "test_name");
-account_set_email_address(account, "test_email@samsung.com");
-account_set_package_name(account, "data-sync-module");
+account_set_user_name(account, "test_name");
+account_set_email_address(account, "test_email@samsung.com");
+account_set_package_name(account, "data-sync-module");
 account_set_sync_support(account, ACCOUNT_SUPPORTS_SYNC);
 account_insert_to_db(account, &account_id);
 
@@ -366,7 +366,7 @@ const char *sync_capability_video = SYNC_SUPPORTS_CAPABILITY_VIDEO;
 
 bundle *sync_job_user_data = NULL;
 sync_job_user_data = bundle_create();
-bundle_add_str(sync_job_user_data, "str", "String sync_job_user_data sample.");
+bundle_add_str(sync_job_user_data, "str", "String sync_job_user_data sample.");
 
 int sync_job_id = -1;
    @@ -376,35 +376,35 @@ int sync_job_id = -1;

    The sync_manager_add_data_change_sync_job() function operates a sync job only for a registered capability.

     result = sync_manager_add_data_change_sync_job(account, sync_capability_calendar,
-                                               SYNC_OPTION_NONE, sync_job_user_data,
-                                               &sync_job_id);
+                                               SYNC_OPTION_NONE, sync_job_user_data,
+                                               &sync_job_id);

    This function can be used with various options, as shown in the following example. The SYNC_OPTION_NO_RETRY option means a sync job is not performed again when it fails. The SYNC_OPTION_EXPEDITED option means another sync job is operated as soon as possible. The call with the OR structure lets the other sync job operate just once with priority.

     result = sync_manager_add_data_change_sync_job(account, sync_capability_calendar,
-                                               SYNC_OPTION_NO_RETRY, sync_job_user_data,
-                                               &sync_job_id2);
+                                               SYNC_OPTION_NO_RETRY, sync_job_user_data,
+                                               &sync_job_id2);
 result = sync_manager_add_data_change_sync_job(account, sync_capability_contact,
-                                               SYNC_OPTION_EXPEDITED, sync_job_user_data,
-                                               &sync_job_id3);
+                                               SYNC_OPTION_EXPEDITED, sync_job_user_data,
+                                               &sync_job_id3);
 result = sync_manager_add_data_change_sync_job(account, sync_capability_image,
-                                               (SYNC_OPTION_NO_RETRY
-                                                | SYNC_OPTION_EXPEDITED),
-                                               sync_job_user_data, &sync_job_id4);
+                                               (SYNC_OPTION_NO_RETRY
+                                                | SYNC_OPTION_EXPEDITED),
+                                               sync_job_user_data, &sync_job_id4);

    This function can also be called like in the following example, because the account handle and user data are not mandatory:

     result = sync_manager_add_data_change_sync_job(NULL, sync_capability_music,
-                                               SYNC_OPTION_NONE, sync_job_user_data,
-                                               &sync_job_id);
+                                               SYNC_OPTION_NONE, sync_job_user_data,
+                                               &sync_job_id);
 result = sync_manager_add_data_change_sync_job(account, sync_capability_sound,
-                                               SYNC_OPTION_NO_RETRY, NULL,
-                                               &sync_job_id2);
+                                               SYNC_OPTION_NO_RETRY, NULL,
+                                               &sync_job_id2);
 result = sync_manager_add_data_change_sync_job(NULL, sync_capability_video,
-                                               SYNC_OPTION_EXPEDITED, NULL,
-                                               &sync_job_id3);
+                                               SYNC_OPTION_EXPEDITED, NULL,
+                                               &sync_job_id3);

    If the data change sync job addition process succeeds, the SYNC_ERROR_NONE value is returned.

    • @@ -412,12 +412,12 @@ result = sync_manager_add_data_change_sync_job(NULL, sync_capability_video,
  • The sync_manager_add_data_change_sync_job() function can renew a registered data change sync job by using the same sync_capability as before: 
     result = sync_manager_add_data_change_sync_job(account, sync_capability_calendar,
-                                               SYNC_OPTION_NONE, sync_job_user_data,
-                                               &sync_job_id);
+                                               SYNC_OPTION_NONE, sync_job_user_data,
+                                               &sync_job_id);
 result = sync_manager_add_data_change_sync_job(account, sync_capability_calendar,
-                                               SYNC_OPTION_EXPEDITED,
-                                               sync_job_user_data2,
-                                               &sync_job_id);
+                                               SYNC_OPTION_EXPEDITED,
+                                               sync_job_user_data2,
+                                               &sync_job_id);

    All the function parameters can be reset except sync_capability and sync_job_id, which are used to manage a specific sync job.

    • @@ -428,7 +428,7 @@ result = sync_manager_add_data_change_sync_job(account, sync_capability_calendar 
     result = sync_manager_remove_sync_job(sync_job_id);
 
-account_delete_from_db_by_package_name("data-sync-module");
+account_delete_from_db_by_package_name("data-sync-module");
 account_destroy(account);
 
 sync_adapter_unset_callbacks();
@@ -458,9 +458,9 @@ result = sync_manager_foreach_sync_job(sync_job_cb, NULL);
 
     bool
 sync_job_cb(account_h account, const char *sync_job_name, const char *sync_capability,
-            int sync_job_id, bundle *sync_job_user_data, void *user_data)
+            int sync_job_id, bundle *sync_job_user_data, void *user_data)
 {
-    /* Verify the registered sync jobs */
+    /* Verify the registered sync jobs */
 }
 
    
 
@@ -484,16 +484,16 @@ result = sync_adapter_set_callbacks(on_start_cb, on_cancel_cb);
 
     bool
 on_start_cb(account_h account, const char *sync_job_name,
-            const char *sync_capability, bundle *sync_job_user_data)
+            const char *sync_capability, bundle *sync_job_user_data)
 {
-    /* Start the data sync process */
+    /* Start the data sync process */
 }
 
 void
 on_cancel_cb(account_h account, const char *sync_job_name,
-             const char *sync_capability, bundle *sync_job_user_data)
+             const char *sync_capability, bundle *sync_job_user_data)
 {
-    /* Cancel the data sync process */
+    /* Cancel the data sync process */
 }
 
    
 
@@ -539,12 +539,12 @@ result = sync_adapter_unset_callbacks();
 			   
    A data change sync job can provide a notification whenever a corresponding data change occurs. If the sync_manager_add_data_change_sync_job() function is used with a capability, it is operated for the related capability only.
    
 			   
    The following capabilities are available:
    
 			   
    -#define SYNC_SUPPORTS_CAPABILITY_CALENDAR "http://tizen.org/sync/capability/calendar"
-#define SYNC_SUPPORTS_CAPABILITY_CONTACT "http://tizen.org/sync/capability/contact"
-#define SYNC_SUPPORTS_CAPABILITY_IMAGE "http://tizen.org/sync/capability/image"
-#define SYNC_SUPPORTS_CAPABILITY_MUSIC "http://tizen.org/sync/capability/music"
-#define SYNC_SUPPORTS_CAPABILITY_SOUND "http://tizen.org/sync/capability/sound"
-#define SYNC_SUPPORTS_CAPABILITY_VIDEO "http://tizen.org/sync/capability/video"
+#define SYNC_SUPPORTS_CAPABILITY_CALENDAR "http://tizen.org/sync/capability/calendar"
+#define SYNC_SUPPORTS_CAPABILITY_CONTACT "http://tizen.org/sync/capability/contact"
+#define SYNC_SUPPORTS_CAPABILITY_IMAGE "http://tizen.org/sync/capability/image"
+#define SYNC_SUPPORTS_CAPABILITY_MUSIC "http://tizen.org/sync/capability/music"
+#define SYNC_SUPPORTS_CAPABILITY_SOUND "http://tizen.org/sync/capability/sound"
+#define SYNC_SUPPORTS_CAPABILITY_VIDEO "http://tizen.org/sync/capability/video"
 
    
        
        
@@ -561,7 +561,7 @@ result = sync_adapter_unset_callbacks();
                sync_option_e
                Yes
                Option for deciding the sync job behavior.
-			   
    The behavior options can be used as an OR value. For example, the (SYNC_OPTION_EXPEDITED | SYNC_OPTION_NO_RETRY) expression is available, and means that the "Sync job is operated just once with priority".
    
+			   
    The behavior options can be used as an OR value. For example, the (SYNC_OPTION_EXPEDITED | SYNC_OPTION_NO_RETRY) expression is available, and means that the "Sync job is operated just once with priority".
    
 			   
    The following options are available:
    
 			   
    • SYNC_OPTION_NONE: Sync job is operated normally
      • 
 			   
    • SYNC_OPTION_EXPEDITED: Sync job is operated as soon as possible
      • 
diff --git a/org.tizen.guides/html/native/personal/fido_n.htm b/org.tizen.guides/html/native/personal/fido_n.htm
index eece5be..606c3a1 100644
--- a/org.tizen.guides/html/native/personal/fido_n.htm
+++ b/org.tizen.guides/html/native/personal/fido_n.htm
@@ -43,11 +43,11 @@
 
 
 
      
-    
-
      FIDO Universal Authentication Framework
       
+
+
      FIDO Universal Authentication Framework
      
 
   
      The FIDO (Fast IDentity Online) Alliance is a organization formed to address the lack of interoperability among strong authentication devices as well as the problems users face with creating and remembering multiple usernames and passwords.
      
-  
+
   
      FIDO covers both password-less authentications (through FIDO UAF components), such as fingerprint, iris, and voice, and multi-factor authentication, such as OTP and USB dongle. Tizen currently does not support multi-factor authentication.
      
   
      FIDO Alliance provides certification for FIDO-compliant products through FIDO Ready™.
      
 
@@ -73,7 +73,7 @@
 	
   
    • FIDO UAF protocols 
      
   
      The FIDO UAF protocols carry FIDO UAF messages between user devices and relying parties. Use the protocol messages to register, authenticate, and deregister the authentication:
      
-  
      • Authenticator registration: 
        The FIDO UAF registration protocol enables relying parties to discover the FIDO UAF authenticators available on a user's system or device. Discovery conveys the FIDO UAF authenticator attributes to the relying party, thus enabling policy decisions and enforcement to take place.
        
+  
        • Authenticator registration: 
          The FIDO UAF registration protocol enables relying parties to discover the FIDO UAF authenticators available on a user's system or device. Discovery conveys the FIDO UAF authenticator attributes to the relying party, thus enabling policy decisions and enforcement to take place.
          
   
          Figure: FIDO UAF registration
          
   
           Components
          
 	
          • 
@@ -82,14 +82,14 @@
   
           Components
          
 	
   
        • Authenticator deregistration: 
          Deregistration is typically required when the user account is removed at the relying party. The relying party can trigger the deregistration by requesting the authenticator to delete the UAF credential associated with the user account.
          
-  
+
   
          Figure: FIDO UAF deregistration
          
   
           Components
          
   
          • 
   
        
 	
        • 
   
      • FIDO UAF authenticator abstraction layer
        
-  
        The FIDO UAF authenticator abstraction layer provides a uniform API to FIDO clients enabling the use of authenticator-based cryptographic services for FIDO-supported operations. It provides a uniform lower-layer "authenticator plugin" API facilitating the deployment of multi-vendor FIDO UAF authenticators and their requisite drivers.
        
+  
        The FIDO UAF authenticator abstraction layer provides a uniform API to FIDO clients enabling the use of authenticator-based cryptographic services for FIDO-supported operations. It provides a uniform lower-layer "authenticator plugin" API facilitating the deployment of multi-vendor FIDO UAF authenticators and their requisite drivers.
        
 	
        • 
   
      • FIDO UAF authenticator
        
   
        The FIDO UAF authenticator is a secure entity, connected to or housed within the FIDO user devices, that can create key material associated with a relying party. The key can then be used to participate in FIDO UAF strong authentication protocols.
        
@@ -101,7 +101,7 @@
 
        To use the FIDO Client API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:
        
 
         <privileges>
-   <privilege>http://tizen.org/privilege/fido.client</privilege>
+   <privilege>http://tizen.org/privilege/fido.client</privilege>
 </privileges>
 
        
 
@@ -112,24 +112,24 @@
 void
 start_discover(void *data, Evas_Object *obj, void *event_info)
 {
-    int ret = fido_foreach_authenticator(auth_list_cb, data);
+    int ret = fido_foreach_authenticator(auth_list_cb, data);
 }
 
 static void
 auth_list_cb(const fido_authenticator_h auth, void *user_data)
 {
-    appdata_s *ad = user_data;
-    __print_authinfo(auth, ad);
+    appdata_s *ad = user_data;
+    __print_authinfo(auth, ad);
 }
 
 static void
 __print_authinfo(fido_authenticator_h auth, appdata_s *ad)
 {
-    char *title = NULL;
-    fido_authenticator_get_title(auth, &title);
+    char *title = NULL;
+    fido_authenticator_get_title(auth, &title);
 
-    char *aaid = NULL;
-    fido_authenticator_get_aaid(auth, &aaid);
+    char *aaid = NULL;
+    fido_authenticator_get_aaid(auth, &aaid);
 }
    @@ -141,20 +141,20 @@ __print_authinfo(fido_authenticator_h auth, appdata_s *ad) void start_check_policy(void *data, Evas_Object *obj, void *event_info) { -    bool is_supported = false; -    int ret = fido_uaf_is_supported(json_reg, &is_supported); + bool is_supported = false; + int ret = fido_uaf_is_supported(json_reg, &is_supported); -    char str[2048] = {0,}; -    str[0] = '\0'; + char str[2048] = {0,}; + str[0] = '\0'; -    strcpy(str, "CHECK POLICY RESPONSE | "); -    if (is_supported == true) -        sprintf(str, "TRUE"); -    else -        sprintf(str, "FALSE"); + strcpy(str, "CHECK POLICY RESPONSE | "); + if (is_supported == true) + sprintf(str, "TRUE"); + else + sprintf(str, "FALSE"); -    create_popup(str, (appdata_s *)user_data); -    free(error_string); + create_popup(str, (appdata_s *)user_data); + free(error_string); } @@ -172,31 +172,31 @@ start_check_policy(void *data, Evas_Object *obj, void *event_info) void start_registration(void *data, Evas_Object *obj, void *event_info) { -    int ret = fido_uaf_get_response_message(json_reg, NULL, _process_cb, data); + int ret = fido_uaf_get_response_message(json_reg, NULL, _process_cb, data); } static void _process_cb(fido_error_e tizen_error_code, const char *uaf_response, void *user_data) { -    char str[2048] = {0,}; -    if (tizen_error_code == 0 && uaf_response != NULL) { -        const int max_popup_str_len = strlen(uaf_response) + 500; -        char *popup_str = calloc(1, max_popup_str_len); -        snprintf(popup_str, max_popup_str_len - 1, "UAF Response =%s", uaf_response); -        create_popup(popup_str, (appdata_s *)user_data); -        free(popup_str); -    } + char str[2048] = {0,}; + if (tizen_error_code == 0 && uaf_response != NULL) { + const int max_popup_str_len = strlen(uaf_response) + 500; + char *popup_str = calloc(1, max_popup_str_len); + snprintf(popup_str, max_popup_str_len - 1, "UAF Response =%s", uaf_response); + create_popup(popup_str, (appdata_s *)user_data); + free(popup_str); + } }
  • Authenticate a user. -

    UAF allows the relying party to prompt the end user to authenticate using a previously registered FIDO authenticator. This authentication can be invoked any time, at the relying party's discretion.

    +

    UAF allows the relying party to prompt the end user to authenticate using a previously registered FIDO authenticator. This authentication can be invoked any time, at the relying party's discretion.

     void
 start_auth(void *data, Evas_Object *obj, void *event_info)
 {
-    int ret = fido_uaf_get_response_message(json_auth, NULL, _process_cb, data);
+    int ret = fido_uaf_get_response_message(json_auth, NULL, _process_cb, data);
 }
    • @@ -207,15 +207,15 @@ start_auth(void *data, Evas_Object *obj, void *event_info) void start_de_registration(void *data, Evas_Object *obj, void *event_info) { -    int ret = fido_uaf_get_response_message(json_dereg, NULL, _process_dereg_cb, data); + int ret = fido_uaf_get_response_message(json_dereg, NULL, _process_dereg_cb, data); } static void _process_dereg_cb(int tizen_error_code, char *uaf_response, void *user_data) { -    char *error_string = get_error_code(tizen_error_code); -    create_popup(error_string, (appdata_s *)user_data); -    free(error_string); + char *error_string = get_error_code(tizen_error_code); + create_popup(error_string, (appdata_s *)user_data); + free(error_string); } @@ -234,21 +234,21 @@ _process_dereg_cb(int tizen_error_code, char *uaf_response, void *user_data) void start_notify_pos(void *data, Evas_Object *obj, void *event_info) { -    if (json_reg != NULL) -        int ret = fido_uaf_get_response_message(json_reg, NULL, -                                                _process_cb_for_notify_pos, -                                                data); + if (json_reg != NULL) + int ret = fido_uaf_get_response_message(json_reg, NULL, + _process_cb_for_notify_pos, + data); } static void _process_cb_for_notify_pos(fido_error_e tizen_error_code, const char *uaf_response, -                           void *user_data) + void *user_data) { -    int ret = fido_uaf_set_server_result(FIDO_SERVER_STATUS_CODE_OK, uaf_response); + int ret = fido_uaf_set_server_result(FIDO_SERVER_STATUS_CODE_OK, uaf_response); -    char *error_string = get_error_code(tizen_error_code); -    create_popup(error_string, (appdata_s *)user_data); -    free(error_string); + char *error_string = get_error_code(tizen_error_code); + create_popup(error_string, (appdata_s *)user_data); + free(error_string); } @@ -258,24 +258,24 @@ _process_cb_for_notify_pos(fido_error_e tizen_error_code, const char *uaf_respon void start_notify_neg(void *data, Evas_Object *obj, void *event_info) { -    int ret = fido_uaf_get_response_message(json_reg, NULL, -                                            _process_cb_for_notify_neg, data); + int ret = fido_uaf_get_response_message(json_reg, NULL, + _process_cb_for_notify_neg, data); } static void _process_cb_for_notify_neg(fido_error_e tizen_error_code, const char *uaf_response, -                           void *user_data) + void *user_data) { -    int ret = fido_uaf_set_server_result(0, uaf_response); + int ret = fido_uaf_set_server_result(0, uaf_response); -    char *error_string = get_error_code(tizen_error_code); -    create_popup(error_string, (appdata_s *)user_data); -    free(error_string); + char *error_string = get_error_code(tizen_error_code); + create_popup(error_string, (appdata_s *)user_data); + free(error_string); } - + diff --git a/org.tizen.guides/html/native/personal/oauth_n.htm b/org.tizen.guides/html/native/personal/oauth_n.htm index 6c17710..faf8506 100644 --- a/org.tizen.guides/html/native/personal/oauth_n.htm +++ b/org.tizen.guides/html/native/personal/oauth_n.htm @@ -43,10 +43,10 @@
    - -

    OAuth 2.0

    -

    The OAuth 2.0 authorization framework enables a third-party application to obtain limited access to an HTTP service, either on behalf of a resource owner by orchestrating an approval interaction between the resource owner and the HTTP service, or by allowing the third-party application to obtain access on its own behalf.

    +

    OAuth 2.0

    + +

    The OAuth 2.0 authorization framework enables a third-party application to obtain limited access to an HTTP service, either on behalf of a resource owner by orchestrating an approval interaction between the resource owner and the HTTP service, or by allowing the third-party application to obtain access on its own behalf.

    The main features of the OAuth 2.0 API include:

    -

    Figure: Protocol flow

    -

    Protocol flow

    - +

    Figure: Protocol flow

    +

    Protocol flow

    +

    The OAuth 2.0 specification is defined in [RFC 6749] and it builds on the OAuth 1.0 [RFC 5849] deployment experience, as well as additional use cases and extensibility requirements gathered from the wider IETF community. The OAuth 2.0 protocol is not backward-compatible with OAuth 1.0.

    - -

    Authorization Grant

    -

    An authorization grant is a credential representing the resource owner's authorization (to access its protected resources) used by the client to obtain an access token.

    + +

    Authorization Grant

    +

    An authorization grant is a credential representing the resource owner's authorization (to access its protected resources) used by the client to obtain an access token.

    The specification defines the following 4 grant types as well as an extensibility mechanism for defining additional types:

    • Authorization code

      The authorization code is obtained by using an authorization server as an intermediary between the client and resource owner. Instead of requesting authorization directly from the resource owner, the client directs the resource owner to an authorization server, which in turn directs the resource owner back to the client with the authorization code.

      -

      The authorization code provides some important security benefits, such as the ability to authenticate the client, as well as the transmission of the access token directly to the client without passing it through the resource owner's user-agent and potentially exposing it to others, including the resource owner.

      -

      Figure: Authorization code flow

      -

      Authorization code flow

      +

      The authorization code provides some important security benefits, such as the ability to authenticate the client, as well as the transmission of the access token directly to the client without passing it through the resource owner's user-agent and potentially exposing it to others, including the resource owner.

      +

      Figure: Authorization code flow

      +

      Authorization code flow

      • - +
    • Implicit

      In the implicit flow, the client is issued an access token directly (as a result of the resource owner authorization). The grant type is implicit, as no intermediate credentials (such as an authorization code) are issued.

      Implicit grants improve the responsiveness and efficiency of some clients (such as a client implemented as an in-browser application), since it reduces the number of round trips required to obtain an access token.

      -

      Figure: Implicit grant flow

      -

      Implicit grant flow

      +

      Figure: Implicit grant flow

      +

      Implicit grant flow

      • - +
    • Resource owner password credentials

      The resource owner password credentials (such as username and password) can be used directly as an authorization grant to obtain an access token.

      Even though this grant type requires direct client access to the resource owner credentials, the resource owner credentials are used for a single request and are exchanged for an access token. This grant type can eliminate the need for the client to store the resource owner credentials for future use, by exchanging the credentials with a long-lived access token or refresh token.

      -

      Figure: Resource owner password credentials flow

      -

      Resource owner password credentials flow

      +

      Figure: Resource owner password credentials flow

      +

      Resource owner password credentials flow

      • - +
    • Client credentials

      The client credentials can be used as an authorization grant when the authorization scope is limited to the protected resources under the control of the client, or to protected resources previously arranged with the authorization server. Client credentials are typically used as an authorization grant when the client is acting on its own behalf (the client is also the resource owner) or is requesting access to protected resources based on an authorization previously arranged with the authorization server.

      -

      Figure: Client credentials flow

      -

      Client credentials flow

      +

      Figure: Client credentials flow

      +

      Client credentials flow

    - +

    To request an access token for the implicit, resource owner password credentials, or client credentials grant type, follow the direct access token request instructions.

    Prerequisites

    @@ -106,7 +106,7 @@

    To use the OAuth 2.0 API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

     <privileges>
-   <privilege>http://tizen.org/privilege/internet</privilege>
+   <privilege>http://tizen.org/privilege/internet</privilege>
 </privileges>
    @@ -148,10 +148,10 @@ ret = oauth2_request_create(&request);

    You can set various request properties, such as end points for authentication and token, grant type, user name, and password.

    -char* auth_url = "https://accounts.google.com/o/oauth2/auth";
-char* token_url = "https://accounts.google.com/o/oauth2/token";
-char* user_name = "username";
-char* password = "password";
+char* auth_url = "https://accounts.google.com/o/oauth2/auth";
+char* token_url = "https://accounts.google.com/o/oauth2/token";
+char* user_name = "username";
+char* password = "password";
 
 ret = oauth2_request_set_auth_end_point_url(request, auth_url);
 
@@ -191,7 +191,7 @@ ret = oauth2_request_destroy(request);
    - +

    Requesting the Server for a Grant or Token

    To obtain the required authorization code or access token:

    @@ -204,43 +204,43 @@ ret = oauth2_request_destroy(request); void grant_response_cb(oauth2_response_h response, void* user_data) { -    /* Authorization code response callback */ -    char *auth_code = NULL; -    oauth2_response_get_authorization_code(response, &auth_code); + /* Authorization code response callback */ + char *auth_code = NULL; + oauth2_response_get_authorization_code(response, &auth_code); } void request_auth_code(void) { -    oauth2_manager_h mgr = NULL; -    int ret = oauth2_manager_create(&mgr); - -    oauth2_request_h request = NULL; -    ret = oauth2_request_create(&request); - -    /* -     Set all the required parameters needed as per the Web server's -     OAuth 2.0 authentication policy before making the request -    */ - -    /* Set the response_type as "code" */ -    ret = oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_CODE); - -    /* Set the application client ID registered in the server */ -    ret = oauth2_request_set_client_id(request, "app_client_id"); - -    /* -     Set the redirect URI for the server -     to redirect the flow after the authentication -    */ -    ret = oauth2_request_set_redirection_url(request, "https://developer.tizen.org"); - -    /* -     Request the server for the authorization grant; -     the response from the server is returned in the callback -    */ -    ret = oauth2_manager_request_authorization_grant(mgr, request, grant_response_cb, -                                                     user_data); + oauth2_manager_h mgr = NULL; + int ret = oauth2_manager_create(&mgr); + + oauth2_request_h request = NULL; + ret = oauth2_request_create(&request); + + /* + Set all the required parameters needed as per the Web server's + OAuth 2.0 authentication policy before making the request + */ + + /* Set the response_type as "code" */ + ret = oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_CODE); + + /* Set the application client ID registered in the server */ + ret = oauth2_request_set_client_id(request, "app_client_id"); + + /* + Set the redirect URI for the server + to redirect the flow after the authentication + */ + ret = oauth2_request_set_redirection_url(request, "https://developer.tizen.org"); + + /* + Request the server for the authorization grant; + the response from the server is returned in the callback + */ + ret = oauth2_manager_request_authorization_grant(mgr, request, grant_response_cb, + user_data); } @@ -257,41 +257,41 @@ request_auth_code(void) void request_auth_code(void) { -    oauth2_manager_h mgr = NULL; -    int ret = oauth2_manager_create(&mgr); + oauth2_manager_h mgr = NULL; + int ret = oauth2_manager_create(&mgr); -    oauth2_request_h request = NULL; -    ret = oauth2_request_create(&request); + oauth2_request_h request = NULL; + ret = oauth2_request_create(&request); -    /* -     Set all the required parameters needed as per the Web server's -     OAuth 2.0 authentication policy before making the request -    */ + /* + Set all the required parameters needed as per the Web server's + OAuth 2.0 authentication policy before making the request + */ -    ret = -        oauth2_request_set_auth_end_point_url(request, -                                              "https://login.live.com/oauth20_authorize.srf"); + ret = + oauth2_request_set_auth_end_point_url(request, + "https://login.live.com/oauth20_authorize.srf"); -    ret = -        oauth2_request_set_token_end_point_url(request, -                                               "https://login.live.com/oauth20_token.srf"); + ret = + oauth2_request_set_token_end_point_url(request, + "https://login.live.com/oauth20_token.srf"); -    ret = oauth2_request_set_redirection_url(request, -                                             "https://developer.tizen.org"); + ret = oauth2_request_set_redirection_url(request, + "https://developer.tizen.org"); -    ret = oauth2_request_set_client_id(request, "WINDOWS_CLIENT_ID"); + ret = oauth2_request_set_client_id(request, "WINDOWS_CLIENT_ID"); -    ret = oauth2_request_set_client_secret(request, "WINDOWS_CLIENT_SECRET"); + ret = oauth2_request_set_client_secret(request, "WINDOWS_CLIENT_SECRET"); -    ret = oauth2_request_set_scope(request, "wl.basic"); + ret = oauth2_request_set_scope(request, "wl.basic"); -    ret = -    oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_CODE); + ret = + oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_CODE); -    if (mgr && request) -        ret = oauth2_manager_request_authorization_grant(mgr, request, -                                                         grant_response_cb, -                                                         request); + if (mgr && request) + ret = oauth2_manager_request_authorization_grant(mgr, request, + grant_response_cb, + request); } @@ -301,33 +301,33 @@ request_auth_code(void) void access_token_cb(oauth2_response_h response, void* user_data) { -    /* Access token response callback */ + /* Access token response callback */ -    char *access_token = NULL; -    oauth2_response_get_access_token(response, &access_token); + char *access_token = NULL; + oauth2_response_get_access_token(response, &access_token); } void grant_response_cb(oauth2_response_h response, void* user_data) { -    /* Authorization code response callback */ + /* Authorization code response callback */ -    char *auth_code = NULL; -    oauth2_response_get_authorization_code(response, &auth_code); + char *auth_code = NULL; + oauth2_response_get_authorization_code(response, &auth_code); -    if (auth_code) { -        oauth2_manager_h mgr = NULL; -        int ret = oauth2_manager_create(&mgr); + if (auth_code) { + oauth2_manager_h mgr = NULL; + int ret = oauth2_manager_create(&mgr); -        /* Request handle was passed as the user data */ -        oauth2_request_h request = (oauth2_request_h) user_data; + /* Request handle was passed as the user data */ + oauth2_request_h request = (oauth2_request_h) user_data; -        ret = oauth2_request_set_authorization_code(request, auth_code); + ret = oauth2_request_set_authorization_code(request, auth_code); -        if (mgr && request) -            ret = oauth2_manager_request_access_token(mgr, request, -                                                      access_token_cb, NULL); -    } + if (mgr && request) + ret = oauth2_manager_request_access_token(mgr, request, + access_token_cb, NULL); + } } @@ -342,45 +342,45 @@ grant_response_cb(oauth2_response_h response, void* user_data) void token_response_cb(oauth2_response_h response, void* user_data) { -    /* Access token response callback */ + /* Access token response callback */ -    char *access_token = NULL; -    oauth2_response_get_access_token(response, &access_token); + char *access_token = NULL; + oauth2_response_get_access_token(response, &access_token); } void request_access_token(void) { -    oauth2_manager_h mgr = NULL; -    int ret = oauth2_manager_create(&mgr); + oauth2_manager_h mgr = NULL; + int ret = oauth2_manager_create(&mgr); -    oauth2_request_h request = NULL; -    ret = oauth2_request_create(&request); + oauth2_request_h request = NULL; + ret = oauth2_request_create(&request); -    /* -     Set all the required parameters needed as per the Web server's -     OAuth 2.0 authentication policy before making the request -    */ + /* + Set all the required parameters needed as per the Web server's + OAuth 2.0 authentication policy before making the request + */ -    ret = -    oauth2_request_set_auth_end_point_url(request, -                                              "https://www.facebook.com/dialog/oauth"); + ret = + oauth2_request_set_auth_end_point_url(request, + "https://www.facebook.com/dialog/oauth"); -    ret = oauth2_request_set_redirection_url(request, -                                             "https://developer.tizen.org"); + ret = oauth2_request_set_redirection_url(request, + "https://developer.tizen.org"); -    ret = oauth2_request_set_client_id(request, "SAMPLE_CLIENT_ID"); + ret = oauth2_request_set_client_id(request, "SAMPLE_CLIENT_ID"); -    ret = oauth2_request_set_scope(request, "read_stream"); + ret = oauth2_request_set_scope(request, "read_stream"); -    ret = oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_TOKEN); + ret = oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_TOKEN); -    if (mgr && request) { -        ret = oauth2_manager_request_token(mgr, request, -                                           token_response_cb, request); -        if (ret != OAUTH2_ERROR_NONE) -            dlog_print(DLOG_ERROR, LOG_TAG, "Access Token request failed"); -    } + if (mgr && request) { + ret = oauth2_manager_request_token(mgr, request, + token_response_cb, request); + if (ret != OAUTH2_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "Access Token request failed"); + } } @@ -393,92 +393,92 @@ request_access_token(void) void token_response_cb(oauth2_response_h response, void* user_data) { -    /* Access token response callback */ + /* Access token response callback */ -    char *access_token = NULL; -    oauth2_response_get_access_token(response, &access_token); + char *access_token = NULL; + oauth2_response_get_access_token(response, &access_token); } void refresh_token_response_cb(oauth2_response_h response, void* user_data) { -    char *acc_token = NULL; -    oauth2_response_get_access_token(response, &acc_token); + char *acc_token = NULL; + oauth2_response_get_access_token(response, &acc_token); -    char *ref_token = NULL; -    oauth2_response_get_refresh_token(response, &ref_token); + char *ref_token = NULL; + oauth2_response_get_refresh_token(response, &ref_token); -    char *auth_code = NULL; -    oauth2_response_get_authorization_code(response, &auth_code); -    if (auth_code) { -        oauth2_manager_h mgr = (oauth2_manager_h) user_data; + char *auth_code = NULL; + oauth2_response_get_authorization_code(response, &auth_code); + if (auth_code) { + oauth2_manager_h mgr = (oauth2_manager_h) user_data; -        oauth2_request_h request = NULL; + oauth2_request_h request = NULL; -        int ret = oauth2_request_create(&request); + int ret = oauth2_request_create(&request); -        /* -         Set all the required parameters needed as per the Web server's -         OAuth 2.0 authentication policy before making the request -        */ + /* + Set all the required parameters needed as per the Web server's + OAuth 2.0 authentication policy before making the request + */ -        ret = -            oauth2_request_set_refresh_token_url(request, -                                                 "https://www.googleapis.com/oauth2/v3/token"); + ret = + oauth2_request_set_refresh_token_url(request, + "https://www.googleapis.com/oauth2/v3/token"); -        ret = oauth2_request_set_refresh_token(request, ref_token); + ret = oauth2_request_set_refresh_token(request, ref_token); -        ret = oauth2_request_set_client_id(request, "GOOGLE_CLIENT_ID"); + ret = oauth2_request_set_client_id(request, "GOOGLE_CLIENT_ID"); -        ret = oauth2_request_set_client_secret(request, "GOOGLE_CLIENT_SECRET"); + ret = oauth2_request_set_client_secret(request, "GOOGLE_CLIENT_SECRET"); -        ret = oauth2_request_set_grant_type(request, OAUTH2_GRANT_TYPE_REFRESH); + ret = oauth2_request_set_grant_type(request, OAUTH2_GRANT_TYPE_REFRESH); -        ret = -            oauth2_request_set_client_authentication_type(request, -                                                          OAUTH2_CLIENT_AUTHENTICATION_TYPE_REQUEST_BODY); + ret = + oauth2_request_set_client_authentication_type(request, + OAUTH2_CLIENT_AUTHENTICATION_TYPE_REQUEST_BODY); -        if (mgr && request) -            ret = oauth2_manager_refresh_access_token(mgr, request, -                                                      token_response_cb, NULL); -    } + if (mgr && request) + ret = oauth2_manager_refresh_access_token(mgr, request, + token_response_cb, NULL); + } } void request_access_token(void) { -    oauth2_manager_h mgr = NULL; -    int ret = oauth2_manager_create(&mgr); + oauth2_manager_h mgr = NULL; + int ret = oauth2_manager_create(&mgr); -    oauth2_request_h request = NULL; -    ret = oauth2_request_create(&request); + oauth2_request_h request = NULL; + ret = oauth2_request_create(&request); -    /* -     Set all the required parameters needed as per the Web server's -     OAuth 2.0 authentication policy before making the request -    */ + /* + Set all the required parameters needed as per the Web server's + OAuth 2.0 authentication policy before making the request + */ -    ret = -    oauth2_request_set_auth_end_point_url(request, -                                              "https://accounts.google.com/o/oauth2/auth"); + ret = + oauth2_request_set_auth_end_point_url(request, + "https://accounts.google.com/o/oauth2/auth"); -    ret = -    oauth2_request_set_token_end_point_url(request, -                                               "https://accounts.google.com/o/oauth2/token"); + ret = + oauth2_request_set_token_end_point_url(request, + "https://accounts.google.com/o/oauth2/token"); -    ret = oauth2_request_set_redirection_url(request, "https://localhost:8080"); + ret = oauth2_request_set_redirection_url(request, "https://localhost:8080"); -    ret = oauth2_request_set_client_id(request, "GOOGLE_CLIENT_ID"); + ret = oauth2_request_set_client_id(request, "GOOGLE_CLIENT_ID"); -    ret = oauth2_request_set_client_secret(request, "GOOGLE_CLIENT_SECRET"); + ret = oauth2_request_set_client_secret(request, "GOOGLE_CLIENT_SECRET"); -    ret = oauth2_request_set_scope(request, "email"); + ret = oauth2_request_set_scope(request, "email"); -    ret = oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_CODE); + ret = oauth2_request_set_response_type(request, OAUTH2_RESPONSE_TYPE_CODE); -    if (mgr && request) -        ret = oauth2_manager_request_token(mgr, request, -                                           refresh_token_response_cb, mgr); + if (mgr && request) + ret = oauth2_manager_request_token(mgr, request, + refresh_token_response_cb, mgr); } @@ -529,7 +529,7 @@ oauth2_error_get_description(e_handle, &description); oauth2_error_get_uri(e_handle, &uri); -oauth2_error_get_custom_data(e_handle, "error", &error_val); +oauth2_error_get_custom_data(e_handle, "error", &error_val);
  • When you no longer need the it, free the response handle with the oauth2_response_destroy() function: @@ -540,7 +540,7 @@ ret = oauth2_response_destroy(response);
    • - +
    diff --git a/org.tizen.guides/html/native/personal/personal_cover_n.htm b/org.tizen.guides/html/native/personal/personal_cover_n.htm index 1bcff36..3603b06 100644 --- a/org.tizen.guides/html/native/personal/personal_cover_n.htm +++ b/org.tizen.guides/html/native/personal/personal_cover_n.htm @@ -5,13 +5,13 @@ - + - Personal Data + Personal Data @@ -31,7 +31,7 @@
  • Creating Applications with Contacts
    • - +

    Personal Data

    @@ -63,7 +63,7 @@
  • Contextual Device Usage History Data in mobile applications only -

    The Tizen platform collects data on the device usage. Based on this data, you can retrieve the user's application usage patterns, such as information about frequently used applications, from the device usage history to perform statistical analysis.

    • +

    The Tizen platform collects data on the device usage. Based on this data, you can retrieve the user's application usage patterns, such as information about frequently used applications, from the device usage history to perform statistical analysis.

    diff --git a/org.tizen.guides/html/native/security/csr_n.htm b/org.tizen.guides/html/native/security/csr_n.htm index 8a2d957..d784612 100644 --- a/org.tizen.guides/html/native/security/csr_n.htm +++ b/org.tizen.guides/html/native/security/csr_n.htm @@ -54,7 +54,7 @@
  • Web Protection (Anti Phishing) Service

    The service enables caller modules and applications to check whether a URL they want to access is risky. The actual operation is performed by an underlying anti-malware engine, which is provided by a device manufacturer.

    • - +

    You can manage the anti-malware engines by enabling and disabling, as needed.

    Figure: CSR framework process

    @@ -68,13 +68,13 @@
  • To use the CSR API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the tizen-manifest.xml file: 
     <privileges>
-   <!--Needed for malware scanning-->
-   <privilege>http://tizen.org/privilege/antivirus.scan</privilege>
-   <!--Needed for URL reputation checks-->
-   <privilege>http://tizen.org/privilege/antivirus.webprotect</privilege>
-   <!--Needed for engine management and judging any detected malware-->
-   <!--Platform-level privilege-->
-   <privilege>http://tizen.org/privilege/antivirus.admin</privilege>
+   <!--Needed for malware scanning-->
+   <privilege>http://tizen.org/privilege/antivirus.scan</privilege>
+   <!--Needed for URL reputation checks-->
+   <privilege>http://tizen.org/privilege/antivirus.webprotect</privilege>
+   <!--Needed for engine management and judging any detected malware-->
+   <!--Platform-level privilege-->
+   <privilege>http://tizen.org/privilege/antivirus.admin</privilege>
 </privileges>
    • @@ -112,7 +112,7 @@ ret = csr_cs_context_create(&context);
  • Scan for the content:
    • Scan in memory. -

      Memory scanning is a synchronous operation. When a malware is detected and CSR_CS_ASK_USER_YES is set in the csr_cs_set_ask_user() function, a popup notice is displayed to the user and processed based on the user's decision.

      +

      Memory scanning is a synchronous operation. When a malware is detected and CSR_CS_ASK_USER_YES is set in the csr_cs_set_ask_user() function, a popup notice is displayed to the user and processed based on the user's decision.

       csr_cs_malware_h detected;
 
@@ -123,7 +123,7 @@ ret = csr_cs_set_ask_user(context, CSR_CS_ASK_USER_YES);
 unsigned char data[100] = {0,}; /* Set your own data for scanning */
 ret = csr_cs_scan_data(context, data, sizeof(data), &detected);
 if (ret != CSR_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
 
 /* Extract result */
 csr_cs_severity_level_e severity;
@@ -132,18 +132,18 @@ char *detailed_url;
 char *file_name;
 
 if (detected != NULL) {
-    ret = csr_cs_malware_get_severity(detected, &severity);
-    ret = csr_cs_malware_get_name(detected, &malware_name);
-    ret = csr_cs_malware_get_detailed_url(detected, &detailed_url);
-    ret = csr_cs_malware_get_user_response(detected, &user_response);
+    ret = csr_cs_malware_get_severity(detected, &severity);
+    ret = csr_cs_malware_get_name(detected, &malware_name);
+    ret = csr_cs_malware_get_detailed_url(detected, &detailed_url);
+    ret = csr_cs_malware_get_user_response(detected, &user_response);
 
-    /* Release the returned C strings using free() */
+    /* Release the returned C strings using free() */
 }
    • Scan in a file. -

      Scanning content in a file is a synchronous operation. When a malware is detected and CSR_CS_ASK_USER_YES is set in the csr_cs_set_ask_user() function, a popup notice is displayed to the user and processed based on the user's decision.

      +

      Scanning content in a file is a synchronous operation. When a malware is detected and CSR_CS_ASK_USER_YES is set in the csr_cs_set_ask_user() function, a popup notice is displayed to the user and processed based on the user's decision.

       csr_cs_malware_h detected;
 
@@ -151,10 +151,10 @@ csr_cs_malware_h detected;
 ret = csr_cs_set_ask_user(context, CSR_CS_ASK_USER_YES);
 
 /* Scan in a file */
-const char *file = "/tmp/testfile.txt"; /* Set the target file for scanning */
+const char *file = "/tmp/testfile.txt"; /* Set the target file for scanning */
 ret = csr_cs_scan_file(context, file, &detected);
 if (ret != CSR_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      • @@ -164,7 +164,7 @@ if (ret != CSR_ERROR_NONE) /* Define callback functions */ void on_detected(csr_cs_malware_h detected, void *userdata) { -    /* Extract detected malware information */ + /* Extract detected malware information */ } void on_scanned(const char *file, void *userdata) {} void on_error(int ec, void *userdata) {} @@ -172,22 +172,22 @@ void on_completed(void *userdata) {} void on_cancelled(void *userdata) {} { -    csr_cs_malware_h detected; -    /* User-specific data to be returned at callback method */ -    char *user_data = NULL; -    int ret; - -    /* Register callbacks */ -    ret = csr_cs_set_detected_cb(context, on_detected); -    ret = csr_cs_set_completed_cb(context, on_completed); -    ret = csr_cs_set_cancelled_cb(context, on_cancelled); -    ret = csr_cs_set_error_cb(context, on_error); -    ret = csr_cs_set_file_scanned_cb(context, on_scanned); - -    /* Scan asynchronously */ -    const char *dirs[2] = {TEST_DIR1, TEST_DIR2}; -    ret = csr_cs_scan_dirs_async(context, dirs, sizeof(dirs) / sizeof(const char *), -                                 user_data); /* user_data can be NULL */ + csr_cs_malware_h detected; + /* User-specific data to be returned at callback method */ + char *user_data = NULL; + int ret; + + /* Register callbacks */ + ret = csr_cs_set_detected_cb(context, on_detected); + ret = csr_cs_set_completed_cb(context, on_completed); + ret = csr_cs_set_cancelled_cb(context, on_cancelled); + ret = csr_cs_set_error_cb(context, on_error); + ret = csr_cs_set_file_scanned_cb(context, on_scanned); + + /* Scan asynchronously */ + const char *dirs[2] = {TEST_DIR1, TEST_DIR2}; + ret = csr_cs_scan_dirs_async(context, dirs, sizeof(dirs) / sizeof(const char *), + user_data); /* user_data can be NULL */ }
    @@ -202,29 +202,29 @@ size_t list_size; int idx; const char *dirs[1] = { -    TEST_DIR + TEST_DIR }; /* Get information on detected malware files specified by file path */ -csr_cs_get_detected_malware(context, "file_path_of_malware_file", &detected); +csr_cs_get_detected_malware(context, "file_path_of_malware_file", &detected); /* Get information on detected malware files specified by directory path */ csr_cs_get_detected_malwares(context, dirs, size, &detected_list, &list_size); for (idx = 0; idx < list_size; idx++) { -    ret = csr_cs_malware_list_get_malware(detected_list, idx, &detected); -    /* Get additional information here */ + ret = csr_cs_malware_list_get_malware(detected_list, idx, &detected); + /* Get additional information here */ } /* Get information on ignored malware files specified by file path */ -csr_cs_get_ignored_malware(context, "file_path_of_malware_file", &detected); +csr_cs_get_ignored_malware(context, "file_path_of_malware_file", &detected); /* Get information on ignored malware files specified by directory path */ csr_cs_get_ignored_malwares(context, dirs, size, &detected_list, &list_size); for (idx = 0; idx < list_size; idx++) { -    ret = csr_cs_malware_list_get_malware(detected_list, idx, &detected); -    /* Get additional information here */ + ret = csr_cs_malware_list_get_malware(detected_list, idx, &detected); + /* Get additional information here */ }
    • @@ -272,7 +272,7 @@ int ret; ret = csr_wp_set_ask_user(context, CSR_WP_ASK_USER_YES); /* Check a URL */ -const char *url = "http://www.testurl.com"; /* Set the target URL to check */ +const char *url = "http://www.testurl.com"; /* Set the target URL to check */ ret = csr_wp_check_url(context, url, &result); /* Extract result */ diff --git a/org.tizen.guides/html/native/security/dpm_n.htm b/org.tizen.guides/html/native/security/dpm_n.htm index 3373292..275265c 100644 --- a/org.tizen.guides/html/native/security/dpm_n.htm +++ b/org.tizen.guides/html/native/security/dpm_n.htm @@ -28,7 +28,7 @@

    Content

    Related Info

      @@ -56,7 +56,7 @@

    The following figure illustrates the DPM framework process.

    - +

    Figure: DPM framework process

    DPM framework process

    @@ -90,24 +90,24 @@ int callback_id; void on_policy_changed(const char* name, const char* value, void* data) { -    int state = strcmp(value, "allowed") ? 0 : 1; - -    if (strcmp(name, "camera") == 0) { -        if (state) -            /* Using the camera is allowed */ -        else -            /* Using the camera is not allowed */ -    } + int state = strcmp(value, "allowed") ? 0 : 1; + + if (strcmp(name, "camera") == 0) { + if (state) + /* Using the camera is allowed */ + else + /* Using the camera is not allowed */ + } } /* Add the policy change callback to the device policy manager */ int dpm_init() { -    int ret = dpm_add_policy_changed_cb(dpm, "camera", on_policy_changed, -                                        user_data, &callback_id); -    if (ret < 0) -        /* Error handling */ + int ret = dpm_add_policy_changed_cb(dpm, "camera", on_policy_changed, + user_data, &callback_id); + if (ret < 0) + /* Error handling */ } @@ -120,8 +120,8 @@ int state; /* Check the restriction state of the camera */ if (dpm_restriction_get_camera_state(dpm, &state) == DPM_ERROR_NONE) { -    /* state: 0: using the camera is not allowed */ -    /* state: 1: using the camera is allowed */ + /* state: 0: using the camera is not allowed */ + /* state: 1: using the camera is allowed */ } @@ -131,10 +131,10 @@ if (dpm_restriction_get_camera_state(dpm, &state) == DPM_ERROR_NONE) { void dpm_finalize() { -    /* Remove the policy change callback from the device policy manager */ -    dpm_remove_policy_changed_cb(dpm, callback_id); -    /* Destroy the DPM handle */ -    dpm_manager_destroy(dpm); + /* Remove the policy change callback from the device policy manager */ + dpm_remove_policy_changed_cb(dpm, callback_id); + /* Destroy the DPM handle */ + dpm_manager_destroy(dpm); } diff --git a/org.tizen.guides/html/native/security/privilege_n.htm b/org.tizen.guides/html/native/security/privilege_n.htm index 5eb2443..7de8d69 100644 --- a/org.tizen.guides/html/native/security/privilege_n.htm +++ b/org.tizen.guides/html/native/security/privilege_n.htm @@ -49,7 +49,7 @@
  • Privilege description: Detailed information on permissions, including accessible resources and functionality, that the application can get with this privilege. It also contains information related to billing or device performance, such as cost or increased battery usage.
  • Privacy name: Privacy name represents a group of privileges that are related to a certain common feature.
    • -

    From Tizen 3.0, some privileges are categorized as privacy-related, and you can switch those privileges on and off based on the user preference. You can change certain privileges' status to allow or deny them at runtime. This means that the application calling a privileged API can be prevented from using it even if the required privilege is declared in its manifest file. Specific APIs can be used to check the privacy-related privilege's current status and get the display name of the privacy that includes the privilege. For example, you can use the APIs to check the privilege's current status before entering a function that requires the privilege, and if the status is off, display a guide message to the user to ask them to go to the device settings and switch the required privacy on.

    +

    From Tizen 3.0, some privileges are categorized as privacy-related, and you can switch those privileges on and off based on the user preference. You can change certain privileges' status to allow or deny them at runtime. This means that the application calling a privileged API can be prevented from using it even if the required privilege is declared in its manifest file. Specific APIs can be used to check the privacy-related privilege's current status and get the display name of the privacy that includes the privilege. For example, you can use the APIs to check the privilege's current status before entering a function that requires the privilege, and if the status is off, display a guide message to the user to ask them to go to the device settings and switch the required privacy on.

    Prerequisites

    To use the functions and data types of the Privilege Info API (in mobile and wearable applications), include the <privilege_information.h> header file in your application:

    @@ -66,9 +66,9 @@ 
     char* display_name = NULL;
 int ret =
-    privilege_info_get_display_name("2.2",
-                                    "http://tizen.org/privilege/application.launch",
-                                    &display_name);
+    privilege_info_get_display_name("2.2",
+                                    "http://tizen.org/privilege/application.launch",
+                                    &display_name);
    @@ -76,9 +76,9 @@ int ret = 
     char* display_name = NULL;
 int ret =
-    privilege_info_get_display_name_by_pkgtype("PRVINFO_PACKAGE_TYPE_WEB", "2.2",
-                                               "http://tizen.org/privilege/application.launch",
-                                               &display_name);
+    privilege_info_get_display_name_by_pkgtype("PRVINFO_PACKAGE_TYPE_WEB", "2.2",
+                                               "http://tizen.org/privilege/application.launch",
+                                               &display_name);
    @@ -86,9 +86,9 @@ int ret = 
     char* description = NULL;
 int ret =
-    privilege_info_get_description("2.2",
-                                   "http://tizen.org/privilege/application.launch",
-                                   &description);
+    privilege_info_get_description("2.2",
+                                   "http://tizen.org/privilege/application.launch",
+                                   &description);
    @@ -97,25 +97,25 @@ int ret = 
     char* description = NULL;
 int ret =
-    privilege_info_get_description_by_pkgtype("PRVINFO_PACKAGE_TYPE_WEB", "2.2",
-                                              "http://tizen.org/privilege/application.launch",
-                                              &description);
+    privilege_info_get_description_by_pkgtype("PRVINFO_PACKAGE_TYPE_WEB", "2.2",
+                                              "http://tizen.org/privilege/application.launch",
+                                              &description);
  • Get the privacy display name using the privilege_info_get_privacy_display_name() function: 
     char* privacy_display_name = NULL;
 int ret =
-    privilege_info_get_privacy_display_name("http://tizen.org/privilege/account.read",
-                                            &privacy_display_name);
+    privilege_info_get_privacy_display_name("http://tizen.org/privilege/account.read",
+                                            &privacy_display_name);
    • -
  • Get the privacy-related privilege's status using the privilege_info_get_privacy_privilege_status() function: +
  • Get the privacy-related privilege's status using the privilege_info_get_privacy_privilege_status() function: 
     bool status = NULL;
 int ret =
-    privilege_info_get_privacy_privilege_status("http://tizen.org/privilege/account.read",
-                                                &status);
+    privilege_info_get_privacy_privilege_status("http://tizen.org/privilege/account.read",
+                                                &status);
    • diff --git a/org.tizen.guides/html/native/security/secure_key_n.htm b/org.tizen.guides/html/native/security/secure_key_n.htm index db69430..e759a6b 100644 --- a/org.tizen.guides/html/native/security/secure_key_n.htm +++ b/org.tizen.guides/html/native/security/secure_key_n.htm @@ -24,7 +24,7 @@
    • Tizen 2.4 and Higher for Mobile
    • Tizen 2.3.1 and Higher for Wearable
      • -
    +

    Content

    +

    Related Info

    -

    Figure: Key manager process

    -

    Key manager process

    +

    Figure: Key manager process

    +

    Key manager process

    The key manager provides 2 types of APIs (in mobile and wearable applications):

      @@ -118,11 +118,11 @@

      To use the Key Manager API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

       <privileges>
-   <privilege>http://tizen.org/privilege/keymanager</privilege>
+   <privilege>http://tizen.org/privilege/keymanager</privilege>
 </privileges>
      - +

    • To use the functions and data types of the Key Manager API, include the <ckmc/ckmc-manager.h> header file in your application:

       #include <ckmc/ckmc-manager.h>
@@ -138,18 +138,18 @@ int ret = CKMC_ERROR_NONE;
 
 ckmc_key_s test_key;
 ckmc_policy_s store_policy;
-char* alias= "mykey";
+char* alias= "mykey";
 char* key_password = NULL;
 
-char* binary_key = "-----BEGIN PUBLIC KEY-----\n"
-    "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA2b1bXDa+S8/MGWnMkru4\n"
-    "T4tUddtZNi0NVjQn9RFH1NMa220GsRhRO56F77FlSVFKfSfVZKIiWg6C+DVCkcLf\n"
-    "zXJ/Z0pvwOQYBAqVMFjV6efQGN0JzJ1Unu7pPRiZl7RKGEI+cyzzrcDyrLLrQ2W7\n"
-    "0ZySkNEOv6Frx9JgC5NExuYY4lk2fQQa38JXiZkfyzif2em0px7mXbyf5LjccsKq\n"
-    "v1e+XLtMsL0ZefRcqsP++NzQAI8fKX7WBT+qK0HJDLiHrKOTWYzx6CwJ66LD/vvf\n"
-    "j55xtsKDLVDbsotvf8/m6VLMab+vqKk11TP4tq6yo0mwyTADvgl1zowQEO9I1W6o\n"
-    "zQIDAQAB\n"
-    "-----END PUBLIC KEY-----";
+char* binary_key = "-----BEGIN PUBLIC KEY-----\n"
+    "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA2b1bXDa+S8/MGWnMkru4\n"
+    "T4tUddtZNi0NVjQn9RFH1NMa220GsRhRO56F77FlSVFKfSfVZKIiWg6C+DVCkcLf\n"
+    "zXJ/Z0pvwOQYBAqVMFjV6efQGN0JzJ1Unu7pPRiZl7RKGEI+cyzzrcDyrLLrQ2W7\n"
+    "0ZySkNEOv6Frx9JgC5NExuYY4lk2fQQa38JXiZkfyzif2em0px7mXbyf5LjccsKq\n"
+    "v1e+XLtMsL0ZefRcqsP++NzQAI8fKX7WBT+qK0HJDLiHrKOTWYzx6CwJ66LD/vvf\n"
+    "j55xtsKDLVDbsotvf8/m6VLMab+vqKk11TP4tq6yo0mwyTADvgl1zowQEO9I1W6o\n"
+    "zQIDAQAB\n"
+    "-----END PUBLIC KEY-----";
 
 test_key.raw_key = (unsigned char *)binary_key;
 test_key.key_size = strlen(binary_key);
@@ -162,7 +162,7 @@ store_policy.extractable = true; /* Key value is extractable */
 
 ret = ckmc_save_key(alias, test_key, store_policy);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
    • Get the key from the key manager: @@ -170,14 +170,14 @@ if (CKMC_ERROR_NONE != ret) int ret = CKMC_ERROR_NONE; ckmc_key_s *test_key; -char* alias= "mykey"; +char* alias= "mykey"; char* key_password = NULL; ret = ckmc_get_key(alias, key_password, &test_key); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ -dlog_print(DLOG_INFO, LOG_TAG, "key size =%d\n", test_key->key_size); +dlog_print(DLOG_INFO, LOG_TAG, "key size =%d\n", test_key->key_size); ckmc_key_free(test_key); /* Called when the key is no longer needed */
      • @@ -194,15 +194,15 @@ int count_list = 0; ret = ckmc_get_key_alias_list(&alias_list); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ plist = alias_list; do { -    ckmc_get_key(plist->alias, key_password, &test_key); -    dlog_print(DLOG_INFO, LOG_TAG, "%d th key: key size =%d\n", -               ++count_list, test_key->key_size); -    ckmc_key_free(test_key); -    plist = plist->next; + ckmc_get_key(plist->alias, key_password, &test_key); + dlog_print(DLOG_INFO, LOG_TAG, "%d th key: key size =%d\n", + ++count_list, test_key->key_size); + ckmc_key_free(test_key); + plist = plist->next; } while (plist != NULL); ckmc_alias_list_all_free(alias_list); /* Called when the list is no longer needed */ @@ -211,11 +211,11 @@ ckmc_alias_list_all_free(alias_list); /* Called when the list is no longer neede 
       int ret = CKMC_ERROR_NONE;
 
-const char* alias= "mykey";
+const char* alias= "mykey";
 
 ret = ckmc_remove_alias(alias);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
      @@ -231,36 +231,36 @@ int ret = CKMC_ERROR_NONE; char* password = NULL; ckmc_cert_s cert; -const char *alias = "myCert"; +const char *alias = "myCert"; ckmc_policy_s test_policy; -const char *certPem = "-----BEGIN CERTIFICATE-----\n" -"MIIEgDCCA2igAwIBAgIIcjtBYJGQtOAwDQYJKoZIhvcNAQEFBQAwSTELMAkGA1UE\n" -"BhMCVVMxEzARBgNVBAoTCkdvb2dsZSBJbmMxJTAjBgNVBAMTHEdvb2dsZSBJbnRl\n" -"cm5ldCBBdXRob3JpdHkgRzIwHhcNMTQwNTIyMTEyOTQyWhcNMTQwODIwMDAwMDAw\n" -"WjBtMQswCQYDVQQGEwJVUzETMBEGA1UECAwKQ2FsaWZvcm5pYTEWMBQGA1UEBwwN\n" -"TW91bnRhaW4gVmlldzETMBEGA1UECgwKR29vZ2xlIEluYzEcMBoGA1UEAwwTYWNj\n" -"b3VudHMuZ29vZ2xlLmNvbTCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEB\n" -"ALtlLWVWPN3q3bSEQl1Z97gPdgl5vbgJOZSAr0ZY0tJCuFLBbUKetJWryyE+5KpG\n" -"gMMpLS4v8/bvXaZc6mAs+RfAqGM24C3vQg5hPnj4dflnhL0WiOCZBurm1tV4oexk\n" -"HLXs3jr/jpnb738AQpj8zZ9a4VEBuHJRZALnWZ/XhqU+dvYomAoRQNuL5OhkT7uu\n" -"d0NKJL9JjYLyQglGgE2sVsWv2kj7EO/P9Q6NEKt9BGmhMsFvtfeKUaymynaxpR1g\n" -"wEPlqYvB38goh1dIOgVLT0OVyLImeg5Mdwar/8c1U0OYhLOc6PJapOZAfUkE+3+w\n" -"xYt8AChLN1b5szOwInrCVpECAwEAAaOCAUYwggFCMB0GA1UdJQQWMBQGCCsGAQUF\n" -"BwMBBggrBgEFBQcDAjAeBgNVHREEFzAVghNhY2NvdW50cy5nb29nbGUuY29tMGgG\n" -"CCsGAQUFBwEBBFwwWjArBggrBgEFBQcwAoYfaHR0cDovL3BraS5nb29nbGUuY29t\n" -"L0dJQUcyLmNydDArBggrBgEFBQcwAYYfaHR0cDovL2NsaWVudHMxLmdvb2dsZS5j\n" -"b20vb2NzcDAdBgNVHQ4EFgQU0/UtToEtNIfwDwHuYGuVKcj0xK8wDAYDVR0TAQH/\n" -"BAIwADAfBgNVHSMEGDAWgBRK3QYWG7z2aLV29YG2u2IaulqBLzAXBgNVHSAEEDAO\n" -"MAwGCisGAQQB1nkCBQEwMAYDVR0fBCkwJzAloCOgIYYfaHR0cDovL3BraS5nb29n\n" -"bGUuY29tL0dJQUcyLmNybDANBgkqhkiG9w0BAQUFAAOCAQEAcGNI/X9f0g+7ij0o\n" -"ehLpk6vxSMQGrmOZ4+PG/MC9SLClCkt7zJkfU7erZnyVXyxCpwlljq+Wk9YTPUOq\n" -"xD/V2ikQVSAANoxGJFO9UoL5jzWusPhKKv8CcM7fuiERz8K+CfBcqfxbgI5rH0g5\n" -"dYclmLC81cJ/08i+9Nltvxv69Y3hGfEICT6K+EdSxwnQzOhpMZmvxZsIj+d6CVNa\n" -"9ICYgUthsNQVWzrIs5wknpjjZ9liDMwJX0vu8A0rce4X/Lna5hh2bW9igz2iP5WM\n" -"9fuwdbTw4y3jfPQgszU4YZxWxhMzccxe058Qx1tLndAknBQEBesQjXytVQpuM1SV\n" -"rHva8A==\n" -"-----END CERTIFICATE-----\n"; +const char *certPem = "-----BEGIN CERTIFICATE-----\n" +"MIIEgDCCA2igAwIBAgIIcjtBYJGQtOAwDQYJKoZIhvcNAQEFBQAwSTELMAkGA1UE\n" +"BhMCVVMxEzARBgNVBAoTCkdvb2dsZSBJbmMxJTAjBgNVBAMTHEdvb2dsZSBJbnRl\n" +"cm5ldCBBdXRob3JpdHkgRzIwHhcNMTQwNTIyMTEyOTQyWhcNMTQwODIwMDAwMDAw\n" +"WjBtMQswCQYDVQQGEwJVUzETMBEGA1UECAwKQ2FsaWZvcm5pYTEWMBQGA1UEBwwN\n" +"TW91bnRhaW4gVmlldzETMBEGA1UECgwKR29vZ2xlIEluYzEcMBoGA1UEAwwTYWNj\n" +"b3VudHMuZ29vZ2xlLmNvbTCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEB\n" +"ALtlLWVWPN3q3bSEQl1Z97gPdgl5vbgJOZSAr0ZY0tJCuFLBbUKetJWryyE+5KpG\n" +"gMMpLS4v8/bvXaZc6mAs+RfAqGM24C3vQg5hPnj4dflnhL0WiOCZBurm1tV4oexk\n" +"HLXs3jr/jpnb738AQpj8zZ9a4VEBuHJRZALnWZ/XhqU+dvYomAoRQNuL5OhkT7uu\n" +"d0NKJL9JjYLyQglGgE2sVsWv2kj7EO/P9Q6NEKt9BGmhMsFvtfeKUaymynaxpR1g\n" +"wEPlqYvB38goh1dIOgVLT0OVyLImeg5Mdwar/8c1U0OYhLOc6PJapOZAfUkE+3+w\n" +"xYt8AChLN1b5szOwInrCVpECAwEAAaOCAUYwggFCMB0GA1UdJQQWMBQGCCsGAQUF\n" +"BwMBBggrBgEFBQcDAjAeBgNVHREEFzAVghNhY2NvdW50cy5nb29nbGUuY29tMGgG\n" +"CCsGAQUFBwEBBFwwWjArBggrBgEFBQcwAoYfaHR0cDovL3BraS5nb29nbGUuY29t\n" +"L0dJQUcyLmNydDArBggrBgEFBQcwAYYfaHR0cDovL2NsaWVudHMxLmdvb2dsZS5j\n" +"b20vb2NzcDAdBgNVHQ4EFgQU0/UtToEtNIfwDwHuYGuVKcj0xK8wDAYDVR0TAQH/\n" +"BAIwADAfBgNVHSMEGDAWgBRK3QYWG7z2aLV29YG2u2IaulqBLzAXBgNVHSAEEDAO\n" +"MAwGCisGAQQB1nkCBQEwMAYDVR0fBCkwJzAloCOgIYYfaHR0cDovL3BraS5nb29n\n" +"bGUuY29tL0dJQUcyLmNybDANBgkqhkiG9w0BAQUFAAOCAQEAcGNI/X9f0g+7ij0o\n" +"ehLpk6vxSMQGrmOZ4+PG/MC9SLClCkt7zJkfU7erZnyVXyxCpwlljq+Wk9YTPUOq\n" +"xD/V2ikQVSAANoxGJFO9UoL5jzWusPhKKv8CcM7fuiERz8K+CfBcqfxbgI5rH0g5\n" +"dYclmLC81cJ/08i+9Nltvxv69Y3hGfEICT6K+EdSxwnQzOhpMZmvxZsIj+d6CVNa\n" +"9ICYgUthsNQVWzrIs5wknpjjZ9liDMwJX0vu8A0rce4X/Lna5hh2bW9igz2iP5WM\n" +"9fuwdbTw4y3jfPQgszU4YZxWxhMzccxe058Qx1tLndAknBQEBesQjXytVQpuM1SV\n" +"rHva8A==\n" +"-----END CERTIFICATE-----\n"; test_policy.password = password; test_policy.extractable = true; @@ -271,7 +271,7 @@ cert.data_format = CKMC_FORM_PEM; ret = ckmc_save_cert(alias, cert, test_policy); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */
    • Get the certificate from the key manager: @@ -279,14 +279,14 @@ if (CKMC_ERROR_NONE != ret) int ret = CKMC_ERROR_NONE; ckmc_cert_s *test_cert; -char* alias= "myCert"; +char* alias= "myCert"; char* password = NULL; ret = ckmc_get_cert(alias, password, &test_cert); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ -dlog_print(DLOG_INFO, LOG_TAG, "cert size =%d\n", test_cert->cert_size); +dlog_print(DLOG_INFO, LOG_TAG, "cert size =%d\n", test_cert->cert_size); ckmc_cert_free(test_cert); /* Called when the certificate is no longer needed */
      • @@ -302,15 +302,15 @@ int count_list = 0; ret = ckmc_get_cert_alias_list(&alias_list); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ plist = alias_list; do { -    ckmc_get_cert(plist->alias, password, &test_cert); -    dlog_print(DLOG_INFO, LOG_TAG, "%d th cert: cert size =%d\n", -               ++count_list, test_cert->cert_size); -    ckmc_cert_free(test_cert); -    plist = plist->next; + ckmc_get_cert(plist->alias, password, &test_cert); + dlog_print(DLOG_INFO, LOG_TAG, "%d th cert: cert size =%d\n", + ++count_list, test_cert->cert_size); + ckmc_cert_free(test_cert); + plist = plist->next; } while (plist != NULL); ckmc_alias_list_all_free(alias_list); /* Called when the list is no longer needed */ @@ -320,11 +320,11 @@ ckmc_alias_list_all_free(alias_list); /* Called when the list is no longer neede 
       int ret = CKMC_ERROR_NONE;
 
-const char* alias= "myCert";
+const char* alias= "myCert";
 
 ret = ckmc_remove_alias(alias);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
      @@ -338,10 +338,10 @@ int ret = CKMC_ERROR_NONE; char* password = NULL; ckmc_raw_buffer_s test_data; -const char *alias = "myData"; +const char *alias = "myData"; ckmc_policy_s test_policy; -const char *char_bin_data = "My Binary Data"; +const char *char_bin_data = "My Binary Data"; test_policy.password = password; test_policy.extractable = true; @@ -350,7 +350,7 @@ test_data.data = (unsigned char *)char_bin_data; test_data.size = strlen(char_bin_data); ret = ckmc_save_data(alias, test_data, test_policy); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */
    • Get data from the key manager: @@ -359,13 +359,13 @@ int ret = CKMC_ERROR_NONE; char* password = NULL; ckmc_raw_buffer_s *test_data; -const char *alias = "myData"; +const char *alias = "myData"; ret = ckmc_get_data(alias, password, &test_data); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ -dlog_print(DLOG_INFO, LOG_TAG, "data size =%d\n", test_data->size); +dlog_print(DLOG_INFO, LOG_TAG, "data size =%d\n", test_data->size); ckmc_buffer_free(test_data); /* Called when the buffer is no longer needed */
      • @@ -382,15 +382,15 @@ int count_list = 0; ret = ckmc_get_data_alias_list(&alias_list); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ plist = alias_list; do { -    ckmc_get_data(plist->alias, password, &test_data); -    dlog_print(DLOG_INFO, LOG_TAG, "%d th data: data size =%d\n", -               ++count_list, test_data->size); -    ckmc_buffer_free(test_data); -    plist = plist->next; + ckmc_get_data(plist->alias, password, &test_data); + dlog_print(DLOG_INFO, LOG_TAG, "%d th data: data size =%d\n", + ++count_list, test_data->size); + ckmc_buffer_free(test_data); + plist = plist->next; } while (plist != NULL); ckmc_alias_list_all_free(alias_list); /* Called when the list is no longer needed */ @@ -399,11 +399,11 @@ ckmc_alias_list_all_free(alias_list); /* Called when the list is no longer neede 
       int ret = CKMC_ERROR_NONE;
 
-const char* alias= "myData";
+const char* alias= "myData";
 
 ret = ckmc_remove_alias(alias);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */

      Creating Key Pairs

      @@ -415,13 +415,13 @@ if (CKMC_ERROR_NONE != ret) int ret = CKMC_ERROR_NONE; size_t size = 2048; /* Key manager supports 1024, 2048, 4096 */ -const char *private_key_alias = "PRV_RSA1"; -const char *public_key_alias = "PUB_RSA1"; +const char *private_key_alias = "PRV_RSA1"; +const char *public_key_alias = "PUB_RSA1"; ckmc_policy_s policy_private_key; ckmc_policy_s policy_public_key; /* Private key is encrypted with an additional password */ -policy_private_key.password = (char *)"pri_password"; +policy_private_key.password = (char *)"pri_password"; /* Key cannot be extracted from the key manager */ policy_private_key.extractable = false; @@ -429,9 +429,9 @@ policy_public_key.password = NULL; policy_public_key.extractable = true; ret = ckmc_create_key_pair_rsa(size, private_key_alias, public_key_alias, -                               policy_private_key, policy_public_key); + policy_private_key, policy_public_key); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */

    • Create the ECDSA key pair:

      @@ -439,13 +439,13 @@ if (CKMC_ERROR_NONE != ret) int ret = CKMC_ERROR_NONE; ckmc_ec_type_e ectype = CKMC_EC_PRIME192V1; -const char *private_key_alias = "PRV_ECDSA1"; -const char *public_key_alias = "PUB_ECDSA1"; +const char *private_key_alias = "PRV_ECDSA1"; +const char *public_key_alias = "PUB_ECDSA1"; ckmc_policy_s policy_private_key; ckmc_policy_s policy_public_key; /* Private key is encrypted with an additional password */ -policy_private_key.password = (char *)"pri_password"; +policy_private_key.password = (char *)"pri_password"; /* Key cannot be extracted from the key manager */ policy_private_key.extractable = false; @@ -453,9 +453,9 @@ policy_public_key.password = NULL; policy_public_key.extractable = true; ret = ckmc_create_key_pair_ecdsa(ectype, private_key_alias, public_key_alias, -                                 policy_private_key, policy_public_key); + policy_private_key, policy_public_key); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */

    • Create the DSA key pair:

      @@ -463,22 +463,22 @@ if (CKMC_ERROR_NONE != ret) int ret = CKMC_ERROR_NONE; size_t size = 1024; -const char *private_key_alias = "PRV_DSA1"; -const char *public_key_alias = "PUB-DSA1"; +const char *private_key_alias = "PRV_DSA1"; +const char *public_key_alias = "PUB-DSA1"; ckmc_policy_s policy_private_key; ckmc_policy_s policy_public_key; /* This private key is encrypted with an additional password */ -policy_private_key.password = (char *)"pri_password"; +policy_private_key.password = (char *)"pri_password"; policy_private_key.extractable = false; policy_public_key.password = NULL; policy_public_key.extractable = true; ret = ckmc_create_key_pair_dsa(size, private_key_alias, public_key_alias, -                               policy_private_key, policy_public_key); + policy_private_key, policy_public_key); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */

    Creating or Verifying Signatures

    @@ -488,9 +488,9 @@ if (CKMC_ERROR_NONE != ret) 
     int ret = CKMC_ERROR_NONE;
 
-const char *pub_alias = "pub1";
-const char *pri_alias = "prv1";
-char *key_passwd = (char *)"1234";
+const char *pub_alias = "pub1";
+const char *pri_alias = "prv1";
+char *key_passwd = (char *)"1234";
 char *pri_passwd = NULL;
 char *pub_passwd = NULL;
 ckmc_hash_algo_e hash_algo = CKMC_HASH_SHA256;
@@ -502,46 +502,46 @@ ckmc_policy_s pubpolicy;
 ckmc_key_s prikey;
 ckmc_policy_s pripolicy;
 
-const char *prv = "-----BEGIN RSA PRIVATE KEY-----\n"
-    "Proc-Type: 4,ENCRYPTED\n"
-    "DEK-Info: DES-EDE3-CBC,6C6507B11671DABC\n"
-    "\n"
-    "YiKNviNqc/V/i241CKtAVsNckesE0kcaka3VrY7ApXR+Va93YoEwVQ8gB9cE/eHH\n"
-    "S0j3ZS1PAVFM/qo4ZnPdMzaSLvTQw0GAL90wWgF3XQ+feMnWyBObEoQdGXE828TB\n"
-    "SLz4UOIQ55Dx6JSWTfEhwAlPs2cEWD14xvuxPzAEzBIYmWmBBsCN94YgFeRTzjH0\n"
-    "TImoYVMN60GgOfZWw6rXq9RaV5dY0Y6F1piypCLGD35VaXAutdHIDvwUGECPm7SN\n"
-    "w05jRro53E1vb4mYlZEY/bs4q7XEOI5+ZKT76Xn0oEJNX1KRL1h2q8fgUkm5j40M\n"
-    "uQj71aLR9KyIoQARwGLeRy09tLVjH3fj66CCMqaPcxcIRIyWi5yYBB0s53ipm6A9\n"
-    "CYuyc7MS2C0pOdWKsDvYsHR/36KUiIdPuhF4AbaTqqO0eWeuP7Na7dGK56Fl+ooi\n"
-    "cUpJr7cIqMl2vL25B0jW7d4TB3zwCEkVVD1fBPeNoZWo30z4bILcBqjjPkQfHZ2e\n"
-    "xNraG3qI4FHjoPT8JEE8p+PgwaMoINlICyIMKiCdvwz9yEnsHPy7FkmatpS+jFoS\n"
-    "mg8R9vMwgK/HGEm0dmb/7/a0XsG2jCDm6cOmJdZJFQ8JW7hFs3eOHpNlQYDChG2D\n"
-    "A1ExslqBtbpicywTZhzFdYU/hxeCr4UqcY27Zmhr4JlBPMyvadWKeOqCamWepjbT\n"
-    "T/MhWJbmWgZbI5s5sbpu7cOYubQcUIEsTaQXGx/KEzGo1HLn9tzSeQfP/nqjAD/L\n"
-    "T5t1Mb8o4LuV/fGIT33Q3i2FospJMqp2JINNzG18I6Fjo08PTvJ3row40Rb76+lJ\n"
-    "wN1IBthgBgsgsOdB6XNc56sV+uq2TACsNNWw+JnFRCkCQgfF/KUrvN+WireWq88B\n"
-    "9UPG+Hbans5A6K+y1a+bzfdYnKws7x8wNRyPxb7Vb2t9ZTl5PBorPLVGsjgf9N5X\n"
-    "tCdBlfJsUdXot+EOxrIczV5zx0JIB1Y9hrDG07RYkzPuJKxkW7skqeLo8oWGVpaQ\n"
-    "LGWvuebky1R75hcSuL3e4QHfjBHPdQ31fScB884tqkbhBAWr2nT9bYEmyT170bno\n"
-    "8QkyOSb99xZBX55sLDHs9p61sTJr2C9Lz/KaWQs+3hTkpwSjSRyjEMH2n491qiQX\n"
-    "G+kvLEnvtR8sl9zinorj/RfsxyPntAxudfY3qaYUu2QkLvVdfTVUVbxS/Fg8f7B3\n"
-    "hEjCtpKgFjPxQuHE3didNOr5xM7mkmLN/QA7yHVgdpE64T5mFgC3JcVRpcR7zBPH\n"
-    "3OeXHgjrhDfN8UIX/cq6gNgD8w7O0rhHa3mEXI1xP14ykPcJ7wlRuLm9P3fwx5A2\n"
-    "jQrVKJKw1Nzummmspn4VOpJY3LkH4Sxo4e7Soo1l1cxJpzmERwgMF+vGz1L70+DG\n"
-    "M0hVrz1PxlOsBBFgcdS4TB91DIs/RcFDqrJ4gOPNKCgBP+rgTXXLFcxUwJfE3lKg\n"
-    "Kmpwdne6FuQYX3eyRVAmPgOHbJuRQCh/V4fYo51UxCcEKeKy6UgOPEJlXksWGbH5\n"
-    "VFmlytYW6dFKJvjltSmK6L2r+TlyEQoXwTqe4bkfhB2LniDEq28hKQ==\n"
-    "-----END RSA PRIVATE KEY-----\n";
-
-const char *pub = "-----BEGIN PUBLIC KEY-----\n"
-    "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA2b1bXDa+S8/MGWnMkru4\n"
-    "T4tUddtZNi0NVjQn9RFH1NMa220GsRhRO56F77FlSVFKfSfVZKIiWg6C+DVCkcLf\n"
-    "zXJ/Z0pvwOQYBAqVMFjV6efQGN0JzJ1Unu7pPRiZl7RKGEI+cyzzrcDyrLLrQ2W7\n"
-    "0ZySkNEOv6Frx9JgC5NExuYY4lk2fQQa38JXiZkfyzif2em0px7mXbyf5LjccsKq\n"
-    "v1e+XLtMsL0ZefRcqsP++NzQAI8fKX7WBT+qK0HJDLiHrKOTWYzx6CwJ66LD/vvf\n"
-    "j55xtsKDLVDbsotvf8/m6VLMab+vqKk11TP4tq6yo0mwyTADvgl1zowQEO9I1W6o\n"
-    "zQIDAQAB\n"
-    "-----END PUBLIC KEY-----\n";
+const char *prv = "-----BEGIN RSA PRIVATE KEY-----\n"
+    "Proc-Type: 4,ENCRYPTED\n"
+    "DEK-Info: DES-EDE3-CBC,6C6507B11671DABC\n"
+    "\n"
+    "YiKNviNqc/V/i241CKtAVsNckesE0kcaka3VrY7ApXR+Va93YoEwVQ8gB9cE/eHH\n"
+    "S0j3ZS1PAVFM/qo4ZnPdMzaSLvTQw0GAL90wWgF3XQ+feMnWyBObEoQdGXE828TB\n"
+    "SLz4UOIQ55Dx6JSWTfEhwAlPs2cEWD14xvuxPzAEzBIYmWmBBsCN94YgFeRTzjH0\n"
+    "TImoYVMN60GgOfZWw6rXq9RaV5dY0Y6F1piypCLGD35VaXAutdHIDvwUGECPm7SN\n"
+    "w05jRro53E1vb4mYlZEY/bs4q7XEOI5+ZKT76Xn0oEJNX1KRL1h2q8fgUkm5j40M\n"
+    "uQj71aLR9KyIoQARwGLeRy09tLVjH3fj66CCMqaPcxcIRIyWi5yYBB0s53ipm6A9\n"
+    "CYuyc7MS2C0pOdWKsDvYsHR/36KUiIdPuhF4AbaTqqO0eWeuP7Na7dGK56Fl+ooi\n"
+    "cUpJr7cIqMl2vL25B0jW7d4TB3zwCEkVVD1fBPeNoZWo30z4bILcBqjjPkQfHZ2e\n"
+    "xNraG3qI4FHjoPT8JEE8p+PgwaMoINlICyIMKiCdvwz9yEnsHPy7FkmatpS+jFoS\n"
+    "mg8R9vMwgK/HGEm0dmb/7/a0XsG2jCDm6cOmJdZJFQ8JW7hFs3eOHpNlQYDChG2D\n"
+    "A1ExslqBtbpicywTZhzFdYU/hxeCr4UqcY27Zmhr4JlBPMyvadWKeOqCamWepjbT\n"
+    "T/MhWJbmWgZbI5s5sbpu7cOYubQcUIEsTaQXGx/KEzGo1HLn9tzSeQfP/nqjAD/L\n"
+    "T5t1Mb8o4LuV/fGIT33Q3i2FospJMqp2JINNzG18I6Fjo08PTvJ3row40Rb76+lJ\n"
+    "wN1IBthgBgsgsOdB6XNc56sV+uq2TACsNNWw+JnFRCkCQgfF/KUrvN+WireWq88B\n"
+    "9UPG+Hbans5A6K+y1a+bzfdYnKws7x8wNRyPxb7Vb2t9ZTl5PBorPLVGsjgf9N5X\n"
+    "tCdBlfJsUdXot+EOxrIczV5zx0JIB1Y9hrDG07RYkzPuJKxkW7skqeLo8oWGVpaQ\n"
+    "LGWvuebky1R75hcSuL3e4QHfjBHPdQ31fScB884tqkbhBAWr2nT9bYEmyT170bno\n"
+    "8QkyOSb99xZBX55sLDHs9p61sTJr2C9Lz/KaWQs+3hTkpwSjSRyjEMH2n491qiQX\n"
+    "G+kvLEnvtR8sl9zinorj/RfsxyPntAxudfY3qaYUu2QkLvVdfTVUVbxS/Fg8f7B3\n"
+    "hEjCtpKgFjPxQuHE3didNOr5xM7mkmLN/QA7yHVgdpE64T5mFgC3JcVRpcR7zBPH\n"
+    "3OeXHgjrhDfN8UIX/cq6gNgD8w7O0rhHa3mEXI1xP14ykPcJ7wlRuLm9P3fwx5A2\n"
+    "jQrVKJKw1Nzummmspn4VOpJY3LkH4Sxo4e7Soo1l1cxJpzmERwgMF+vGz1L70+DG\n"
+    "M0hVrz1PxlOsBBFgcdS4TB91DIs/RcFDqrJ4gOPNKCgBP+rgTXXLFcxUwJfE3lKg\n"
+    "Kmpwdne6FuQYX3eyRVAmPgOHbJuRQCh/V4fYo51UxCcEKeKy6UgOPEJlXksWGbH5\n"
+    "VFmlytYW6dFKJvjltSmK6L2r+TlyEQoXwTqe4bkfhB2LniDEq28hKQ==\n"
+    "-----END RSA PRIVATE KEY-----\n";
+
+const char *pub = "-----BEGIN PUBLIC KEY-----\n"
+    "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA2b1bXDa+S8/MGWnMkru4\n"
+    "T4tUddtZNi0NVjQn9RFH1NMa220GsRhRO56F77FlSVFKfSfVZKIiWg6C+DVCkcLf\n"
+    "zXJ/Z0pvwOQYBAqVMFjV6efQGN0JzJ1Unu7pPRiZl7RKGEI+cyzzrcDyrLLrQ2W7\n"
+    "0ZySkNEOv6Frx9JgC5NExuYY4lk2fQQa38JXiZkfyzif2em0px7mXbyf5LjccsKq\n"
+    "v1e+XLtMsL0ZefRcqsP++NzQAI8fKX7WBT+qK0HJDLiHrKOTWYzx6CwJ66LD/vvf\n"
+    "j55xtsKDLVDbsotvf8/m6VLMab+vqKk11TP4tq6yo0mwyTADvgl1zowQEO9I1W6o\n"
+    "zQIDAQAB\n"
+    "-----END PUBLIC KEY-----\n";
 pubkey.raw_key = (unsigned char *)pub;
 pubkey.key_size = strlen(pub);
 pubkey.key_type = CKMC_KEY_NONE;
@@ -560,11 +560,11 @@ prikey.password = key_passwd; /* prv private key is encrypted with the key_passw
 
 ret = ckmc_save_key(pri_alias, prikey, pripolicy);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 ret = ckmc_save_key(pub_alias, pubkey, pubpolicy);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
  • Create and verify the signature: @@ -573,14 +573,14 @@ if (CKMC_ERROR_NONE != ret) 
     int ret = CKMC_ERROR_NONE;
 
-const char *message = "message test";
+const char *message = "message test";
 ckmc_raw_buffer_s msg_buff;
 ckmc_raw_buffer_s *signature;
 ckmc_hash_algo_e hash_algo = CKMC_HASH_SHA256;
 ckmc_rsa_padding_algo_e pad_algo = CKMC_PKCS1_PADDING;
 
-const char *pub_alias = "pub1";
-const char *pri_alias = "prv1";
+const char *pub_alias = "pub1";
+const char *pri_alias = "prv1";
 char *pri_passwd = NULL;
 char *pub_passwd = NULL;
 
@@ -588,28 +588,28 @@ msg_buff.data = (unsigned char *)message;
 msg_buff.size = strlen(message);
 
 ret = ckmc_create_signature(pri_alias, pri_passwd, msg_buff, hash_algo,
-                            pad_algo, &signature);
+                            pad_algo, &signature);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 ret = ckmc_verify_signature(pub_alias, pub_passwd, msg_buff, *signature,
-                            hash_algo, pad_algo);
+                            hash_algo, pad_algo);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
  • Create and verify without a hash algorithm: 
     int ret = CKMC_ERROR_NONE;
 
-const char *message = "message test";
+const char *message = "message test";
 ckmc_raw_buffer_s msg_buff;
 ckmc_raw_buffer_s *signature;
 ckmc_hash_algo_e hash_algo = CKMC_HASH_NONE; /* Do not use a hash algorithm */
 ckmc_rsa_padding_algo_e pad_algo = CKMC_PKCS1_PADDING;
 
-const char *pub_alias = "pub1";
-const char *pri_alias = "prv1";
+const char *pub_alias = "pub1";
+const char *pri_alias = "prv1";
 char *pri_passwd = NULL;
 char *pub_passwd = NULL;
 
@@ -617,14 +617,14 @@ msg_buff.data = (unsigned char *)message;
 msg_buff.size = strlen(message);
 
 ret = ckmc_create_signature(pri_alias, pri_passwd, msg_buff,
-                            hash_algo, pad_algo, &signature);
+                            hash_algo, pad_algo, &signature);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 ret = ckmc_verify_signature(pub_alias, pub_passwd, msg_buff,
-                            *signature, hash_algo, pad_algo);
+                            *signature, hash_algo, pad_algo);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
    • @@ -647,76 +647,76 @@ ckmc_cert_list_s *current; ckmc_cert_list_s *next; const char * ee = -"-----BEGIN CERTIFICATE-----\n" -"MIIF0TCCBLmgAwIBAgIQaPGTP4aS7Ut/WDNaBzdQrDANBgkqhkiG9w0BAQUFADCB\n" -"ujELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" -"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2Ug\n" -"YXQgaHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMr\n" -"VmVyaVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTAeFw0x\n" -"NDAyMjAwMDAwMDBaFw0xNTAyMjAyMzU5NTlaMIHmMRMwEQYLKwYBBAGCNzwCAQMT\n" -"AlBMMR0wGwYDVQQPExRQcml2YXRlIE9yZ2FuaXphdGlvbjETMBEGA1UEBRMKMDAw\n" -"MDAyNTIzNzELMAkGA1UEBhMCUEwxDzANBgNVBBEUBjAwLTk1MDEUMBIGA1UECBML\n" -"bWF6b3dpZWNraWUxETAPBgNVBAcUCFdhcnN6YXdhMRYwFAYDVQQJFA1TZW5hdG9y\n" -"c2thIDE4MRMwEQYDVQQKFAptQmFuayBTLkEuMQwwCgYDVQQLFANESU4xGTAXBgNV\n" -"BAMUEHd3dy5tYmFuay5jb20ucGwwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEK\n" -"AoIBAQDph6x8V6xUW/+651+qHF+UmorH9uaz2ZrX2bIWiMKIJFmpDDHlxcapKkqE\n" -"BV04is83aiCpqKtc2ZHy2g4Hpj1eSF5BP2+OAlo0YUQZPIeRRdiMjmeAxw/ncBDx\n" -"9rQBuCJ4XTD6cqQox5SI0TASOZ+wyAEjbDRXzL73XqRAFZ1LOpb2ONkolS+RutMB\n" -"vshvCsWPeNe7eGLuOh6DyC6r1vX9xhw3xnjM2mTSvmtimgzSLacNGKqRrsucUgcb\n" -"0+O5C2jZAtAMLyZksL92cxmWbtVzUYzem4chjHu5cRxUlPNzUJWrrczueB7Ip4A8\n" -"aQuFMfNXYc0x+WLWjy//urypMKjhAgMBAAGjggGjMIIBnzAbBgNVHREEFDASghB3\n" -"d3cubWJhbmsuY29tLnBsMAkGA1UdEwQCMAAwDgYDVR0PAQH/BAQDAgWgMB0GA1Ud\n" -"JQQWMBQGCCsGAQUFBwMBBggrBgEFBQcDAjBEBgNVHSAEPTA7MDkGC2CGSAGG+EUB\n" -"BxcGMCowKAYIKwYBBQUHAgEWHGh0dHBzOi8vd3d3LnZlcmlzaWduLmNvbS9jcHMw\n" -"HQYDVR0OBBYEFN37iGaS7mZnENxZ9FGqNLR+QgoMMB8GA1UdIwQYMBaAFPyKULqe\n" -"uSVae1WFT5UAY4/pWGtDMEIGA1UdHwQ7MDkwN6A1oDOGMWh0dHA6Ly9FVlNlY3Vy\n" -"ZS1jcmwudmVyaXNpZ24uY29tL0VWU2VjdXJlMjAwNi5jcmwwfAYIKwYBBQUHAQEE\n" -"cDBuMC0GCCsGAQUFBzABhiFodHRwOi8vRVZTZWN1cmUtb2NzcC52ZXJpc2lnbi5j\n" -"b20wPQYIKwYBBQUHMAKGMWh0dHA6Ly9FVlNlY3VyZS1haWEudmVyaXNpZ24uY29t\n" -"L0VWU2VjdXJlMjAwNi5jZXIwDQYJKoZIhvcNAQEFBQADggEBAD0wO+rooUrIM4qp\n" -"PHhp+hkXK6WMQ2qzGOmbMcZjw0govg5vkzkefPDryIXXbrF8mRagiJNMSfNaWWeh\n" -"Cj41OV24EdUl0OLbFxNzcvub599zRs/apfaRLTfsmlmOgi0/YP305i+3tJ2ll946\n" -"P+qV1wXnXqTqEdIl4Ys3+1HmDCdTB1hoDwAAzqRVUXZ5+iiwPAU7R/LTHfMjV1ke\n" -"8jtNFfrorlZMCfVH/7eEnHJvVjOJt+YFe4aFMzE+DfuYIK7MH+olC2v79kBwbnEQ\n" -"fvHMA9gFwOYLUBBdSfcocp8EKZ+mRlNPGR/3LBrPeaQQ0GZEkxzRK+v/aNTuiYfr\n" -"oFXtrg0=\n" -"-----END CERTIFICATE-----\n"; +"-----BEGIN CERTIFICATE-----\n" +"MIIF0TCCBLmgAwIBAgIQaPGTP4aS7Ut/WDNaBzdQrDANBgkqhkiG9w0BAQUFADCB\n" +"ujELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" +"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2Ug\n" +"YXQgaHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMr\n" +"VmVyaVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTAeFw0x\n" +"NDAyMjAwMDAwMDBaFw0xNTAyMjAyMzU5NTlaMIHmMRMwEQYLKwYBBAGCNzwCAQMT\n" +"AlBMMR0wGwYDVQQPExRQcml2YXRlIE9yZ2FuaXphdGlvbjETMBEGA1UEBRMKMDAw\n" +"MDAyNTIzNzELMAkGA1UEBhMCUEwxDzANBgNVBBEUBjAwLTk1MDEUMBIGA1UECBML\n" +"bWF6b3dpZWNraWUxETAPBgNVBAcUCFdhcnN6YXdhMRYwFAYDVQQJFA1TZW5hdG9y\n" +"c2thIDE4MRMwEQYDVQQKFAptQmFuayBTLkEuMQwwCgYDVQQLFANESU4xGTAXBgNV\n" +"BAMUEHd3dy5tYmFuay5jb20ucGwwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEK\n" +"AoIBAQDph6x8V6xUW/+651+qHF+UmorH9uaz2ZrX2bIWiMKIJFmpDDHlxcapKkqE\n" +"BV04is83aiCpqKtc2ZHy2g4Hpj1eSF5BP2+OAlo0YUQZPIeRRdiMjmeAxw/ncBDx\n" +"9rQBuCJ4XTD6cqQox5SI0TASOZ+wyAEjbDRXzL73XqRAFZ1LOpb2ONkolS+RutMB\n" +"vshvCsWPeNe7eGLuOh6DyC6r1vX9xhw3xnjM2mTSvmtimgzSLacNGKqRrsucUgcb\n" +"0+O5C2jZAtAMLyZksL92cxmWbtVzUYzem4chjHu5cRxUlPNzUJWrrczueB7Ip4A8\n" +"aQuFMfNXYc0x+WLWjy//urypMKjhAgMBAAGjggGjMIIBnzAbBgNVHREEFDASghB3\n" +"d3cubWJhbmsuY29tLnBsMAkGA1UdEwQCMAAwDgYDVR0PAQH/BAQDAgWgMB0GA1Ud\n" +"JQQWMBQGCCsGAQUFBwMBBggrBgEFBQcDAjBEBgNVHSAEPTA7MDkGC2CGSAGG+EUB\n" +"BxcGMCowKAYIKwYBBQUHAgEWHGh0dHBzOi8vd3d3LnZlcmlzaWduLmNvbS9jcHMw\n" +"HQYDVR0OBBYEFN37iGaS7mZnENxZ9FGqNLR+QgoMMB8GA1UdIwQYMBaAFPyKULqe\n" +"uSVae1WFT5UAY4/pWGtDMEIGA1UdHwQ7MDkwN6A1oDOGMWh0dHA6Ly9FVlNlY3Vy\n" +"ZS1jcmwudmVyaXNpZ24uY29tL0VWU2VjdXJlMjAwNi5jcmwwfAYIKwYBBQUHAQEE\n" +"cDBuMC0GCCsGAQUFBzABhiFodHRwOi8vRVZTZWN1cmUtb2NzcC52ZXJpc2lnbi5j\n" +"b20wPQYIKwYBBQUHMAKGMWh0dHA6Ly9FVlNlY3VyZS1haWEudmVyaXNpZ24uY29t\n" +"L0VWU2VjdXJlMjAwNi5jZXIwDQYJKoZIhvcNAQEFBQADggEBAD0wO+rooUrIM4qp\n" +"PHhp+hkXK6WMQ2qzGOmbMcZjw0govg5vkzkefPDryIXXbrF8mRagiJNMSfNaWWeh\n" +"Cj41OV24EdUl0OLbFxNzcvub599zRs/apfaRLTfsmlmOgi0/YP305i+3tJ2ll946\n" +"P+qV1wXnXqTqEdIl4Ys3+1HmDCdTB1hoDwAAzqRVUXZ5+iiwPAU7R/LTHfMjV1ke\n" +"8jtNFfrorlZMCfVH/7eEnHJvVjOJt+YFe4aFMzE+DfuYIK7MH+olC2v79kBwbnEQ\n" +"fvHMA9gFwOYLUBBdSfcocp8EKZ+mRlNPGR/3LBrPeaQQ0GZEkxzRK+v/aNTuiYfr\n" +"oFXtrg0=\n" +"-----END CERTIFICATE-----\n"; const char *im = -"-----BEGIN CERTIFICATE-----\n" -"MIIF5DCCBMygAwIBAgIQW3dZxheE4V7HJ8AylSkoazANBgkqhkiG9w0BAQUFADCB\n" -"yjELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" -"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTowOAYDVQQLEzEoYykgMjAwNiBWZXJp\n" -"U2lnbiwgSW5jLiAtIEZvciBhdXRob3JpemVkIHVzZSBvbmx5MUUwQwYDVQQDEzxW\n" -"ZXJpU2lnbiBDbGFzcyAzIFB1YmxpYyBQcmltYXJ5IENlcnRpZmljYXRpb24gQXV0\n" -"aG9yaXR5IC0gRzUwHhcNMDYxMTA4MDAwMDAwWhcNMTYxMTA3MjM1OTU5WjCBujEL\n" -"MAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQLExZW\n" -"ZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2UgYXQg\n" -"aHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMrVmVy\n" -"aVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTCCASIwDQYJ\n" -"KoZIhvcNAQEBBQADggEPADCCAQoCggEBAJjboFXrnP0XeeOabhQdsVuYI4cWbod2\n" -"nLU4O7WgerQHYwkZ5iqISKnnnbYwWgiXDOyq5BZpcmIjmvt6VCiYxQwtt9citsj5\n" -"OBfH3doxRpqUFI6e7nigtyLUSVSXTeV0W5K87Gws3+fBthsaVWtmCAN/Ra+aM/EQ\n" -"wGyZSpIkMQht3QI+YXZ4eLbtfjeubPOJ4bfh3BXMt1afgKCxBX9ONxX/ty8ejwY4\n" -"P1C3aSijtWZfNhpSSENmUt+ikk/TGGC+4+peGXEFv54cbGhyJW+ze3PJbb0S/5tB\n" -"Ml706H7FC6NMZNFOvCYIZfsZl1h44TO/7Wg+sSdFb8Di7Jdp91zT91ECAwEAAaOC\n" -"AdIwggHOMB0GA1UdDgQWBBT8ilC6nrklWntVhU+VAGOP6VhrQzASBgNVHRMBAf8E\n" -"CDAGAQH/AgEAMD0GA1UdIAQ2MDQwMgYEVR0gADAqMCgGCCsGAQUFBwIBFhxodHRw\n" -"czovL3d3dy52ZXJpc2lnbi5jb20vY3BzMD0GA1UdHwQ2MDQwMqAwoC6GLGh0dHA6\n" -"Ly9FVlNlY3VyZS1jcmwudmVyaXNpZ24uY29tL3BjYTMtZzUuY3JsMA4GA1UdDwEB\n" -"/wQEAwIBBjARBglghkgBhvhCAQEEBAMCAQYwbQYIKwYBBQUHAQwEYTBfoV2gWzBZ\n" -"MFcwVRYJaW1hZ2UvZ2lmMCEwHzAHBgUrDgMCGgQUj+XTGoasjY5rw8+AatRIGCx7\n" -"GS4wJRYjaHR0cDovL2xvZ28udmVyaXNpZ24uY29tL3ZzbG9nby5naWYwKQYDVR0R\n" -"BCIwIKQeMBwxGjAYBgNVBAMTEUNsYXNzM0NBMjA0OC0xLTQ3MD0GCCsGAQUFBwEB\n" -"BDEwLzAtBggrBgEFBQcwAYYhaHR0cDovL0VWU2VjdXJlLW9jc3AudmVyaXNpZ24u\n" -"Y29tMB8GA1UdIwQYMBaAFH/TZafC3ey78DAJ80M5+gKvMzEzMA0GCSqGSIb3DQEB\n" -"BQUAA4IBAQCWovp/5j3t1CvOtxU/wHIDX4u6FpAl98KD2Md1NGNoElMMU4l7yVYJ\n" -"p8M2RE4O0GJis4b66KGbNGeNUyIXPv2s7mcuQ+JdfzOE8qJwwG6Cl8A0/SXGI3/t\n" -"5rDFV0OEst4t8dD2SB8UcVeyrDHhlyQjyRNddOVG7wl8nuGZMQoIeRuPcZ8XZsg4\n" -"z+6Ml7YGuXNG5NOUweVgtSV1LdlpMezNlsOjdv3odESsErlNv1HoudRETifLriDR\n" -"fip8tmNHnna6l9AW5wtsbfdDbzMLKTB3+p359U64drPNGLT5IO892+bKrZvQTtKH\n" -"qQ2mRHNQ3XBb7a1+Srwi1agm5MKFIA3Z\n" -"-----END CERTIFICATE-----\n"; +"-----BEGIN CERTIFICATE-----\n" +"MIIF5DCCBMygAwIBAgIQW3dZxheE4V7HJ8AylSkoazANBgkqhkiG9w0BAQUFADCB\n" +"yjELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" +"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTowOAYDVQQLEzEoYykgMjAwNiBWZXJp\n" +"U2lnbiwgSW5jLiAtIEZvciBhdXRob3JpemVkIHVzZSBvbmx5MUUwQwYDVQQDEzxW\n" +"ZXJpU2lnbiBDbGFzcyAzIFB1YmxpYyBQcmltYXJ5IENlcnRpZmljYXRpb24gQXV0\n" +"aG9yaXR5IC0gRzUwHhcNMDYxMTA4MDAwMDAwWhcNMTYxMTA3MjM1OTU5WjCBujEL\n" +"MAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQLExZW\n" +"ZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2UgYXQg\n" +"aHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMrVmVy\n" +"aVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTCCASIwDQYJ\n" +"KoZIhvcNAQEBBQADggEPADCCAQoCggEBAJjboFXrnP0XeeOabhQdsVuYI4cWbod2\n" +"nLU4O7WgerQHYwkZ5iqISKnnnbYwWgiXDOyq5BZpcmIjmvt6VCiYxQwtt9citsj5\n" +"OBfH3doxRpqUFI6e7nigtyLUSVSXTeV0W5K87Gws3+fBthsaVWtmCAN/Ra+aM/EQ\n" +"wGyZSpIkMQht3QI+YXZ4eLbtfjeubPOJ4bfh3BXMt1afgKCxBX9ONxX/ty8ejwY4\n" +"P1C3aSijtWZfNhpSSENmUt+ikk/TGGC+4+peGXEFv54cbGhyJW+ze3PJbb0S/5tB\n" +"Ml706H7FC6NMZNFOvCYIZfsZl1h44TO/7Wg+sSdFb8Di7Jdp91zT91ECAwEAAaOC\n" +"AdIwggHOMB0GA1UdDgQWBBT8ilC6nrklWntVhU+VAGOP6VhrQzASBgNVHRMBAf8E\n" +"CDAGAQH/AgEAMD0GA1UdIAQ2MDQwMgYEVR0gADAqMCgGCCsGAQUFBwIBFhxodHRw\n" +"czovL3d3dy52ZXJpc2lnbi5jb20vY3BzMD0GA1UdHwQ2MDQwMqAwoC6GLGh0dHA6\n" +"Ly9FVlNlY3VyZS1jcmwudmVyaXNpZ24uY29tL3BjYTMtZzUuY3JsMA4GA1UdDwEB\n" +"/wQEAwIBBjARBglghkgBhvhCAQEEBAMCAQYwbQYIKwYBBQUHAQwEYTBfoV2gWzBZ\n" +"MFcwVRYJaW1hZ2UvZ2lmMCEwHzAHBgUrDgMCGgQUj+XTGoasjY5rw8+AatRIGCx7\n" +"GS4wJRYjaHR0cDovL2xvZ28udmVyaXNpZ24uY29tL3ZzbG9nby5naWYwKQYDVR0R\n" +"BCIwIKQeMBwxGjAYBgNVBAMTEUNsYXNzM0NBMjA0OC0xLTQ3MD0GCCsGAQUFBwEB\n" +"BDEwLzAtBggrBgEFBQcwAYYhaHR0cDovL0VWU2VjdXJlLW9jc3AudmVyaXNpZ24u\n" +"Y29tMB8GA1UdIwQYMBaAFH/TZafC3ey78DAJ80M5+gKvMzEzMA0GCSqGSIb3DQEB\n" +"BQUAA4IBAQCWovp/5j3t1CvOtxU/wHIDX4u6FpAl98KD2Md1NGNoElMMU4l7yVYJ\n" +"p8M2RE4O0GJis4b66KGbNGeNUyIXPv2s7mcuQ+JdfzOE8qJwwG6Cl8A0/SXGI3/t\n" +"5rDFV0OEst4t8dD2SB8UcVeyrDHhlyQjyRNddOVG7wl8nuGZMQoIeRuPcZ8XZsg4\n" +"z+6Ml7YGuXNG5NOUweVgtSV1LdlpMezNlsOjdv3odESsErlNv1HoudRETifLriDR\n" +"fip8tmNHnna6l9AW5wtsbfdDbzMLKTB3+p359U64drPNGLT5IO892+bKrZvQTtKH\n" +"qQ2mRHNQ3XBb7a1+Srwi1agm5MKFIA3Z\n" +"-----END CERTIFICATE-----\n"; c_cert.raw_cert = (unsigned char *)ee; c_cert.cert_size = strlen(ee); @@ -731,12 +731,12 @@ untrustedcerts.next = NULL; ret = ckmc_get_cert_chain(&c_cert, &untrustedcerts, &cert_chain_list); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ next=cert_chain_list; do { -    current = next; -    next = current->next; + current = next; + next = current->next; } while (next != NULL); /* Called when the list is no longer needed */ @@ -749,7 +749,7 @@ ckmc_cert_list_all_free(cert_chain_list); int ret = CKMC_ERROR_NONE; char* password = NULL; -const char *ca_alias = "untrusted_ca_cert1"; +const char *ca_alias = "untrusted_ca_cert1"; ckmc_policy_s test_policy; ckmc_cert_s c_cert; /* For a user certificate */ @@ -762,76 +762,76 @@ ckmc_cert_list_s *current; ckmc_cert_list_s *next; const char * ee = -"-----BEGIN CERTIFICATE-----\n" -"MIIF0TCCBLmgAwIBAgIQaPGTP4aS7Ut/WDNaBzdQrDANBgkqhkiG9w0BAQUFADCB\n" -"ujELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" -"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2Ug\n" -"YXQgaHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMr\n" -"VmVyaVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTAeFw0x\n" -"NDAyMjAwMDAwMDBaFw0xNTAyMjAyMzU5NTlaMIHmMRMwEQYLKwYBBAGCNzwCAQMT\n" -"AlBMMR0wGwYDVQQPExRQcml2YXRlIE9yZ2FuaXphdGlvbjETMBEGA1UEBRMKMDAw\n" -"MDAyNTIzNzELMAkGA1UEBhMCUEwxDzANBgNVBBEUBjAwLTk1MDEUMBIGA1UECBML\n" -"bWF6b3dpZWNraWUxETAPBgNVBAcUCFdhcnN6YXdhMRYwFAYDVQQJFA1TZW5hdG9y\n" -"c2thIDE4MRMwEQYDVQQKFAptQmFuayBTLkEuMQwwCgYDVQQLFANESU4xGTAXBgNV\n" -"BAMUEHd3dy5tYmFuay5jb20ucGwwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEK\n" -"AoIBAQDph6x8V6xUW/+651+qHF+UmorH9uaz2ZrX2bIWiMKIJFmpDDHlxcapKkqE\n" -"BV04is83aiCpqKtc2ZHy2g4Hpj1eSF5BP2+OAlo0YUQZPIeRRdiMjmeAxw/ncBDx\n" -"9rQBuCJ4XTD6cqQox5SI0TASOZ+wyAEjbDRXzL73XqRAFZ1LOpb2ONkolS+RutMB\n" -"vshvCsWPeNe7eGLuOh6DyC6r1vX9xhw3xnjM2mTSvmtimgzSLacNGKqRrsucUgcb\n" -"0+O5C2jZAtAMLyZksL92cxmWbtVzUYzem4chjHu5cRxUlPNzUJWrrczueB7Ip4A8\n" -"aQuFMfNXYc0x+WLWjy//urypMKjhAgMBAAGjggGjMIIBnzAbBgNVHREEFDASghB3\n" -"d3cubWJhbmsuY29tLnBsMAkGA1UdEwQCMAAwDgYDVR0PAQH/BAQDAgWgMB0GA1Ud\n" -"JQQWMBQGCCsGAQUFBwMBBggrBgEFBQcDAjBEBgNVHSAEPTA7MDkGC2CGSAGG+EUB\n" -"BxcGMCowKAYIKwYBBQUHAgEWHGh0dHBzOi8vd3d3LnZlcmlzaWduLmNvbS9jcHMw\n" -"HQYDVR0OBBYEFN37iGaS7mZnENxZ9FGqNLR+QgoMMB8GA1UdIwQYMBaAFPyKULqe\n" -"uSVae1WFT5UAY4/pWGtDMEIGA1UdHwQ7MDkwN6A1oDOGMWh0dHA6Ly9FVlNlY3Vy\n" -"ZS1jcmwudmVyaXNpZ24uY29tL0VWU2VjdXJlMjAwNi5jcmwwfAYIKwYBBQUHAQEE\n" -"cDBuMC0GCCsGAQUFBzABhiFodHRwOi8vRVZTZWN1cmUtb2NzcC52ZXJpc2lnbi5j\n" -"b20wPQYIKwYBBQUHMAKGMWh0dHA6Ly9FVlNlY3VyZS1haWEudmVyaXNpZ24uY29t\n" -"L0VWU2VjdXJlMjAwNi5jZXIwDQYJKoZIhvcNAQEFBQADggEBAD0wO+rooUrIM4qp\n" -"PHhp+hkXK6WMQ2qzGOmbMcZjw0govg5vkzkefPDryIXXbrF8mRagiJNMSfNaWWeh\n" -"Cj41OV24EdUl0OLbFxNzcvub599zRs/apfaRLTfsmlmOgi0/YP305i+3tJ2ll946\n" -"P+qV1wXnXqTqEdIl4Ys3+1HmDCdTB1hoDwAAzqRVUXZ5+iiwPAU7R/LTHfMjV1ke\n" -"8jtNFfrorlZMCfVH/7eEnHJvVjOJt+YFe4aFMzE+DfuYIK7MH+olC2v79kBwbnEQ\n" -"fvHMA9gFwOYLUBBdSfcocp8EKZ+mRlNPGR/3LBrPeaQQ0GZEkxzRK+v/aNTuiYfr\n" -"oFXtrg0=\n" -"-----END CERTIFICATE-----\n"; +"-----BEGIN CERTIFICATE-----\n" +"MIIF0TCCBLmgAwIBAgIQaPGTP4aS7Ut/WDNaBzdQrDANBgkqhkiG9w0BAQUFADCB\n" +"ujELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" +"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2Ug\n" +"YXQgaHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMr\n" +"VmVyaVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTAeFw0x\n" +"NDAyMjAwMDAwMDBaFw0xNTAyMjAyMzU5NTlaMIHmMRMwEQYLKwYBBAGCNzwCAQMT\n" +"AlBMMR0wGwYDVQQPExRQcml2YXRlIE9yZ2FuaXphdGlvbjETMBEGA1UEBRMKMDAw\n" +"MDAyNTIzNzELMAkGA1UEBhMCUEwxDzANBgNVBBEUBjAwLTk1MDEUMBIGA1UECBML\n" +"bWF6b3dpZWNraWUxETAPBgNVBAcUCFdhcnN6YXdhMRYwFAYDVQQJFA1TZW5hdG9y\n" +"c2thIDE4MRMwEQYDVQQKFAptQmFuayBTLkEuMQwwCgYDVQQLFANESU4xGTAXBgNV\n" +"BAMUEHd3dy5tYmFuay5jb20ucGwwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEK\n" +"AoIBAQDph6x8V6xUW/+651+qHF+UmorH9uaz2ZrX2bIWiMKIJFmpDDHlxcapKkqE\n" +"BV04is83aiCpqKtc2ZHy2g4Hpj1eSF5BP2+OAlo0YUQZPIeRRdiMjmeAxw/ncBDx\n" +"9rQBuCJ4XTD6cqQox5SI0TASOZ+wyAEjbDRXzL73XqRAFZ1LOpb2ONkolS+RutMB\n" +"vshvCsWPeNe7eGLuOh6DyC6r1vX9xhw3xnjM2mTSvmtimgzSLacNGKqRrsucUgcb\n" +"0+O5C2jZAtAMLyZksL92cxmWbtVzUYzem4chjHu5cRxUlPNzUJWrrczueB7Ip4A8\n" +"aQuFMfNXYc0x+WLWjy//urypMKjhAgMBAAGjggGjMIIBnzAbBgNVHREEFDASghB3\n" +"d3cubWJhbmsuY29tLnBsMAkGA1UdEwQCMAAwDgYDVR0PAQH/BAQDAgWgMB0GA1Ud\n" +"JQQWMBQGCCsGAQUFBwMBBggrBgEFBQcDAjBEBgNVHSAEPTA7MDkGC2CGSAGG+EUB\n" +"BxcGMCowKAYIKwYBBQUHAgEWHGh0dHBzOi8vd3d3LnZlcmlzaWduLmNvbS9jcHMw\n" +"HQYDVR0OBBYEFN37iGaS7mZnENxZ9FGqNLR+QgoMMB8GA1UdIwQYMBaAFPyKULqe\n" +"uSVae1WFT5UAY4/pWGtDMEIGA1UdHwQ7MDkwN6A1oDOGMWh0dHA6Ly9FVlNlY3Vy\n" +"ZS1jcmwudmVyaXNpZ24uY29tL0VWU2VjdXJlMjAwNi5jcmwwfAYIKwYBBQUHAQEE\n" +"cDBuMC0GCCsGAQUFBzABhiFodHRwOi8vRVZTZWN1cmUtb2NzcC52ZXJpc2lnbi5j\n" +"b20wPQYIKwYBBQUHMAKGMWh0dHA6Ly9FVlNlY3VyZS1haWEudmVyaXNpZ24uY29t\n" +"L0VWU2VjdXJlMjAwNi5jZXIwDQYJKoZIhvcNAQEFBQADggEBAD0wO+rooUrIM4qp\n" +"PHhp+hkXK6WMQ2qzGOmbMcZjw0govg5vkzkefPDryIXXbrF8mRagiJNMSfNaWWeh\n" +"Cj41OV24EdUl0OLbFxNzcvub599zRs/apfaRLTfsmlmOgi0/YP305i+3tJ2ll946\n" +"P+qV1wXnXqTqEdIl4Ys3+1HmDCdTB1hoDwAAzqRVUXZ5+iiwPAU7R/LTHfMjV1ke\n" +"8jtNFfrorlZMCfVH/7eEnHJvVjOJt+YFe4aFMzE+DfuYIK7MH+olC2v79kBwbnEQ\n" +"fvHMA9gFwOYLUBBdSfcocp8EKZ+mRlNPGR/3LBrPeaQQ0GZEkxzRK+v/aNTuiYfr\n" +"oFXtrg0=\n" +"-----END CERTIFICATE-----\n"; const char *im = -"-----BEGIN CERTIFICATE-----\n" -"MIIF5DCCBMygAwIBAgIQW3dZxheE4V7HJ8AylSkoazANBgkqhkiG9w0BAQUFADCB\n" -"yjELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" -"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTowOAYDVQQLEzEoYykgMjAwNiBWZXJp\n" -"U2lnbiwgSW5jLiAtIEZvciBhdXRob3JpemVkIHVzZSBvbmx5MUUwQwYDVQQDEzxW\n" -"ZXJpU2lnbiBDbGFzcyAzIFB1YmxpYyBQcmltYXJ5IENlcnRpZmljYXRpb24gQXV0\n" -"aG9yaXR5IC0gRzUwHhcNMDYxMTA4MDAwMDAwWhcNMTYxMTA3MjM1OTU5WjCBujEL\n" -"MAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQLExZW\n" -"ZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2UgYXQg\n" -"aHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMrVmVy\n" -"aVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTCCASIwDQYJ\n" -"KoZIhvcNAQEBBQADggEPADCCAQoCggEBAJjboFXrnP0XeeOabhQdsVuYI4cWbod2\n" -"nLU4O7WgerQHYwkZ5iqISKnnnbYwWgiXDOyq5BZpcmIjmvt6VCiYxQwtt9citsj5\n" -"OBfH3doxRpqUFI6e7nigtyLUSVSXTeV0W5K87Gws3+fBthsaVWtmCAN/Ra+aM/EQ\n" -"wGyZSpIkMQht3QI+YXZ4eLbtfjeubPOJ4bfh3BXMt1afgKCxBX9ONxX/ty8ejwY4\n" -"P1C3aSijtWZfNhpSSENmUt+ikk/TGGC+4+peGXEFv54cbGhyJW+ze3PJbb0S/5tB\n" -"Ml706H7FC6NMZNFOvCYIZfsZl1h44TO/7Wg+sSdFb8Di7Jdp91zT91ECAwEAAaOC\n" -"AdIwggHOMB0GA1UdDgQWBBT8ilC6nrklWntVhU+VAGOP6VhrQzASBgNVHRMBAf8E\n" -"CDAGAQH/AgEAMD0GA1UdIAQ2MDQwMgYEVR0gADAqMCgGCCsGAQUFBwIBFhxodHRw\n" -"czovL3d3dy52ZXJpc2lnbi5jb20vY3BzMD0GA1UdHwQ2MDQwMqAwoC6GLGh0dHA6\n" -"Ly9FVlNlY3VyZS1jcmwudmVyaXNpZ24uY29tL3BjYTMtZzUuY3JsMA4GA1UdDwEB\n" -"/wQEAwIBBjARBglghkgBhvhCAQEEBAMCAQYwbQYIKwYBBQUHAQwEYTBfoV2gWzBZ\n" -"MFcwVRYJaW1hZ2UvZ2lmMCEwHzAHBgUrDgMCGgQUj+XTGoasjY5rw8+AatRIGCx7\n" -"GS4wJRYjaHR0cDovL2xvZ28udmVyaXNpZ24uY29tL3ZzbG9nby5naWYwKQYDVR0R\n" -"BCIwIKQeMBwxGjAYBgNVBAMTEUNsYXNzM0NBMjA0OC0xLTQ3MD0GCCsGAQUFBwEB\n" -"BDEwLzAtBggrBgEFBQcwAYYhaHR0cDovL0VWU2VjdXJlLW9jc3AudmVyaXNpZ24u\n" -"Y29tMB8GA1UdIwQYMBaAFH/TZafC3ey78DAJ80M5+gKvMzEzMA0GCSqGSIb3DQEB\n" -"BQUAA4IBAQCWovp/5j3t1CvOtxU/wHIDX4u6FpAl98KD2Md1NGNoElMMU4l7yVYJ\n" -"p8M2RE4O0GJis4b66KGbNGeNUyIXPv2s7mcuQ+JdfzOE8qJwwG6Cl8A0/SXGI3/t\n" -"5rDFV0OEst4t8dD2SB8UcVeyrDHhlyQjyRNddOVG7wl8nuGZMQoIeRuPcZ8XZsg4\n" -"z+6Ml7YGuXNG5NOUweVgtSV1LdlpMezNlsOjdv3odESsErlNv1HoudRETifLriDR\n" -"fip8tmNHnna6l9AW5wtsbfdDbzMLKTB3+p359U64drPNGLT5IO892+bKrZvQTtKH\n" -"qQ2mRHNQ3XBb7a1+Srwi1agm5MKFIA3Z\n" -"-----END CERTIFICATE-----\n"; +"-----BEGIN CERTIFICATE-----\n" +"MIIF5DCCBMygAwIBAgIQW3dZxheE4V7HJ8AylSkoazANBgkqhkiG9w0BAQUFADCB\n" +"yjELMAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQL\n" +"ExZWZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTowOAYDVQQLEzEoYykgMjAwNiBWZXJp\n" +"U2lnbiwgSW5jLiAtIEZvciBhdXRob3JpemVkIHVzZSBvbmx5MUUwQwYDVQQDEzxW\n" +"ZXJpU2lnbiBDbGFzcyAzIFB1YmxpYyBQcmltYXJ5IENlcnRpZmljYXRpb24gQXV0\n" +"aG9yaXR5IC0gRzUwHhcNMDYxMTA4MDAwMDAwWhcNMTYxMTA3MjM1OTU5WjCBujEL\n" +"MAkGA1UEBhMCVVMxFzAVBgNVBAoTDlZlcmlTaWduLCBJbmMuMR8wHQYDVQQLExZW\n" +"ZXJpU2lnbiBUcnVzdCBOZXR3b3JrMTswOQYDVQQLEzJUZXJtcyBvZiB1c2UgYXQg\n" +"aHR0cHM6Ly93d3cudmVyaXNpZ24uY29tL3JwYSAoYykwNjE0MDIGA1UEAxMrVmVy\n" +"aVNpZ24gQ2xhc3MgMyBFeHRlbmRlZCBWYWxpZGF0aW9uIFNTTCBDQTCCASIwDQYJ\n" +"KoZIhvcNAQEBBQADggEPADCCAQoCggEBAJjboFXrnP0XeeOabhQdsVuYI4cWbod2\n" +"nLU4O7WgerQHYwkZ5iqISKnnnbYwWgiXDOyq5BZpcmIjmvt6VCiYxQwtt9citsj5\n" +"OBfH3doxRpqUFI6e7nigtyLUSVSXTeV0W5K87Gws3+fBthsaVWtmCAN/Ra+aM/EQ\n" +"wGyZSpIkMQht3QI+YXZ4eLbtfjeubPOJ4bfh3BXMt1afgKCxBX9ONxX/ty8ejwY4\n" +"P1C3aSijtWZfNhpSSENmUt+ikk/TGGC+4+peGXEFv54cbGhyJW+ze3PJbb0S/5tB\n" +"Ml706H7FC6NMZNFOvCYIZfsZl1h44TO/7Wg+sSdFb8Di7Jdp91zT91ECAwEAAaOC\n" +"AdIwggHOMB0GA1UdDgQWBBT8ilC6nrklWntVhU+VAGOP6VhrQzASBgNVHRMBAf8E\n" +"CDAGAQH/AgEAMD0GA1UdIAQ2MDQwMgYEVR0gADAqMCgGCCsGAQUFBwIBFhxodHRw\n" +"czovL3d3dy52ZXJpc2lnbi5jb20vY3BzMD0GA1UdHwQ2MDQwMqAwoC6GLGh0dHA6\n" +"Ly9FVlNlY3VyZS1jcmwudmVyaXNpZ24uY29tL3BjYTMtZzUuY3JsMA4GA1UdDwEB\n" +"/wQEAwIBBjARBglghkgBhvhCAQEEBAMCAQYwbQYIKwYBBQUHAQwEYTBfoV2gWzBZ\n" +"MFcwVRYJaW1hZ2UvZ2lmMCEwHzAHBgUrDgMCGgQUj+XTGoasjY5rw8+AatRIGCx7\n" +"GS4wJRYjaHR0cDovL2xvZ28udmVyaXNpZ24uY29tL3ZzbG9nby5naWYwKQYDVR0R\n" +"BCIwIKQeMBwxGjAYBgNVBAMTEUNsYXNzM0NBMjA0OC0xLTQ3MD0GCCsGAQUFBwEB\n" +"BDEwLzAtBggrBgEFBQcwAYYhaHR0cDovL0VWU2VjdXJlLW9jc3AudmVyaXNpZ24u\n" +"Y29tMB8GA1UdIwQYMBaAFH/TZafC3ey78DAJ80M5+gKvMzEzMA0GCSqGSIb3DQEB\n" +"BQUAA4IBAQCWovp/5j3t1CvOtxU/wHIDX4u6FpAl98KD2Md1NGNoElMMU4l7yVYJ\n" +"p8M2RE4O0GJis4b66KGbNGeNUyIXPv2s7mcuQ+JdfzOE8qJwwG6Cl8A0/SXGI3/t\n" +"5rDFV0OEst4t8dD2SB8UcVeyrDHhlyQjyRNddOVG7wl8nuGZMQoIeRuPcZ8XZsg4\n" +"z+6Ml7YGuXNG5NOUweVgtSV1LdlpMezNlsOjdv3odESsErlNv1HoudRETifLriDR\n" +"fip8tmNHnna6l9AW5wtsbfdDbzMLKTB3+p359U64drPNGLT5IO892+bKrZvQTtKH\n" +"qQ2mRHNQ3XBb7a1+Srwi1agm5MKFIA3Z\n" +"-----END CERTIFICATE-----\n"; c_cert.raw_cert = (unsigned char *)ee; c_cert.cert_size = strlen(ee); @@ -846,19 +846,19 @@ test_policy.extractable = true; ret = ckmc_save_cert(ca_alias, c_cert1, test_policy); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ untrustedcerts.alias = (char *)ca_alias; untrustedcerts.next = NULL; ret = ckmc_get_cert_chain_with_alias(&c_cert, &untrustedcerts, &cert_chain_list); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ next=cert_chain_list; do { -    current = next; -    next = current->next; + current = next; + next = current->next; } while (next != NULL); /* Called when the list is no longer needed */ @@ -878,13 +878,13 @@ ckmc_cert_s *pcert; defined_media_storage_directory can be obtained with the storage_get_directory() function */ -const char *file_name = "<defined_media_storage_directory>/ckmc_test_cert.pem"; +const char *file_name = "<defined_media_storage_directory>/ckmc_test_cert.pem"; ret = ckmc_load_cert_from_file(file_name, &pcert); if (CKMC_ERROR_NONE != ret) -    /* Error handling */ + /* Error handling */ -dlog_print(DLOG_INFO, LOG_TAG, "cert size =%d\n", pcert->cert_size); +dlog_print(DLOG_INFO, LOG_TAG, "cert size =%d\n", pcert->cert_size); ckmc_cert_free(pcert); /* Called when the certificate is no longer needed */ @@ -898,25 +898,25 @@ ckmc_pkcs12_s *ppkcs12 = NULL; defined_media_storage_directory can be obtained with the storage_get_directory() function */ -const char *p12file = "<defined_media_storage_directory>/ckmc_p12_test.p12"; -const char *password = "password"; /* PKCS#12 file can be protected by a password */ +const char *p12file = "<defined_media_storage_directory>/ckmc_p12_test.p12"; +const char *password = "password"; /* PKCS#12 file can be protected by a password */ ret = ckmc_pkcs12_load(p12file, password, &ppkcs12); if (CKMC_ERROR_NONE != ret || ppkcs12 == NULL) -    /* Error handling */ + /* Error handling */ if (ppkcs12->priv_key != NULL) -    /* Check a private key */ + /* Check a private key */ if (ppkcs12->cert != NULL) -    /* Check a certificate */ + /* Check a certificate */ int cnt = 0; ckmc_cert_list_s *tmp_list = ppkcs12->ca_chain; while (tmp_list!= NULL) { -    /* Check a certificate list */ + /* Check a certificate list */ -    tmp_list = tmp_list->next; + tmp_list = tmp_list->next; } ckmc_pkcs12_free(ppkcs12); /* Called when the pkcs12 data is no longer needed */ @@ -924,7 +924,7 @@ ckmc_pkcs12_free(ppkcs12); /* Called when the pkcs12 data is no longer needed */

    Implementing Access Control

    -

    To implement access control rules for each individual client's data, certificates, and keys:

    +

    To implement access control rules for each individual client's data, certificates, and keys:

    1. Store test data:

      @@ -932,10 +932,10 @@ int ret = CKMC_ERROR_NONE;
 
 char* password = NULL;
 ckmc_raw_buffer_s test_data;
-const char *alias = "targetData";
+const char *alias = "targetData";
 ckmc_policy_s test_policy;
 
-const char *char_bin_data = "Access control test Data";
+const char *char_bin_data = "Access control test Data";
 
 test_policy.password = password;
 test_policy.extractable = true;
@@ -944,44 +944,44 @@ test_data.data = (unsigned char *)char_bin_data;
 test_data.size = strlen(char_bin_data);
 ret = ckmc_save_data(alias, test_data, test_policy);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */

    2. Set a rule to allow access:

       int ret = CKMC_ERROR_NONE;
 
-const char *target1 = "accessor-allow-1";
-const char *target2 = "accessor-allow-2";
-const char *alias = "targetData";
+const char *target1 = "accessor-allow-1";
+const char *target2 = "accessor-allow-2";
+const char *alias = "targetData";
 
 /* Only allow reading data */
 ret = ckmc_set_permission(alias, target1, CKMC_PERMISSION_READ);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 /* Allow reading and deleting data */
 ret = ckmc_set_permission(alias, target2, CKMC_PERMISSION_READ | CKMC_PERMISSION_REMOVE);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */

    3. Set a rule to deny access:

       int ret = CKMC_ERROR_NONE;
 
-const char *target = "denied-accessor";
-const char *alias = "targetData";
+const char *target = "denied-accessor";
+const char *alias = "targetData";
 
 /* Allow the target user to a read (alias) */
 ret = ckmc_set_permission(alias, target, CKMC_PERMISSION_READ);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
 
 /* Deny the target user access to data (alias) */
 ret = ckmc_set_permission(alias, target, CKMC_PERMISSION_NONE);
 if (CKMC_ERROR_NONE != ret)
-    /* Error handling */
+    /* Error handling */
    diff --git a/org.tizen.guides/html/native/security/security_cover_n.htm b/org.tizen.guides/html/native/security/security_cover_n.htm index 739c50a..b6839df 100644 --- a/org.tizen.guides/html/native/security/security_cover_n.htm +++ b/org.tizen.guides/html/native/security/security_cover_n.htm @@ -5,13 +5,13 @@ - + - Security + Security @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • -
    +

    Security

    @@ -58,7 +58,7 @@

    For information on how to minimize any accidental introduction of security vulnerabilities in your application, see Security Tips (in mobile applications only).

    - +
    diff --git a/org.tizen.guides/html/native/security/security_tip.htm b/org.tizen.guides/html/native/security/security_tip.htm index 70c6c03..673b8ea 100644 --- a/org.tizen.guides/html/native/security/security_tip.htm +++ b/org.tizen.guides/html/native/security/security_tip.htm @@ -5,13 +5,13 @@ - + - Security Tips + Security Tips @@ -36,10 +36,10 @@
  • Secure Key Management
  • Message Port
  • Data Control
    • - + - -
    +
    +

    Security Tips

    When you design an application or service, you must minimize any accidental introduction of security vulnerabilities. The following practices aim to reduce the likelihood of security vulnerabilities caused by programming in the Tizen platform.

    @@ -66,7 +66,7 @@

    A client can specify simple access rules when storing data in the key manager:

    • If the data is tagged as exportable, the key manager returns the raw value of the data.
      • -
    • If the data is tagged as non-exportable, the key manager does not return its raw value. +
    • If the data is tagged as non-exportable, the key manager does not return its raw value.

      In that case, the key manager provides secure cryptographic operations for non-exportable keys without revealing key values to clients.

    All the data in the key manager is protected by an internal key. In addition, a client can encrypt its data using its own password. If a client provides a password when storing data, the data is encrypted with that password. To obtain the data from the key manager later on, the same password must be provided. The additional password provides protection in case the device is lost.

    When storing data:

    @@ -89,7 +89,7 @@

    To determine whether an API requires privileges to be used, see the API Reference.

    -

    In Tizen 3.0, the platform uses core privileges for access control, but the concept of the application privilege declaration is not changed. As in Tizen 2.X, +

    In Tizen 3.0, the platform uses core privileges for access control, but the concept of the application privilege declaration is not changed. As in Tizen 2.X, the application can declare required privileges in the manifest file according to their own application type.

    Privacy-related Privileges

    diff --git a/org.tizen.guides/html/native/security/yaca_n.htm b/org.tizen.guides/html/native/security/yaca_n.htm index 9140f21..a7e9b6c 100644 --- a/org.tizen.guides/html/native/security/yaca_n.htm +++ b/org.tizen.guides/html/native/security/yaca_n.htm @@ -24,7 +24,7 @@
    • Tizen 3.0 and Higher for Mobile
    • Tizen 3.0 and Higher for Wearable
      • -
    +

    Content

    +

    Related Info

    • YACA API for Mobile Native
      • @@ -92,12 +92,12 @@
    • Initialize and clean up the library:
        -
      1. Initialize the library. +
      2. Initialize the library.

        This function must be called in each thread that uses YACA.

         int ret = yaca_initialize();
 if (ret != YACA_ERROR_NONE)
-    /* Error handling */
+    /* Error handling */
      3. Clean up the library when no longer needed. @@ -122,38 +122,38 @@ yaca_key_h key = YACA_KEY_NULL; ret = yaca_key_generate(YACA_KEY_TYPE_SYMMETRIC, YACA_KEY_LENGTH_256BIT, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); ret = yaca_key_generate(YACA_KEY_TYPE_DES, YACA_KEY_LENGTH_192BIT, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); ret = yaca_key_generate(YACA_KEY_TYPE_RSA_PRIV, YACA_KEY_LENGTH_1024BIT, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); ret = yaca_key_generate(YACA_KEY_TYPE_DSA_PRIV, YACA_KEY_LENGTH_512BIT, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); ret = yaca_key_generate(YACA_KEY_TYPE_DH_PRIV, -                        YACA_KEY_LENGTH_DH_GENERATOR_2 | 333, &key); + YACA_KEY_LENGTH_DH_GENERATOR_2 | 333, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); ret = yaca_key_generate(YACA_KEY_TYPE_DH_PRIV, YACA_KEY_LENGTH_DH_RFC_2048_224, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); ret = yaca_key_generate(YACA_KEY_TYPE_EC_PRIV, YACA_KEY_LENGTH_EC_SECP384R1, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key);
        4. @@ -165,42 +165,42 @@ yaca_key_h key_params = YACA_KEY_NULL; ret = yaca_key_generate(YACA_KEY_TYPE_DSA_PARAMS, YACA_KEY_LENGTH_512BIT, &key_params); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_generate_from_parameters(key_params, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); yaca_key_destroy(key_params); ret = yaca_key_generate(YACA_KEY_TYPE_DH_PARAMS, -                        YACA_KEY_LENGTH_DH_GENERATOR_5 | YACA_KEY_LENGTH_2048BIT, -                        &key_params); + YACA_KEY_LENGTH_DH_GENERATOR_5 | YACA_KEY_LENGTH_2048BIT, + &key_params); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_generate_from_parameters(key_params, &key); if (ret != YACA_ERROR_NONE) -    goto error; + goto error; yaca_key_destroy(key); yaca_key_destroy(key_params); ret = yaca_key_generate(YACA_KEY_TYPE_DH_PARAMS, YACA_KEY_LENGTH_DH_RFC_2048_256, -                        &key_params); + &key_params); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_generate_from_parameters(key_params, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); yaca_key_destroy(key_params); ret = yaca_key_generate(YACA_KEY_TYPE_EC_PARAMS, YACA_KEY_LENGTH_EC_PRIME256V1, -                        &key_params); + &key_params); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_generate_from_parameters(key_params, &key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(key); yaca_key_destroy(key_params); @@ -220,13 +220,13 @@ yaca_key_h b64_imported = YACA_KEY_NULL; /* BASE64 */ ret = yaca_key_export(sym, YACA_KEY_FORMAT_DEFAULT, YACA_KEY_FILE_FORMAT_BASE64, -                      NULL, &b64, &b64_len); + NULL, &b64, &b64_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(YACA_KEY_TYPE_SYMMETRIC, NULL, b64, b64_len, &b64_imported); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(b64); b64 = NULL; @@ -234,12 +234,12 @@ yaca_key_destroy(b64_imported); /* RAW */ ret = yaca_key_export(sym, YACA_KEY_FORMAT_DEFAULT, YACA_KEY_FILE_FORMAT_RAW, -                      NULL, &raw, &raw_len); + NULL, &raw, &raw_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(YACA_KEY_TYPE_SYMMETRIC, NULL, raw, raw_len, &raw_imported); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(raw); raw = NULL; @@ -268,13 +268,13 @@ yaca_key_h der_pub_imported = YACA_KEY_NULL; /* PEM private */ ret = yaca_key_export(priv, YACA_KEY_FORMAT_DEFAULT, YACA_KEY_FILE_FORMAT_PEM, -                      NULL, &pem_prv, &pem_prv_len); + NULL, &pem_prv, &pem_prv_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(priv_type, NULL, pem_prv, pem_prv_len, &pem_prv_imported); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(pem_prv); pem_prv = NULL; @@ -282,12 +282,12 @@ yaca_key_destroy(pem_prv_imported); /* DER private */ ret = yaca_key_export(priv, YACA_KEY_FORMAT_DEFAULT, YACA_KEY_FILE_FORMAT_DER,NULL, -                      &der_prv, &der_prv_len); + &der_prv, &der_prv_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(priv_type, NULL, der_prv, der_prv_len, &der_prv_imported); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(der_prv); der_prv = NULL; @@ -295,12 +295,12 @@ yaca_key_destroy(der_prv_imported); /* PEM public */ ret = yaca_key_export(pub, YACA_KEY_FORMAT_DEFAULT, YACA_KEY_FILE_FORMAT_PEM, -                      NULL, &pem_pub, &pem_pub_len); + NULL, &pem_pub, &pem_pub_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(pub_type, NULL, pem_pub, pem_pub_len, &pem_pub_imported); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(pem_pub); pem_pub = NULL; @@ -308,12 +308,12 @@ yaca_key_destroy(pem_pub_imported); /* DER public */ ret = yaca_key_export(pub, YACA_KEY_FORMAT_DEFAULT, YACA_KEY_FILE_FORMAT_DER, -                      NULL, &der_pub, &der_pub_len); + NULL, &der_pub, &der_pub_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(pub_type, NULL, der_pub, der_pub_len, &der_pub_imported); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(der_pub); der_pub = NULL; @@ -343,41 +343,41 @@ yaca_key_h iv = YACA_KEY_NULL; ret = yaca_key_extract_parameters(peer_public_key, &params); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_generate_from_parameters(params, &private_key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_extract_public(private_key, &public_key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Derive secret */ ret = yaca_key_derive_dh(private_key, peer_public_key, &secret, &secret_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ key_material_len = YACA_KEY_LENGTH_192BIT / 8; iv_material_len = YACA_KEY_LENGTH_IV_128BIT / 8; temp_material_len = key_material_len + iv_material_len; ret = yaca_key_derive_kdf(YACA_KDF_X962, YACA_DIGEST_SHA512, secret, secret_len, -                          NULL, 0, temp_material_len, &temp_material); + NULL, 0, temp_material_len, &temp_material); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ key_material = temp_material; iv_material = temp_material + key_material_len; ret = yaca_key_import(YACA_KEY_TYPE_SYMMETRIC, NULL, key_material, -                      key_material_len, &aes_key); + key_material_len, &aes_key); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_key_import(YACA_KEY_TYPE_IV, NULL, iv_material, -                      iv_material_len, &iv); + iv_material_len, &iv); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_key_destroy(private_key); yaca_key_destroy(public_key); @@ -411,30 +411,30 @@ yaca_padding_e padding = YACA_PADDING_PKCS1_PSS; /* Generation */ if (yaca_key_generate(type, YACA_KEY_LENGTH_1024BIT, &prv) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_key_extract_public(prv, &pub) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Signing */ if (yaca_sign_initialize(&ctx, YACA_DIGEST_SHA512, prv) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_context_set_property(ctx, YACA_PROPERTY_PADDING, (char*)(&padding), -                              sizeof(padding)) != YACA_ERROR_NONE) -    /* Error handling */ + sizeof(padding)) != YACA_ERROR_NONE) + /* Error handling */ if (yaca_sign_update(ctx, lorem4096, LOREM4096_SIZE) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_context_get_output_length(ctx, 0, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_malloc(signature_len, (void**)&signature) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_finalize(ctx, signature, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Cleanup */ yaca_context_destroy(ctx); @@ -442,17 +442,17 @@ ctx = YACA_CONTEXT_NULL; /* Verification */ if (yaca_verify_initialize(&ctx, YACA_DIGEST_SHA512, pub) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_context_set_property(ctx, YACA_PROPERTY_PADDING, (char*)(&padding), -                              sizeof(padding)) != YACA_ERROR_NONE) -    /* Error handling */ + sizeof(padding)) != YACA_ERROR_NONE) + /* Error handling */ if (yaca_verify_update(ctx, lorem4096, LOREM4096_SIZE) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_verify_finalize(ctx, signature, signature_len) != YACA_ERROR_NONE) -    /* Verification failed */ + /* Verification failed */ yaca_free(signature); yaca_key_destroy(prv); @@ -471,24 +471,24 @@ yaca_key_h key = YACA_KEY_NULL; /* Generation */ if (yaca_key_generate(YACA_KEY_TYPE_SYMMETRIC, YACA_KEY_LENGTH_256BIT, &key) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ /* Signing */ if (yaca_sign_initialize_hmac(&ctx, YACA_DIGEST_SHA512, key) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_update(ctx, lorem4096, LOREM4096_SIZE) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_context_get_output_length(ctx, 0, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_malloc(signature_len, (void**)&signature1) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_finalize(ctx, signature1, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Cleanup */ yaca_context_destroy(ctx); @@ -496,22 +496,22 @@ ctx = YACA_CONTEXT_NULL; /* Verification */ if (yaca_sign_initialize_hmac(&ctx, YACA_DIGEST_SHA512, key) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_update(ctx, lorem4096, LOREM4096_SIZE) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_context_get_output_length(ctx, 0, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_malloc(signature_len, (void**)&signature2) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_finalize(ctx, signature2, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_memcmp(signature1, signature2, signature_len) != YACA_ERROR_NONE) -    /* HMAC verification failed */ + /* HMAC verification failed */ yaca_free(signature1); yaca_free(signature2); @@ -530,23 +530,23 @@ yaca_key_h key = YACA_KEY_NULL; /* Generation */ if (yaca_key_generate(YACA_KEY_TYPE_SYMMETRIC, YACA_KEY_LENGTH_256BIT, &key)) -    /* Error handling */ + /* Error handling */ /* Signing */ if (yaca_sign_initialize_cmac(&ctx, YACA_ENCRYPT_AES, key) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_update(ctx, lorem4096, LOREM4096_SIZE)) -    /* Error handling */ + /* Error handling */ if (yaca_context_get_output_length(ctx, 0, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_malloc(signature_len, (void**)&signature1) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_finalize(ctx, signature1, &signature_len)) -    /* Error handling */ + /* Error handling */ /* Cleanup */ yaca_context_destroy(ctx); @@ -554,22 +554,22 @@ ctx = YACA_CONTEXT_NULL; /* Verification */ if (yaca_sign_initialize_cmac(&ctx, YACA_ENCRYPT_AES, key) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_update(ctx, lorem4096, LOREM4096_SIZE)) -    /* Error handling */ + /* Error handling */ if (yaca_context_get_output_length(ctx, 0, &signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_malloc(signature_len, (void**)&signature2) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_sign_finalize(ctx, signature2, &signature_len)) -    /* Error handling */ + /* Error handling */ if (yaca_memcmp(signature1, signature2, signature_len) != YACA_ERROR_NONE) -    /* CMAC verification failed */ + /* CMAC verification failed */ yaca_free(signature1); yaca_free(signature2); @@ -592,21 +592,21 @@ yaca_key_h pub = YACA_KEY_NULL; /* Generation */ if (yaca_key_generate(type, YACA_KEY_LENGTH_1024BIT, &prv) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_key_extract_public(prv, &pub) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Signing */ if (yaca_simple_calculate_signature(YACA_DIGEST_SHA512, prv, lorem4096, -                                    LOREM4096_SIZE, &signature, &signature_len) -    != YACA_ERROR_NONE) -    /* Error handling */ + LOREM4096_SIZE, &signature, &signature_len) + != YACA_ERROR_NONE) + /* Error handling */ /* Verification */ if (yaca_simple_verify_signature(YACA_DIGEST_SHA512, pub, lorem4096, LOREM4096_SIZE, -                                 signature, signature_len) != YACA_ERROR_NONE) -    /* Error handling */ + signature, signature_len) != YACA_ERROR_NONE) + /* Error handling */ yaca_free(signature); yaca_key_destroy(prv); @@ -627,23 +627,23 @@ yaca_context_h ctx; ret = yaca_digest_initialize(&ctx, YACA_DIGEST_SHA256); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ ret = yaca_digest_update(ctx, lorem1024, 1024); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ size_t digest_len; ret = yaca_context_get_output_length(ctx, 0, &digest_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ { -    char digest[digest_len]; + char digest[digest_len]; -    ret = yaca_digest_finalize(ctx, digest, &digest_len); -    if (ret != YACA_ERROR_NONE) -        /* Error handling */ + ret = yaca_digest_finalize(ctx, digest, &digest_len); + if (ret != YACA_ERROR_NONE) + /* Error handling */ } yaca_context_destroy(ctx); @@ -656,10 +656,10 @@ char *digest; size_t digest_len; ret = yaca_simple_calculate_digest(YACA_DIGEST_SHA256, -                                   lorem1024, -                                   1024, &digest, &digest_len); + lorem1024, + 1024, &digest, &digest_len); if (ret != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ yaca_free(digest); @@ -698,78 +698,78 @@ size_t written_len; /* Key generation */ if (yaca_key_generate(key_type, key_bit_len, &key) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_encrypt_get_iv_bit_length(algo, bcm, key_bit_len, &iv_bit_len) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (iv_bit_len > 0 && yaca_key_generate(YACA_KEY_TYPE_IV, iv_bit_len, &iv) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ /* Encryption */ { -    if (yaca_encrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    enc_len = output_len + block_len; -    if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + enc_len = output_len + block_len; + if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_encrypt_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) + != YACA_ERROR_NONE) + /* Error handling */ -    enc_len = written_len; + enc_len = written_len; -    if (yaca_encrypt_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    enc_len += written_len; + enc_len += written_len; -    yaca_context_destroy(ctx); -    ctx = YACA_CONTEXT_NULL; + yaca_context_destroy(ctx); + ctx = YACA_CONTEXT_NULL; } /* Decryption */ { -    if (yaca_decrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    dec_len = output_len + block_len; -    if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + dec_len = output_len + block_len; + if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_decrypt_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len = written_len; + dec_len = written_len; -    if (yaca_decrypt_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len += written_len; + dec_len += written_len; } yaca_free(dec); @@ -810,109 +810,109 @@ size_t written_len; /* Key generation */ if (yaca_key_generate(key_type, key_bit_len, &key) != YACA_ERROR_NONE)) -    /* Error handling */ + /* Error handling */ /* IV generation */ if (yaca_key_generate(YACA_KEY_TYPE_IV, iv_bit_len, &iv) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(aad_len, (void**)&aad) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_randomize_bytes(aad, aad_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(tag_len, (void**)&tag) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Encryption */ { -    if (yaca_encrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    enc_len = output_len + block_len; -    if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + enc_len = output_len + block_len; + if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_encrypt_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) + != YACA_ERROR_NONE) + /* Error handling */ -    enc_len = written_len; + enc_len = written_len; -    if (yaca_encrypt_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    enc_len += written_len; + enc_len += written_len; -    /* Set the tag length and get the tag after final encryption */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG_LEN, -                                  (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the tag length and get the tag after final encryption */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG_LEN, + (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_context_get_property(ctx, YACA_PROPERTY_GCM_TAG, (void**)tag, &tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_context_get_property(ctx, YACA_PROPERTY_GCM_TAG, (void**)tag, &tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    dump_hex(enc, 16, "Encrypted data (16 of %zu bytes): ", enc_len); + dump_hex(enc, 16, "Encrypted data (16 of %zu bytes): ", enc_len); -    yaca_context_destroy(ctx); -    ctx = YACA_CONTEXT_NULL; + yaca_context_destroy(ctx); + ctx = YACA_CONTEXT_NULL; } /* Decryption */ { -    if (yaca_decrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    dec_len = output_len + block_len; -    if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + dec_len = output_len + block_len; + if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_decrypt_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len = written_len; + dec_len = written_len; -    /* Set the expected tag value before final decryption */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG, tag, tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the expected tag value before final decryption */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG, tag, tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_decrypt_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len += written_len; + dec_len += written_len; } yaca_free(enc); @@ -955,109 +955,109 @@ size_t written_len; /* Key generation */ if (yaca_key_generate(key_type, key_bit_len, &key) != YACA_ERROR_NONE)) -    /* Error handling */ + /* Error handling */ /* IV generation */ if (yaca_key_generate(YACA_KEY_TYPE_IV, iv_bit_len, &iv) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(aad_len, (void**)&aad) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_randomize_bytes(aad, aad_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(tag_len, (void**)&tag) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Encryption */ { -    if (yaca_encrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    enc_len = output_len + block_len; -    if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + enc_len = output_len + block_len; + if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_encrypt_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) + != YACA_ERROR_NONE) + /* Error handling */ -    enc_len = written_len; + enc_len = written_len; -    if (yaca_encrypt_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_encrypt_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    enc_len += written_len; + enc_len += written_len; -    /* Set the tag length and get the tag after final encryption */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG_LEN, -                                  (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the tag length and get the tag after final encryption */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG_LEN, + (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_context_get_property(ctx, YACA_PROPERTY_GCM_TAG, (void**)tag, &tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_context_get_property(ctx, YACA_PROPERTY_GCM_TAG, (void**)tag, &tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    dump_hex(enc, 16, "Encrypted data (16 of %zu bytes): ", enc_len); + dump_hex(enc, 16, "Encrypted data (16 of %zu bytes): ", enc_len); -    yaca_context_destroy(ctx); -    ctx = YACA_CONTEXT_NULL; + yaca_context_destroy(ctx); + ctx = YACA_CONTEXT_NULL; } /* Decryption */ { -    if (yaca_decrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_initialize(&ctx, algo, bcm, key, iv) != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    dec_len = output_len + block_len; -    if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + dec_len = output_len + block_len; + if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_decrypt_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len = written_len; + dec_len = written_len; -    /* Set the expected tag value before final decryption */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG, tag, tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the expected tag value before final decryption */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG, tag, tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_decrypt_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_decrypt_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len += written_len; + dec_len += written_len; } yaca_free(enc); @@ -1085,25 +1085,25 @@ size_t dec_len; size_t iv_bit_len; /* Key generation */ -if (yaca_key_derive_pbkdf2("foo bar", "123456789", 10, 1000, -                           YACA_DIGEST_SHA256, key_bit_len, &key) != YACA_ERROR_NONE) -    /* Error handling */ +if (yaca_key_derive_pbkdf2("foo bar", "123456789", 10, 1000, + YACA_DIGEST_SHA256, key_bit_len, &key) != YACA_ERROR_NONE) + /* Error handling */ if (yaca_encrypt_get_iv_bit_length(algo, bcm, key_bit_len, &iv_bit_len) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (iv_bit_len > 0 && yaca_key_generate(YACA_KEY_TYPE_IV, iv_bit_len, &iv) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (yaca_simple_encrypt(algo, bcm, key, iv, lorem4096, LOREM4096_SIZE, &enc, &enc_len) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (yaca_simple_decrypt(algo, bcm, key, iv, enc, enc_len, &dec, &dec_len) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ yaca_free(enc); yaca_free(dec); @@ -1146,78 +1146,78 @@ size_t written_len; /* Key generation */ if (yaca_key_generate(YACA_KEY_TYPE_RSA_PRIV, YACA_KEY_LENGTH_4096BIT, &key_priv) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (yaca_key_extract_public(key_priv, &key_pub) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Encryption */ { -    if (yaca_seal_initialize(&ctx, key_pub, algo, bcm, key_bit_len, &sym_key, &iv) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_initialize(&ctx, key_pub, algo, bcm, key_bit_len, &sym_key, &iv) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    enc_len = output_len + block_len; -    if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + enc_len = output_len + block_len; + if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) + /* Error handling */ -    /* Seal and finalize */ -    if (yaca_seal_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Seal and finalize */ + if (yaca_seal_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) + != YACA_ERROR_NONE) + /* Error handling */ -    enc_len = written_len; + enc_len = written_len; -    if (yaca_seal_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    enc_len += written_len; + enc_len += written_len; -    yaca_context_destroy(ctx); -    ctx = YACA_CONTEXT_NULL; + yaca_context_destroy(ctx); + ctx = YACA_CONTEXT_NULL; } /* Decryption */ { -    if (yaca_open_initialize(&ctx, key_priv, algo, bcm, key_bit_len, sym_key, iv) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_open_initialize(&ctx, key_priv, algo, bcm, key_bit_len, sym_key, iv) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    dec_len = output_len + block_len; -    if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + dec_len = output_len + block_len; + if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) + /* Error handling */ -    /* Open and finalize */ -    if (yaca_open_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* Open and finalize */ + if (yaca_open_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len = written_len; + dec_len = written_len; -    if (yaca_open_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_open_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len += written_len; + dec_len += written_len; } yaca_free(dec); @@ -1260,109 +1260,109 @@ size_t written_len; /* Key generation */ if (yaca_key_generate(YACA_KEY_TYPE_RSA_PRIV, YACA_KEY_LENGTH_4096BIT, &key_priv) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (yaca_key_extract_public(key_priv, &key_pub) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(aad_len, (void**)&aad) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_randomize_bytes(aad, aad_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(tag_len, (void**)&tag) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Encryption */ { -    if (yaca_seal_initialize(&ctx, key_pub, algo, bcm, key_bit_len, &sym_key, &iv) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_initialize(&ctx, key_pub, algo, bcm, key_bit_len, &sym_key, &iv) + != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    enc_len = output_len + block_len; -    if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + enc_len = output_len + block_len; + if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_seal_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) + != YACA_ERROR_NONE) + /* Error handling */ -    enc_len = written_len; + enc_len = written_len; -    if (yaca_seal_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    enc_len += written_len; + enc_len += written_len; -    /* Set the tag length and get the tag after final encryption */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG_LEN, -                                  (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the tag length and get the tag after final encryption */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG_LEN, + (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_context_get_property(ctx, YACA_PROPERTY_GCM_TAG, (void**)tag, &tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_context_get_property(ctx, YACA_PROPERTY_GCM_TAG, (void**)tag, &tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    yaca_context_destroy(ctx); -    ctx = YACA_CONTEXT_NULL; + yaca_context_destroy(ctx); + ctx = YACA_CONTEXT_NULL; } /* Decryption */ { -    if (yaca_open_initialize(&ctx, key_priv, algo, bcm, key_bit_len, sym_key, iv) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_open_initialize(&ctx, key_priv, algo, bcm, key_bit_len, sym_key, iv) + != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    dec_len = output_len + block_len; -    if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + dec_len = output_len + block_len; + if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_open_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_open_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Set the expected tag value before final decryption */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG, tag, tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the expected tag value before final decryption */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_GCM_TAG, tag, tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    dec_len = written_len; + dec_len = written_len; -    if (yaca_open_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_open_finalize(ctx, dec + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    dec_len += written_len; + dec_len += written_len; } yaca_free(dec); @@ -1409,117 +1409,117 @@ size_t len; /* Key generation */ if (yaca_key_generate(YACA_KEY_TYPE_RSA_PRIV, YACA_KEY_LENGTH_3072BIT, &key_priv) -    != YACA_ERROR_NONE) -    /* Error handling */ + != YACA_ERROR_NONE) + /* Error handling */ if (yaca_key_extract_public(key_priv, &key_pub) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(aad_len, (void**)&aad) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_randomize_bytes(aad, aad_len) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ if (yaca_zalloc(tag_len, (void**)&tag) != YACA_ERROR_NONE) -    /* Error handling */ + /* Error handling */ /* Encryption */ { -    if (yaca_seal_initialize(&ctx, key_pub, algo, bcm, key_bit_len, &sym_key, &iv) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_initialize(&ctx, key_pub, algo, bcm, key_bit_len, &sym_key, &iv) + != YACA_ERROR_NONE) + /* Error handling */ -    /* Set the tag length (optionally) */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_TAG_LEN, -                                  (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) -        /* Error handling */ + /* Set the tag length (optionally) */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_TAG_LEN, + (void*)&tag_len, sizeof(tag_len)) != YACA_ERROR_NONE) + /* Error handling */ -    /* The total plain text length must be passed (only needed if AAD is passed) */ -    if (yaca_seal_update(ctx, NULL, LOREM4096_SIZE , NULL, &len) != YACA_ERROR_NONE) -        /* Error handling */ + /* The total plain text length must be passed (only needed if AAD is passed) */ + if (yaca_seal_update(ctx, NULL, LOREM4096_SIZE , NULL, &len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ -    /* Calculate the max output: size of update + final chunks */ -    enc_len = output_len + block_len; -    if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) -        /* Error handling */ + /* Calculate the max output: size of update + final chunks */ + enc_len = output_len + block_len; + if (yaca_malloc(enc_len, (void**)&enc) != YACA_ERROR_NONE) + /* Error handling */ -    if (yaca_seal_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_update(ctx, lorem4096, LOREM4096_SIZE, enc, &written_len) + != YACA_ERROR_NONE) + /* Error handling */ -    enc_len = written_len; + enc_len = written_len; -    if (yaca_seal_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ + if (yaca_seal_finalize(ctx, enc + written_len, &written_len) != YACA_ERROR_NONE) + /* Error handling */ -    enc_len += written_len; + enc_len += written_len; -    /* Get the tag after final encryption */ -    if (yaca_context_get_property(ctx, YACA_PROPERTY_CCM_TAG, (void**)tag, &tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ + /* Get the tag after final encryption */ + if (yaca_context_get_property(ctx, YACA_PROPERTY_CCM_TAG, (void**)tag, &tag_len) + != YACA_ERROR_NONE) + /* Error handling */ -    yaca_context_destroy(ctx); -    ctx = YACA_CONTEXT_NULL; + yaca_context_destroy(ctx); + ctx = YACA_CONTEXT_NULL; } /* Decryption */ { -    if (yaca_open_initialize(&ctx, key_priv, algo, bcm, key_bit_len, sym_key, iv) -        != YACA_ERROR_NONE) -        /* Error handling */ - -    /* Set the expected tag value */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_TAG, tag, tag_len) -        != YACA_ERROR_NONE) -        /* Error handling */ - -    /* The total encrypted text length must be passed (only needed if AAD is passed) */ -    if (yaca_open_update(ctx, NULL, enc_len , NULL, &len) != YACA_ERROR_NONE) -        /* Error handling */ - -    /* Provide any AAD data */ -    if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_AAD, aad, aad_len) -        != YACA_ERROR_NONE) -        /* Error handling */ - -    /* For the update */ -    if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) -        != YACA_ERROR_NONE) -        /* Error handling */ - -    /* For finalizing */ -    if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) -        /* Error handling */ - -    /* Calculate the max output: size of update + final chunks */ -    dec_len = output_len + block_len; -    if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) -        /* Error handling */ - -    /* -     Tag verification is done when you call the final yaca_open_update() -     function, there is no call to the yaca_open_finalize() function -    */ -    if (yaca_open_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) -        /* Error handling */ - -    dec_len = written_len; + if (yaca_open_initialize(&ctx, key_priv, algo, bcm, key_bit_len, sym_key, iv) + != YACA_ERROR_NONE) + /* Error handling */ + + /* Set the expected tag value */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_TAG, tag, tag_len) + != YACA_ERROR_NONE) + /* Error handling */ + + /* The total encrypted text length must be passed (only needed if AAD is passed) */ + if (yaca_open_update(ctx, NULL, enc_len , NULL, &len) != YACA_ERROR_NONE) + /* Error handling */ + + /* Provide any AAD data */ + if (yaca_context_set_property(ctx, YACA_PROPERTY_CCM_AAD, aad, aad_len) + != YACA_ERROR_NONE) + /* Error handling */ + + /* For the update */ + if (yaca_context_get_output_length(ctx, LOREM4096_SIZE, &output_len) + != YACA_ERROR_NONE) + /* Error handling */ + + /* For finalizing */ + if (yaca_context_get_output_length(ctx, 0, &block_len) != YACA_ERROR_NONE) + /* Error handling */ + + /* Calculate the max output: size of update + final chunks */ + dec_len = output_len + block_len; + if (yaca_malloc(dec_len, (void**)&dec) != YACA_ERROR_NONE) + /* Error handling */ + + /* + Tag verification is done when you call the final yaca_open_update() + function, there is no call to the yaca_open_finalize() function + */ + if (yaca_open_update(ctx, enc, enc_len, dec, &written_len) != YACA_ERROR_NONE) + /* Error handling */ + + dec_len = written_len; } yaca_free(dec); diff --git a/org.tizen.guides/html/native/text_input/input_method_n.htm b/org.tizen.guides/html/native/text_input/input_method_n.htm index 4cc07b2..cc77f7c 100644 --- a/org.tizen.guides/html/native/text_input/input_method_n.htm +++ b/org.tizen.guides/html/native/text_input/input_method_n.htm @@ -37,7 +37,7 @@
      4. Showing the IME List
      5. Showing the IME Selector
      6. Checking the IME State
        7. -
    +

    Related Info

    @@ -50,14 +50,14 @@
    - +

    Input Method

    The input method editor (IME) is an input panel (keyboard) that lets the user input text and the platform receive the entered data. The user can select an IME as their default keyboard in the device Settings application.

    You can create a Tizen native IME application that provides a new IME. You can start the IME application life-cycle, interact with the current IME UI state, and retrieve attributes and events.

    - -

    The main features of the Input Method API include:

    + +

    The main features of the Input Method API include:

    • Managing the IME life-cycle @@ -92,7 +92,7 @@

      The Input Method Manager (in mobile and wearable applications) is a module used to manage the installed IMEs. You can use it to open the installed IME list or selector menu after your IME application is installed, and guide the user to select the installed IME:

        -
      • Showing the IME list +
      • Showing the IME list

        You can request the installed IME list menu to be opened. If a new IME has been installed, the user can see its name in the IME list, and can use the toggle button to enable the keyboard they want. All keyboards enabled in the IME list are shown in the IME selector to allow the user to select them as the default keyboard.

        Figure: IME list

        IME list

        @@ -115,7 +115,7 @@

        To use the Input Method Manager API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the tizen-manifest.xml file:

         <privileges>
-   <privilege>http://tizen.org/privilege/imemanager</privilege>
+   <privilege>http://tizen.org/privilege/imemanager</privilege>
 </privileges>
        • @@ -155,7 +155,7 @@ int ime_run(ime_callback_s *basic_cb, void *user_data);

        1. You must register the create(), terminate(), show(), and hide() callbacks.

          -

          Add the callbacks to the ime_callback_s structure (in mobile and wearable applications), and pass the structure as a parameter to the ime_run() function:

          +

          Add the callbacks to the ime_callback_s structure (in mobile and wearable applications), and pass the structure as a parameter to the ime_run() function:

           static void create(void *user_data);
@@ -166,14 +166,14 @@ static void hide(int context_id, void *user_data);
 void
 ime_app_main(int argc, char **argv)
 {
-    ime_callback_s basic_callback = {
-        create, /* When the input panel is created */
-        terminate, /* When the input panel is terminated */
-        show, /* When the input panel is shown */
-        hide, /* When the input panel is hidden */
-    };
-
-    ime_run(&basic_callback, NULL);
+    ime_callback_s basic_callback = {
+        create, /* When the input panel is created */
+        terminate, /* When the input panel is terminated */
+        show, /* When the input panel is shown */
+        hide, /* When the input panel is hidden */
+    };
+
+    ime_run(&basic_callback, NULL);
 }
          2. @@ -182,59 +182,59 @@ ime_app_main(int argc, char **argv) static void create(void *user_data) { -    int portrait_w, portrait_h, landscape_w, landscape_h; -    Evas_Object *ime_win = ime_get_main_window(); + int portrait_w, portrait_h, landscape_w, landscape_h; + Evas_Object *ime_win = ime_get_main_window(); -    /* Update IME size information */ -    ime_set_size(portrait_w, portrait_h, landscape_w, landscape_h); + /* Update IME size information */ + ime_set_size(portrait_w, portrait_h, landscape_w, landscape_h); -    /* Create or initialize resources */ + /* Create or initialize resources */ } static void terminate(void *user_data) { -    /* Release the resources */ + /* Release the resources */ } static void show(int context_id, ime_context_h context, void *user_data) { -    Ecore_IMF_Input_Panel_Layout layout; -    ime_layout_variation_e layout_variation; -    int cursor_pos; -    Ecore_IMF_Autocapital_Type autocapital_type; -    Ecore_IMF_Input_Panel_Return_Key_Type return_key_type; -    bool return_key_state, prediction_mode, password_mode; -    Ecore_IMF_Input_Hints input_hint; -    Ecore_IMF_BiDi_Direction bidi; -    Ecore_IMF_Input_Panel_Lang language; - -    Evas_Object *ime_win = ime_get_main_window(); - -    ime_context_get_layout(context, &layout); -    ime_context_get_layout_variation(context, &layout_variation); -    /* Draw the proper layout */ - -    ime_context_get_autocapital_type(context, &autocapital_type); -    ime_context_get_cursor_position(context, &cursor_pos); -    /* Draw the capital or small characters accordingly */ - -    ime_context_get_return_key_type(context, &return_key_type); -    ime_context_get_return_key_state(context, &return_key_state); -    /* Draw the proper Return key */ - -    /* Show the IME window */ -    evas_object_show(ime_win); + Ecore_IMF_Input_Panel_Layout layout; + ime_layout_variation_e layout_variation; + int cursor_pos; + Ecore_IMF_Autocapital_Type autocapital_type; + Ecore_IMF_Input_Panel_Return_Key_Type return_key_type; + bool return_key_state, prediction_mode, password_mode; + Ecore_IMF_Input_Hints input_hint; + Ecore_IMF_BiDi_Direction bidi; + Ecore_IMF_Input_Panel_Lang language; + + Evas_Object *ime_win = ime_get_main_window(); + + ime_context_get_layout(context, &layout); + ime_context_get_layout_variation(context, &layout_variation); + /* Draw the proper layout */ + + ime_context_get_autocapital_type(context, &autocapital_type); + ime_context_get_cursor_position(context, &cursor_pos); + /* Draw the capital or small characters accordingly */ + + ime_context_get_return_key_type(context, &return_key_type); + ime_context_get_return_key_state(context, &return_key_state); + /* Draw the proper Return key */ + + /* Show the IME window */ + evas_object_show(ime_win); } static void hide(int context_id, void *user_data) { -    Evas_Object *ime_win = ime_get_main_window(); + Evas_Object *ime_win = ime_get_main_window(); -    /* Hide the IME window */ -    evas_object_hide(ime_win); + /* Hide the IME window */ + evas_object_hide(ime_win); }

          In the show() callback, the IME application can get the contextual information from an associated text input UI control to configure the keyboard state and look accordingly. The contextual information of each input UI control is provided through the ime_context_get_XXX() functions defined in the inputmethod.h header file.

          @@ -245,7 +245,7 @@ hide(int context_id, void *user_data)
          1. -

            You can register optional callbacks with the ime_event_set_XXX_cb() functions provided in the inputmethod.h header file:

            +

            You can register optional callbacks with the ime_event_set_XXX_cb() functions provided in the inputmethod.h header file:

             static int focus_in(int context_id, void *user_data);
@@ -255,15 +255,15 @@ static int cursor_position_updated(int cursor_pos, void *user_data);
 void
 ime_app_main(int argc, char **argv)
 {
-    ime_callback_s basic_callback = {
-        /* Add the mandatory callbacks */
-    };
+    ime_callback_s basic_callback = {
+        /* Add the mandatory callbacks */
+    };
 
-    ime_event_set_focus_in_cb(focus_in, NULL);
-    ime_event_set_focus_out_cb(focus_out, NULL);
-    ime_event_set_cursor_position_updated_cb(cursor_position_updated, NULL);
+    ime_event_set_focus_in_cb(focus_in, NULL);
+    ime_event_set_focus_out_cb(focus_out, NULL);
+    ime_event_set_cursor_position_updated_cb(cursor_position_updated, NULL);
 
-    ime_run(&basic_callback, NULL);
+    ime_run(&basic_callback, NULL);
 }
            2. @@ -275,7 +275,7 @@ ime_app_main(int argc, char **argv) static int focus_in(int context_id, void *user_data) { -    /* Take action */ + /* Take action */ }
          2. The focus_out() callback is triggered when an associated text input UI control in any application loses the focus. Usually, the focus_out() event is followed by the hide() event. @@ -284,7 +284,7 @@ focus_in(int context_id, void *user_data) static int focus_out(int context_id, void *user_data) { -    /* Take action */ + /* Take action */ }
          3. The cursor_position_updated() callback is triggered when the position of the cursor in an associated text input UI control changes. You can use this callback to provide, for example, auto-capitalization or predictive text features. @@ -293,7 +293,7 @@ focus_out(int context_id, void *user_data) static int cursor_position_updated(int cursor_pos, void *user_data) { -    /* Take action */ + /* Take action */ }
      @@ -309,20 +309,20 @@ cursor_position_updated(int cursor_pos, void *user_data)
    • Add the necessary callbacks for reacting to the keyboard option menu opening and closing, before calling the ime_run() function: 
       static void option_window_created(Evas_Object *window, ime_option_window_type_e type,
-                                  void *user_data);
+                                  void *user_data);
 static void option_window_destroyed(Evas_Object *window, void *user_data);
 
 void
 ime_app_main(int argc, char **argv)
 {
-    ime_callback_s basic_callback = {
-        /* Add the mandatory callbacks */
-    };
+    ime_callback_s basic_callback = {
+        /* Add the mandatory callbacks */
+    };
 
-    ime_event_set_option_window_created_cb(option_window_created, NULL);
-    ime_event_set_option_window_destroyed_cb(option_window_destroyed, NULL);
+    ime_event_set_option_window_created_cb(option_window_created, NULL);
+    ime_event_set_option_window_destroyed_cb(option_window_destroyed, NULL);
 
-    ime_run(&basic_callback, NULL);
+    ime_run(&basic_callback, NULL);
 }
      • @@ -333,12 +333,12 @@ ime_app_main(int argc, char **argv) 
       static void
 option_window_created(Evas_Object *window, ime_option_window_type_e type,
-                      void *user_data)
+                      void *user_data)
 {
-    /* Create the option window */
-    /* Draw the content to the given window object */
+    /* Create the option window */
+    /* Draw the content to the given window object */
 
-    evas_object_show(window);
+    evas_object_show(window);
 }
      @@ -350,8 +350,8 @@ option_window_created(Evas_Object *window, ime_option_window_type_e type, static void _clicked(void *data, Evas_Object *obj, void *event_info) { -    /* Open the IME option menu window */ -    ime_create_option_window(); + /* Open the IME option menu window */ + ime_create_option_window(); }

      The ime_create_option_window() function call triggers the option_window_created() callback, in which you can draw the option menu content on the given window.

      @@ -362,24 +362,24 @@ _clicked(void *data, Evas_Object *obj, void *event_info) static void option_window_destroyed(Evas_Object *window, void *user_data) { -    /* Destroy the option window */ -    /* Release the resources */ + /* Destroy the option window */ + /* Release the resources */ } - +

      Showing the IME List

      - +

      To launch the IME list menu to show the installed IMEs, use the ime_manager_show_ime_list() function:

       void
 show_ime_list()
 {
-    int ret = ime_manager_show_ime_list();
-    if (IME_MANAGER_ERROR_NONE != ret)
-        /* Error handling */
+    int ret = ime_manager_show_ime_list();
+    if (IME_MANAGER_ERROR_NONE != ret)
+        /* Error handling */
 }
      @@ -387,16 +387,16 @@ show_ime_list()

      Showing the IME Selector

      - +

      To launch the IME selector menu to allow the user to select the default keyboard, use the ime_manager_show_ime_selector() function:

       void
 show_ime_selector()
 {
-    int ret = ime_manager_show_ime_selector();
-    if (IME_MANAGER_ERROR_NONE != ret)
-        /* Error handling */
+    int ret = ime_manager_show_ime_selector();
+    if (IME_MANAGER_ERROR_NONE != ret)
+        /* Error handling */
 }
      @@ -404,7 +404,7 @@ show_ime_selector()

      Checking the IME State

      - +

      To check the current default keyboard or whether a specific IME is enabled, or to get the number of enabled (usable) IMEs:

        @@ -414,12 +414,12 @@ show_ime_selector() boolean is_ime_enabled(const char *app_id) { -    boolean enabled = false; -    int ret = ime_manager_is_ime_enabled(app_id, &enabled); -    if (IME_MANAGER_ERROR_NONE != ret) -        /* Error handling */ + boolean enabled = false; + int ret = ime_manager_is_ime_enabled(app_id, &enabled); + if (IME_MANAGER_ERROR_NONE != ret) + /* Error handling */ -    return enabled; + return enabled; } @@ -431,13 +431,13 @@ is_ime_enabled(const char *app_id) void get_active_ime() { -    char *app_id = NULL; -    int ret = ime_manager_get_active_ime(&app_id); -    if (IME_MANAGER_ERROR_NONE != ret) -        /* Error handling */ -    /* Take action */ + char *app_id = NULL; + int ret = ime_manager_get_active_ime(&app_id); + if (IME_MANAGER_ERROR_NONE != ret) + /* Error handling */ + /* Take action */ -    free(app_id); + free(app_id); } @@ -450,22 +450,22 @@ get_active_ime() int get_enabled_ime_count() { -    int count = ime_manager_get_enabled_ime_count(); -    if (count == 0) { -        if (get_last_result() != IME_MANAGER_ERROR_NONE) { -            /* Error handling */ -        } -    } -    /* Take action */ - -   return count; + int count = ime_manager_get_enabled_ime_count(); + if (count == 0) { + if (get_last_result() != IME_MANAGER_ERROR_NONE) { + /* Error handling */ + } + } + /* Take action */ + + return count; }

        If the function is successful, it returns the number of enabled IMEs. Otherwise, 0.

      - + @@ -473,9 +473,9 @@ get_enabled_ime_count() Go to top - + - Speech-to-text + Speech-to-text @@ -20,7 +20,7 @@

      Mobile native Wearable native

      - +

      Dependencies

      -
    +
    -

    Speech-to-text

    +

    Speech-to-text

    The STT (speech-to-text) features enable recognizing sound data recorded by the user and sending the result as text.

    When your application creates a handle and prepares the STT service by the API, the STT daemon is invoked and connected for background work. This daemon and your application communicate as the server and the client.

    @@ -89,10 +89,10 @@

    The STT life-cycle is described in the following figure.

    - -

    Figure: STT life-cycle

    + +

    Figure: STT life-cycle

    STT life-cycle

    - +

    STT Parameters

    You can set the following parameters about the STT:

      @@ -102,7 +102,7 @@

      The private data is a setting parameter for applying keys provided by the STT engine. Using the stt_set_private_data() function, you can set the private data as the corresponding key of the STT engine.

    - +

    STT Information Retrieval

    You can get the following information about the STT:

      @@ -125,10 +125,10 @@ #include <stt.h> -

    • To use the STT library, create an STT handle.

      +

    • To use the STT library, create an STT handle.

      The STT handle is used in other STT functions as a parameter. After the handle creation, the STT state changes to STT_STATE_CREATED.

      - +
      Note STT is not thread-safe and depends on the ecore main loop. Implement STT within the ecore main loop and do not use it in a thread. @@ -138,11 +138,11 @@ void create_stt_handle() { -    stt_h stt; -    int ret; -    ret = stt_create(&stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + stt_h stt; + int ret; + ret = stt_create(&stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ }

    • When you no longer need the STT library, destroy the STT handle using the stt_destroy() function:

      @@ -152,14 +152,14 @@ create_stt_handle() void destroy_stt_handle(stt_h stt) { -    int ret; -    ret = stt_destroy(stt); /* stt is the STT handle */ -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_destroy(stt); /* stt is the STT handle */ + if (STT_ERROR_NONE != ret) + /* Error handling */ } - +
      Note Do not use the stt_destroy() function in a callback. Within a callback, the stt_destroy() function fails and returns STT_ERROR_OPERATION_FAILED. @@ -182,29 +182,29 @@ destroy_stt_handle(stt_h stt) /* Callback */ void state_changed_cb(stt_h stt, stt_state_e previous, stt_state_e current, -                 void* user_data) + void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_state_changed_cb(stt_h stt) { -    int ret; -    ret = stt_set_state_changed_cb(stt, state_changed_cb, NULL); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_state_changed_cb(stt, state_changed_cb, NULL); + if (STT_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_state_changed_cb(stt_h stt) { -    int ret; -    ret = stt_unset_state_changed_cb(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_unset_state_changed_cb(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ }
      • @@ -214,78 +214,78 @@ unset_state_changed_cb(stt_h stt) /* Callback */ void default_language_changed_cb(stt_h stt, const char* previous_language, -                            const char* current_language, void* user_data) + const char* current_language, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_default_language_changed_cb(stt_h stt) { -    int ret; -    ret = stt_set_default_language_changed_cb(stt, default_language_changed_cb, -                                              NULL); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_default_language_changed_cb(stt, default_language_changed_cb, + NULL); + if (STT_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_default_language_changed_cb(stt_h stt) { -    int ret; -    ret = stt_unset_default_language_changed_cb(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_unset_default_language_changed_cb(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ } -
    • Recognition result +
    • Recognition result

      To get the STT recognition result, set the recognition result callback.

      Within the callback, use the stt_foreach_detailed_result() function to trigger a result time callback that retrieves the time stamp of the current recognition result.

       /* Result time callback */
 bool
 result_time_cb(stt_h stt, int index, stt_result_time_event_e event,
-               const char* text, long start_time,
-               long end_time, void* user_data)
+               const char* text, long start_time,
+               long end_time, void* user_data)
 {
-    /* Your code */
+    /* Your code */
 }
 
 /* Recognition result callback */
 void
 recognition_result_cb(stt_h stt, stt_result_event_e event, const char** data,
-                      int data_count, const char* msg, void* user_data)
+                      int data_count, const char* msg, void* user_data)
 {
-    /* If you want to get time info of result */
-    int ret;
-    ret = stt_foreach_detailed_result(stt, result_time_cb, NULL);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
-    /* Your code */
+    /* If you want to get time info of result */
+    int ret;
+    ret = stt_foreach_detailed_result(stt, result_time_cb, NULL);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
+    /* Your code */
 }
 
 /* Set */
 void
 set_recognition_result_cb(stt_h stt)
 {
-    int ret;
-    ret = stt_set_recognition_result_cb(stt, recognition_result_cb, NULL);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = stt_set_recognition_result_cb(stt, recognition_result_cb, NULL);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 /* Unset */
 void
 unset_recognition_result_cb(stt_h stt)
 {
-    int ret;
-    ret = stt_unset_recognition_result_cb(stt);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = stt_unset_recognition_result_cb(stt);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }
      • @@ -296,30 +296,30 @@ unset_recognition_result_cb(stt_h stt) /* Callback */ void engine_changed_cb(stt_h stt, const char* engine_id, -                  const char* language, bool support_silence, -                  bool need_credential, void* user_data) + const char* language, bool support_silence, + bool need_credential, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_engine_changed_cb(stt_h stt) { -    int ret; -    ret = stt_set_engine_changed_cb(stt, engine_changed_cb, NULL); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_engine_changed_cb(stt, engine_changed_cb, NULL); + if (STT_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_engine_changed_cb(stt_h stt) { -    int ret; -    ret = stt_unset_engine_changed_cb(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_unset_engine_changed_cb(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -331,30 +331,30 @@ unset_engine_changed_cb(stt_h stt) void error_cb(stt_h stt, stt_error_e reason, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_error_cb(stt_h stt) { -    int ret; -    ret = stt_set_error_cb(stt, error_cb, NULL); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_error_cb(stt, error_cb, NULL); + if (STT_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_error_cb(stt_h stt) { -    int ret; -    ret = stt_unset_error_cb(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_unset_error_cb(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ } -
    +

    Getting Information

    @@ -366,48 +366,48 @@ unset_error_cb(stt_h stt) void get_state(stt_h stt) { -    stt_state_e current_state; -    int ret; -    ret = stt_get_state(stt, &current_state); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + stt_state_e current_state; + int ret; + ret = stt_get_state(stt, &current_state); + if (STT_ERROR_NONE != ret) + /* Error handling */ } -
  • Obtain a list of languages supported by the STT using the stt_foreach_supported_languages() function. +
  • Obtain a list of languages supported by the STT using the stt_foreach_supported_languages() function.

    The foreach function triggers a separate callback for each supported language. As long as the callback returns true, the foreach function continues to loop over the supported languages.

     bool
 supported_language_cb(stt_h stt, const char* language, void* user_data)
 {
-    return true; /* To continue to get the next supported language */
+    return true; /* To continue to get the next supported language */
 
-    return false; /* To stop the loop */
+    return false; /* To stop the loop */
 }
 
 void
 get_supported_language(stt_h stt)
 {
-    int ret;
-    ret = stt_foreach_supported_languages(stt, supported_language_cb, NULL);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = stt_foreach_supported_languages(stt, supported_language_cb, NULL);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }
    • -
  • Get the default language using the stt_get_default_language() function. +
  • Get the default language using the stt_get_default_language() function.

    The STT recognition process works for this default language, if you do not set the language as a parameter of the stt_start() function.

     void
 get_default_language(stt_h stt)
 {
-    int ret;
-    char* default_lang = NULL;
-    ret = stt_get_default_language(stt, &default_lang);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    char* default_lang = NULL;
+    ret = stt_get_default_language(stt, &default_lang);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }

    You can get a notification about the default language changes by setting a default language changed callback.

    @@ -418,20 +418,20 @@ get_default_language(stt_h stt) 
     bool
 supported_engine_cb(stt_h stt, const char* engine_id, const char* engine_name,
-                    void* user_data)
+                    void* user_data)
 {
-    return true; /* To continue to get the next supported engine */
+    return true; /* To continue to get the next supported engine */
 
-    return false; /* To stop the loop */
+    return false; /* To stop the loop */
 }
 
 void
 get_supported_engine(stt_h stt)
 {
-    int ret;
-    ret = stt_foreach_supported_engines(stt, supported_engine_cb, NULL);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = stt_foreach_supported_engines(stt, supported_engine_cb, NULL);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }
    • @@ -443,21 +443,21 @@ get_supported_engine(stt_h stt) void get_current_engine(stt_h stt) { -    int ret; -    char* current_engine_id = NULL; -    ret = stt_get_engine(stt, &current_engine_id); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + char* current_engine_id = NULL; + ret = stt_get_engine(stt, &current_engine_id); + if (STT_ERROR_NONE != ret) + /* Error handling */ } /* Set the engine */ void set_current_engine(stt_h stt, const char* engine_id) { -    int ret; -    ret = stt_set_engine(stt, engine_id); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_engine(stt, engine_id); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -468,13 +468,13 @@ set_current_engine(stt_h stt, const char* engine_id) void check_supported_recognition_type(stt_h stt) { -    int ret; -    bool support; -    ret = stt_is_recognition_type_supported(stt, -                                            STT_RECOGNITION_TYPE_FREE_PARTIAL, -                                            &support); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + bool support; + ret = stt_is_recognition_type_supported(stt, + STT_RECOGNITION_TYPE_FREE_PARTIAL, + &support); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -485,25 +485,25 @@ check_supported_recognition_type(stt_h stt) void error_cb(stt_h stt, stt_error_e reason, void *user_data) { -    int ret; -    char * err_msg = NULL; -    ret = stt_get_error_message(stt, &err_msg); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ -    if (NULL != err_msg) { -        /* Memory release */ -        free(err_msg); -        err_msg = NULL; -    } + int ret; + char * err_msg = NULL; + ret = stt_get_error_message(stt, &err_msg); + if (STT_ERROR_NONE != ret) + /* Error handling */ + if (NULL != err_msg) { + /* Memory release */ + free(err_msg); + err_msg = NULL; + } } void get_error_message(stt_h stt) { -    int ret; -    ret = stt_set_error_cb(stt, error_cb, NULL); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_error_cb(stt, error_cb, NULL); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -521,14 +521,14 @@ get_error_message(stt_h stt) void prepare_for_stt(stt_h stt) { -    int ret; -    ret = stt_prepare(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_prepare(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ } - +
    Note If you get the error callback after calling the stt_prepare() function, STT is not available. @@ -541,10 +541,10 @@ prepare_for_stt(stt_h stt) void unprepared_for_stt(stt_h stt) { -    int ret; -    ret = stt_unprepare(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_unprepare(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -560,10 +560,10 @@ unprepared_for_stt(stt_h stt) void set_credential(stt_h stt, const char* credential) { -    int ret; -    ret = stt_set_credential(stt, credential); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_credential(stt, credential); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -580,19 +580,19 @@ set_credential(stt_h stt, const char* credential) void set_private_data(stt_h stt, const char* key, const char* data) { -    int ret; -    ret = stt_set_private_data(stt, key, data); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_private_data(stt, key, data); + if (STT_ERROR_NONE != ret) + /* Error handling */ } void get_private_data(stt_h stt, const char* key, char** data) { -    int ret; -    ret = stt_get_private_data(stt, key, data); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_get_private_data(stt, key, data); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -610,11 +610,11 @@ get_private_data(stt_h stt, const char* key, char** data) void set_silence_detection(stt_h stt, stt_option_silence_detection_e type) { -    int ret; -    /* Default type is STT_OPTION_SILENCE_DETECTION_AUTO */ -    ret = stt_set_silence_detection(stt, type); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + /* Default type is STT_OPTION_SILENCE_DETECTION_AUTO */ + ret = stt_set_silence_detection(stt, type); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -622,7 +622,7 @@ set_silence_detection(stt_h stt, stt_option_silence_detection_e type)
  • Set or unset the start sound.

    To play a sound before the STT recognition starts, call the stt_set_start_sound() function in the STT_STATE_READY state.

    - +
    Note The sound file path must be a full path. Only WAV format sound files are supported. @@ -632,19 +632,19 @@ set_silence_detection(stt_h stt, stt_option_silence_detection_e type) void set_start_sound(stt_h stt, const char* filename) { -    int ret; -    ret = stt_set_start_sound(stt, filename); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_set_start_sound(stt, filename); + if (STT_ERROR_NONE != ret) + /* Error handling */ } void unset_start_sound(stt_h stt) { -    int ret; -    ret = stt_unset_start_sound(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_unset_start_sound(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ }
    • @@ -656,25 +656,25 @@ unset_start_sound(stt_h stt) Note The sound file path must be a full path. Only WAV format sound files are supported.
    - - + + 
     void
 set_stop_sound(stt_h stt, const char* filename)
 {
-    int ret;
-    ret = stt_set_stop_sound(stt, filename);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = stt_set_stop_sound(stt, filename);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 void
 unset_stop_sound(stt_h stt)
 {
-    int ret;
-    ret = stt_unset_stop_sound(stt);
-    if (STT_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = stt_unset_stop_sound(stt);
+    if (STT_ERROR_NONE != ret)
+        /* Error handling */
 }
    @@ -684,7 +684,7 @@ unset_stop_sound(stt_h stt)

  • To start recording, use the stt_start() function.

    The connected STT daemon starts recording, and the state is changed to STT_STATE_RECORDING.

    - +
    Note If the stt_start() function fails, check the error code and take appropriate action. @@ -695,10 +695,10 @@ unset_stop_sound(stt_h stt) void start(stt_h stt, const char* language, const char* type) { -    int ret; -    ret = stt_start(stt, language, type); /* Default language is NULL */ -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_start(stt, language, type); /* Default language is NULL */ + if (STT_ERROR_NONE != ret) + /* Error handling */ }
    • @@ -709,11 +709,11 @@ start(stt_h stt, const char* language, const char* type) void get_volume(stt_h stt) { -    int ret; -    float current_volume; -    ret = stt_get_recording_volume(stt, &current_volume); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + float current_volume; + ret = stt_get_recording_volume(stt, &current_volume); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -724,10 +724,10 @@ get_volume(stt_h stt) void stop(stt_h stt) { -    int ret; -    ret = stt_stop(stt); -    if (STT_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_stop(stt); + if (STT_ERROR_NONE != ret) + /* Error handling */ } @@ -738,17 +738,17 @@ stop(stt_h stt) void cancel(stt_h stt) { -    int ret; -    ret = stt_cancel(stt); -    if (VC_STATIC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = stt_cancel(stt); + if (VC_STATIC_ERROR_NONE != ret) + /* Error handling */ } - +
    diff --git a/org.tizen.guides/html/native/text_input/text_input_cover_n.htm b/org.tizen.guides/html/native/text_input/text_input_cover_n.htm index 607e015..8c20ba1 100644 --- a/org.tizen.guides/html/native/text_input/text_input_cover_n.htm +++ b/org.tizen.guides/html/native/text_input/text_input_cover_n.htm @@ -5,13 +5,13 @@ - + - Text Input and Voice + Text Input and Voice @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • -
    +

    Text Input and Voice

    @@ -53,7 +53,7 @@

    You can allow the user to control the device through voice commands. You can register voice commands, which trigger a callback when the user speaks them. Voice commands registered for EFL-supported UI components can be used to perform component-related actions, such as button clicks.

    - +
    diff --git a/org.tizen.guides/html/native/text_input/tts_n.htm b/org.tizen.guides/html/native/text_input/tts_n.htm index 2ecbf85..3269737 100644 --- a/org.tizen.guides/html/native/text_input/tts_n.htm +++ b/org.tizen.guides/html/native/text_input/tts_n.htm @@ -5,13 +5,13 @@ - + - Text-to-speech + Text-to-speech @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - +

    Dependencies

    -
    +
    -

    Text-to-speech

    +

    Text-to-speech

    The TTS (text-to-speech) features include synthesizing text into sound data as utterances and playing them. It is also possible to pause and stop playing.

    When your application creates a handle and prepares the TTS service by the API, the TTS daemon is invoked and connected for background work. This daemon and your application communicate as the server and the client.

    @@ -95,10 +95,10 @@

    The TTS life-cycle is described in the following figure.

    - -

    Figure: TTS life-cycle

    + +

    Figure: TTS life-cycle

    TTS life-cycle

    - +

    TTS Parameters

    You can set the following parameters about the TTS:

      @@ -147,11 +147,11 @@ void create_tts_handle() { -    tts_h tts; -    int ret; -    ret = tts_create(&tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + tts_h tts; + int ret; + ret = tts_create(&tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -163,10 +163,10 @@ create_tts_handle() void destroy_tts_handle(tts_h tts) { -    int ret; -    ret = tts_destroy(tts); /* tts is the TTS handle */ -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_destroy(tts); /* tts is the TTS handle */ + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -191,29 +191,29 @@ destroy_tts_handle(tts_h tts) /* Callback */ void state_changed_cb(tts_h tts, tts_state_e previous, tts_state_e current, -                 void* user_data) + void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_state_changed_cb(tts_h tts) { -    int ret; -    ret = tts_set_state_changed_cb(tts, state_changed_cb, NULL); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_state_changed_cb(tts, state_changed_cb, NULL); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_state_changed_cb(tts_h tts) { -    int ret; -    ret = tts_unset_state_changed_cb(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_unset_state_changed_cb(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -224,30 +224,30 @@ unset_state_changed_cb(tts_h tts) /* Callback */ void default_voice_changed_cb(tts_h tts, const char* previous_language, -                         int previous_voice_type, const char* current_language, -                         int current_voice_type, void* user_data) + int previous_voice_type, const char* current_language, + int current_voice_type, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_default_voice_changed_cb(tts_h tts) { -    int ret; -    ret = tts_set_default_voice_changed_cb(tts, default_voice_changed_cb, NULL); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_default_voice_changed_cb(tts, default_voice_changed_cb, NULL); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_default_language_changed_cb(tts_h tts) { -    int ret; -    ret = tts_unset_default_voice_changed_cb(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_unset_default_voice_changed_cb(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -257,30 +257,30 @@ unset_default_language_changed_cb(tts_h tts) 
       /* Callback */
 void
-engine_changed_cb(tts_h tts, const char* engine_id, const char* language, 
-                  int voice_type, bool need_credential, void* user_data)
+engine_changed_cb(tts_h tts, const char* engine_id, const char* language,
+                  int voice_type, bool need_credential, void* user_data)
 {
-    /* Your code */
+    /* Your code */
 }
 
 /* Set */
 void
 set_engine_changed_cb(tts_h tts)
 {
-    int ret;
-    ret = tts_set_engine_changed_cb(tts, engine_changed_cb, NULL);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = tts_set_engine_changed_cb(tts, engine_changed_cb, NULL);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 /* Unset */
 void
 unset_engine_changed_cb(tts_h tts)
 {
-    int ret;
-    ret = tts_unset_engine_changed_cb(tts);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = tts_unset_engine_changed_cb(tts);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
      @@ -292,41 +292,41 @@ unset_engine_changed_cb(tts_h tts) void utterance_started_cb(tts_h tts, int utt_id, void* user_data) { -    /* Your code */ + /* Your code */ } /* Completed callback */ void utterance_completed_cb(tts_h tts, int utt_id, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_utterance_cb(tts_h tts) { -    int ret; -    ret = tts_set_utterance_started_cb(tts, utterance_started_cb, NULL); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_utterance_started_cb(tts, utterance_started_cb, NULL); + if (TTS_ERROR_NONE != ret) + /* Error handling */ -    ret = tts_set_utterance_completed_cb(tts, utterance_completed_cb, NULL); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + ret = tts_set_utterance_completed_cb(tts, utterance_completed_cb, NULL); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_utterance_cb(tts_h tts) { -    int ret; -    ret = tts_unset_utterance_started_cb(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ -    ret = tts_unset_utterance_completed_cb(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_unset_utterance_started_cb(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ + ret = tts_unset_utterance_completed_cb(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -338,27 +338,27 @@ unset_utterance_cb(tts_h tts) void error_cb(tts_h tts, int utt_id, tts_error_e reason, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_error_cb(tts_h tts) { -    int ret; -    ret = tts_set_error_cb(tts, error_cb, NULL); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_error_cb(tts, error_cb, NULL); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_error_cb(tts_h tts) { -    int ret; -    ret = tts_unset_error_cb(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_unset_error_cb(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -374,33 +374,33 @@ unset_error_cb(tts_h tts) void get_state(tts_h tts) { -    tts_state_e current_state; -    int ret; -    ret = tts_get_state(tts, &current_state); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + tts_state_e current_state; + int ret; + ret = tts_get_state(tts, &current_state); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } -
    • Obtain a list of voices supported by the TTS using the tts_foreach_supported_voices() function. +
    • Obtain a list of voices supported by the TTS using the tts_foreach_supported_voices() function.

      The foreach function triggers a separate callback for each supported voice. As long as the callback returns true, the foreach function continues to loop over the supported voices.

       bool
 supported_voice_cb(tts_h tts, const char* language, int voice_type, void* user_data)
 {
-    return true; /* To continue to get the next supported language */
+    return true; /* To continue to get the next supported language */
 
-    return false; /* To stop the loop */
+    return false; /* To stop the loop */
 }
 
 void
 get_supported_voice(tts_h tts)
 {
-    int ret;
-    ret = tts_foreach_supported_voices(tts, supported_language_cb, NULL);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = tts_foreach_supported_voices(tts, supported_language_cb, NULL);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
      • @@ -411,12 +411,12 @@ get_supported_voice(tts_h tts) void get_default_voice(tts_h tts) { -    int ret; -    char* default_lang = NULL; -    int default_voice_type; -    ret = tts_get_default_voice(tts, &default_lang, &default_voice_type); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + char* default_lang = NULL; + int default_voice_type; + ret = tts_get_default_voice(tts, &default_lang, &default_voice_type); + if (TTS_ERROR_NONE != ret) + /* Error handling */ }

      You can get a notification about the default voice changes by setting a default voice changed callback.

      @@ -427,25 +427,25 @@ get_default_voice(tts_h tts) void error_cb(tts_h tts, int utt_id, tts_error_e reason, void* user_data) { -    int ret; -    char * err_msg = NULL; -    ret = tts_get_error_message(tts, &err_msg); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ -    if (NULL != err_msg) { -        /* Memory release */ -        free(err_msg); -        err_msg = NULL; -    } + int ret; + char * err_msg = NULL; + ret = tts_get_error_message(tts, &err_msg); + if (TTS_ERROR_NONE != ret) + /* Error handling */ + if (NULL != err_msg) { + /* Memory release */ + free(err_msg); + err_msg = NULL; + } } void get_error_message(tts_h tts) { -    int ret; -    ret = tts_set_error_cb(tts, error_cb, NULL); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_error_cb(tts, error_cb, NULL); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -453,36 +453,36 @@ get_error_message(tts_h tts)

      Getting and Setting the Mode

      -

      There are 3 different TTS modes available. The main difference is audio mixing with other sources. The default mode is TTS_MODE_DEFAULT, used for normal applications such as eBooks. If you set this mode and play your text, it can be interrupted when other sounds, such as ringtone or other TTS sounds, are played.

      +

      There are 3 different TTS modes available. The main difference is audio mixing with other sources. The default mode is TTS_MODE_DEFAULT, used for normal applications such as eBooks. If you set this mode and play your text, it can be interrupted when other sounds, such as ringtone or other TTS sounds, are played.

      + -
      Note The TTS_MODE_NOTIFICATION and TTS_MODE_SCREEN_READER modes are mixed with other sound sources, but they are used only for platform-specific features. Do not use them for normal applications.
      - +

      Get and set the mode in the TTS_STATE_CREATED state:

      - + 
       void
 set_mode(tts_h tts)
 {
-    int ret;
-    tts_mode_e mode = TTS_MODE_DEFAULT;
-    ret = tts_set_mode(tts, mode);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    tts_mode_e mode = TTS_MODE_DEFAULT;
+    ret = tts_set_mode(tts, mode);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 void
 get_mode(tts_h tts)
 {
-    int ret;
-    tts_mode_e mode;
-    ret = tts_get_mode(tts, &mode);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    tts_mode_e mode;
+    ret = tts_get_mode(tts, &mode);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
      @@ -498,14 +498,14 @@ get_mode(tts_h tts) void prepare_for_tts(tts_h tts) { -    int ret; -    ret = tts_prepare(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_prepare(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } - +
      Note If you get the error callback after calling the tts_prepare() function, TTS is not available. @@ -513,15 +513,15 @@ prepare_for_tts(tts_h tts)

    • When the connection is no longer needed, use the tts_unprepare() function to disconnect the TTS and change the state to TTS_STATE_CREATED:

      - + 
       void
 unprepared_for_tts(tts_h tts)
 {
-    int ret;
-    ret = tts_unprepare(tts);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = tts_unprepare(tts);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
      • @@ -537,10 +537,10 @@ unprepared_for_tts(tts_h tts) void set_credential(tts_h tts, const char* credential) { -    int ret; -    ret = tts_set_credential(tts, credential); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_credential(tts, credential); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -557,19 +557,19 @@ set_credential(tts_h tts, const char* credential) void set_private_data(tts_h tts, const char* key, const char* data) { -    int ret; -    ret = tts_set_private_data(tts, key, data); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_set_private_data(tts, key, data); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } void get_private_data(tts_h tts, const char* key, char** data) { -    int ret; -    ret = tts_get_private_data(tts, key, data); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_get_private_data(tts, key, data); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -583,7 +583,7 @@ get_private_data(tts_h tts, const char* key, char** data)

    • You can request the TTS library to read your own text using the tts_add_text() function. The TTS library manages added text using queues, so it is possible to add several texts simultaneously. Each obtained text receives an utterance ID, which is used for synthesizing and playing the sound data.

      - +
      Note If the added text is too long, some engines need a long time for synthesis. It is recommended to only use proper length text clips. @@ -596,16 +596,16 @@ get_private_data(tts_h tts, const char* key, char** data) void add_text(tts_h tts) { -    const char* text = "tutorial"; /* Text for read */ -    const char* language = "en_US"; /* Language */ -    int voice_type = TTS_VOICE_TYPE_FEMALE; /* Voice type */ -    int speed = TTS_SPEED_AUTO; /* Read speed */ -    int utt_id; /* Utterance ID for the requested text */ + const char* text = "tutorial"; /* Text for read */ + const char* language = "en_US"; /* Language */ + int voice_type = TTS_VOICE_TYPE_FEMALE; /* Voice type */ + int speed = TTS_SPEED_AUTO; /* Read speed */ + int utt_id; /* Utterance ID for the requested text */ -    int ret; -    ret = tts_add_text(tts, text, language, voice_type, speed, &utt_id); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_add_text(tts, text, language, voice_type, speed, &utt_id); + if (TTS_ERROR_NONE != ret) + /* Error handling */ }
      • @@ -617,11 +617,11 @@ add_text(tts_h tts) void get_maximum_text_size(tts_h tts) { -    int ret; -    int size; -    ret = tts_get_max_text_size(tts, &size); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + int size; + ret = tts_get_max_text_size(tts, &size); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -636,21 +636,21 @@ get_maximum_text_size(tts_h tts)

      If there is no text in the queue, the TTS waits for text to be added in the TTS_STATE_PLAYING state. In that case, when you add text, the TTS starts synthesizing and playing it immediately. The TTS state need not change to TTS_STATE_READY state before using the tts_stop() function.

      - +
      Note If you get the TTS state changed callback in the TTS_STATE_PLAYING state without a TTS function call, prepare the TTS state. The TTS state can change if other applications request TTS play, the audio session requests TTS pause, or the TTS engine changes. -
      + 
       void
 start(tts_h tts)
 {
-    int ret;
-    ret = tts_play(tts);
-    if (TTS_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = tts_play(tts);
+    if (TTS_ERROR_NONE != ret)
+        /* Error handling */
 }
      @@ -661,10 +661,10 @@ start(tts_h tts) void pause(tts_h tts) { -    int ret; -    ret = tts_pause(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_pause(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ } @@ -675,13 +675,13 @@ pause(tts_h tts) void stop(tts_h tts) { -    int ret; -    ret = tts_stop(tts); -    if (TTS_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = tts_stop(tts); + if (TTS_ERROR_NONE != ret) + /* Error handling */ }
    - +
    diff --git a/org.tizen.guides/html/native/text_input/voice_control_n.htm b/org.tizen.guides/html/native/text_input/voice_control_n.htm index 8a79520..185bf11 100644 --- a/org.tizen.guides/html/native/text_input/voice_control_n.htm +++ b/org.tizen.guides/html/native/text_input/voice_control_n.htm @@ -40,7 +40,7 @@
  • Managing Commands and Hints
    • - +

    Related Info

    +

    To use the voice control:

    1. Set up the voice control and register callback functions.

      The initialization allows the voice control to distinguish your application from any other applications also using voice control. The registered callbacks allow you to receive notifications about changes in the service state, language, and recognition result, and about any errors.

      2. @@ -97,35 +97,35 @@

      You must disconnect the voice control service and deinitialize the voice control using the vc_unprepare() and vc_deinitialize() functions.

    The following figure illustrates the voice control life-cycle states.

    - +

    Figure: Voice control (left) and Voice control service (right) life-cycle states

    -

    Voice control and Voice control service life-cycle states

    - +

    Voice control and Voice control service life-cycle states

    +

    Voice Control with Elementary Components

    You can register voice commands for EFL-supported UI components to allow the user to interact with visible UI components inside the application using their voice. The Voice control elementary library recognizes spoken commands from registered UI components.

    - +

    The following figure illustrates the application screen when the Voice control elementary features are enabled. When the screen is updated, any UI components that have a registered command and hint are shown with a tooltip (hint). When the user speaks the hint, the callback function of the action related to the UI component is executed.

    Figure: Voice command hints on the screen

    -

    Voice command hints on the screen

    - +

    Voice command hints on the screen

    +

    You have no need to consider how to recognize voice commands or start and stop the recognition process. A preloaded voice application handles the process automatically. You just need to set the command and hint on every EFL elementary component on which you want to use the voice command.

    -

    When the user speaks a command corresponding to a visible EFL elementary component on the screen, the recognized command is sent to the Voice control elementary library from the Voice control service, and the action mapped to the component is executed. For example, if the component is a button, the action can be a button click.

    - - +

    When the user speaks a command corresponding to a visible EFL elementary component on the screen, the recognized command is sent to the Voice control elementary library from the Voice control service, and the action mapped to the component is executed. For example, if the component is a button, the action can be a button click.

    + +

    Figure: Voice command process

    -

    Voice command process

    - +

    Voice command process

    +
    Note The detailed implementation of the preloaded voice application (how to trigger and recognize the user speaking) can differ according to the device (mobile, wearable, or TV).
    - - -

    The main features of the Voice control elementary API include:

    - +

    You can set and unset a callback to get notifications when the system or application language changes.

    -

    The following table lists the EFL UI components that support voice commands, and the actions supported by each component and already defined in the configuration file. Note that the label component only supports the hint without any action command.

    +

    The following table lists the EFL UI components that support voice commands, and the actions supported by each component and already defined in the configuration file. Note that the label component only supports the hint without any action command.

    Table: UI components and their actions

    @@ -163,7 +163,7 @@ - + @@ -171,7 +171,7 @@ - + @@ -179,7 +179,7 @@ - + @@ -187,7 +187,7 @@ - + @@ -195,7 +195,7 @@ - + @@ -203,7 +203,7 @@ - + @@ -211,7 +211,7 @@ - + @@ -219,7 +219,7 @@ - + @@ -227,7 +227,7 @@ - + @@ -235,7 +235,7 @@ - + @@ -243,12 +243,12 @@ - - -
    No No NoNoNo
    CheckNo No NoNoNo
    CtxpopupNo No NoNoNo
    EntryNo No NoNoNo
    GengridYes Yes YesYesYes
    GenlistYes Yes NoNoNo
    LabelNo No NoNoNo
    RadioNo No NoNoNo
    SliderYes Yes YesYesYes
    SpinnerYes Yes YesYesYes
    ToolbarYes Yes YesYes
    - - - + Yes + + + + +

    To use the voice commands:

    1. Initialize the Voice control elementary library and create a handle. @@ -262,7 +262,7 @@
      Note Set the commands and hints on visible EFL elementary UI components only. When the visible components on the screen change, the commands and hints must also change. -
      +

      Prerequisites

      @@ -280,15 +280,15 @@ void initialize_voice_control() { -    int ret; -    ret = vc_initialize(); -    if (VC_ERROR_NONE != result) -        /* Error handling */ + int ret; + ret = vc_initialize(); + if (VC_ERROR_NONE != result) + /* Error handling */ }

      If the function call is successful, the voice control state changes to VC_STATE_INITIALIZED.

      - +
      Note The voice control feature is not thread-safe and depends on the ecore main loop. Implement voice control within the ecore main loop and do not use it in a thread. @@ -302,37 +302,37 @@ initialize_voice_control() void prepare_vc() { -    int ret; -    ret = vc_prepare(); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_prepare(); + if (VC_ERROR_NONE != ret) + /* Error handling */ } -

      The vc_prepare() function is asynchronous, and when the preparation succeeds, the voice control state changes from VC_STATE_INITIALIZED to VC_STATE_READY. If the vc_prepare() function fails, the error callback is triggered.

      +

      The vc_prepare() function is asynchronous, and when the preparation succeeds, the voice control state changes from VC_STATE_INITIALIZED to VC_STATE_READY. If the vc_prepare() function fails, the error callback is triggered.

    2. When the voice control is no longer needed, unprepare and deinitialize it: 
       void
 unprepared_vc()
 {
-    int ret;
-    ret = vc_unprepare();
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = vc_unprepare();
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 void
 deinitialize_voice_control()
 {
-    int ret;
-    ret = vc_deinitialize();
-    if (VC_ERROR_NONE != result)
-        /* Error handling */
+    int ret;
+    ret = vc_deinitialize();
+    if (VC_ERROR_NONE != result)
+        /* Error handling */
 }
      -

      When the vc_unprepare() function succeeds, the voice control state changes from VC_STATE_READY to VC_STATE_INITIALIZED.

      - +

      When the vc_unprepare() function succeeds, the voice control state changes from VC_STATE_READY to VC_STATE_INITIALIZED.

      +
      Note Do not call the vc_deinitialize() function in a callback. Within a callback, the vc_deinitialize() function fails and returns VC_ERROR_OPERATION_FAILED. @@ -348,33 +348,33 @@ deinitialize_voice_control() void initialize_voice_control_elm() { -    int ret; -    ret = vc_elm_initialize(); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_initialize(); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
      3. -
    3. Create a handle for each UI component for which you want to set a command and hint. +
    4. Create a handle for each UI component for which you want to set a command and hint.

      Use the vc_elm_create_object() function to create a handle for Evas_Object instances, and the vc_elm_create_item() function for Elm_Object_Item instances.

       void
 create_vc_elm_handler()
 {
-    int ret;
-    vc_elm_h handler_object;
-    vc_elm_h handler_item;
-
-    /* Creating Evas_Object button */
-    Evas_Object *button = elm_button_add(win);
-    ret = vc_elm_create_object(button, &handler_object);
-    if (VC_ELM_ERROR_NONE != ret)
-        /* Error handling */
-    /* Creating Elm_Object_Item list */
-    Elm_Object_Item *item = elm_list_item_append(...);
-    ret = vc_elm_create_item(item, &handler_item);
-    if (VC_ELM_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    vc_elm_h handler_object;
+    vc_elm_h handler_item;
+
+    /* Creating Evas_Object button */
+    Evas_Object *button = elm_button_add(win);
+    ret = vc_elm_create_object(button, &handler_object);
+    if (VC_ELM_ERROR_NONE != ret)
+        /* Error handling */
+    /* Creating Elm_Object_Item list */
+    Elm_Object_Item *item = elm_list_item_append(...);
+    ret = vc_elm_create_item(item, &handler_item);
+    if (VC_ELM_ERROR_NONE != ret)
+        /* Error handling */
 }
      5. @@ -383,28 +383,28 @@ create_vc_elm_handler() void destroy_vc_elm_handler(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_destroy(handler); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_destroy(handler); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } void deinitialize_voice_control_elm() { -    int ret; -    ret = vc_elm_deinitialize(); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_deinitialize(); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } - +

    Managing Callbacks

    The callback functions are defined in the voice_control_common.h header file, where you can find more information about them.

    - +

    To set and unset callbacks to get notifications about recognition results, state changes, and errors:

    - +
    Note Set and unset all callbacks when the voice control state is VC_STATE_INITIALIZED. @@ -417,27 +417,27 @@ deinitialize_voice_control_elm() void state_changed_cb(vc_state_e previous, vc_state_e current, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_state_changed_cb() { -    int ret; -    ret = vc_set_state_changed_cb(state_changed_cb, NULL); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_set_state_changed_cb(state_changed_cb, NULL); + if (VC_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_state_changed_cb() { -    int ret; -    ret = vc_unset_state_changed_cb(); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_unset_state_changed_cb(); + if (VC_ERROR_NONE != ret) + /* Error handling */ } @@ -446,29 +446,29 @@ unset_state_changed_cb() /* Callback */ void __service_state_changed_cb(vc_service_state_e previous, vc_service_state_e current, -                           void* user_data) + void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_service_state_changed_cb() { -    int ret; -    ret = vc_set_service_state_changed_cb(__service_state_changed_cb, NULL); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_set_service_state_changed_cb(__service_state_changed_cb, NULL); + if (VC_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_service_state_changed_cb() { -    int ret; -    ret = vc_unset_service_state_changed_cb(); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_unset_service_state_changed_cb(); + if (VC_ERROR_NONE != ret) + /* Error handling */ } @@ -478,92 +478,92 @@ unset_service_state_changed_cb() void __current_language_changed_cb(const char* previous, const char* current, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_current_language_changed_cb() { -    int ret; -    ret = vc_set_current_language_changed_cb(__current_language_changed_cb, NULL); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_set_current_language_changed_cb(__current_language_changed_cb, NULL); + if (VC_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_current_language_changed_cb() { -    int ret; -    ret = vc_unset_current_language_changed_cb(); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_unset_current_language_changed_cb(); + if (VC_ERROR_NONE != ret) + /* Error handling */ }
  • Set the recognition result callback to be invoked when a voice command is recognized. - +
    Note If the recognition result produces a reject event, the Voice control service has rejected the recognized command. Make sure that the command does not conflict with other commands and there are not duplicated commands.
    - -

    To get the command, use the Voice control APIs with the vc_cmd_list parameter, which is a list of recognized commands. The result parameter contains the recognized text.

    + +

    To get the command, use the Voice control APIs with the vc_cmd_list parameter, which is a list of recognized commands. The result parameter contains the recognized text.

     /* Callback */
 void
 __result_cb(vc_result_event_e event, vc_cmd_list_h vc_cmd_list, const char* result,
-            void* user_data)
+            void* user_data)
 {
-    int ret = -1;
-    int count = 0;
-    ret = vc_cmd_list_get_count(vc_cmd_list, &count);
-    if (VC_ERROR_NONE != ret) {
-        /* No result */
-
-        return;
-    }
-
-    vc_cmd_list_first(vc_cmd_list);
-
-    int i = 0;
-    int type = 0;
-    char* cmd = NULL;
-    vc_cmd_h result_command = NULL;
-    for (i = 0; i < count; i++) {
-        result_command = NULL;
-        ret = vc_cmd_list_get_current(vc_cmd_list, &result_command);
-        if (0 == ret && NULL != result_command) {
-            cmd = NULL;
-            type = 0;
-            vc_cmd_get_command(result_command, &cmd);
-            vc_cmd_get_type(result_command, &type);
-            /* Check command and type */
-        }
-    }
-
-    return;
+    int ret = -1;
+    int count = 0;
+    ret = vc_cmd_list_get_count(vc_cmd_list, &count);
+    if (VC_ERROR_NONE != ret) {
+        /* No result */
+
+        return;
+    }
+
+    vc_cmd_list_first(vc_cmd_list);
+
+    int i = 0;
+    int type = 0;
+    char* cmd = NULL;
+    vc_cmd_h result_command = NULL;
+    for (i = 0; i < count; i++) {
+        result_command = NULL;
+        ret = vc_cmd_list_get_current(vc_cmd_list, &result_command);
+        if (0 == ret && NULL != result_command) {
+            cmd = NULL;
+            type = 0;
+            vc_cmd_get_command(result_command, &cmd);
+            vc_cmd_get_type(result_command, &type);
+            /* Check command and type */
+        }
+    }
+
+    return;
 }
 
 /* Set */
 void
 set_result_cb()
 {
-    int ret;
-    ret = vc_set_result_cb(__result_cb, NULL);
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = vc_set_result_cb(__result_cb, NULL);
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 /* Unset */
 void
 unset_result_cb()
 {
-    int ret;
-    ret = vc_unset_result_cb();
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = vc_unset_result_cb();
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
 }
  • Set the error callback to be invoked when an error occurs in the voice control process: @@ -572,33 +572,33 @@ unset_result_cb() void __error_cb(vc_error_e reason, void* user_data) { -    /* Your code */ + /* Your code */ } /* Set */ void set_error_cb(vc_h vc) { -    int ret; -    ret = vc_set_error_cb(__error_cb, NULL); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_set_error_cb(__error_cb, NULL); + if (VC_ERROR_NONE != ret) + /* Error handling */ } /* Unset */ void unset_error_cb(vc_h vc) { -    int ret; -    ret = vc_unset_error_cb(); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_unset_error_cb(); + if (VC_ERROR_NONE != ret) + /* Error handling */ }
    • - - + +

    Retrieving Voice Control Information

    - +

    To get information about the current states, and current and supported languages:

      @@ -609,11 +609,11 @@ unset_error_cb(vc_h vc) void get_state() { -    vc_state_e current_state; -    int ret; -    ret = vc_get_state(&current_state); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + vc_state_e current_state; + int ret; + ret = vc_get_state(&current_state); + if (VC_ERROR_NONE != ret) + /* Error handling */ }
    • @@ -628,11 +628,11 @@ get_state() void get_state(vc_h vc) { -    vc_service_state_e service_state; -    int ret; -    ret = vc_get_service_state(&service_state); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + vc_service_state_e service_state; + int ret; + ret = vc_get_service_state(&service_state); + if (VC_ERROR_NONE != ret) + /* Error handling */ }
    • Get the supported languages with a foreach function that triggers a separate callback for each language. @@ -641,37 +641,37 @@ get_state(vc_h vc) bool supported_language_cb(const char* language, void* user_data) { -    return true; /* To continue to get the next language */ + return true; /* To continue to get the next language */ -    return false; /* To stop the loop */ + return false; /* To stop the loop */ } void get_supported_language() { -    int ret; -    ret = vc_foreach_supported_languages(supported_language_cb, NULL); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_foreach_supported_languages(supported_language_cb, NULL); + if (VC_ERROR_NONE != ret) + /* Error handling */ }
      • -
    • Get the current language with the vc_get_current_language() function. The voice control recognition works for the current (default) language. Use the language change callback to be notified of language changes. +
    • Get the current language with the vc_get_current_language() function. The voice control recognition works for the current (default) language. Use the language change callback to be notified of language changes. 
       void
 get_current_language()
 {
-    int ret;
-    char* current_lang = NULL;
-    ret = vc_get_current_language(&current_lang);
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    char* current_lang = NULL;
+    ret = vc_get_current_language(&current_lang);
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
 }
    - +

    Managing Commands

    - +

    To create a command list and commands:

      @@ -683,11 +683,11 @@ get_current_language() void create_command_list() { -    int ret; -    vc_cmd_list_h vc_cmd_list; -    ret = vc_cmd_list_create(&vc_cmd_list); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + vc_cmd_list_h vc_cmd_list; + ret = vc_cmd_list_create(&vc_cmd_list); + if (VC_ERROR_NONE != ret) + /* Error handling */ } @@ -697,44 +697,44 @@ create_command_list() void create_command() { -    int ret; -    vc_cmd_h vc_cmd = NULL; -    ret = vc_cmd_create(&vc_cmd); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ - -    ret = vc_cmd_set_command(vc_cmd, "open"); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ -    ret = vc_cmd_set_type(vc_cmd, VC_COMMAND_TYPE_FOREGROUND); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + vc_cmd_h vc_cmd = NULL; + ret = vc_cmd_create(&vc_cmd); + if (VC_ERROR_NONE != ret) + /* Error handling */ + + ret = vc_cmd_set_command(vc_cmd, "open"); + if (VC_ERROR_NONE != ret) + /* Error handling */ + ret = vc_cmd_set_type(vc_cmd, VC_COMMAND_TYPE_FOREGROUND); + if (VC_ERROR_NONE != ret) + /* Error handling */ } -
    1. Add the command to the command list. +
    2. Add the command to the command list.

      If necessary, you can also remove commands from the command list. After you remove a command, if you no longer use it, destroy the command handle with the vc_cmd_destroy() function.

       void
 add_command(vc_cmd_list_h vc_cmd_list, vc_cmd_h vc_cmd)
 {
-    int ret;
-    ret = vc_cmd_list_add(vc_cmd_list, vc_cmd);
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = vc_cmd_list_add(vc_cmd_list, vc_cmd);
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
 }
 
 void
 remove_command(vc_cmd_list_h vc_cmd_list, vc_cmd_h vc_cmd)
 {
-    int ret;
-    ret = vc_cmd_list_remove(vc_cmd_list, vc_cmd);
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
-    /* Destroy the command if no longer needed */
-    ret = vc_cmd_destroy(vc_cmd);
-    if (VC_ERROR_NONE != ret)
-        /* Error handling */
+    int ret;
+    ret = vc_cmd_list_remove(vc_cmd_list, vc_cmd);
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
+    /* Destroy the command if no longer needed */
+    ret = vc_cmd_destroy(vc_cmd);
+    if (VC_ERROR_NONE != ret)
+        /* Error handling */
 }
      @@ -745,25 +745,25 @@ remove_command(vc_cmd_list_h vc_cmd_list, vc_cmd_h vc_cmd) bool __vc_get_command_cb(vc_cmd_h vc_command, void* user_data) { -    /* Your code */ + /* Your code */ -    return true; + return true; } void foreach_command(vc_cmd_list_h vc_cmd_list) { -    int ret; -    vc_cmd_h vc_cmd; -    ret = vc_cmd_list_foreach_commands(vc_cmd_list, __vc_get_command_cb, NULL); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + vc_cmd_h vc_cmd; + ret = vc_cmd_list_foreach_commands(vc_cmd_list, __vc_get_command_cb, NULL); + if (VC_ERROR_NONE != ret) + /* Error handling */ }
    3. You can use the vc_cmd_list_get_current() function to get the current command in an output parameter. - +
      Note When you get the command handle with the vc_cmd_list_get_current() function, do not release it. To release the command handle, call the vc_cmd_list_remove() function before the vc_cmd_destroy() function. @@ -772,46 +772,46 @@ foreach_command(vc_cmd_list_h vc_cmd_list) void get_commands(vc_cmd_list_h vc_cmd_list) { -    int i; -    int ret; -    int count; -    vc_cmd_h vc_cmd; -    char* command = NULL; -    int type = 0; - -    ret = vc_cmd_list_get_count(vc_cmd_list, &count); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ - -    if (0 >= count) { -        /* Error handling */ - -        return; -    } - -    ret = vc_cmd_list_first(vc_cmd_list); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ - -    do { -        ret = vc_cmd_list_get_current(vc_cmd_list, &vc_cmd); -        if (VC_ERROR_NONE == ret) { -            ret = vc_cmd_get_command(vc_cmd, &command); -            if (VC_ERROR_NONE != ret) -                /* Error handling */ -            if (NULL != command) { -                /* Command must be released */ -                free(command); -            } - -            ret = vc_cmd_get_type(vc_cmd, &type); -            if (VC_ERROR_NONE != ret) -                /* Error handling */ -            /* Do not release the command handle */ -        } - -        ret = vc_cmd_list_next(vc_cmd_list); -    } while (VC_ERROR_ITERATION_END != ret); + int i; + int ret; + int count; + vc_cmd_h vc_cmd; + char* command = NULL; + int type = 0; + + ret = vc_cmd_list_get_count(vc_cmd_list, &count); + if (VC_ERROR_NONE != ret) + /* Error handling */ + + if (0 >= count) { + /* Error handling */ + + return; + } + + ret = vc_cmd_list_first(vc_cmd_list); + if (VC_ERROR_NONE != ret) + /* Error handling */ + + do { + ret = vc_cmd_list_get_current(vc_cmd_list, &vc_cmd); + if (VC_ERROR_NONE == ret) { + ret = vc_cmd_get_command(vc_cmd, &command); + if (VC_ERROR_NONE != ret) + /* Error handling */ + if (NULL != command) { + /* Command must be released */ + free(command); + } + + ret = vc_cmd_get_type(vc_cmd, &type); + if (VC_ERROR_NONE != ret) + /* Error handling */ + /* Do not release the command handle */ + } + + ret = vc_cmd_list_next(vc_cmd_list); + } while (VC_ERROR_ITERATION_END != ret); }
      4. @@ -823,10 +823,10 @@ get_commands(vc_cmd_list_h vc_cmd_list) void set_command(vc_cmd_list_h vc_cmd_list, int type) { -    int ret; -    ret = vc_set_command_list(vc_cmd_list, type); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_set_command_list(vc_cmd_list, type); + if (VC_ERROR_NONE != ret) + /* Error handling */ } @@ -837,37 +837,37 @@ set_command(vc_cmd_list_h vc_cmd_list, int type) void unset_command(int type) { -    int ret; -    ret = vc_unset_command_list(type); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_unset_command_list(type); + if (VC_ERROR_NONE != ret) + /* Error handling */ } /* Destroy the command handle */ void destroy_command(vc_cmd_h vc_cmd) { -    int ret; -    ret = vc_cmd_destroy(vc_cmd); -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_cmd_destroy(vc_cmd); + if (VC_ERROR_NONE != ret) + /* Error handling */ } /* Destroy the command list handle */ void destroy_command_list(vc_cmd_list_h vc_cmd_list) { -    int ret; -    ret = vc_cmd_list_destroy(vc_cmd_list, true); /* true destroys all commands */ -    if (VC_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_cmd_list_destroy(vc_cmd_list, true); /* true destroys all commands */ + if (VC_ERROR_NONE != ret) + /* Error handling */ }

    Monitoring Language Changes

    - +

    To monitor when the system or application language changes:

      @@ -877,10 +877,10 @@ destroy_command_list(vc_cmd_list_h vc_cmd_list) void set_language_changed_cb() { -    int ret; -    ret = vc_elm_set_current_language_changed_cb(language_changed_cb, NULL); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_set_current_language_changed_cb(language_changed_cb, NULL); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } @@ -889,13 +889,13 @@ set_language_changed_cb() void language_changed_cb(const char *previous, const char *current, void* user_data) { -    if ("en_US" == current) { -        vc_elm_set_command(handler, "button"); -        vc_elm_set_command_hint(handler, "button"); -    } else if ("ko_KR" = current) { -        vc_elm_set_command(handler, "버튼"); -        vc_elm_set_command_hint(handler, "버튼"); -    } + if ("en_US" == current) { + vc_elm_set_command(handler, "button"); + vc_elm_set_command_hint(handler, "button"); + } else if ("ko_KR" = current) { + vc_elm_set_command(handler, "버튼"); + vc_elm_set_command_hint(handler, "버튼"); + } } @@ -904,16 +904,16 @@ language_changed_cb(const char *previous, const char *current, void* user_data) void unset_state_changed_cb() { -    int ret; -    ret = vc_elm_unset_current_language_changed_cb(); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_unset_current_language_changed_cb(); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
    - - + +

    Retrieving Voice Control Information

    - +

    To get information about supported languages, widgets, and actions:

      @@ -923,11 +923,11 @@ unset_state_changed_cb() void get_language() { -    char *current_language; -    int ret; -    ret = vc_elm_get_current_language(&current_language); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + char *current_language; + int ret; + ret = vc_elm_get_current_language(&current_language); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
    • Get the languages supported by the Voice control elementary library with a foreach function that triggers a separate callback for each language. @@ -936,18 +936,18 @@ get_language() bool supported_language_cb(const char *language, void* user_data) { -    return true; /* To continue to get the next language */ + return true; /* To continue to get the next language */ -    return false; /* To stop the loop */ + return false; /* To stop the loop */ } void set_default_language_changed_cb() { -    int ret; -    ret = vc_elm_foreach_supported_languages(supported_language_cb, NULL); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_foreach_supported_languages(supported_language_cb, NULL); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
    • Get the UI components supported by the Voice control elementary library with a foreach function that triggers a separate callback for each UI component. @@ -956,18 +956,18 @@ set_default_language_changed_cb() void widget_cb(const char *widget, void *user_data) { -    return true; /* To continue to get the next UI component */ + return true; /* To continue to get the next UI component */ -    return false; /* To stop the loop */ + return false; /* To stop the loop */ } void set_supported_widget_cb() { -    int ret; -    ret = vc_elm_foreach_supported_widgets(widget_cb, NULL); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_foreach_supported_widgets(widget_cb, NULL); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
    • Get the actions supported by the Voice control elementary library for specific UI components with a foreach function that triggers a separate callback for each action. @@ -977,30 +977,30 @@ set_supported_widget_cb() void action_cb(const char *action, void *user_data) { -    char *command_param; -    vc_elm_get_action_command(action, &command_param); + char *command_param; + vc_elm_get_action_command(action, &command_param); -    return true; /* To continue to get the next action */ + return true; /* To continue to get the next action */ -    return false; /* To stop the loop */ + return false; /* To stop the loop */ } void set_supported_action_cb() { -    int ret; -    /* -     Elm_Button is an example, it can be obtained -     using vc_elm_foreach_supported_widgets callback -    */ -    ret = vc_elm_foreach_supported_actions("Elm_Button", action_cb, NULL); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + /* + Elm_Button is an example, it can be obtained + using vc_elm_foreach_supported_widgets callback + */ + ret = vc_elm_foreach_supported_actions("Elm_Button", action_cb, NULL); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
    - +

    Managing Commands and Hints

    - +

    To set and unset commands and hints, and define the hint direction and offset:

      @@ -1010,10 +1010,10 @@ set_supported_action_cb() void set_command(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_set_command(handler, "Command"); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_set_command(handler, "Command"); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } @@ -1023,10 +1023,10 @@ set_command(vc_elm_h &handler) void set_command_hint(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_set_command_hint(handler, "Hint"); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_set_command_hint(handler, "Hint"); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } @@ -1036,19 +1036,19 @@ set_command_hint(vc_elm_h &handler) void set_hint_direction(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_set_command_hint_direction(handler, VC_ELM_DIRECTION_RIGHT); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_set_command_hint_direction(handler, VC_ELM_DIRECTION_RIGHT); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } void set_hint_offset(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_set_command_hint_offset(handler, 100, 100); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_set_command_hint_offset(handler, 100, 100); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } @@ -1057,22 +1057,22 @@ set_hint_offset(vc_elm_h &handler) void get_hint_direction(vc_elm_h &handler) { -    int ret; -    vc_elm_direction_e direction; -    ret = vc_elm_get_command_hint_direction(handler, &direction); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + vc_elm_direction_e direction; + ret = vc_elm_get_command_hint_direction(handler, &direction); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } void get_hint_offset(vc_elm_h &handler) { -    int ret; -    int x; -    int y; -    ret = vc_elm_get_command_hint_offset(handler, &x, &y); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + int x; + int y; + ret = vc_elm_get_command_hint_offset(handler, &x, &y); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } @@ -1082,19 +1082,19 @@ get_hint_offset(vc_elm_h &handler) void unset_command(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_unset_command(handler); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_unset_command(handler); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ } void unset_command_hint(vc_elm_h &handler) { -    int ret; -    ret = vc_elm_unset_command_hint(handler); -    if (VC_ELM_ERROR_NONE != ret) -        /* Error handling */ + int ret; + ret = vc_elm_unset_command_hint(handler); + if (VC_ELM_ERROR_NONE != ret) + /* Error handling */ }
    @@ -1105,9 +1105,9 @@ unset_command_hint(vc_elm_h &handler) Go to top - + - Actors + Actors @@ -38,10 +38,10 @@
  • Dali::Actor API for Mobile Native
  • Dali::Stage API for Mobile Native
  • Dali::Actor API for Wearable Native
    • -
  • Dali::Stage API for Wearable Native
    • +
  • Dali::Stage API for Wearable Native
    • - +

    Actors

    @@ -53,7 +53,7 @@

    Actor Types

    -

    Figure: Actor types

    +

    Figure: Actor types

    Actor types

    Actor has the following concrete types:

    @@ -80,16 +80,16 @@ Actor actor = Actor::New(); Stage::GetCurrent().Add( actor ); - +

    Positioning Actors

    -

    An actor inherits its parent's position. The relative position between the actor & parent is determined by the following properties:

    +

    An actor inherits its parent's position. The relative position between the actor & parent is determined by the following properties:

    • Parent origin -

      This Vector3 property defines a point within the parent actor's area.

      +

      This Vector3 property defines a point within the parent actor's area.

      + +

      Figure: Parent origin

      +

      Parent origin

      -

      Figure: Parent origin

      -

      Parent origin

      -

      The default is top-left (Dali::ParentOrigin::TOP_LEFT), which can be visualized in 2D as (0, 0), but is actually Vector3 (0, 0, 0.5) in the 3D DALi world. The actor position is relative to this point.

      For more information, see the Dali::Actor::SetParentOrigin() function.

      • @@ -98,9 +98,9 @@ Stage::GetCurrent().Add( actor );

      This Vector3 property defines a point within the child actor area.

      -

      Figure: Anchor point

      -

      Anchor point

      - +

      Figure: Anchor point

      +

      Anchor point

      +

      The default is center (Dali::AnchorPoint::CENTER), which can be visualized in 2D as (0.5, 0.5), but is actually Vector3 (0.5, 0.5, 0.5) in the 3D DALi world. The actor position is also relative to this point.

      For more information, see the Dali::Actor::SetAnchorPoint() function.

      @@ -109,10 +109,10 @@ Stage::GetCurrent().Add( actor );
    • Position

      This is the position vector between the parent origin and anchor point.

      -

      Figure: Position

      -

      Position

      - -

      Therefore by default, an actor's position indicates the vector to its center from the top-left corner of its parent.

      +

      Figure: Position

      +

      Position

      + +

      Therefore by default, an actor's position indicates the vector to its center from the top-left corner of its parent.

      For example (with the default camera):

        @@ -121,10 +121,10 @@ Stage::GetCurrent().Add( actor );

      For more information, see the Dali::Actor::SetPosition() function.

      • -
    +

    Event Handling for Actors

    -

    The Dali::Actor class provides following event signals:

    +

    The Dali::Actor class provides following event signals:

    Table: Event signals

    @@ -159,51 +159,51 @@ Stage::GetCurrent().Add( actor );
    -

    For example, a touch event can be handled as follows:

    +

    For example, a touch event can be handled as follows:

     // This sample code is for the HelloWorldExample class
 // in Creating a DALi Application
 void HelloWorldExample::Create( Application& application )
 {
-  // Control is one of the simplest types of Actor which is visible
-  Control control = Control::New();
-  control.SetParentOrigin( ParentOrigin::CENTER );
-  control.SetSize( 100.0f, 100.0f );
-  control.SetBackgroundColor( Color::WHITE );
-  Stage::GetCurrent().Add( control );
-
-  // Connect to a touch signal emitted by the control
-  control.TouchedSignal().Connect( this, &HelloWorldExample::OnTouch );
+  // Control is one of the simplest types of Actor which is visible
+  Control control = Control::New();
+  control.SetParentOrigin( ParentOrigin::CENTER );
+  control.SetSize( 100.0f, 100.0f );
+  control.SetBackgroundColor( Color::WHITE );
+  Stage::GetCurrent().Add( control );
+
+  // Connect to a touch signal emitted by the control
+  control.TouchedSignal().Connect( this, &HelloWorldExample::OnTouch );
 }
 
 bool HelloWorldExample::OnTouch( Actor actor, const TouchEvent& event )
 {
-  bool handled = false;
-  unsigned int pointCount = event.GetPointCount();
-  if( pointCount == 1 )
-  {
-    if( event.GetPoint( 0 ).state == TouchPoint::Down )
-    {
-      // Act on the first touch on screen
-      handled = true;
-    }
-  }
-  else if( pointCount > 1 )
-  {
-    if( event.GetPoint( pointCount-1 ).state == TouchPoint::Down )
-    {
-      // Act on a multi-touch on screen
-      handled = true;
-    }
-  }
-  // true if you have handled the touch, false otherwise
-  return handled;
+  bool handled = false;
+  unsigned int pointCount = event.GetPointCount();
+  if( pointCount == 1 )
+  {
+    if( event.GetPoint( 0 ).state == TouchPoint::Down )
+    {
+      // Act on the first touch on screen
+      handled = true;
+    }
+  }
+  else if( pointCount > 1 )
+  {
+    if( event.GetPoint( pointCount-1 ).state == TouchPoint::Down )
+    {
+      // Act on a multi-touch on screen
+      handled = true;
+    }
+  }
+  // true if you have handled the touch, false otherwise
+  return handled;
 }
    -

    For more information, see Event Handling.

    +

    For more information, see Event Handling.

    + -
    diff --git a/org.tizen.guides/html/native/ui/dali/animation_n.htm b/org.tizen.guides/html/native/ui/dali/animation_n.htm index d60f6c1..4cf5b1b 100644 --- a/org.tizen.guides/html/native/ui/dali/animation_n.htm +++ b/org.tizen.guides/html/native/ui/dali/animation_n.htm @@ -5,13 +5,13 @@ - + - Animation + Animation @@ -51,14 +51,14 @@

    You can use animation to allow your objects to move around and change their properties for a specified duration.

    -

    DALi provides a rich and easy to use animation framework which allows you to create visually rich applications. The Dali::Animation class can be used to animate the animatable properties of any number of objects.

    +

    DALi provides a rich and easy to use animation framework which allows you to create visually rich applications. The Dali::Animation class can be used to animate the animatable properties of any number of objects.

    DALi animations occur in a dedicated thread. This allows animations to run smoothly, regardless of the time taken to process the input, events, and other factors in the application code.

    The following figure illustrates the animation components.

    -

    Figure: DALi animation components

    -

    DALi animation components

    +

    Figure: DALi animation components

    +

    DALi animation components

    To implement a basic animation, create an animation object that takes place over 3 seconds:

    @@ -81,12 +81,12 @@ Animation animation = Animation::New( 3.0f ); 
     // Animate the actor1 position TO 10.0f, 50.0f, 0.0f
 animation.AnimateTo( Property( actor1, Dali::Actor::Property::POSITION ),
-                     Vector3( 10.0f, 50.0f, 0.0f ) ); 
+                     Vector3( 10.0f, 50.0f, 0.0f ) );
 // End Position: 10.0f, 50.0f, 0.0f
 
 // Animate the actor2 position BY 10.0f, 50.0f, 0.0f
 animation.AnimateBy( Property( actor2, Dali::Actor::Property::POSITION ),
-                     Vector3( 10.0f, 50.0f, 0.0f ) ); 
+                     Vector3( 10.0f, 50.0f, 0.0f ) );
 // End Position: 20.0f, 60.0f, 0.0f
    @@ -117,27 +117,27 @@ animation.SetEndAction( Animation::Discard );

    Using Notifications

    -

    Using DALi's signal framework, the application can be notified when the animation finishes. The Dali::Animation class supports "fire and forget" behavior, which means that the animation continues to play even if the handle is discarded. In the following example, the finished signal is emitted after 2 seconds:

    +

    Using DALi's signal framework, the application can be notified when the animation finishes. The Dali::Animation class supports "fire and forget" behavior, which means that the animation continues to play even if the handle is discarded. In the following example, the finished signal is emitted after 2 seconds:

     // This sample code is for the HelloWorldExample class
 // in Creating a DALi Application
 void HelloWorldExample::Create( Application& application )
 {
-  // Create a button
-  PushButton button = PushButton::New();
-  Stage::GetCurrent().Add( button );
-
-  // Create an animation for the button
-  Animation animation = Animation::New( 2.0f ); // Duration 2 seconds
-  animation.AnimateTo( Property( button, Actor::Property::POSITION ),
-                       Vector3( 100.0f, 100.0f, 0.0f ) );
-  animation.FinishedSignal().Connect( this, &HelloWorldExample::OnFinished );
-  animation.Play(); // Fire the animation and forget about it
+  // Create a button
+  PushButton button = PushButton::New();
+  Stage::GetCurrent().Add( button );
+
+  // Create an animation for the button
+  Animation animation = Animation::New( 2.0f ); // Duration 2 seconds
+  animation.AnimateTo( Property( button, Actor::Property::POSITION ),
+                       Vector3( 100.0f, 100.0f, 0.0f ) );
+  animation.FinishedSignal().Connect( this, &HelloWorldExample::OnFinished );
+  animation.Play(); // Fire the animation and forget about it
 } // At this point the animation handle has gone out of scope
 
 void HelloWorldExample::OnFinished( Animation& animation )
 {
-  // Do something when the animation is finished
+  // Do something when the animation is finished
 }
    @@ -151,7 +151,7 @@ animation.SetDefaultAlphaFunction( Dali::AlphaFunction::EASE_IN ); 
     float MyAlphaFunction( float progress )
 {
-  return progress;
+  return progress;
 }
 
 AlphaFunction alphaFunction( &MyAlphaFunction );
@@ -159,8 +159,8 @@ animation.SetDefaultAlphaFunction( alphaFunction );

    You can specify a different alpha function for each animate call within the Animation object:

    -animation.AnimateTo( Property( actor1, Dali::Actor::Property::POSITION ), 
-                     Vector3( 10.0f, 50.0f, 0.0f ), Dali::AlphaFunction::EASE_IN );
+animation.AnimateTo( Property( actor1, Dali::Actor::Property::POSITION ),
+                     Vector3( 10.0f, 50.0f, 0.0f ), Dali::AlphaFunction::EASE_IN );
    diff --git a/org.tizen.guides/html/native/ui/dali/animation_types_n.htm b/org.tizen.guides/html/native/ui/dali/animation_types_n.htm index 03d569a..be6ca44 100644 --- a/org.tizen.guides/html/native/ui/dali/animation_types_n.htm +++ b/org.tizen.guides/html/native/ui/dali/animation_types_n.htm @@ -5,13 +5,13 @@ - + - Animation Types + Animation Types @@ -52,11 +52,11 @@ 
     KeyFrames keyFrames = KeyFrames::New();
 keyFrames.Add( 0.0f,
-               Vector3( 10.0f, 10.0f, 10.0f ) );
+               Vector3( 10.0f, 10.0f, 10.0f ) );
 keyFrames.Add( 0.7f,
-               Vector3( 200.0f, 200.0f, 200.0f ) );
+               Vector3( 200.0f, 200.0f, 200.0f ) );
 keyFrames.Add( 1.0f,
-               Vector3( 100.0f, 100.0f, 100.0f ) );
+               Vector3( 100.0f, 100.0f, 100.0f ) );

    Next, you can add the key frames to your animation.

    @@ -64,16 +64,16 @@ keyFrames.Add( 1.0f, animation.AnimateBetween( Property( actor1, Dali::Actor::Property::POSITION ), keyFrames );

    When you play the animation, DALi animates the position of actor1 between the specified key frames. The actor1 animates from (10.0f, 10.0f, 10.0f) to (200.0f, 200.f, 200.0f) by 70% of the animation time, and then spends the remaining time animating back to (100.0f, 100.0f, 100.0f).

    -

    The advantage of specifying a key frame at 0% is that regardless of where the actor1 is, it starts from position (10.0f, 10.0f, 10.0f). If AnimateTo() is used, the start position is the actor1's current position.

    +

    The advantage of specifying a key frame at 0% is that regardless of where the actor1 is, it starts from position (10.0f, 10.0f, 10.0f). If AnimateTo() is used, the start position is the actor1's current position.

    Path Animation

    The Dali::Path class can be used to animate the position and orientation of actors.

    The black points in the following figure are points where the DALi logo travels to. The red points are the control points which express the curvature of the path on the black points.

    -

    Figure: Path animation

    -

    Path animation

    - +

    Figure: Path animation

    +

    Path animation

    +

    The following code presents the black points:

     Path path = Path::New();
@@ -90,7 +90,7 @@ path.GenerateControlPoints( 0.25f );
 
     animation.Animate( actor1, path, Vector3::ZERO );
 
    
-
    The third parameter is the forward vector (in a local space coordinate system) that is oriented with the path's tangent direction.
    
+
    The third parameter is the forward vector (in a local space coordinate system) that is oriented with the path's tangent direction.
    
 
 
 
diff --git a/org.tizen.guides/html/native/ui/dali/background_n.htm b/org.tizen.guides/html/native/ui/dali/background_n.htm
index ef274b9..2f0f7d9 100644
--- a/org.tizen.guides/html/native/ui/dali/background_n.htm
+++ b/org.tizen.guides/html/native/ui/dali/background_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Background Knowledge  
+	Background Knowledge
 
 
 
@@ -29,12 +29,12 @@
 		
    Related Info
    
 		
 	
-	
+
 
 
    
 
    Background Knowledge
    
@@ -50,7 +50,7 @@
 	
 
 
-    
+
 
 
 
    
diff --git a/org.tizen.guides/html/native/ui/dali/buttons_n.htm b/org.tizen.guides/html/native/ui/dali/buttons_n.htm
index 2ae2bd3..9470411 100644
--- a/org.tizen.guides/html/native/ui/dali/buttons_n.htm
+++ b/org.tizen.guides/html/native/ui/dali/buttons_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Buttons  
+	Buttons
 
 
 
@@ -42,10 +42,10 @@
 			
  • Dali::Toolkit::CheckBoxButton API for Wearable Native
    • 
 			
  • Dali::Toolkit::PushButton API for Wearable Native
    • 
 			
  • Dali::Toolkit::RadioButton API for Wearable Native
    • 
-			
  • (DALi) Button Sample Description
    • 			
+			
  • (DALi) Button Sample Description
    • 
 		
 	
-	
+
 
 
    
 
    Buttons
    
@@ -83,11 +83,11 @@
   
 
 
    PushButton
    
- 
+
 
    The Dali::Toolkit::PushButton class provides a button that can be pressed to operate it. A push button changes its appearance when is pressed and returns to its original appearance when is released.
    
 
-
    Figure: PushButton
      
-	
    PushButton
     
+
    Figure: PushButton
    
+	
    PushButton
    
 
 
    A push button emits a Button::PressedSignal() signal when the button is pressed, a Button::ClickedSignal() signal when clicked, and a Button::ReleasedSignal() signal when released or the touch point leaves the boundary of the button. The following code shows an example of a basic push button:
    
 
@@ -96,46 +96,46 @@
 // in Creating a DALi Application
 void HelloWorldExample::Create( Application& application )
 {
-  PushButton button = PushButton::New();
-  button.SetParentOrigin( ParentOrigin::CENTER );
-  button.SetLabelText( "Press" );
-  Stage::GetCurrent().Add( button );
-
-  // Connect to button signals emitted by the button
-  button.ClickedSignal().Connect( this, &HelloWorldExample::OnButtonClicked );
-  button.PressedSignal().Connect( this, &HelloWorldExample::OnButtonPressed );
-  button.ReleasedSignal().Connect( this, &HelloWorldExample::OnButtonReleased );
+  PushButton button = PushButton::New();
+  button.SetParentOrigin( ParentOrigin::CENTER );
+  button.SetLabelText( "Press" );
+  Stage::GetCurrent().Add( button );
+
+  // Connect to button signals emitted by the button
+  button.ClickedSignal().Connect( this, &HelloWorldExample::OnButtonClicked );
+  button.PressedSignal().Connect( this, &HelloWorldExample::OnButtonPressed );
+  button.ReleasedSignal().Connect( this, &HelloWorldExample::OnButtonReleased );
 }
 
 bool HelloWorldExample::OnButtonClicked( Button button )
 {
-  // Do something when the button is clicked
+  // Do something when the button is clicked
 
-  return true;
-} 
+  return true;
+}
 
 bool HelloWorldExample::OnButtonPressed( Button button )
 {
-  // Do something when the button is pressed
+  // Do something when the button is pressed
 
-  return true;
+  return true;
 }
 
 bool HelloWorldExample::OnButtonReleased( Button button )
 {
-  // Do something when the button is released
+  // Do something when the button is released
 
-  return true;
+  return true;
 }

    CheckBoxButton

    - +

    The Dali::Toolkit::CheckBoxButton class provides a check box button, which can be checked or unchecked.

    -

    Figure: CheckBoxButton

    -

    CheckBoxButton

    +

    Figure: CheckBoxButton

    +

    CheckBoxButton

    A checkbox button emits all 4 button input signals, but usually you can just use the Button::StateChangedSignal() signal to be notified when the button changes its state to selected or unselected. The following code shows an example of a basic checkbox button:

    @@ -144,32 +144,32 @@ bool HelloWorldExample::OnButtonReleased( Button button ) // in Creating a DALi Application void HelloWorldExample::Create( Application& application ) { -  CheckBoxButton button = CheckBoxButton::New(); -  button.SetParentOrigin( ParentOrigin::CENTER ); -  button.SetLabelText( "Check" ); -  button.SetSize( 200, 40 ); -  button.SetBackgroundColor( Color::WHITE ); -  Stage::GetCurrent().Add( button ); - -  // Connect to a button signal emitted by the button -  button.StateChangedSignal().Connect( this, &HelloWorldExample::OnButtonStateChanged ); + CheckBoxButton button = CheckBoxButton::New(); + button.SetParentOrigin( ParentOrigin::CENTER ); + button.SetLabelText( "Check" ); + button.SetSize( 200, 40 ); + button.SetBackgroundColor( Color::WHITE ); + Stage::GetCurrent().Add( button ); + + // Connect to a button signal emitted by the button + button.StateChangedSignal().Connect( this, &HelloWorldExample::OnButtonStateChanged ); } bool HelloWorldExample::OnButtonStateChanged( Button button ) { -  // Do something when the button state is changed -  // You can get the state using button.IsSelected() call + // Do something when the button state is changed + // You can get the state using button.IsSelected() call -  return true; + return true; }

    RadioButton

    - +

    The Dali::Toolkit::RadioButton class provides a radio button with 2 states: selected and unselected.

    -

    Figure: RadioButton

    -

    RadioButton

    +

    Figure: RadioButton

    +

    RadioButton

    Usually, radio buttons are grouped. When they have the same parent, 2 or more radio buttons are located in the same group. In each group, only 1 radio button can be selected at a given time. You can use the Button::StateChangedSignal() signal to check which radio button is selected. The following code shows an example of a basic radio button:

    @@ -178,35 +178,35 @@ bool HelloWorldExample::OnButtonStateChanged( Button button ) // in Creating a DALi Application void HelloWorldExample::Create( Application& application ) { -  Actor radioGroup = Actor::New(); -  radioGroup.SetParentOrigin( ParentOrigin::CENTER ); -  Stage::GetCurrent().Add( radioGroup ); - -  RadioButton button1 = RadioButton::New(); -  button1.SetLabelText( "button1" ); -  button1.SetBackgroundColor( Color::WHITE ); -  button1.SetPosition( 0, -40 ); -  radioGroup.Add( button1 ); - -  RadioButton button2 = RadioButton::New(); -  button2.SetLabelText( "button2" ); -  button2.SetBackgroundColor( Color::WHITE ); -  button2.SetPosition( 0, 40 ); -  radioGroup.Add( button2 ); - -  // Connect a single callback to button signals emitted by both button1 and button2 -  button1.StateChangedSignal().Connect( this, &HelloWorldExample::OnButtonStateChanged ); -  button2.StateChangedSignal().Connect( this, &HelloWorldExample::OnButtonStateChanged ); + Actor radioGroup = Actor::New(); + radioGroup.SetParentOrigin( ParentOrigin::CENTER ); + Stage::GetCurrent().Add( radioGroup ); + + RadioButton button1 = RadioButton::New(); + button1.SetLabelText( "button1" ); + button1.SetBackgroundColor( Color::WHITE ); + button1.SetPosition( 0, -40 ); + radioGroup.Add( button1 ); + + RadioButton button2 = RadioButton::New(); + button2.SetLabelText( "button2" ); + button2.SetBackgroundColor( Color::WHITE ); + button2.SetPosition( 0, 40 ); + radioGroup.Add( button2 ); + + // Connect a single callback to button signals emitted by both button1 and button2 + button1.StateChangedSignal().Connect( this, &HelloWorldExample::OnButtonStateChanged ); + button2.StateChangedSignal().Connect( this, &HelloWorldExample::OnButtonStateChanged ); } bool HelloWorldExample::OnButtonStateChanged( Toolkit::Button button ) { -  // Do something when the 2 buttons' states are changed -  // button parameter can be both button1 and button2 -  // You can use button.GetLabelText() and button.IsSelected() -  // to know which button is selected + // Do something when the 2 buttons' states are changed + // button parameter can be both button1 and button2 + // You can use button.GetLabelText() and button.IsSelected() + // to know which button is selected -  return true; + return true; } diff --git a/org.tizen.guides/html/native/ui/dali/constraints_n.htm b/org.tizen.guides/html/native/ui/dali/constraints_n.htm index 2c314fb..9a25e67 100644 --- a/org.tizen.guides/html/native/ui/dali/constraints_n.htm +++ b/org.tizen.guides/html/native/ui/dali/constraints_n.htm @@ -5,13 +5,13 @@ - + - Constraints + Constraints @@ -44,7 +44,7 @@

    Constraints

    -

    Constraints are used to modify the property of an actor (target property), based on other properties of the same actor; properties of the actor's parent; or properties of another actor altogether (property input or constraint source), when the modification needs to be at runtime. Custom functions or functors can be supplied, where the desired value of the property can be calculated. These functions or functors are called in every frame, therefore they must be fast and not too complex, otherwise they can affect performance (constraint function).

    +

    Constraints are used to modify the property of an actor (target property), based on other properties of the same actor; properties of the actor's parent; or properties of another actor altogether (property input or constraint source), when the modification needs to be at runtime. Custom functions or functors can be supplied, where the desired value of the property can be calculated. These functions or functors are called in every frame, therefore they must be fast and not too complex, otherwise they can affect performance (constraint function).

    Figure: Conceptual diagram for the DALi constraint system

    Conceptual diagram for the DALi constraint system

    @@ -52,12 +52,12 @@

    The following pseudocode fragment shows how to set up and apply a constraint:

     Constraint constraint =
-  Constraint::New< <target-property-type> >( <target-handle>, <target-property>,
-                                             <constraint-function> );
-constraint.AddSource( <property-input-1> ); 
-constraint.AddSource( <property-input-2> ); 
+  Constraint::New< <target-property-type> >( <target-handle>, <target-property>,
+                                             <constraint-function> );
+constraint.AddSource( <property-input-1> );
+constraint.AddSource( <property-input-2> );
 
-constraint.Apply(); 
+constraint.Apply();

    Multiple constraints can be applied to the same actor at the same time. The order in which constraints are applied is important as this is the order in which they are processed in the update thread.

    @@ -72,19 +72,19 @@ constraint.Apply();

    A constraint input source can be one of the following types:

    • Local source (use Dali::LocalSource) -

      A local source is based on the local properties (such as size, position, scale, orientation, or color) of an actor. For example, the actor's orientation can be used as a constraint input source:

      +

      A local source is based on the local properties (such as size, position, scale, orientation, or color) of an actor. For example, the actor's orientation can be used as a constraint input source:

       ConstraintSource source( LocalSource( Actor::Property::ORIENTATION ) );
    • Parent source (use Dali::ParentSource) -

      A parent source is based on properties of the actor's parent. For example, a parent's position can be used as a constraint input source:

      +

      A parent source is based on properties of the actor's parent. For example, a parent's position can be used as a constraint input source:

       ConstraintSource source( ParentSource( Actor::Property::POSITION ) );
    • Other handle source (use Dali::Source) -

      You can base your source on the properties of another handle altogether. For example, a sibling actor's color can be used as a constraint input source:

      +

      You can base your source on the properties of another handle altogether. For example, a sibling actor's color can be used as a constraint input source:

       ConstraintSource source( Source( anotherHandle, Actor::Property::COLOR ) );
      @@ -126,42 +126,42 @@ const Vector3& parentSize( inputs[3]->GetVector3() ); // C function void MyConstraintFunction( Vector4& current, const PropertyInputContainer& inputs ) { -  const Vector3& position( inputs[0]->GetVector3() ); - -  float distance = fabs( position.x ); -  if( distance > 100.0f ) // More than 100.0f away, color is red -  { -    current.g = current.b = 0.0f; -  } -  else // Otherwise it blends between white and red -  { -    current.g = current.b = ( 100.0f - distance ) / 100.0f; -  } + const Vector3& position( inputs[0]->GetVector3() ); + + float distance = fabs( position.x ); + if( distance > 100.0f ) // More than 100.0f away, color is red + { + current.g = current.b = 0.0f; + } + else // Otherwise it blends between white and red + { + current.g = current.b = ( 100.0f - distance ) / 100.0f; + } } void HelloWorldExample::Create( Application& application ) { -  // Create a control -  Control control = Control::New(); -  control.SetParentOrigin( ParentOrigin::CENTER ); -  control.SetSize( 100.0f, 100.0f ); -  control.SetBackgroundColor( Color::WHITE ); -  Stage::GetCurrent().Add( control ); - -  // Use PanGestureDetector to move the control with touch panning -  mDetector = PanGestureDetector::New(); -  mDetector.Attach( control ); -  mDetector.DetectedSignal().Connect( this, &HelloWorldExample::OnPan ); - -  // Create a constraint that targets the control -  Constraint constraint = Constraint::New< Vector4 >( control, Actor::Property::COLOR, -                                                      MyConstraintFunction ); - -  // Add the POSITION property of the control as a constraint input -  constraint.AddSource( LocalSource( Actor::Property::POSITION ) ); - -  // Apply the constraint -  constraint.Apply(); + // Create a control + Control control = Control::New(); + control.SetParentOrigin( ParentOrigin::CENTER ); + control.SetSize( 100.0f, 100.0f ); + control.SetBackgroundColor( Color::WHITE ); + Stage::GetCurrent().Add( control ); + + // Use PanGestureDetector to move the control with touch panning + mDetector = PanGestureDetector::New(); + mDetector.Attach( control ); + mDetector.DetectedSignal().Connect( this, &HelloWorldExample::OnPan ); + + // Create a constraint that targets the control + Constraint constraint = Constraint::New< Vector4 >( control, Actor::Property::COLOR, + MyConstraintFunction ); + + // Add the POSITION property of the control as a constraint input + constraint.AddSource( LocalSource( Actor::Property::POSITION ) ); + + // Apply the constraint + constraint.Apply(); } @@ -169,8 +169,8 @@ void HelloWorldExample::Create( Application& application ) 
       void HelloWorldExample::OnPan( Actor actor, const PanGesture& gesture )
 {
-  // Move the button using the detected gesture
-  actor.TranslateBy( Vector3( gesture.displacement ) );
+  // Move the button using the detected gesture
+  actor.TranslateBy( Vector3( gesture.displacement ) );
 }
      @@ -184,35 +184,35 @@ void HelloWorldExample::OnPan( Actor actor, const PanGesture& gesture ) 
       struct MyConstraintFunctor
 {
-  // Constructor which takes the distance at which the actor is red
-  MyConstraintFunctor(float distance)
-    : mDistance(distance)  {}
-
-  // Functor
-  void operator()( Vector4& current, const PropertyInputContainer& inputs )
-  {
-    const Vector3& position( inputs[0]->GetVector3() );
-
-    float distance = fabs( position.x );
-    if( distance > mDistance ) // More than mDistance away, color is red
-    {
-      current.g = current.b = 0.0f;
-    }
-    else // Otherwise it blends between white and red
-    {
-      current.g = current.b = ( mDistance - distance ) / mDistance;
-    }
-  }
-
-  const float mDistance; // Data
+  // Constructor which takes the distance at which the actor is red
+  MyConstraintFunctor(float distance)
+    : mDistance(distance)  {}
+
+  // Functor
+  void operator()( Vector4& current, const PropertyInputContainer& inputs )
+  {
+    const Vector3& position( inputs[0]->GetVector3() );
+
+    float distance = fabs( position.x );
+    if( distance > mDistance ) // More than mDistance away, color is red
+    {
+      current.g = current.b = 0.0f;
+    }
+    else // Otherwise it blends between white and red
+    {
+      current.g = current.b = ( mDistance - distance ) / mDistance;
+    }
+  }
+
+  const float mDistance; // Data
 };

      The MyConstraintFunctor() functor can be applied to the control as follows:

      - + 
       Constraint constraint = Constraint::New< Vector4 >( control, Actor::Property::COLOR,
-                                                    MyConstraintFunctor( 200.0f ) );
+                                                    MyConstraintFunctor( 200.0f ) );

      The MyConstraintFunctor() functor can be used also with another constraint with a different distance. Instead of using the default functor (operator()), another function can be declared in the class or struct and used as the constraint function. For more information, see the New() function in the Dali::Constraint class.

      @@ -229,11 +229,11 @@ Constraint constraint = Constraint::New< Vector4 >( control, Actor::Proper

      The built-in Dali::EqualToConstraint() function can be used if you only need to set a property equal to another property:

       Constraint constraint = Constraint::New< Vector3 >( actor, Actor::Property::POSITION,
-                                                    EqualToConstraint() );
+                                                    EqualToConstraint() );
 constraint.AddSource( Source( anotherActor, Actor::Property::POSITION ) );
 constraint.Apply();
      -

      Here the actor's position is set to equal the position of anotherActor.

      +

      Here the actor's position is set to equal the position of anotherActor.

    • Relative to constraint @@ -242,33 +242,33 @@ constraint.Apply(); 
       Constraint constraint = Constraint::New< Vector3 >( actor, Actor::Property::POSITION,
-                                                    RelativeToConstraint( 2.0f ) );
+                                                    RelativeToConstraint( 2.0f ) );
 constraint.AddSource( Source( anotherActor, Actor::Property::POSITION ) );
 constraint.Apply();
      - -

      Here the actor's position is relative to the position of anotherActor (multiplied by a given scale). If anotherActor is at (10.0f, 20.0f, 30.0f), actor is at (20.0f, 40.0f, 60.0f).

    + +

    Here the actor's position is relative to the position of anotherActor (multiplied by a given scale). If anotherActor is at (10.0f, 20.0f, 30.0f), actor is at (20.0f, 40.0f, 60.0f).

    Removing Constraints

    -

    When no longer needed, the actor's constraints can be removed in several ways:

    +

    When no longer needed, the actor's constraints can be removed in several ways:

    • To remove the constraint itself and stop applying it: 
       constraint.Remove();
-
      +
    • To remove all constraints applied to an actor: 
       actor.RemoveConstraints();
-
      +
    • To remove all constraints with the tag from an actor (the tag can be set using the SetTag() function): 
       actor.RemoveConstraints( tag );
-
      +
    @@ -313,8 +313,8 @@ actor.RemoveConstraints( tag ); Use a constraint. - Need to modify an actor's property in real time based on some calculations that require additional data to be stored in-between frames. - Use a constraint. + Need to modify an actor's property in real time based on some calculations that require additional data to be stored in-between frames. + Use a constraint.

    The constraint functor can hold any variables within it that need to be preserved frame-to-frame.

    diff --git a/org.tizen.guides/html/native/ui/dali/control_base_n.htm b/org.tizen.guides/html/native/ui/dali/control_base_n.htm index 27bc4e9..9c4c179 100644 --- a/org.tizen.guides/html/native/ui/dali/control_base_n.htm +++ b/org.tizen.guides/html/native/ui/dali/control_base_n.htm @@ -5,13 +5,13 @@ - + - Control + Control @@ -37,7 +37,7 @@
  • Dali::Toolkit::Control API for Wearable Native
    • -
    +

    Control

    @@ -55,18 +55,18 @@ control.SetSize( 200.0f, 200.0f ); control.SetBackgroundColor( Color::RED ); -

    Figure: Control object with a red background

    -

    Control object with a red background

    +

    Figure: Control object with a red background

    +

    Control object with a red background

    You can handle all existing controls similarly. For example, to set the background color for a TextLabel:

    -TextLabel label = TextLabel::New( "Hello World" );
+TextLabel label = TextLabel::New( "Hello World" );
 label.SetBackgroundColor( Dali::Color::RED );
    -

    Figure: TextLabel object with a red background

    -

    TextLabel object with a red background

    +

    Figure: TextLabel object with a red background

    +

    TextLabel object with a red background

    Setting the Background Image

    @@ -75,13 +75,13 @@ label.SetBackgroundColor( Dali::Color::RED ); 
     Control control = Control::New();
-Image image = Image::New( "image.png" );
+Image image = Image::New( "image.png" );
 control.SetBackgroundImage( image );
    -

    Figure: Control object with a background image

    -

    Control object with a background image

    - +

    Figure: Control object with a background image

    +

    Control object with a background image

    + diff --git a/org.tizen.guides/html/native/ui/dali/dali_n.htm b/org.tizen.guides/html/native/ui/dali/dali_n.htm index b20f7e7..bb16cfe 100644 --- a/org.tizen.guides/html/native/ui/dali/dali_n.htm +++ b/org.tizen.guides/html/native/ui/dali/dali_n.htm @@ -5,13 +5,13 @@ - + - Dynamic Animation Library (DALi) + Dynamic Animation Library (DALi) @@ -32,7 +32,7 @@
  • DALi API References for Wearable Native
    • -
    +

    Dynamic Animation Library (DALi)

    @@ -60,7 +60,7 @@

    Enables you to use DALi more effectively with background knowledge.

    - +
    diff --git a/org.tizen.guides/html/native/ui/dali/dali_overview_n.htm b/org.tizen.guides/html/native/ui/dali/dali_overview_n.htm index 4543797..c5c81d8 100644 --- a/org.tizen.guides/html/native/ui/dali/dali_overview_n.htm +++ b/org.tizen.guides/html/native/ui/dali/dali_overview_n.htm @@ -98,7 +98,7 @@

    Creating a DALi Application

    -

    To create a 'Hello World' application with Dali:

    +

    To create a 'Hello World' application with Dali:

    1. Create a DALi project:
        @@ -120,72 +120,72 @@ using namespace Dali::Toolkit; class HelloWorldExample : public ConnectionTracker { -  public: - -    HelloWorldExample( Application& application ) -    : mApplication( application ) -    { -      // Connect to the application's init signal -      mApplication.InitSignal().Connect( this, &HelloWorldExample::Create ); -    } - -    ~HelloWorldExample() -    { -      // Nothing to do here -    } - -    // Init signal is received once (only) during the application lifetime -    void Create( Application& application ) -    { -      // Get a handle to the stage -      Stage stage = Stage::GetCurrent(); -      stage.SetBackgroundColor( Color::WHITE ); - -      TextLabel textLabel = TextLabel::New( "Hello World" ); -      textLabel.SetSize( stage.GetSize() ); -      textLabel.SetAnchorPoint( AnchorPoint::TOP_LEFT ); -      textLabel.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" ); -      textLabel.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" ); -      stage.Add( textLabel ); - -      // Connect to touch and key event signals -      stage.GetRootLayer().TouchSignal().Connect( this, -                                                  &HelloWorldExample::OnTouch ); -      stage.KeyEventSignal().Connect( this, &HelloWorldExample::OnKeyEvent ); -    } - -    bool OnTouch( Actor actor, const TouchData& touch ) -    { -      // Quit the application -      mApplication.Quit(); - -      return true; -    } - -    void OnKeyEvent( const KeyEvent& event ) -    { -      if( event.state == KeyEvent::Down ) -      { -        if( IsKey( event, DALI_KEY_ESCAPE ) || IsKey( event, DALI_KEY_BACK ) ) -        { -          mApplication.Quit(); -        } -      } -    } - -  private: -    Application& mApplication; + public: + + HelloWorldExample( Application& application ) + : mApplication( application ) + { + // Connect to the application's init signal + mApplication.InitSignal().Connect( this, &HelloWorldExample::Create ); + } + + ~HelloWorldExample() + { + // Nothing to do here + } + + // Init signal is received once (only) during the application lifetime + void Create( Application& application ) + { + // Get a handle to the stage + Stage stage = Stage::GetCurrent(); + stage.SetBackgroundColor( Color::WHITE ); + + TextLabel textLabel = TextLabel::New( "Hello World" ); + textLabel.SetSize( stage.GetSize() ); + textLabel.SetAnchorPoint( AnchorPoint::TOP_LEFT ); + textLabel.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" ); + textLabel.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" ); + stage.Add( textLabel ); + + // Connect to touch and key event signals + stage.GetRootLayer().TouchSignal().Connect( this, + &HelloWorldExample::OnTouch ); + stage.KeyEventSignal().Connect( this, &HelloWorldExample::OnKeyEvent ); + } + + bool OnTouch( Actor actor, const TouchData& touch ) + { + // Quit the application + mApplication.Quit(); + + return true; + } + + void OnKeyEvent( const KeyEvent& event ) + { + if( event.state == KeyEvent::Down ) + { + if( IsKey( event, DALI_KEY_ESCAPE ) || IsKey( event, DALI_KEY_BACK ) ) + { + mApplication.Quit(); + } + } + } + + private: + Application& mApplication; }; // Entry point for DALi applications int main( int argc, char **argv ) { -  Application application = Application::New( &argc, &argv ); -  HelloWorldExample test( application ); -  application.MainLoop(); + Application application = Application::New( &argc, &argv ); + HelloWorldExample test( application ); + application.MainLoop(); -  return 0; + return 0; } @@ -234,11 +234,11 @@ mApplication.InitSignal().Connect( this, &HelloWorldExample::Create ); Stage stage = Stage::GetCurrent(); stage.SetBackgroundColor( Color::WHITE ); -TextLabel textLabel = TextLabel::New( "Hello World" ); +TextLabel textLabel = TextLabel::New( "Hello World" ); textLabel.SetSize( stage.GetSize() ); textLabel.SetAnchorPoint( AnchorPoint::TOP_LEFT ); -textLabel.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" ); -textLabel.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" ); +textLabel.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" ); +textLabel.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" ); stage.Add( textLabel ); @@ -260,7 +260,7 @@ stage.KeyEventSignal().Connect( this, &HelloWorldExample::OnKeyEvent ); bool OnTouch( Actor actor, const TouchData& touch ) - +
      1. Start the application main loop:

        To run the application, start its main loop. This ensures that images are displayed, and events as well as signals are dispatched and captured.

        @@ -286,7 +286,7 @@ application.MainLoop();

        Figure: Basic DALi application

        Basic DALi application

        - + diff --git a/org.tizen.guides/html/native/ui/dali/event_handling_n.htm b/org.tizen.guides/html/native/ui/dali/event_handling_n.htm index 89e8c2b..9404632 100644 --- a/org.tizen.guides/html/native/ui/dali/event_handling_n.htm +++ b/org.tizen.guides/html/native/ui/dali/event_handling_n.htm @@ -11,7 +11,7 @@ - Event Handling + Event Handling @@ -75,9 +75,9 @@

        The concept of signal and slots were introduced by Qt for communication between objects, and it inspires DALi.

        Figure: Schematic example of signal-slot connections

        -

        Schematic example of signal-slot connections

        +

        Schematic example of signal-slot connections

        In the figure, signal 1 is connected to slot 1, signal 2 is connected to slot 1 and slot 3, and signal 3 is connected to slot 2.

        - +

        The signal and slot system has following advantages:

        • Object-oriented: supports callbacks for C++ member functions
          • @@ -98,7 +98,7 @@ TouchDataSignalType& TouchSignal();

          This means that a slot of the following type can be connected to the return value of the Actor::TouchSignal() function:

           bool YourCallbackName( Actor actor,
-                       const TouchData& data );
+                       const TouchData& data );

          The return value true indicates that the touch event must be consumed. Otherwise, the signal is emitted on the next sensitive parent of the actor. Note that a callback function signature varies depending on its corresponding signal type. Some signal types do not have a return value in their callback functions.

          @@ -114,45 +114,45 @@ bool YourCallbackName( Actor actor, // in Creating a DALi Application void HelloWorldExample::Create( Application& application ) { -  // Control is one of the simplest types of Actor which is visible -  Control control = Control::New(); -  control.SetParentOrigin( ParentOrigin::CENTER ); -  control.SetSize( 100.0f, 100.0f ); -  control.SetBackgroundColor( Color::WHITE ); -  Stage::GetCurrent().Add( control ); - -  // Connect to a touch signal emitted by the control -  control.TouchSignal().Connect( this, &HelloWorldExample::OnTouch ); + // Control is one of the simplest types of Actor which is visible + Control control = Control::New(); + control.SetParentOrigin( ParentOrigin::CENTER ); + control.SetSize( 100.0f, 100.0f ); + control.SetBackgroundColor( Color::WHITE ); + Stage::GetCurrent().Add( control ); + + // Connect to a touch signal emitted by the control + control.TouchSignal().Connect( this, &HelloWorldExample::OnTouch ); } bool HelloWorldExample::OnTouch( Actor actor, TouchData& touch ) { -  const std::size_t pointCount = touch.GetPointCount(); -  if( pointCount == 1 ) -  { -    // Single touch event - -    // Get touch state of the primary point -    PointState::Type pointState = touch.GetState( 0 ); -    if( pointState == PointState::DOWN ) -    { -      // User has just pressed on the device -    } -    else if( pointState == PointState::UP ) -    { -      // User has just released their finger from the device -    } -  } -  else -  { -    // Multi-touch event -  } - -  return true; // Touch handled + const std::size_t pointCount = touch.GetPointCount(); + if( pointCount == 1 ) + { + // Single touch event + + // Get touch state of the primary point + PointState::Type pointState = touch.GetState( 0 ); + if( pointState == PointState::DOWN ) + { + // User has just pressed on the device + } + else if( pointState == PointState::UP ) + { + // User has just released their finger from the device + } + } + else + { + // Multi-touch event + } + + return true; // Touch handled } -

          The touch event is first emitted to the hit actor by the primary touch point, which is the first point that the user touches. If this hit actor does not handle the event, then the event is offered to the hit actor's parent. Again, if the parent does not handle this event, it is then offered to its parent and so on until the stage is reached or the event is consumed.

          +

          The touch event is first emitted to the hit actor by the primary touch point, which is the first point that the user touches. If this hit actor does not handle the event, then the event is offered to the hit actor's parent. Again, if the parent does not handle this event, it is then offered to its parent and so on until the stage is reached or the event is consumed.

          If a parent and child actor both connect to the touch signal, the touch event is first offered to the child. If it is consumed by the child, the parent is not informed.

          @@ -167,23 +167,23 @@ bool HelloWorldExample::OnTouch( Actor actor, TouchData& touch ) // in Creating a DALi Application void HelloWorldExample::Create( Application& application ) { -  // Simple control to render the screen -  PushButton button = PushButton::New(); -  Stage::GetCurrent().Add( button ); -  // Connect to a key event signal emitted by the stage -  Stage::GetCurrent().KeyEventSignal().Connect( this, &HelloWorldExample::OnKeyEvent ); + // Simple control to render the screen + PushButton button = PushButton::New(); + Stage::GetCurrent().Add( button ); + // Connect to a key event signal emitted by the stage + Stage::GetCurrent().KeyEventSignal().Connect( this, &HelloWorldExample::OnKeyEvent ); } void HelloWorldExample::OnKeyEvent( const KeyEvent& event ) { -  if( event.state == KeyEvent::Down ) -  { -    if( IsKey( event, DALI_KEY_ESCAPE ) || IsKey( event, DALI_KEY_BACK ) ) -    { -      // Quit the application when escape or back key is pressed -      mApplication.Quit(); -    } -  } + if( event.state == KeyEvent::Down ) + { + if( IsKey( event, DALI_KEY_ESCAPE ) || IsKey( event, DALI_KEY_BACK ) ) + { + // Quit the application when escape or back key is pressed + mApplication.Quit(); + } + } } @@ -363,7 +363,7 @@ void HelloWorldExample::OnKeyEvent( const KeyEvent& event ) - +

          The actor receiving events is passed to the callbacks.

          @@ -469,7 +469,7 @@ void HelloWorldExample::OnKeyEvent( const KeyEvent& event ) - +

          Dali::Toolkit::KeyboardFocusManager provides the functionality of handling keyboard navigation and maintaining the 2-dimensional keyboard focus chain. Dissimilar to the key input focus, the keyboard focus is about the focus moving between actors, and that is why this signal is provided by the specific focus managing class.

        @@ -528,28 +528,28 @@ void HelloWorldExample::OnKeyEvent( const KeyEvent& event ) // in Creating a DALi Application class HelloWorldExample : public ConnectionTracker { -  // Gesture detector must be a member variable to exist outside the local scope -  PanGestureDetector mDetector; + // Gesture detector must be a member variable to exist outside the local scope + PanGestureDetector mDetector; }; void HelloWorldExample::Create( Application& application ) { -  PushButton button = PushButton::New(); -  button.SetParentOrigin( ParentOrigin::CENTER ); -  button.SetSize( 100.0f, 100.0f ); -  Stage::GetCurrent().Add( button ); - -  // Create a PanGestureDetector -  mDetector = PanGestureDetector::New(); -  mDetector.Attach( button ); -  // Attach the button to the detector -  mDetector.DetectedSignal().Connect( this, &HelloWorldExample::OnPan ); + PushButton button = PushButton::New(); + button.SetParentOrigin( ParentOrigin::CENTER ); + button.SetSize( 100.0f, 100.0f ); + Stage::GetCurrent().Add( button ); + + // Create a PanGestureDetector + mDetector = PanGestureDetector::New(); + mDetector.Attach( button ); + // Attach the button to the detector + mDetector.DetectedSignal().Connect( this, &HelloWorldExample::OnPan ); } void HelloWorldExample::OnPan( Actor actor, const PanGesture& gesture ) { -  // Move the button using detected gesture -  actor.TranslateBy( Vector3( gesture.displacement ) ); + // Move the button using detected gesture + actor.TranslateBy( Vector3( gesture.displacement ) ); } @@ -560,7 +560,7 @@ void HelloWorldExample::OnPan( Actor actor, const PanGesture& gesture )

        DALi provides the automatic connection management mechanism to prevent this kind of situation. The key is the Dali::ConnectionTracker class (in mobile and wearable applications). It tracks connections between signals and slots, and performs an automatic disconnection when either the signal or slot is deleted.

        Due to this mechanism, all the DALi sample codes start with a controller class derived from the Dali::ConnectionTracker class. This is a safe and typical way of making a DALi application. You can, of course, create other structures using the Dali::ConnectionTracker class.

        - + diff --git a/org.tizen.guides/html/native/ui/dali/flexcontainer_n.htm b/org.tizen.guides/html/native/ui/dali/flexcontainer_n.htm index d561be2..7272f7e 100644 --- a/org.tizen.guides/html/native/ui/dali/flexcontainer_n.htm +++ b/org.tizen.guides/html/native/ui/dali/flexcontainer_n.htm @@ -5,7 +5,7 @@ - + @@ -45,7 +45,7 @@

        The Dali::Toolkit::FlexContainer class provides a control that implements a subset of the CSS Flexible Box Layout Module Level 1 specification (defined by W3C).

        -

        The flexible box (flexbox) is a CSS3 Web layout model, which allows responsive elements within a container, automatically arranged to different size screens or devices. The following figure illustrates the various directions and terms applied to a flex container with the "flex direction" defined as "row".

        +

        The flexible box (flexbox) is a CSS3 Web layout model, which allows responsive elements within a container, automatically arranged to different size screens or devices. The following figure illustrates the various directions and terms applied to a flex container with the "flex direction" defined as "row".

        Figure: Flex container terms

        Flex container terms

        @@ -55,7 +55,7 @@

        The following basic example shows how to create a gallery-like flexbox layout using the Dali::Toolkit::FlexContainer object.

        -

        Figure: Flex container example

        +

        Figure: Flex container example

        Flex container example

          @@ -67,20 +67,20 @@ FlexContainer flexContainer = FlexContainer::New(); flexContainer.SetParentOrigin( ParentOrigin::TOP_LEFT ); flexContainer.SetAnchorPoint( AnchorPoint::TOP_LEFT ); flexContainer.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, -                               Dimension::ALL_DIMENSIONS ); + Dimension::ALL_DIMENSIONS ); // Set the background color to be white flexContainer.SetBackgroundColor( Color::WHITE ); // Add the container to the stage -Stage::GetCurrent().Add( flexContainer ); +Stage::GetCurrent().Add( flexContainer ); -
        1. Set the flex direction of the main container to "column" to make the toolbar and the actual content display vertically: +
        2. Set the flex direction of the main container to "column" to make the toolbar and the actual content display vertically: 
           // Display toolbar and content vertically
 flexContainer.SetProperty( FlexContainer::Property::FLEX_DIRECTION,
-                           FlexContainer::COLUMN ); 
+                           FlexContainer::COLUMN );
          3. @@ -92,15 +92,15 @@ FlexContainer toolBar = FlexContainer::New(); toolBar.SetParentOrigin( ParentOrigin::TOP_LEFT ); toolBar.SetAnchorPoint( AnchorPoint::TOP_LEFT ); // Set the background color for the toolbar -toolBar.SetBackgroundColor( Color::CYAN ); +toolBar.SetBackgroundColor( Color::CYAN ); // Add it to the main container flexContainer.Add( toolBar ); flexContainer.SetProperty( FlexContainer::Property::FLEX_DIRECTION, -                           FlexContainer::COLUMN ); + FlexContainer::COLUMN ); -
        3. To make the buttons and title display horizontally and be vertically aligned to the center of the toolbar, set the toolbar flex direction to "row" and set its ALIGN_ITEMS property to center. +
        4. To make the buttons and title display horizontally and be vertically aligned to the center of the toolbar, set the toolbar flex direction to "row" and set its ALIGN_ITEMS property to center.

          Set the FLEX property to make the toolbar and the actual content share the height of the main container, so that the toolbar occupies 10 percent of the whole vertical space and the content occupies the rest of the vertical space.

          @@ -108,7 +108,7 @@ flexContainer.SetProperty( FlexContainer::Property::FLEX_DIRECTION,
 toolBar.SetProperty( FlexContainer::Property::FLEX_DIRECTION, FlexContainer::ROW );
 // Align toolbar items vertically center
 toolBar.SetProperty( FlexContainer::Property::ALIGN_ITEMS,
-                     FlexContainer::ALIGN_CENTER );
+                     FlexContainer::ALIGN_CENTER );
 // 10 percent of available space in the cross axis
 toolBar.SetProperty( FlexContainer::ChildProperty::FLEX, 0.1f );
          @@ -124,14 +124,14 @@ content.SetParentOrigin( ParentOrigin::TOP_LEFT ); content.SetAnchorPoint( AnchorPoint::TOP_LEFT ); // Display items horizontally content.SetProperty( FlexContainer::Property::FLEX_DIRECTION, FlexContainer::ROW ); -// Align items horizontally center +// Align items horizontally center content.SetProperty( FlexContainer::Property::JUSTIFY_CONTENT, -                     FlexContainer::JUSTIFY_CENTER ); + FlexContainer::JUSTIFY_CENTER ); // Align items vertically center content.SetProperty( FlexContainer::Property::ALIGN_ITEMS, -                     FlexContainer::ALIGN_CENTER ); + FlexContainer::ALIGN_CENTER ); // 90 percent of available space in the cross axis -content.SetProperty( FlexContainer::ChildProperty::FLEX, 0.9f ); +content.SetProperty( FlexContainer::ChildProperty::FLEX, 0.9f ); // Add it to the main container flexContainer.Add( content ); @@ -146,41 +146,41 @@ PushButton prevButton = PushButton::New(); prevButton.SetParentOrigin( ParentOrigin::TOP_LEFT ); prevButton.SetAnchorPoint( AnchorPoint::TOP_LEFT ); // Minimum size the button must keep -prevButton.SetMinimumSize( Vector2( 100.0f, 60.0f ) ); +prevButton.SetMinimumSize( Vector2( 100.0f, 60.0f ) ); // Set 10 pixel margin around the button prevButton.SetProperty( FlexContainer::ChildProperty::FLEX_MARGIN, -                        Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); + Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); toolBar.Add( prevButton ); // Set the button text Property::Map labelMap; -labelMap["text"] = "Prev"; -labelMap["textColor"] = Color::BLACK; +labelMap["text"] = "Prev"; +labelMap["textColor"] = Color::BLACK; prevButton.SetProperty( Button::Property::LABEL, labelMap ); // Add a title to the center of the toolbar -TextLabel title = TextLabel::New( "Gallery" ); +TextLabel title = TextLabel::New( "Gallery" ); title.SetParentOrigin( ParentOrigin::TOP_LEFT ); title.SetAnchorPoint( AnchorPoint::TOP_LEFT ); title.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS ); -title.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" ); -title.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" ); +title.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" ); +title.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" ); // Take all the available space left apart from the 2 buttons -title.SetProperty( FlexContainer::ChildProperty::FLEX, 1.0f ); +title.SetProperty( FlexContainer::ChildProperty::FLEX, 1.0f ); // Set 10 pixel margin around the title title.SetProperty( FlexContainer::ChildProperty::FLEX_MARGIN, -                   Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); + Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); toolBar.Add( title ); // Add a button to the right of the toolbar PushButton nextButton = PushButton::New(); nextButton.SetParentOrigin( ParentOrigin::TOP_LEFT ); nextButton.SetAnchorPoint( AnchorPoint::TOP_LEFT ); // Minimum size the button must keep -nextButton.SetMinimumSize( Vector2( 100.0f, 60.0f ) ); +nextButton.SetMinimumSize( Vector2( 100.0f, 60.0f ) ); // Set 10 pixel margin around the button nextButton.SetProperty( FlexContainer::ChildProperty::FLEX_MARGIN, -                        Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); + Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); toolBar.Add( nextButton ); // Set the button text -labelMap["text"] = "Next"; +labelMap["text"] = "Next"; nextButton.SetProperty( Button::Property::LABEL, labelMap ); @@ -194,12 +194,12 @@ nextButton.SetProperty( Button::Property::LABEL, labelMap ); ImageView imageView = ImageView::New( "image.jpg" ); imageView.SetParentOrigin( ParentOrigin::TOP_LEFT ); imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT ); -content.Add( imageView ); +content.Add( imageView );
        - +

        Modifying FlexContainer Properties

        You can modify the flex container appearance and behavior through the following properties:

        @@ -214,7 +214,7 @@ content.Add( imageView );

        Figure: CONTENT_DIRECTION RTL

        CONTENT_DIRECTION RTL

        - +

        Table: CONTENT_DIRECTION values

        @@ -224,7 +224,7 @@ content.Add( imageView ); - + @@ -416,7 +416,7 @@ content.Add( imageView ); FlexContainer flexContainer = FlexContainer::New(); // Set the flex direction to lay out the items horizontally flexContainer.SetProperty( FlexContainer::Property::FLEX_DIRECTION, -                           FlexContainer::ROW ); + FlexContainer::ROW ); // Create flex items and set the proportion Control item1 = Control::New(); @@ -438,7 +438,7 @@ flexContainer.Add( item5 );
      2. ALIGN_SELF -

        This property specifies how the item aligns along the cross axis. If set, this property overrides the default alignment for all items defined by the container's ALIGN_ITEMS property.

        +

        This property specifies how the item aligns along the cross axis. If set, this property overrides the default alignment for all items defined by the container's ALIGN_ITEMS property.

        Figure: ALIGN_SELF

        ALIGN_SELF

        @@ -449,17 +449,17 @@ flexContainer.Add( item5 ); FlexContainer flexContainer = FlexContainer::New(); // Set the flex direction to lay out the items horizontally flexContainer.SetProperty( FlexContainer::Property::FLEX_DIRECTION, -                           FlexContainer::ROW ); + FlexContainer::ROW ); // Set the items to be aligned at the beginning of the container -// on the cross axis by default +// on the cross axis by default flexContainer.SetProperty( FlexContainer::Property::ALIGN_ITEMS, -                           FlexContainer::ALIGN_FLEX_START ); + FlexContainer::ALIGN_FLEX_START ); // Create flex items and add them to the flex container Control item1 = Control::New(); // Align item1 at the center of the container item1.SetProperty( FlexContainer::ChildProperty::ALIGN_SELF, -                   FlexContainer::ALIGN_CENTER ); + FlexContainer::ALIGN_CENTER ); flexContainer.Add( item1 ); Control item2 = Control::New(); // item2 is aligned at the beginning of the container @@ -467,11 +467,11 @@ flexContainer.Add( item2 ); Control item3 = Control::New(); // Align item3 at the bottom of the container item3.SetProperty( FlexContainer::ChildProperty::ALIGN_SELF, -                   FlexContainer::ALIGN_FLEX_END ); + FlexContainer::ALIGN_FLEX_END ); flexContainer.Add( item3 ); Control item4 = Control::New(); // item4 is aligned at the beginning of the container -flexContainer.Add( item4 ); +flexContainer.Add( item4 );
      3. FLEX_MARGIN @@ -502,7 +502,7 @@ FlexContainer flexContainer = FlexContainer::New(); Control item = Control::New(); // Add the margin around the item item.SetProperty( FlexContainer::ChildProperty::FLEX_MARGIN, -                  Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); + Vector4( 10.0f, 10.0f, 10.0f, 10.0f ) ); // Add the item to the container flexContainer.Add( item ); diff --git a/org.tizen.guides/html/native/ui/dali/handle_n.htm b/org.tizen.guides/html/native/ui/dali/handle_n.htm index 52bd865..905d1fa 100644 --- a/org.tizen.guides/html/native/ui/dali/handle_n.htm +++ b/org.tizen.guides/html/native/ui/dali/handle_n.htm @@ -5,13 +5,13 @@ - + - Handle/Body Pattern + Handle/Body Pattern @@ -32,7 +32,7 @@
      4. Dali::BaseHandle API for Wearable Native
        5. - +

        Handle/Body Pattern

        @@ -44,7 +44,7 @@

        The handle/body pattern structure is beneficial for both DALi users and developers:

        • Easier memory management -

          Each internal implementation class (body class) contains a single reference count object, which can be initialized with the static "New" functions in the DALi public API. This means that C++ new/delete operators do not have to be used in your code. (The internal body classes inherit from the Dali::BaseObject class, but you do not need to use this class directly.)

          +

          Each internal implementation class (body class) contains a single reference count object, which can be initialized with the static "New" functions in the DALi public API. This means that C++ new/delete operators do not have to be used in your code. (The internal body classes inherit from the Dali::BaseObject class, but you do not need to use this class directly.)

        • Better encapsulation

          The danger of API/ABI breaks is reduced, since the implementation of a class can be changed without modifying the public API, thus without recompiling code using the public API. This can also reduce the build time.

          @@ -58,14 +58,14 @@ 
           class HandleTest
 {
-  HandleTest()
-  {
-    mActor = Actor::New();
-  }
+  HandleTest()
+  {
+    mActor = Actor::New();
+  }
 
-  ~HandleTest() {} // Actor object is destroyed automatically
+  ~HandleTest() {} // Actor object is destroyed automatically
 
-  Actor mActor;
+  Actor mActor;
 };
          • @@ -74,15 +74,15 @@ class HandleTest 
           class HandleTest
 {
-  HandleTest()
-  {
-    mActors.push_back( Actor::New() );
-    mActors.push_back( Actor::New() );
-  }
+  HandleTest()
+  {
+    mActors.push_back( Actor::New() );
+    mActors.push_back( Actor::New() );
+  }
 
-  ~HandleTest() {} // Actors are destroyed automatically
+  ~HandleTest() {} // Actors are destroyed automatically
 
-  std::vector<Actor> mActors;
+  std::vector<Actor> mActors;
 };
          @@ -91,10 +91,10 @@ class HandleTest 
           void SomeFunction( Actor actor )
 {
-  if( actor )
-  {
-    actor.SomeMethod();
-  }
+  if( actor )
+  {
+    actor.SomeMethod();
+  }
 }
          @@ -102,13 +102,13 @@ void SomeFunction( Actor actor )
        • Validity check: 
           {
-  Actor actor;  // Create a NULL object
+  Actor actor;  // Create a NULL object
 
-  // At this stage, you cannot call any of the Actor functions
-  if( !actor ) // This test passes, since the actor is NULL
-  {
-    actor = Actor::New();
-  }
+  // At this stage, you cannot call any of the Actor functions
+  if( !actor ) // This test passes, since the actor is NULL
+  {
+    actor = Actor::New();
+  }
 }
          • @@ -116,18 +116,18 @@ void SomeFunction( Actor actor )
        • Equality operators: 
           {
-  Actor handle1;
-  Actor handle2;
-  cout << handle1 == handle2 << endl; // "true", both handles are empty
+  Actor handle1;
+  Actor handle2;
+  cout << handle1 == handle2 << endl; // "true", both handles are empty
 
-  handle2 = Actor::New();
-  cout << handle1 == handle2 << endl; // "false", one handle is empty
+  handle2 = Actor::New();
+  cout << handle1 == handle2 << endl; // "false", one handle is empty
 
-  handle1 = Actor::New();
-  cout << handle1 == handle2 << endl; // "false", handles to different objects
+  handle1 = Actor::New();
+  cout << handle1 == handle2 << endl; // "false", handles to different objects
 
-  handle1 = handle2;
-  cout << handle1 == handle2 << endl; // "true", handles to same object
+  handle1 = handle2;
+  cout << handle1 == handle2 << endl; // "true", handles to same object
 }
          • @@ -136,34 +136,34 @@ void SomeFunction( Actor actor ) 
           class AnimationTest
 {
-  private:
-    Animation mAnimation; // Animation handle
+  private:
+    Animation mAnimation; // Animation handle
 };
 
 void AnimationTest::Initialize()
 {
-  // Reference count is 1, the animation object stays alive when the function returns
-  mAnimation = Animation::New( 10.0f ); 
+  // Reference count is 1, the animation object stays alive when the function returns
+  mAnimation = Animation::New( 10.0f );
 }
 
 void AnimationTest::SetAnimation( Animation anim )
 {
-  // Reference count of the original animation decreased, 
-  // 'anim' is referenced instead
-  // If nobody else had a reference on the initial animation,
-  // the object is destroyed
-  mAnimation = anim; 
+  // Reference count of the original animation decreased,
+  // 'anim' is referenced instead
+  // If nobody else had a reference on the initial animation,
+  // the object is destroyed
+  mAnimation = anim;
 }
 
          -// At this point, you own a Dali::Actor named "container"
+// At this point, you own a Dali::Actor named "container"
 // Enter a code block
 {
-  // Create an text label
-  TextLabel actor = TextLabel::New( "test" );
-  // Add the text label to a container
-  container.Add( actor );
+  // Create an text label
+  TextLabel actor = TextLabel::New( "test" );
+  // Add the text label to a container
+  container.Add( actor );
 }
 // Exit the code block
 // At this stage, the text label is still alive
@@ -174,7 +174,7 @@ void AnimationTest::SetAnimation( Animation anim )
        - +
        diff --git a/org.tizen.guides/html/native/ui/dali/imageview_n.htm b/org.tizen.guides/html/native/ui/dali/imageview_n.htm index 2db6d5a..9d5e611 100644 --- a/org.tizen.guides/html/native/ui/dali/imageview_n.htm +++ b/org.tizen.guides/html/native/ui/dali/imageview_n.htm @@ -5,13 +5,13 @@ - + - ImageView + ImageView @@ -40,18 +40,18 @@
      5. (DALi) ImageView Sample Description
        6. - +

        ImageView

        The Dali::Toolkit::ImageView component displays an image.

        - -

        Figure: ImageView

        + +

        Figure: ImageView

        ImageView

        -

        Creating an ImageView

        +

        Creating an ImageView

        The image view is constructed by passing a Dali::Image object. The Dali::Image is an abstract base class with multiple derived classes, and the Dali::ResourceImage class is used for loading an image from a file or URL. The following example shows how to create an ImageView object:

        @@ -70,7 +70,7 @@ ImageView imageView = ImageView::New( image ); imageView.SetImage( newImage ); - +
        diff --git a/org.tizen.guides/html/native/ui/dali/itemview_n.htm b/org.tizen.guides/html/native/ui/dali/itemview_n.htm index cecab51..4b693cb 100644 --- a/org.tizen.guides/html/native/ui/dali/itemview_n.htm +++ b/org.tizen.guides/html/native/ui/dali/itemview_n.htm @@ -5,13 +5,13 @@ - + - ItemView + ItemView @@ -54,7 +54,7 @@

        The Dali::Toolkit::ItemView class is a scrollable container that can contain many items. It provides several scrollable layouts, as illustrated in the following figure.

        -

        Figure: ItemView layouts

        +

        Figure: ItemView layouts

        INHERITInherits the parent's directionInherits the parent's direction
        LTR
        @@ -79,19 +79,19 @@ 
         class MyFactory : public ItemFactory
 {
-  public:  
-    virtual unsigned int GetNumberOfItems()
-    {
-      // Return the number of items
-      return MY_ITEM_COUNT;
-    } 
- 
-    virtual Actor NewItem( unsigned int itemId ) 
-    { 
-      // Create the actor representing
-      // the item based on the itemId
-      return ImageView::New( MY_IMAGE_PATHS[itemId] );
-    }
+  public:
+    virtual unsigned int GetNumberOfItems()
+    {
+      // Return the number of items
+      return MY_ITEM_COUNT;
+    }
+
+    virtual Actor NewItem( unsigned int itemId )
+    {
+      // Create the actor representing
+      // the item based on the itemId
+      return ImageView::New( MY_IMAGE_PATHS[itemId] );
+    }
 };
        @@ -106,28 +106,28 @@ class MyFactory : public ItemFactory // in Creating a DALi Application class HelloWorldExample : public ConnectionTracker { -  // Store a factory as a member variable -  MyFactory mFactory; + // Store a factory as a member variable + MyFactory mFactory; }; void HelloWorldExample::Create( Application& application ) { -  // Create an ItemView with the factory -  ItemView itemView = ItemView::New( mFactory ); -  itemView.SetParentOrigin( ParentOrigin::CENTER ); + // Create an ItemView with the factory + ItemView itemView = ItemView::New( mFactory ); + itemView.SetParentOrigin( ParentOrigin::CENTER ); -  // Create a layout -  ItemLayoutPtr spiralLayout = DefaultItemLayout::New( DefaultItemLayout::SPIRAL ); + // Create a layout + ItemLayoutPtr spiralLayout = DefaultItemLayout::New( DefaultItemLayout::SPIRAL ); -  // Add the layout to the itemView -  itemView.AddLayout( *spiralLayout ); -  // More layouts can be created and added to the itemView + // Add the layout to the itemView + itemView.AddLayout( *spiralLayout ); + // More layouts can be created and added to the itemView -  // Activate the layout -  itemView.ActivateLayout( 0, Vector3( Stage::GetCurrent().GetSize() ), 0 ); + // Activate the layout + itemView.ActivateLayout( 0, Vector3( Stage::GetCurrent().GetSize() ), 0 ); -  // Add the itemView to the stage -  Stage::GetCurrent().Add( itemView ); + // Add the itemView to the stage + Stage::GetCurrent().Add( itemView ); } diff --git a/org.tizen.guides/html/native/ui/dali/layout_n.htm b/org.tizen.guides/html/native/ui/dali/layout_n.htm index 1f4f1f7..e843bc8 100644 --- a/org.tizen.guides/html/native/ui/dali/layout_n.htm +++ b/org.tizen.guides/html/native/ui/dali/layout_n.htm @@ -5,13 +5,13 @@ - + - Layout Management + Layout Management @@ -38,12 +38,12 @@
      6. Dali::Actor API for Wearable Native
        7. - +

        Layout Management

        -

        DALi provides rule-based layout management (size negotiation), which is used to allocate the actor sizes on the stage based on the dependency rules between the actors.

        +

        DALi provides rule-based layout management (size negotiation), which is used to allocate the actor sizes on the stage based on the dependency rules between the actors.

        Dimensions

        The notion of width and height is generalized into a concept of a dimension. Several functions take the Dimension parameter. The Dali::Dimension::Type enum (in mobile and wearable applications) specifies the available dimensions as bit fields:

        @@ -51,7 +51,7 @@
      7. Dimension::WIDTH
      8. Dimension::HEIGHT
        9. -

        If a function can process width and height at the same time, the Dimension::ALL_DIMENSIONS mask can be specified.

        +

        If a function can process width and height at the same time, the Dimension::ALL_DIMENSIONS mask can be specified.

        Resize Policies

        @@ -77,17 +77,17 @@
        - + - + - + @@ -106,15 +106,15 @@

        Actor Layout Examples

        -

        This section describes layout examples with a actor.

        +

        This section describes layout examples with a actor.

        Specifying Size Policies

        -

        Actors have different size policies by default. For example, the Dali::Toolkit::ImageView is set to USE_NATURAL_SIZE. This ensures that an image view uses its natural size by default when it is placed on the stage. However, if the SetSize() function is used with sizes other than 0 on the image view, the current resize policy is overridden by the FIXED policy and the actor takes the specified size.

        +

        Actors have different size policies by default. For example, the Dali::Toolkit::ImageView is set to USE_NATURAL_SIZE. This ensures that an image view uses its natural size by default when it is placed on the stage. However, if the SetSize() function is used with sizes other than 0 on the image view, the current resize policy is overridden by the FIXED policy and the actor takes the specified size.

        -

        You can specify how an actor is size-negotiated using the SetResizePolicy() function. You can specify different policies for the different dimensions of width and height to archive different layouts.

        +

        You can specify how an actor is size-negotiated using the SetResizePolicy() function. You can specify different policies for the different dimensions of width and height to archive different layouts.

        -

        The following example shows the control with its width set to ResizePolicy::FILL_TO_PARENT and its height set to ResizePolicy::FIT_TO_CHILDREN. It has the imageView added to it with an explicit call to USE_NATURAL_SIZE in both dimensions. This creates the control that fills the space of its parent in the width dimension and fits its child in the height dimension. As the imageView child is using its natural size, the height of the control fits the height of the child image.

        +

        The following example shows the control with its width set to ResizePolicy::FILL_TO_PARENT and its height set to ResizePolicy::FIT_TO_CHILDREN. It has the imageView added to it with an explicit call to USE_NATURAL_SIZE in both dimensions. This creates the control that fills the space of its parent in the width dimension and fits its child in the height dimension. As the imageView child is using its natural size, the height of the control fits the height of the child image.

         Control control = Control::New();
@@ -132,8 +132,8 @@ control.Add( imageView );
 
 
        The following figure shows the before and after layouts for this code example.
        
 
-
        Figure: Before and after setting the resize policy
          
-	
        Before and after setting the resize policy Before and after setting the resize policy
         
+
        Figure: Before and after setting the resize policy
        
+	
        Before and after setting the resize policy Before and after setting the resize policy
        
 
 
        Adjusting the Negotiated Size
        
 
@@ -150,16 +150,16 @@ control.Add( imageView );
 
 
        Using Actors in Containers
        
 
-
        When using actors in containers, such as a table view, you can specify the padding surrounding the actor with the SetPadding() function. The padding specifies the left, right, bottom, and top padding value.
         
+
        When using actors in containers, such as a table view, you can specify the padding surrounding the actor with the SetPadding() function. The padding specifies the left, right, bottom, and top padding value.
        
 
 
        
 	Note
 	Beware of infinite dependency loops!
-
        For example, when the resize policy of a parent actor is set to ResizePolicy::FIT_TO_CHILDREN with a child that has a resize policy of ResizePolicy::FILL_TO_PARENT, an infinite loop occurs.
         
-
        Similarly, consider a situation where a parent actor has a width policy of ResizePolicy::DIMENSION_DEPENDENCY with a height policy of ResizePolicy::FIT_TO_CHILDREN. If the parent has a single child with a height policy ResizePolicy::DIMENSION_DEPENDENCY with width, and the child's width policy is ResizePolicy::FILL_TO_PARENT, a loop occurs.
        
+
        For example, when the resize policy of a parent actor is set to ResizePolicy::FIT_TO_CHILDREN with a child that has a resize policy of ResizePolicy::FILL_TO_PARENT, an infinite loop occurs.
        
+
        Similarly, consider a situation where a parent actor has a width policy of ResizePolicy::DIMENSION_DEPENDENCY with a height policy of ResizePolicy::FIT_TO_CHILDREN. If the parent has a single child with a height policy ResizePolicy::DIMENSION_DEPENDENCY with width, and the child's width policy is ResizePolicy::FILL_TO_PARENT, a loop occurs.
        
 
        Loops can occur over larger spreads of parent-child relationships. These loops are detected by the relayout algorithm, which allocates the actors 0 sizes.
        
 
        
-    
+
 
 
 
diff --git a/org.tizen.guides/html/native/ui/dali/model3dview_n.htm b/org.tizen.guides/html/native/ui/dali/model3dview_n.htm
index 3732318..9d3e9a5 100644
--- a/org.tizen.guides/html/native/ui/dali/model3dview_n.htm
+++ b/org.tizen.guides/html/native/ui/dali/model3dview_n.htm
@@ -5,7 +5,7 @@
 	
 	
 	
-		
+	
 	
 	
 	
@@ -67,7 +67,7 @@ Stage::GetCurrent().Add( model3dView );
 
        Modifying Model3dView Properties
        
 
 
        You can modify the Model3dView appearance and behavior through its properties. To change a property from its default value, use the SetProperty() function.
        
-  
+
       
        
         Note
         The resource properties require absolute references as their paths. However, the root resource path for your application can be obtained through the app_get_resource_path() function of the App Common API (in mobile and wearable applications), and relative paths can be appended to that root path. If you want to use relative paths, you must specify them in your build files.
@@ -164,7 +164,7 @@ Stage::GetCurrent().Add( model3dView );
 
        Figure: Illumination models
        
 
        DIFFUSE model DIFFUSE_WITH_TEXTURE model
        
 
        DIFFUSE_WITH_NORMAL_MAP model
        
-  
+
 
 
 
        
diff --git a/org.tizen.guides/html/native/ui/dali/multi_threaded_n.htm b/org.tizen.guides/html/native/ui/dali/multi_threaded_n.htm
index 4513903..cdfd8f3 100644
--- a/org.tizen.guides/html/native/ui/dali/multi_threaded_n.htm
+++ b/org.tizen.guides/html/native/ui/dali/multi_threaded_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Multi-threaded Architecture  
+	Multi-threaded Architecture
 
 
 
@@ -28,8 +28,8 @@
 		
 		
        Content
        
 		
 		
        Related Info
        
 		
 	
-	
+
 
 
        
 
        Multi-threaded Architecture
        
@@ -50,7 +50,7 @@
        
      9. Resource thread: Loads images and decodes them into bitmaps.
        10. 
 
 
-
        Figure: DALi thread architecture
         
+
        Figure: DALi thread architecture
        
        
        DALi thread architecture
        
 
 
@@ -62,9 +62,9 @@
 
 
        The following figure shows an actor hierarchy, in which one of the actors is being animated. The green objects in are created by the application code, while the blue private objects are used in the dedicated render thread.
        
 
-
        Figure: Actor hierarchy with an animation
         
-	
        Actor hierarchy with an animation
         
- 
+
        Figure: Actor hierarchy with an animation
        
+	
        Actor hierarchy with an animation
        
+
 
        Reading an Animated Value
        
 
 
        When a property is animatable, it can only be modified in the render thread. The value returned from a getter function is the value used when the previous frame was rendered.
        
@@ -79,33 +79,33 @@ actor.SetPosition( Vector3( 10, 10, 10 ) );
 
 Vector3 current;
 current = actor.GetCurrentPosition();
-std::cout << "Current position: " << current.x << ", " << current.y
-          << ", " << current.z << std::endl;
+std::cout << "Current position: " << current.x << ", " << current.y
+          << ", " << current.z << std::endl;
 
-std::cout << "..." << std::endl;
+std::cout << "..." << std::endl;
 
 // Handling another event
 
 current = actor.GetCurrentPosition();
-std::cout << "Current position: " << current.x << ", " << current.y
-          << ", " << current.z << std::endl;
+std::cout << "Current position: " << current.x << ", " << current.y
+          << ", " << current.z << std::endl;

        The above code is likely to output:

         Actor actor = Actor::New();
-"Current position: 0,0,0"
+"Current position: 0,0,0"
 // Other positions
-"Current position: 10,10,10"
+"Current position: 10,10,10"

        Setting a Property during an Animation

        When a property is being animated, the animation overrides all values set with other functions, such as the SetPosition() function.

        -

        Figure: Actor hierarchy with an animated property

        -

        Actor hierarchy with an animated property

        - +

        Figure: Actor hierarchy with an animated property

        +

        Actor hierarchy with an animated property

        +

        The order of execution in the render thread is:

        1. Process the message and call the SetPosition() function.
          2. @@ -113,12 +113,12 @@ Actor actor = Actor::New();
        2. Render the frame.
        -

        Resource Loading with Multi-threading

        +

        Resource Loading with Multi-threading

        + +

        DALi loads resources in separate threads. If these resource threads are not used, a large image file causes a block in the main thread, which cannot process the next operation while reading data from a file system or downloading from the network.

        -

        DALi loads resources in separate threads. If these resource threads are not used, a large image file causes a block in the main thread, which cannot process the next operation while reading data from a file system or downloading from the network.

        +

        Currently, DALi creates one thread for loading local resources and another for loading remote resources, as required.

        -

        Currently, DALi creates one thread for loading local resources and another for loading remote resources, as required.

        - diff --git a/org.tizen.guides/html/native/ui/dali/properties_n.htm b/org.tizen.guides/html/native/ui/dali/properties_n.htm index ecb5a12..fe3683a 100644 --- a/org.tizen.guides/html/native/ui/dali/properties_n.htm +++ b/org.tizen.guides/html/native/ui/dali/properties_n.htm @@ -5,13 +5,13 @@ - + - Properties + Properties @@ -30,7 +30,7 @@

        Related Info

        - +

        Properties

        @@ -91,18 +91,18 @@ 
         Actor actor = Actor::New();
-actor.SetName( "test actor" );
-std::cout << actor.GetName() << std::endl; // "test actor"
+actor.SetName( "test actor" );
+std::cout << actor.GetName() << std::endl; // "test actor"
 
         Actor actor = Actor::New();
-actor.SetProperty( Actor::Property::NAME, "test actor" );
-// "test actor"
+actor.SetProperty( Actor::Property::NAME, "test actor" );
+// "test actor"
 std::cout << actor.GetProperty( Actor::Property::NAME ) << std::endl;
-// "test actor"
+// "test actor"
 std::cout << actor.GetProperty<std::string>( Actor::Property::NAME ) << std::endl;
-// "test actor"
+// "test actor"
 std::cout << actor.GetProperty( Actor::Property::NAME ).Get<std::string>() << std::endl;
        @@ -116,35 +116,35 @@ std::cout << actor.GetProperty( Actor::Property::NAME ).Get<std::string 
         void Create( Application& application )
 {
-  for( int i = 0; i < 5; ++i )
-  {
-    Toolkit::PushButton button = Toolkit::PushButton::New();
-    button.SetSize( 100, 100 );
-    button.SetPosition( 100*i+50, 50 );
-    button.ClickedSignal().Connect( this, OnButtonClicked );
-
-    // Register a custom property having button index
-    // Store the property index so you can look it up later
-    // Note: This is much faster than looking the property up by property name
-    // and must be used if possible
-    // As all control types are the same (PushButtons),
-    // the indices to the unique custom property are all same
-    Property::Value data( i );
-    mCustomDataIndex = button.RegisterProperty( "custom-data", data );
-
-    Stage::GetCurrent().Add( button );
-  }
+  for( int i = 0; i < 5; ++i )
+  {
+    Toolkit::PushButton button = Toolkit::PushButton::New();
+    button.SetSize( 100, 100 );
+    button.SetPosition( 100*i+50, 50 );
+    button.ClickedSignal().Connect( this, OnButtonClicked );
+
+    // Register a custom property having button index
+    // Store the property index so you can look it up later
+    // Note: This is much faster than looking the property up by property name
+    // and must be used if possible
+    // As all control types are the same (PushButtons),
+    // the indices to the unique custom property are all same
+    Property::Value data( i );
+    mCustomDataIndex = button.RegisterProperty( "custom-data", data );
+
+    Stage::GetCurrent().Add( button );
+  }
 }
 
 bool OnButtonClicked( Toolkit::Button button )
 {
-  // Look up the custom property by the stored property index
-  // Note: If the property belongs to a control in another library, 
-  // or you do not know the index, you can look the index up first with:
-  // Property::Index index = button.GetPropertyIndex( "custom-data" );
-  cout << button.GetProperty( mCustomDataIndex ) << endl;
+  // Look up the custom property by the stored property index
+  // Note: If the property belongs to a control in another library,
+  // or you do not know the index, you can look the index up first with:
+  // Property::Index index = button.GetPropertyIndex( "custom-data" );
+  cout << button.GetProperty( mCustomDataIndex ) << endl;
 
-  return true;
+  return true;
 }
        @@ -160,7 +160,7 @@ RadioButton actor = RadioButton::New(); Stage::GetCurrent().Add( actor ); Animation animation = Animation::New( 2.0f ); // Duration 2 seconds animation.AnimateTo( Property( actor, Actor::Property::POSITION ), -                     Vector3( 100.0f, 200.0f, 0.0f ) ); + Vector3( 100.0f, 200.0f, 0.0f ) ); animation.Play(); @@ -172,7 +172,7 @@ animation.Play(); 
         Constraint constraint = Constraint::New<Vector3>( actor, Actor::Property::SIZE,
-                                                  EqualToConstraint() );
+                                                  EqualToConstraint() );
 constraint.AddSource( ParentSource( Actor::Property::SIZE ) );
 constraint.Apply();
        @@ -182,19 +182,19 @@ constraint.Apply();

        A property has the following attributes:

        -
          -
        • Index: Enumeration number indicating the property. The property index is usually used to access properties.
          • +
            +
          • Index: Enumeration number indicating the property. The property index is usually used to access properties.
            • -
          • Type: Type of the property. Retrieved with the Dali::Handle::GetPropertyType() function.
            • +
          • Type: Type of the property. Retrieved with the Dali::Handle::GetPropertyType() function.
            • -
          • Name: Name of the property. Retrieved with the Dali::Handle::GetPropertyName() function.
            • +
          • Name: Name of the property. Retrieved with the Dali::Handle::GetPropertyName() function.
            • -
          • Writable: If true, the property value can be written. Retrieved with the Dali::Handle::IsPropertyWritable() function.
            • +
          • Writable: If true, the property value can be written. Retrieved with the Dali::Handle::IsPropertyWritable() function.
            • -
          • Animatable: If true, the property can be animated using the Dali::Animation class. Retrieved with the Dali::Handle::IsPropertyAnimatable() function.
            • +
          • Animatable: If true, the property can be animated using the Dali::Animation class. Retrieved with the Dali::Handle::IsPropertyAnimatable() function.
            • -
          • Constraint-Input: If true, the property can be used as constraint input. Retrieved with the Dali::Handle::IsPropertyAConstraintInput() function.
            • -
          +
        • Constraint-Input: If true, the property can be used as constraint input. Retrieved with the Dali::Handle::IsPropertyAConstraintInput() function.
          • +

        The following table lists the type and name attributes of the Dali::Actor properties.

        Table: Dali::Actor property attributes

        @@ -208,34 +208,34 @@ constraint.Apply();
        - + - + - + - + - +
        ResizePolicy::FILL_TO_PARENTThe size of the actor is similar to its parent's size with proportionate filling considered.The size of the actor is similar to its parent's size with proportionate filling considered. captured screen2
        ResizePolicy::SIZE_RELATIVE_TO_PARENTThe size of the actor is similar to its parent's size with a relative scale. Use the SetSizeModeFactor() function to specify the ratio.The size of the actor is similar to its parent's size with a relative scale. Use the SetSizeModeFactor() function to specify the ratio.
        ResizePolicy::SIZE_FIXED_OFFSET_FROM_PARENTThe size of the actor is similar to its parent's size with a fixed offset using the SetSizeModeFactor() function.The size of the actor is similar to its parent's size with a fixed offset using the SetSizeModeFactor() function.
        Dali::Actor::POSITION Vector3"position""position"
        Dali::Actor::ORIENTATION Quaternion"orientation""orientation"
        Dali::Actor::SIZE Vector3"size""size"
        Dali::Actor::COLOR Vector4"color""color"
        Dali::Actor::NAME std::string"name""name"

        For more information about properties, see the API reference of each class. For example, for the Dali::Actor class, see the Dali::Actor::Property struct (in mobile and wearable applications). For information on the supported property types, see Dali::Property::Type (in mobile and wearable applications) and Dali::PropertyTypes (in mobile and wearable applications).

        - + diff --git a/org.tizen.guides/html/native/ui/dali/rendering_effects_n.htm b/org.tizen.guides/html/native/ui/dali/rendering_effects_n.htm index 760af10..a5e1e13 100644 --- a/org.tizen.guides/html/native/ui/dali/rendering_effects_n.htm +++ b/org.tizen.guides/html/native/ui/dali/rendering_effects_n.htm @@ -5,7 +5,7 @@ - + @@ -37,7 +37,7 @@
      10. Dali::Stage API for Wearable Native
        11. - +

        Rendering and Effects

        @@ -51,18 +51,18 @@

        MONO is the default viewing mode. When using the MONO mode, only 1 image per scene is produced in every update. In this setup, DALi creates a default render task, which renders everything added to the stage root layer, and 1 default camera for that render task.

        -

        The STEREO_HORIZONTAL and STEREO_VERTICAL modes allow the application to produce stereo images. Stereoscopy is a technique for creating or enhancing the illusion of depth in an image. Stereo rendering technique produces 2 images of the scene with an slight offset between them, which is presented to the left and the right eye independently. In this setup, DALi creates 2 additional render tasks, 1 for the right eye and 1 for the left, each with its own camera. Those cameras are parented to the default camera. The method to generate the projection transformation for each camera is known as "parallel axis asymmetric frustum perspective projection" and is illustrated in the following figure.

        +

        The STEREO_HORIZONTAL and STEREO_VERTICAL modes allow the application to produce stereo images. Stereoscopy is a technique for creating or enhancing the illusion of depth in an image. Stereo rendering technique produces 2 images of the scene with an slight offset between them, which is presented to the left and the right eye independently. In this setup, DALi creates 2 additional render tasks, 1 for the right eye and 1 for the left, each with its own camera. Those cameras are parented to the default camera. The method to generate the projection transformation for each camera is known as "parallel axis asymmetric frustum perspective projection" and is illustrated in the following figure.

        + +

        Figure: Stereoscopic projection

        +

        Stereoscopic projection

        -

        Figure: Stereoscopic projection

        -

        Stereoscopic projection

        - -

        The separation between the 2 cameras is configurable but, typically, it ranges between 50 and 70 millimeters. Too large a separation can be hard to resolve and is known as hyperstereo. The convergence plane for both frustums is the 2D plane, so the projection of anything lying in the 2D plane is coincident for both left and right eye, resulting in no parallax. Objects that lie in front of the projection plane appear to be in front of the screen and objects behind the projection plane appear to be "into" the screen. Objects behind the projection plane (positive parallax) are easier to look at without straining the eyes.

        +

        The separation between the 2 cameras is configurable but, typically, it ranges between 50 and 70 millimeters. Too large a separation can be hard to resolve and is known as hyperstereo. The convergence plane for both frustums is the 2D plane, so the projection of anything lying in the 2D plane is coincident for both left and right eye, resulting in no parallax. Objects that lie in front of the projection plane appear to be in front of the screen and objects behind the projection plane appear to be "into" the screen. Objects behind the projection plane (positive parallax) are easier to look at without straining the eyes.

        To view stereoscopic images correctly, each image must be presented to each eye independently. There are devices on the market for this, such as a head-mounted display, which is a display device worn in the head that has 2 small displays, one for each eye. A cheaper alternative to this often expensive device is the Google cardboard viewer.

        -

        Figure: Google cardboard viewer

        -

        Google cardboard viewer

        - +

        Figure: Google cardboard viewer

        +

        Google cardboard viewer

        +

        With the Google cardboard viewer or a similar device, you can transform your phone into a basic virtual reality headset.

        For more information about DALi rendering and practical examples of rendering shapes and SVG graphics, see Shape Drawing and SVG Rendering.

        @@ -83,18 +83,18 @@ 
         Dali::RenderTask defaultRenderTask =
-  Dali::Stage::GetCurrent().GetRenderTaskList().GetTask( 0 ); 
+  Dali::Stage::GetCurrent().GetRenderTaskList().GetTask( 0 );
 Dali::CameraActor defaultCamera = defaultRenderTask.GetCameraActor();
        -
      11. Stereo render tasks render everything added to the stage's root layer. If the application must render an object hierarchy to an off-screen buffer, it must set the exclusive flag on that render task so that the stereo tasks do not render that particular subtree. To set the exclusive flag in a render task, use the SetExclusive() function defined in the render task.
        12. +
      12. Stereo render tasks render everything added to the stage's root layer. If the application must render an object hierarchy to an off-screen buffer, it must set the exclusive flag on that render task so that the stereo tasks do not render that particular subtree. To set the exclusive flag in a render task, use the SetExclusive() function defined in the render task.
        13. Note DALi stereoscopic viewing mode is still under development, and may not be mature enough for commercialized applications at the moment. For example, distortion correction is not supported yet. Tizen continues to improve the stereoscopic mode to give you a chance to provide more exciting and immersive user experience to your customers.
        - +
        diff --git a/org.tizen.guides/html/native/ui/dali/rendering_tutorial_n.htm b/org.tizen.guides/html/native/ui/dali/rendering_tutorial_n.htm index 18084c1..e0e6de0 100644 --- a/org.tizen.guides/html/native/ui/dali/rendering_tutorial_n.htm +++ b/org.tizen.guides/html/native/ui/dali/rendering_tutorial_n.htm @@ -5,7 +5,7 @@ - + @@ -62,27 +62,27 @@ 
         const char* VERTEX_SHADER = DALI_COMPOSE_SHADER(
-  attribute mediump vec2 aPosition;
-  uniform mediump mat4 uMvpMatrix;
-  uniform mediump vec3 uSize;
-  void main()
-  {
-    mediump vec4 vertexPosition = vec4( aPosition, 0.0, 1.0 );
-    vertexPosition.xyz *= uSize;
-    gl_Position = uMvpMatrix * vertexPosition;
-  }
+  attribute mediump vec2 aPosition;
+  uniform mediump mat4 uMvpMatrix;
+  uniform mediump vec3 uSize;
+  void main()
+  {
+    mediump vec4 vertexPosition = vec4( aPosition, 0.0, 1.0 );
+    vertexPosition.xyz *= uSize;
+    gl_Position = uMvpMatrix * vertexPosition;
+  }
 );
        -
      13. The fragment shader applies the actor's color: +
      14. The fragment shader applies the actor's color: 
         const char* FRAGMENT_SHADER = DALI_COMPOSE_SHADER(
-  uniform lowp vec4 uColor;
-  void main()
-  {
-    gl_FragColor = uColor;
-  }
+  uniform lowp vec4 uColor;
+  void main()
+  {
+    gl_FragColor = uColor;
+  }
 );
      @@ -93,14 +93,14 @@ const char* FRAGMENT_SHADER = DALI_COMPOSE_SHADER( 
       Property::Map vertexFormat;
-vertexFormat["aPosition"] = Property::VECTOR2;
+vertexFormat["aPosition"] = Property::VECTOR2;
 PropertyBuffer vertices = PropertyBuffer::New( vertexFormat );
 
 struct Vertex { Vector2 position1; };
 Vertex vertexData[2] =
 {
-  { Vector2(  0.5f, 0.5f) },
-  { Vector2( -0.5f, -0.5f) }
+  { Vector2(  0.5f, 0.5f) },
+  { Vector2( -0.5f, -0.5f) }
 };
 const unsigned short INDEX_LINES[] = { 0, 1 };
 vertices.SetData( vertexData, 2 );
@@ -138,14 +138,14 @@ stage.Add( actor );
 
 
      Drawing a Triangle
      
 
-
      To draw a triangle, use the same shader and renderer set-up as in the previous "Drawing a Line" example, and simply modify the geometry to draw the triangle:
      
+
      To draw a triangle, use the same shader and renderer set-up as in the previous "Drawing a Line" example, and simply modify the geometry to draw the triangle:
      
 
 
       Vertex vertexData[3] =
 {
-  { Vector2(  0.45f, 0.45f) },
-  { Vector2( -0.45f, 0.45f) },
-  { Vector2(  0.0f, -0.45f) }
+  { Vector2(  0.45f, 0.45f) },
+  { Vector2( -0.45f, 0.45f) },
+  { Vector2(  0.0f, -0.45f) }
 };
 const unsigned short INDEX_TRIANGLES[] = { 0, 1, 2 };
 vertices.SetData( vertexData, 3 );
@@ -153,7 +153,7 @@ vertices.SetData( vertexData, 3 );
 Geometry geometry = Geometry::New();
 geometry.AddVertexBuffer( vertices );
 geometry.SetIndexBuffer( &INDEX_TRIANGLES[0],
-                         sizeof(INDEX_TRIANGLES)/sizeof(INDEX_TRIANGLES[0]) );
+                         sizeof(INDEX_TRIANGLES)/sizeof(INDEX_TRIANGLES[0]) );
 geometry.SetType( Geometry::TRIANGLES );
 
      
 
@@ -173,18 +173,18 @@ geometry.SetType( Geometry::TRIANGLES );
 
 
       const char* VERTEX_SHADER = DALI_COMPOSE_SHADER(
-  attribute mediump vec3 aPosition;
-  attribute mediump vec3 aColor;
-  uniform mediump mat4 uMvpMatrix;
-  uniform mediump vec3 uSize;
-  varying mediump vec4 vColor;
-  void main()
-  {
-    mediump vec4 vertexPosition = vec4( aPosition, 1.0 );
-    vertexPosition.xyz *= uSize;
-    gl_Position = uMvpMatrix * vertexPosition;
-    vColor = vec4( aColor, 1.0 );
-  }
+  attribute mediump vec3 aPosition;
+  attribute mediump vec3 aColor;
+  uniform mediump mat4 uMvpMatrix;
+  uniform mediump vec3 uSize;
+  varying mediump vec4 vColor;
+  void main()
+  {
+    mediump vec4 vertexPosition = vec4( aPosition, 1.0 );
+    vertexPosition.xyz *= uSize;
+    gl_Position = uMvpMatrix * vertexPosition;
+    vColor = vec4( aColor, 1.0 );
+  }
 );
      2. @@ -192,11 +192,11 @@ const char* VERTEX_SHADER = DALI_COMPOSE_SHADER( 
       const char* FRAGMENT_SHADER = DALI_COMPOSE_SHADER(
-  varying mediump vec4 vColor;
-  void main()
-  {
-    gl_FragColor = vColor;
-  }
+  varying mediump vec4 vColor;
+  void main()
+  {
+    gl_FragColor = vColor;
+  }
 );
    @@ -207,50 +207,50 @@ const char* FRAGMENT_SHADER = DALI_COMPOSE_SHADER( 
     Property::Map vertexFormat;
-vertexFormat["aPosition"] = Property::VECTOR3;
-vertexFormat["aColor"] = Property::VECTOR3;
+vertexFormat["aPosition"] = Property::VECTOR3;
+vertexFormat["aColor"] = Property::VECTOR3;
 PropertyBuffer vertices = PropertyBuffer::New( vertexFormat );
 
 struct Vertex
 {
-  Vector3 position;
-  Vector3 color;
+  Vector3 position;
+  Vector3 color;
 };
 
 Vertex vertexData[24] =
 {
-  { Vector3( -0.5, -0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
-  { Vector3(  0.5, -0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
-  { Vector3( -0.5,  0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
-  { Vector3(  0.5,  0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
-  { Vector3( -0.5, -0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
-  { Vector3(  0.5, -0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
-  { Vector3( -0.5,  0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
-  { Vector3(  0.5,  0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
-  { Vector3( -0.5, -0.5, -0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
-  { Vector3(  0.5, -0.5, -0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
-  { Vector3( -0.5, -0.5,  0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
-  { Vector3(  0.5, -0.5,  0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
-  { Vector3( -0.5,  0.5, -0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
-  { Vector3(  0.5,  0.5, -0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
-  { Vector3( -0.5,  0.5,  0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
-  { Vector3(  0.5,  0.5,  0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
-  { Vector3( -0.5, -0.5, -0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
-  { Vector3( -0.5,  0.5, -0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
-  { Vector3( -0.5, -0.5,  0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
-  { Vector3( -0.5,  0.5,  0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
-  { Vector3(  0.5, -0.5, -0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
-  { Vector3(  0.5,  0.5, -0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
-  { Vector3(  0.5, -0.5,  0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
-  { Vector3(  0.5,  0.5,  0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
+  { Vector3( -0.5, -0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
+  { Vector3(  0.5, -0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
+  { Vector3( -0.5,  0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
+  { Vector3(  0.5,  0.5,  0.5 ), Vector3( 1.0, 0.0, 0.0 ) },
+  { Vector3( -0.5, -0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
+  { Vector3(  0.5, -0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
+  { Vector3( -0.5,  0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
+  { Vector3(  0.5,  0.5, -0.5 ), Vector3( 0.0, 1.0, 0.0 ) },
+  { Vector3( -0.5, -0.5, -0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
+  { Vector3(  0.5, -0.5, -0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
+  { Vector3( -0.5, -0.5,  0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
+  { Vector3(  0.5, -0.5,  0.5 ), Vector3( 0.0, 0.0, 1.0 ) },
+  { Vector3( -0.5,  0.5, -0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
+  { Vector3(  0.5,  0.5, -0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
+  { Vector3( -0.5,  0.5,  0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
+  { Vector3(  0.5,  0.5,  0.5 ), Vector3( 1.0, 1.0, 0.0 ) },
+  { Vector3( -0.5, -0.5, -0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
+  { Vector3( -0.5,  0.5, -0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
+  { Vector3( -0.5, -0.5,  0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
+  { Vector3( -0.5,  0.5,  0.5 ), Vector3( 1.0, 0.0, 1.0 ) },
+  { Vector3(  0.5, -0.5, -0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
+  { Vector3(  0.5,  0.5, -0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
+  { Vector3(  0.5, -0.5,  0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
+  { Vector3(  0.5,  0.5,  0.5 ), Vector3( 0.0, 1.0, 1.0 ) },
 };
 
 const unsigned short INDEX_CUBE[] = { 0,  2,  3,  0,  3,  1,
-                                      5,  7,  6,  5,  6,  4,
-                                      8, 10, 11,  8, 11,  9,
-                                      14, 12, 13, 14, 13, 15,
-                                      16, 17, 19, 16, 19, 18,
-                                      22, 23, 21, 22, 21, 20 };
+                                      5,  7,  6,  5,  6,  4,
+                                      8, 10, 11,  8, 11,  9,
+                                      14, 12, 13, 14, 13, 15,
+                                      16, 17, 19, 16, 19, 18,
+                                      22, 23, 21, 22, 21, 20 };
 
 vertices.SetData( vertexData, 24 );
 
@@ -278,9 +278,9 @@ stage.Add( actor );
 
 mAnimation = Animation::New( 10.0f );
 mAnimation.AnimateTo( Property( actor, Actor::Property::ORIENTATION ),
-                      Quaternion( Radian( Degree( 180 ) ), Vector3::ZAXIS ) );
+                      Quaternion( Radian( Degree( 180 ) ), Vector3::ZAXIS ) );
 mAnimation.AnimateTo( Property( actor, Actor::Property::ORIENTATION ),
-                      Quaternion( Radian( Degree( 180 ) ), Vector3::YAXIS ) );
+                      Quaternion( Radian( Degree( 180 ) ), Vector3::YAXIS ) );
 mAnimation.Play();
    diff --git a/org.tizen.guides/html/native/ui/dali/resources_n.htm b/org.tizen.guides/html/native/ui/dali/resources_n.htm index 8da2c30..bf75cf9 100644 --- a/org.tizen.guides/html/native/ui/dali/resources_n.htm +++ b/org.tizen.guides/html/native/ui/dali/resources_n.htm @@ -5,13 +5,13 @@ - + - Resources + Resources @@ -39,7 +39,7 @@
  • DALi::ResourceImage API for Wearable Native
    • - +

    Resources

    @@ -52,7 +52,7 @@

    You can load an image file with the ResourceImage class by specifying its location:

    -Dali::ResourceImage image = Dali::ResourceImage::New( "/my-path/my-image.png" );
+Dali::ResourceImage image = Dali::ResourceImage::New( "/my-path/my-image.png" );

    The loaded image can be displayed using the ImageView component:

    @@ -93,33 +93,33 @@ Stage::GetCurrent().Add( imageView ); 
     class ResourceImageController : public ConnectionTracker
 {
-  public:
-    ResourceImageController( Application& application ) : mApplication( application )
-    {
-      mApplication.InitSignal().Connect( this, &ResourceImageController::Create );
-    }
-
-    void Create( Application& application )
-    {
-      ResourceImage image =
-        ResourceImage::New( "https://www.tizen.org/sites/default/files/admins/tizen-branding-lockup-on-light.png" );
-      image.LoadingFinishedSignal().Connect( this,
-                                             &ResourceImageController::OnLoadFinished );
-
-      ImageView imageView = ImageView::New( image );
-      imageView.SetSize( 400, 200 );
-      imageView.SetParentOrigin( ParentOrigin::CENTER );
-      Stage::GetCurrent().Add( imageView );
-    }
-
-    void OnLoadFinished( ResourceImage image )
-    {
-      LoadingState state = image.GetLoadingState();
-      if( state == ResourceLoadingSucceeded )
-         cout << "Loading " << image.GetUrl() << " succeeded" << endl;
-      else if( state == ResourceLoadingFailed )
-         cout << "Loading " << image.GetUrl() << " failed" << endl;
-    }
+  public:
+    ResourceImageController( Application& application ) : mApplication( application )
+    {
+      mApplication.InitSignal().Connect( this, &ResourceImageController::Create );
+    }
+
+    void Create( Application& application )
+    {
+      ResourceImage image =
+        ResourceImage::New( "https://www.tizen.org/sites/default/files/admins/tizen-branding-lockup-on-light.png" );
+      image.LoadingFinishedSignal().Connect( this,
+                                             &ResourceImageController::OnLoadFinished );
+
+      ImageView imageView = ImageView::New( image );
+      imageView.SetSize( 400, 200 );
+      imageView.SetParentOrigin( ParentOrigin::CENTER );
+      Stage::GetCurrent().Add( imageView );
+    }
+
+    void OnLoadFinished( ResourceImage image )
+    {
+      LoadingState state = image.GetLoadingState();
+      if( state == ResourceLoadingSucceeded )
+         cout << "Loading " << image.GetUrl() << " succeeded" << endl;
+      else if( state == ResourceLoadingFailed )
+         cout << "Loading " << image.GetUrl() << " failed" << endl;
+    }
 };
    @@ -133,7 +133,7 @@ class ResourceImageController : public ConnectionTracker 
     Dali::Image image = Dali::ResourceImage::New( filename, ImageDimensions( 240, 240 ),
-                                              FittingMode::SCALE_TO_FILL );
+                                              FittingMode::SCALE_TO_FILL );

    This example sets the size and fitting mode appropriately for a large thumbnail during the Dali::ResourceImage object construction. In general, to enable scaling on load, pass a non-zero width or height and one of the 4 fitting modes to the Dali::ResourceImage creator function as shown above.

    @@ -172,7 +172,7 @@ Dali::Image image = Dali::ResourceImage::New( filename, ImageDimensions( 240, 24 
     Dali::ImageDimensions dimensions =
-  Dali::ResourceImage::GetImageSize( "/my-path/my-image.png" );
+  Dali::ResourceImage::GetImageSize( "/my-path/my-image.png" );

    This is a disk-read operation, which can be slow and block the event thread. This operation is currently not supported for remote resources, such as HTTP or HTTPS URLs.

    @@ -186,7 +186,7 @@ Dali::ImageDimensions dimensions = Dali::BufferImage image = Dali::BufferImage::New( 200, 200 ); - +
    diff --git a/org.tizen.guides/html/native/ui/dali/scrollview_n.htm b/org.tizen.guides/html/native/ui/dali/scrollview_n.htm index 834f0c9..e292c63 100644 --- a/org.tizen.guides/html/native/ui/dali/scrollview_n.htm +++ b/org.tizen.guides/html/native/ui/dali/scrollview_n.htm @@ -5,13 +5,13 @@ - + - ScrollView + ScrollView @@ -61,7 +61,7 @@

    The following figure shows example layouts using the ScrollView.

    -

    Figure: ScrollView

    +

    Figure: ScrollView

    ScrollView

    @@ -76,47 +76,47 @@ // class in Creating a DALi Application void HelloWorldExample::Create( Application& application ) { -  // Create a ScrollView instance -  ScrollView scrollView = ScrollView::New(); -  scrollView.SetParentOrigin( ParentOrigin::CENTER ); -  Stage::GetCurrent().Add( scrollView ); - -  // Set the size of scrollView; -  // it covers the entire stage -  Size size = Stage::GetCurrent().GetSize(); -  scrollView.SetSize( size ); - -  // Add actors to the ScrollView -  for( int i; i < MY_ITEM_COUNT; ++i ) -  { -    ImageView imageView = ImageView::New( MY_IMAGE_PATHS[i] ); -    imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT ); -    imageView.SetPosition( i * size.x, 0.0f ); -    scrollView.Add( imageView ); -  } - -  // ScrollView contents are now draggable - -  // To enforce horizontal-only scrolling, -  // the Y axis ruler can be disabled -  RulerPtr rulerY = new DefaultRuler(); -  rulerY->Disable(); -  scrollView.SetRulerY( rulerY ); - -  // To enable snapping, a FixedRuler can be -  // applied to the X axis,with snap -  // points spaced to the width of the stage -  RulerPtr rulerX1 = new FixedRuler( size.width ); -  scrollView.SetRulerX( rulerX1 ); - -  // Domain can be applied to rulers to prevent -  // scrolling beyond this boundary -  // In this case, to 4 times the width of the -  // stage, allowing for 4 pages to be scrolled -  RulerPtr rulerX2 = new FixedRuler( size.width ); -  rulerX2->SetDomain( RulerDomain( 0.0f, -                      size.width*4.0f ) ); -  scrollView.SetRulerX( rulerX2 ); + // Create a ScrollView instance + ScrollView scrollView = ScrollView::New(); + scrollView.SetParentOrigin( ParentOrigin::CENTER ); + Stage::GetCurrent().Add( scrollView ); + + // Set the size of scrollView; + // it covers the entire stage + Size size = Stage::GetCurrent().GetSize(); + scrollView.SetSize( size ); + + // Add actors to the ScrollView + for( int i; i < MY_ITEM_COUNT; ++i ) + { + ImageView imageView = ImageView::New( MY_IMAGE_PATHS[i] ); + imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT ); + imageView.SetPosition( i * size.x, 0.0f ); + scrollView.Add( imageView ); + } + + // ScrollView contents are now draggable + + // To enforce horizontal-only scrolling, + // the Y axis ruler can be disabled + RulerPtr rulerY = new DefaultRuler(); + rulerY->Disable(); + scrollView.SetRulerY( rulerY ); + + // To enable snapping, a FixedRuler can be + // applied to the X axis,with snap + // points spaced to the width of the stage + RulerPtr rulerX1 = new FixedRuler( size.width ); + scrollView.SetRulerX( rulerX1 ); + + // Domain can be applied to rulers to prevent + // scrolling beyond this boundary + // In this case, to 4 times the width of the + // stage, allowing for 4 pages to be scrolled + RulerPtr rulerX2 = new FixedRuler( size.width ); + rulerX2->SetDomain( RulerDomain( 0.0f, + size.width*4.0f ) ); + scrollView.SetRulerX( rulerX2 ); } @@ -129,7 +129,7 @@ void HelloWorldExample::Create( Application& application )

    The ScrollView behavior depends on a combination of the ruler, ruler domain, and wrap modes. The following table shows ScrollView behavior according to the combination.

    -

    Figure: Ruler, ruler domain, and wrap modes

    +

    Figure: Ruler, ruler domain, and wrap modes

    Ruler, ruler domain, and wrap modes

    Table: Scrollview behavior in the ruler, ruler domain, and wrap mode

    diff --git a/org.tizen.guides/html/native/ui/dali/slider_n.htm b/org.tizen.guides/html/native/ui/dali/slider_n.htm index 6e0bded..38d2236 100644 --- a/org.tizen.guides/html/native/ui/dali/slider_n.htm +++ b/org.tizen.guides/html/native/ui/dali/slider_n.htm @@ -5,7 +5,7 @@ - + @@ -53,7 +53,7 @@ @@ -92,7 +92,7 @@ slider.SetAnchorPoint( AnchorPoint::TOP_LEFT ); slider.SetPosition( 0.0f, mStageHeight * 0.1 ); Stage::GetCurrent().Add( slider ); - +

    Modifying Slider Properties

    You can modify the slider appearance and behavior through its properties.

    @@ -205,8 +205,8 @@ slider.SetProperty( Slider::Property::SHOW_POPUP, true ); 
     // Customize the slider handle
 Property::Map handleVisual;
-handleVisual["size"] = Vector2( 120.0f, 120.0f ); // Set the handle size
-handleVisual["url"] = mImageDirectory + "handle_img.png"; // Set the handle image
+handleVisual["size"] = Vector2( 120.0f, 120.0f ); // Set the handle size
+handleVisual["url"] = mImageDirectory + "handle_img.png"; // Set the handle image
 slider.SetProperty( Slider::Property::HANDLE_VISUAL, handleVisual );
    diff --git a/org.tizen.guides/html/native/ui/dali/styling_n.htm b/org.tizen.guides/html/native/ui/dali/styling_n.htm index f47a8a9..a4efdc0 100644 --- a/org.tizen.guides/html/native/ui/dali/styling_n.htm +++ b/org.tizen.guides/html/native/ui/dali/styling_n.htm @@ -5,7 +5,7 @@ - + @@ -51,7 +51,7 @@
  • You can style particular controls or sub-groups of controls by specifying their style name programmatically.
  • Styles can be inherited and tweaked, so you can create minor updates to existing styles with very little code.
    • -
  • The platform can change the default system font family and logical size. This is handled by the default stylesheets, but it is possible to override this behavior in your own stylesheets. You can also listen to the style manager's StyleChangedSignal() in order to determine when the platform style has changed.
    • +
  • The platform can change the default system font family and logical size. This is handled by the default stylesheets, but it is possible to override this behavior in your own stylesheets. You can also listen to the style manager's StyleChangedSignal() in order to determine when the platform style has changed.

    • Stylesheet Loading

    @@ -63,19 +63,19 @@ 
     int main( int argc, char** argv )
 {
-  Application application = Application::New( &argc, &argv, "stylesheet.json" );
-  {
-    Demo::StylingApplication stylingApplication( application );
-    application.MainLoop();
-  }
+  Application application = Application::New( &argc, &argv, "stylesheet.json" );
+  {
+    Demo::StylingApplication stylingApplication( application );
+    application.MainLoop();
+  }
 
-  return 0;
+  return 0;
 }
  • During runtime, use the Dali::Toolkit::StyleManager::ApplyTheme() function: 
    -StyleManager::Get().ApplyTheme( "stylesheet.json" );
+StyleManager::Get().ApplyTheme( "stylesheet.json" );
    • @@ -135,25 +135,25 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" );

    Constants can also be set programmatically by using the StyleManager::SetStyleConstant() function. However, the function only works after the Application::New() function has been called, so it does not affect stylesheets loaded in the Application::New() function.

    -

    The constants can be used in any string value in the JSON files, delimited by '{' and '}' characters. In the following example, the IMAGE_DIR constant is defined within the stylesheet, and is used to access the unselectedStateImage image path in the Dali::Toolkit::PushButton control:

    +

    The constants can be used in any string value in the JSON files, delimited by '{' and '}' characters. In the following example, the IMAGE_DIR constant is defined within the stylesheet, and is used to access the unselectedStateImage image path in the Dali::Toolkit::PushButton control:

     {
-  "constants": {
-    IMAGE_DIR="{APPLICATION_RESOURCE_PATH}/images"
-  },
-
-  "styles": {
-    "PushButton": {
-      "unselectedStateImage": "{IMAGE_DIR}/button-up.9.png"
-    }
-  }
+  "constants": {
+    IMAGE_DIR="{APPLICATION_RESOURCE_PATH}/images"
+  },
+
+  "styles": {
+    "PushButton": {
+      "unselectedStateImage": "{IMAGE_DIR}/button-up.9.png"
+    }
+  }
 }

    Includes Section

    -

    The includes section allows inclusion of other JSON files into the stylesheet. Note that since this section is a JSON array, it is delimited by square brackets ('[' and ']').

    +

    The includes section allows inclusion of other JSON files into the stylesheet. Note that since this section is a JSON array, it is delimited by square brackets ('[' and ']').

    The content of the included files are merged with the other content of the current stylesheet. If more than one included file supplies values for a particular key-value pair, then the last file has the highest priority.

    @@ -161,14 +161,14 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" ); 
     {
-  "constants": {
-    "INCLUDE_DIR": "include"
-  },
-  "includes":
-  [
-    "{INCLUDE_DIR}/first-include.json",
-    "{INCLUDE_DIR}/second-include.json"
-  ]
+  "constants": {
+    "INCLUDE_DIR": "include"
+  },
+  "includes":
+  [
+    "{INCLUDE_DIR}/first-include.json",
+    "{INCLUDE_DIR}/second-include.json"
+  ]
 }
    @@ -176,20 +176,20 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" );

    To reduce the number of repeated key-values, you can use the mappings section. It contains an object of key-value pairs, where the value is any valid JSON type (so can also form a tree).

    -

    If a value in any section is a JSON string delimited by '<' and '>', it is checked against the keys in the mapping section, and the value is replaced by the mapping.

    +

    If a value in any section is a JSON string delimited by '<' and '>', it is checked against the keys in the mapping section, and the value is replaced by the mapping.

    -

    In the following example, the confirmation popup's backingColor property value becomes the JSON array representing RGBA values, which is converted internally into a Dali::Vector4 when it is applied to an object:

    +

    In the following example, the confirmation popup's backingColor property value becomes the JSON array representing RGBA values, which is converted internally into a Dali::Vector4 when it is applied to an object:

     {
-  "mappings": {
-    "backgroundColor": [0.12, 0.0, 0.25, 1.0]
-  },
-  "styles": {
-    "ConfirmationPopup": {
-      "backingColor": "<backgroundColor>"
-    }
-  }
+  "mappings": {
+    "backgroundColor": [0.12, 0.0, 0.25, 1.0]
+  },
+  "styles": {
+    "ConfirmationPopup": {
+      "backingColor": "<backgroundColor>"
+    }
+  }
 }
    @@ -198,7 +198,7 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" );

    The styles section is the main section of the stylesheet. Each key in this JSON object is a style name, which is used to match against control instances in your application:

    @@ -207,35 +207,35 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" ); 
     {
-  "styles": {
-    "Slider": {
-      "showValue": true,
-      "showPopup": true,
-      "trackVisual": {
-        "url": "{IMAGE_DIR}/slider-skin.9.png",
-        "size": [27, 27]
-      },
-      "progressVisual": {
-        "url": "{IMAGE_DIR}/slider-skin-progress.9.png",
-        "size": [27, 27]
-      },
-      "handleVisual": {
-        "url": "{IMAGE_DIR}/slider-skin-handle.png",
-        "size": [72,72]
-      },
-      "background": {
-        "visualType": "GRADIENT",
-        "startPosition": [0.0, -0.5],
-        "endPosition": [0.0, 0.5],
-        "stopOffset": [0.0, 0.5, 0.75,1.0],
-        "stopColor": [[0.0,0.0,1.0,1.0], [0.0,0.0,0.75,1.0], [0.0,0.0,0.5,1.0],
-                      [1.0,1.0,1.0,0.0]]
-      }
-    },
-    "SliderHandleTextLabel": {
-      "textColor":[0.8, 0.8, 1.0, 1.0]
-    }
-  }
+  "styles": {
+    "Slider": {
+      "showValue": true,
+      "showPopup": true,
+      "trackVisual": {
+        "url": "{IMAGE_DIR}/slider-skin.9.png",
+        "size": [27, 27]
+      },
+      "progressVisual": {
+        "url": "{IMAGE_DIR}/slider-skin-progress.9.png",
+        "size": [27, 27]
+      },
+      "handleVisual": {
+        "url": "{IMAGE_DIR}/slider-skin-handle.png",
+        "size": [72,72]
+      },
+      "background": {
+        "visualType": "GRADIENT",
+        "startPosition": [0.0, -0.5],
+        "endPosition": [0.0, 0.5],
+        "stopOffset": [0.0, 0.5, 0.75,1.0],
+        "stopColor": [[0.0,0.0,1.0,1.0], [0.0,0.0,0.75,1.0], [0.0,0.0,0.5,1.0],
+                      [1.0,1.0,1.0,0.0]]
+      }
+    },
+    "SliderHandleTextLabel": {
+      "textColor":[0.8, 0.8, 1.0, 1.0]
+    }
+  }
 }
    @@ -258,53 +258,53 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" );

    Setting an explicit font size for text controls is generally considered to be a bad idea: the Tizen platform offers 5 levels of logical font size that can be set by the user, and the stylesheet can be used on multiple devices with different screen sizes and resolutions.

    -

    To handle the logical to point size conversion after a settings change, the style manager appends FontSize and the logical value ("0"-"4") to each style name during the update, and uses that style in preference to the control class name or style name if it can find it in the style sheet.

    +

    To handle the logical to point size conversion after a settings change, the style manager appends FontSize and the logical value ("0"-"4") to each style name during the update, and uses that style in preference to the control class name or style name if it can find it in the style sheet.

    This means that you can specify alternative mappings for particular text labels. The following example shows how to map the alternative logical sizes, if you have a text label that has a style name of FolderLabel:

     {
-  "styles": {
-    "FolderLabelFontSize0": {
-      "pointSize": 8
-    },
-    "FolderLabelFontSize1": {
-      "pointSize": 10
-    },
-    "FolderLabelFontSize2": {
-      "pointSize": 12
-    },
-    "FolderLabelFontSize3": {
-      "pointSize": 16
-    },
-    "FolderLabelFontSize4": {
-      "pointSize": 20
-    }
-  }
+  "styles": {
+    "FolderLabelFontSize0": {
+      "pointSize": 8
+    },
+    "FolderLabelFontSize1": {
+      "pointSize": 10
+    },
+    "FolderLabelFontSize2": {
+      "pointSize": 12
+    },
+    "FolderLabelFontSize3": {
+      "pointSize": 16
+    },
+    "FolderLabelFontSize4": {
+      "pointSize": 20
+    }
+  }
 }
  • Using style inheritance -

    It is possible to "inherit" properties from one style into another by specifying the style names in a styles array. More than 1 style can be merged in this way. The inherited styles are first merged in order, and then any properties that follow are merged on top.

    +

    It is possible to "inherit" properties from one style into another by specifying the style names in a styles array. More than 1 style can be merged in this way. The inherited styles are first merged in order, and then any properties that follow are merged on top.

    In the following example, the ColorSlider inherits all of the properties from the slider entry, and changes the background to a gradient:

     {
-  "styles": {
-    "ColorSlider": {
-      "styles": ["Slider"], // Inherit from Slider style
-      "background": {
-        "visualType": "GRADIENT",
-        "startPosition": [0.0, -0.5],
-        "endPosition": [0.0, 0.5],
-        "stopOffset": [0.0, 0.5, 0.75,1.0],
-        "stopColor": [[0.0,0.0,1.0,1.0], [0.0,0.0,0.75,1.0], [0.0,0.0,0.5,1.0],
-                      [1,1,1,0.09]]
-      }
-    }
-  }
+  "styles": {
+    "ColorSlider": {
+      "styles": ["Slider"], // Inherit from Slider style
+      "background": {
+        "visualType": "GRADIENT",
+        "startPosition": [0.0, -0.5],
+        "endPosition": [0.0, 0.5],
+        "stopOffset": [0.0, 0.5, 0.75,1.0],
+        "stopColor": [[0.0,0.0,1.0,1.0], [0.0,0.0,0.75,1.0], [0.0,0.0,0.5,1.0],
+                      [1,1,1,0.09]]
+      }
+    }
+  }
 }
    • @@ -314,18 +314,18 @@ StyleManager::Get().ApplyTheme( "stylesheet.json" ); 
     TextLabel label = TextLabel::New( myLabelText );
-label.SetStyleName( "AppLabel" );
+label.SetStyleName( "AppLabel" );

    You can add the alternative style to the application stylesheet as usual:

     {
-  "styles": {
-    "AppLabel": {
-      "textColor": [0.8, 0.8, 1.0, 1.0]
-    }
-  }
+  "styles": {
+    "AppLabel": {
+      "textColor": [0.8, 0.8, 1.0, 1.0]
+    }
+  }
 }
    @@ -342,11 +342,11 @@ label.SetStyleName( "AppLabel" ); 
     {
-  "styles": {
-    "AppLabel": {
-      "textColor": [0.49, 0.235, 0.596, 1.0]
-    }
-  }
+  "styles": {
+    "AppLabel": {
+      "textColor": [0.49, 0.235, 0.596, 1.0]
+    }
+  }
 }
    @@ -354,11 +354,11 @@ label.SetStyleName( "AppLabel" ); 
     {
-  "styles": {
-    "AppLabel": {
-      "textColor": "#7D3C98"
-    }
-  }
+  "styles": {
+    "AppLabel": {
+      "textColor": "#7D3C98"
+    }
+  }
 }
    @@ -366,11 +366,11 @@ label.SetStyleName( "AppLabel" ); 
     {
-  "styles": {
-    "AppLabel": {
-      "textColor": {"r":125, "g":60, "b":152}
-    }
-  }
+  "styles": {
+    "AppLabel": {
+      "textColor": {"r":125, "g":60, "b":152}
+    }
+  }
 }
    diff --git a/org.tizen.guides/html/native/ui/dali/svg_rendering_n.htm b/org.tizen.guides/html/native/ui/dali/svg_rendering_n.htm index c6db585..63da82a 100644 --- a/org.tizen.guides/html/native/ui/dali/svg_rendering_n.htm +++ b/org.tizen.guides/html/native/ui/dali/svg_rendering_n.htm @@ -5,7 +5,7 @@ - + @@ -64,15 +64,15 @@ 
     // C++ example, use ImageView to render the SVG image
-ImageView myImageView = ImageView::New( "source-image-url.svg" );
+ImageView myImageView = ImageView::New( "source-image-url.svg" );
 Stage::GetCurrent().Add( myImageView );
 
-// JSPN example, use ImageView to render SVG                                          
-{"stage":[
-  {
-    "type": "ImageView",
-    "image": { "url", "ome-image-url.svg" }
-  }
+// JSPN example, use ImageView to render SVG
+{"stage":[
+  {
+    "type": "ImageView",
+    "image": { "url", "ome-image-url.svg" }
+  }
 ] }
    @@ -84,16 +84,16 @@ Stage::GetCurrent().Add( myImageView ); // C++ example, set SVG image as control background Control myControl = Control::New(); Property::Map backgroundMap; -backgroundMap[ImageVisual::Property::URL] = "source-image-url.svg"; +backgroundMap[ImageVisual::Property::URL] = "source-image-url.svg"; myControl.SetProperty( Control::Property::BACKGROUND, backgroundMap ); Stage::GetCurrent().Add( myControl ); // JSON example, set SVG image as control background -{"stage":[ -  { -    "type": "Control", -    "background": { "url", "some-image-url.svg" } -  } +{"stage":[ + { + "type": "Control", + "background": { "url", "some-image-url.svg" } + } ] } diff --git a/org.tizen.guides/html/native/ui/dali/tableview_n.htm b/org.tizen.guides/html/native/ui/dali/tableview_n.htm index 3b5bc33..f01cd67 100644 --- a/org.tizen.guides/html/native/ui/dali/tableview_n.htm +++ b/org.tizen.guides/html/native/ui/dali/tableview_n.htm @@ -5,13 +5,13 @@ - + - TableView + TableView @@ -39,9 +39,9 @@

    The Dali::Toolkit::TableView class is a layout container for aligning child actors in a grid like layout. TableView constraints the x and y position and width and height of the child actors.

    -

    Figure: TableView

    +

    Figure: TableView

    TableView

    - +

    Creating a TableView

    The following example shows how to create a TableView object:

    @@ -51,24 +51,24 @@ // in Creating a DALi Application void HelloWorldExample::Create( Application& application ) { -  TableView tableView = TableView::New( 4, 4 ); -  tableView.SetKeyboardFocusable( true ); -  tableView.SetParentOrigin( ParentOrigin::CENTER ); -  tableView.SetSize( 300, 300 ); - -  for( int row = 0; row < 4; ++row ) -  { -    for( int col = 0; col < 4; ++col ) -    { -      std::ostringstream str; -      str << row << "-" << col; -      TextLabel textLabel = TextLabel::New( str.str() ); -      textLabel.SetKeyboardFocusable( true ); -      textLabel.SetBackgroundColor( Color::WHITE ); -      tableView.AddChild( textLabel, TableView::CellPosition( row, col ) ); -    } -  } -  Stage::GetCurrent().Add( tableView ); + TableView tableView = TableView::New( 4, 4 ); + tableView.SetKeyboardFocusable( true ); + tableView.SetParentOrigin( ParentOrigin::CENTER ); + tableView.SetSize( 300, 300 ); + + for( int row = 0; row < 4; ++row ) + { + for( int col = 0; col < 4; ++col ) + { + std::ostringstream str; + str << row << "-" << col; + TextLabel textLabel = TextLabel::New( str.str() ); + textLabel.SetKeyboardFocusable( true ); + textLabel.SetBackgroundColor( Color::WHITE ); + tableView.AddChild( textLabel, TableView::CellPosition( row, col ) ); + } + } + Stage::GetCurrent().Add( tableView ); } diff --git a/org.tizen.guides/html/native/ui/dali/texteditor_n.htm b/org.tizen.guides/html/native/ui/dali/texteditor_n.htm index e279cb7..34322eb 100644 --- a/org.tizen.guides/html/native/ui/dali/texteditor_n.htm +++ b/org.tizen.guides/html/native/ui/dali/texteditor_n.htm @@ -5,7 +5,7 @@ - + @@ -67,7 +67,7 @@ Emitted when the input style is updated as a consequence of a change in the cursor position. - +

    Creating a TextEditor

    @@ -82,10 +82,10 @@ editor.SetParentOrigin( ParentOrigin::TOP_CENTER ); editor.SetProperty( TextEditor::Property::DECORATION_BOUNDING_BOX, boundingBox ); editor.SetProperty( TextEditor::Property::TEXT_COLOR, Color::BLACK ); editor.SetProperty( TextEditor::Property::TEXT, -                    "This is a multiline text.\n" -                    "I can write several lines.\n" -                    "Line wrapping is also supported for very long sentences." -                    "The text should be scrollable as well.\n" ); + "This is a multiline text.\n" + "I can write several lines.\n" + "Line wrapping is also supported for very long sentences." + "The text should be scrollable as well.\n" ); Stage::GetCurrent().Add( editor ); diff --git a/org.tizen.guides/html/native/ui/dali/textfield_n.htm b/org.tizen.guides/html/native/ui/dali/textfield_n.htm index b1006cc..c6a6553 100644 --- a/org.tizen.guides/html/native/ui/dali/textfield_n.htm +++ b/org.tizen.guides/html/native/ui/dali/textfield_n.htm @@ -5,13 +5,13 @@ - + - TextField + TextField @@ -47,17 +47,17 @@

    The Dali::Toolkit::TextField class is a control providing a single-line editable text field.

    -

    Figure: TextField

    +

    Figure: TextField

    TextField

    - +

    Creating a TextField

    Before text has been entered, the Dali::Toolkit::TextField class can display a placeholder text. An alternative placeholder can be displayed when the TextField has keyboard focus. For example, a TextField used to enter a username can initially show the text Unknown Name, and the text Enter Name. when the cursor is visible.

     TextField field = TextField::New();
-field.SetProperty( TextField::Property::PLACEHOLDER_TEXT, "Unnamed Name" );
-field.SetProperty( TextField::Property::PLACEHOLDER_TEXT_FOCUSED, "Enter Name." );
+field.SetProperty( TextField::Property::PLACEHOLDER_TEXT, "Unnamed Name" );
+field.SetProperty( TextField::Property::PLACEHOLDER_TEXT_FOCUSED, "Enter Name." );
 Stage::GetCurrent().Add( field );
    @@ -73,8 +73,8 @@ std::string fieldTextString = fieldText.Get< std::string >();

    The Dali::Toolkit::TextField class displays a single-line of text, which scrolls if there is not enough space for the text displayed. If there is enough space, the text can be aligned horizontally to the beginning, end, or center of the available area:

    -// "CENTER" or "END"
-field.SetProperty( TextField::Property::HORIZONTAL_ALIGNMENT, "BEGIN" );
+// "CENTER" or "END"
+field.SetProperty( TextField::Property::HORIZONTAL_ALIGNMENT, "BEGIN" );

    Using Decorations

    diff --git a/org.tizen.guides/html/native/ui/dali/textlabel_n.htm b/org.tizen.guides/html/native/ui/dali/textlabel_n.htm index df230c2..52849c3 100644 --- a/org.tizen.guides/html/native/ui/dali/textlabel_n.htm +++ b/org.tizen.guides/html/native/ui/dali/textlabel_n.htm @@ -5,13 +5,13 @@ - + - TextLabel + TextLabel @@ -49,7 +49,7 @@

    The Dali::Toolkit::TextLabel class provides a control that renders a short text string. The text labels are lightweight, non-editable, and do not respond to user input.

    -

    Figure: TextLabel

    +

    Figure: TextLabel

    TextLabel

    Creating a TextLabel

    @@ -59,7 +59,7 @@ 
     TextLabel label = TextLabel::New();
 label.SetProperty( TextLabel::Property::TEXT,
-                   "Hello World" );
+                   "Hello World" );
 Stage::GetCurrent().Add( label );
    @@ -70,8 +70,8 @@ Stage::GetCurrent().Add( label );

    Alternatively, you can request a font using the FONT_FAMILY, FONT_STYLE, and POINT_SIZE properties:

    -label.SetProperty( TextLabel::Property::FONT_FAMILY, "HelveticaNue" );
-label.SetProperty( TextLabel::Property::FONT_STYLE, "Regular" );
+label.SetProperty( TextLabel::Property::FONT_FAMILY, "HelveticaNue" );
+label.SetProperty( TextLabel::Property::FONT_STYLE, "Regular" );
 label.SetProperty( TextLabel::Property::POINT_SIZE, 12.0f );
    @@ -89,8 +89,8 @@ label.SetProperty( TextLabel::Property::MULTI_LINE, true );

    The text can be aligned horizontally to the beginning, end, or center of the available area:

    -// "CENTER" or "END"
-label.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "BEGIN" );
+// "CENTER" or "END"
+label.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "BEGIN" );

    Managing the Layout

    @@ -103,7 +103,7 @@ The following examples show the actual size by setting a colored background, whi

    In its natural size, the TextLabel is large enough to display the text without wrapping, and does not have extra space to align the text within. In the following example, the same result is displayed regardless of the alignment or multi-line properties:

    -TextLabel label = TextLabel::New( "Hello World" );
+TextLabel label = TextLabel::New( "Hello World" );
 label.SetAnchorPoint( AnchorPoint::TOP_LEFT );
 label.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
 label.SetBackgroundColor( Color::BLUE );
@@ -122,7 +122,7 @@ parent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
 
 Stage::GetCurrent().Add( parent );
 
-TextLabel label = TextLabel::New( "Hello World" );
+TextLabel label = TextLabel::New( "Hello World" );
 label.SetAnchorPoint( AnchorPoint::TOP_LEFT );
 label.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
 label.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
@@ -131,7 +131,7 @@ label.SetBackgroundColor( Color::BLUE );
 parent.AddChild( label, TableView::CellPosition( 0, 0 ) );
 parent.SetFitHeight( 0 );
 
-label = TextLabel::New( "A Quick Brown Fox Jumps Over The Lazy Dog" );
+label = TextLabel::New( "A Quick Brown Fox Jumps Over The Lazy Dog" );
 label.SetAnchorPoint( AnchorPoint::TOP_LEFT );
 label.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
 label.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
@@ -141,7 +141,7 @@ label.SetProperty( TextLabel::Property::MULTI_LINE, true );
 parent.AddChild( label, TableView::CellPosition( 1, 0 ) );
 parent.SetFitHeight( 1 );
 
-label = TextLabel::New( "لإعادة ترتيب الشاشات، يجب تغيير نوع العرض إل" );
+label = TextLabel::New( "لإعادة ترتيب الشاشات، يجب تغيير نوع العرض إل" );
 label.SetAnchorPoint( AnchorPoint::TOP_LEFT );
 label.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
 label.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
@@ -152,7 +152,7 @@ parent.AddChild( label, TableView::CellPosition( 2, 0 ) );
 parent.SetFitHeight( 2 );
    -

    In the example, the "Hello World" text label has been given the full width, not the natural width.

    +

    In the example, the "Hello World" text label has been given the full width, not the natural width.

    Using Decorations

    @@ -258,7 +258,7 @@ parent.SetFitHeight( 2 );

    To change the color of the text, use the TEXT_COLOR property. Unlike the Actor::COLOR property, this does not affect child actors added to the TextLabel.

    -label.SetProperty( TextLabel::Property::TEXT, "Red Text" );
+label.SetProperty( TextLabel::Property::TEXT, "Red Text" );
 label.SetProperty( TextLabel::Property::TEXT_COLOR, Color::RED );
    @@ -268,14 +268,14 @@ label.SetProperty( TextLabel::Property::TEXT_COLOR, Color::RED ); 
     stage.SetBackgroundColor( Color::BLUE );
-label1.SetProperty( TextLabel::Property::TEXT, "Plain Text" );
-label2.SetProperty( TextLabel::Property::TEXT, "Text with Shadow" );
+label1.SetProperty( TextLabel::Property::TEXT, "Plain Text" );
+label2.SetProperty( TextLabel::Property::TEXT, "Text with Shadow" );
 label2.SetProperty( TextLabel::Property::SHADOW_OFFSET, Vector2( 1.0f, 1.0f ) );
 label2.SetProperty( TextLabel::Property::SHADOW_COLOR, Color::BLACK );
-label3.SetProperty( TextLabel::Property::TEXT, "Text with Bigger Shadow" );
+label3.SetProperty( TextLabel::Property::TEXT, "Text with Bigger Shadow" );
 label3.SetProperty( TextLabel::Property::SHADOW_OFFSET, Vector2( 2.0f, 2.0f ) );
 label3.SetProperty( TextLabel::Property::SHADOW_COLOR, Color::BLACK );
-label4.SetProperty( TextLabel::Property::TEXT, "Text with Color Shadow" );
+label4.SetProperty( TextLabel::Property::TEXT, "Text with Color Shadow" );
 label4.SetProperty( TextLabel::Property::SHADOW_OFFSET, Vector2( 1.0f, 1.0f ) );
 label4.SetProperty( TextLabel::Property::SHADOW_COLOR, Color::RED );
    @@ -285,9 +285,9 @@ label4.SetProperty( TextLabel::Property::SHADOW_COLOR, Color::RED );

    The text can be underlined by setting the UNDERLINE_ENABLED property. The color can also be selected using the UNDERLINE_COLOR property.

    -label1.SetProperty( TextLabel::Property::TEXT, "Text with Underline" );
+label1.SetProperty( TextLabel::Property::TEXT, "Text with Underline" );
 label1.SetProperty( TextLabel::Property::UNDERLINE_ENABLED, true );
-label2.SetProperty( TextLabel::Property::TEXT, "Text with Color Underline" );
+label2.SetProperty( TextLabel::Property::TEXT, "Text with Color Underline" );
 label2.SetProperty( TextLabel::Property::UNDERLINE_ENABLED, true );
 label2.SetProperty( TextLabel::Property::UNDERLINE_COLOR, Color::GREEN );
    diff --git a/org.tizen.guides/html/native/ui/dali/touchdata_n.htm b/org.tizen.guides/html/native/ui/dali/touchdata_n.htm index 8989044..fe9c0d4 100644 --- a/org.tizen.guides/html/native/ui/dali/touchdata_n.htm +++ b/org.tizen.guides/html/native/ui/dali/touchdata_n.htm @@ -5,7 +5,7 @@ - + @@ -53,17 +53,17 @@

    To establish a connection to a touch data signal:

      -
    1. Connect to the actor's touch signal: +
    2. Connect to the actor's touch signal:
      1. Create your touch handling function: 
         class MyApplication : public ConnectionTracker
 {
-  bool OnTouch( Actor actor, TouchData& touch );
+  bool OnTouch( Actor actor, TouchData& touch );
 };
        2. -
      2. Connect to the required actor's touch signal (this is normally done when the init signal is received). +
      3. Connect to the required actor's touch signal (this is normally done when the init signal is received).

        Ensure that your MyApplication class is set up to connect to signals, and that it inherits from the ConnectionTracker class (in mobile and wearable applications). The ConnectionTracker provides a way of automatically disconnecting from the connected signals when the application dies. This is more useful for application objects that exist only temporarily.

        @@ -83,28 +83,28 @@ actor.TouchSignal().Connect( this, &MyApplication::OnTouch );
 
         bool MyApplication::OnTouch( Actor actor, TouchData& touch )
 {
-  const std::size_t pointCount = touch.GetPointCount();
-  if( pointCount == 1 )
-  {
-    // Single touch event
-
-    // Get touch state of the primary point
-    PointState::Type pointState = touch.GetState( 0 );
-    if( pointState == PointState::DOWN )
-    {
-      // User has just pressed on the device
-    }
-    else if( pointState == PointState::UP )
-    {
-      // User has just released their finger from the device
-    }
-  }
-  else
-  {
-    // Multi-touch event
-  }
-
-  return true; // Touch handled
+  const std::size_t pointCount = touch.GetPointCount();
+  if( pointCount == 1 )
+  {
+    // Single touch event
+
+    // Get touch state of the primary point
+    PointState::Type pointState = touch.GetState( 0 );
+    if( pointState == PointState::DOWN )
+    {
+      // User has just pressed on the device
+    }
+    else if( pointState == PointState::UP )
+    {
+      // User has just released their finger from the device
+    }
+  }
+  else
+  {
+    // Multi-touch event
+  }
+
+  return true; // Touch handled
 }
        4. @@ -143,7 +143,7 @@ float averageRadius = touchData.GetRadius( 0 ); const Vector2& ellipseRadii = touchData.GetEllipseRadius( 0 ); -
      4. To retrieve the angle of the user's finger when touching the screen, use the GetAngle() function. The return value is the angle relative to the Y axis. +
      5. To retrieve the angle of the user's finger when touching the screen, use the GetAngle() function. The return value is the angle relative to the Y axis. 
         Degree angle = touchData.GetAngle( 0 );
diff --git a/org.tizen.guides/html/native/ui/dali/ui_components_n.htm b/org.tizen.guides/html/native/ui/dali/ui_components_n.htm
index 2189b87..6170ea0 100644
--- a/org.tizen.guides/html/native/ui/dali/ui_components_n.htm
+++ b/org.tizen.guides/html/native/ui/dali/ui_components_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	UI Components  
+	UI Components
 
 
 
@@ -32,14 +32,14 @@
 			
      6. Dali::Toolkit API for Wearable Native
        7. 
 		
 	
-	
+
 
 
        
 
        UI Components
        
 
 
        UI components are interactive components for layouting and scrolling the user interface. DALi provides UI components, such as buttons, item view, scroll view, table view, text controls, image view, flex container, model3dview, slider, and video view.
        
 
-
        Figure: DALi UI components
          
+
        Figure: DALi UI components
        
 	
        DALi UI components
        
 	
        DALi UI components
        
 
@@ -114,17 +114,17 @@
 	
    
   
-  
+
 
        The base class for the components is Dali::Toolkit::Control (in mobile and wearable applications). This class can also be used to create your own custom UI components. For tips for the control class, see Control. In this UI Components guide, both the terms control and component are used to refer to a UI component.
        
 
 
        You can customize the look of the UI components with stylesheets. For a reusable rendering logic that can be used by all UI components, take advantage of DALi visuals.
        
 
 
        The following figure illustrates the hierarchy of the UI components.
        
 
-
        Figure: DALi UI component hierarchy
          
-	
        DALi UI component hierarchy
         
-	
-    
+
        Figure: DALi UI component hierarchy
        
+	
        DALi UI component hierarchy
        
+
+
 
 
 
        
diff --git a/org.tizen.guides/html/native/ui/dali/videoview_n.htm b/org.tizen.guides/html/native/ui/dali/videoview_n.htm
index f45bbd5..450100b 100644
--- a/org.tizen.guides/html/native/ui/dali/videoview_n.htm
+++ b/org.tizen.guides/html/native/ui/dali/videoview_n.htm
@@ -5,7 +5,7 @@
 	
 	
 	
-		
+	
 	
 	
 	
@@ -47,25 +47,25 @@
 
        Figure: VideoView
        
 	
        VideoView
        
 
-  
+
       
        
         Note
         The VideoView control does not use any privileges APIs on its own. However, if you use video files in a specific device storage, the application can require privileges to access the storage. For more information, see the Player API Reference (in mobile and wearable applications).
     
        
-	
+
 
        The VideoView class provides the FinishedSignal(), which is emitted when the video playback is finished. The related callback can support some basic actions.
        
 
 
         void Create( Application& application )
 {
-  mView.FinishedSignal().Connect( this, &VideoViewController::OnFinished );
+  mView.FinishedSignal().Connect( this, &VideoViewController::OnFinished );
 }
 
 void OnFinished( VideoView& view )
 {
-  mFinished = true;
+  mFinished = true;
 }
-
        	
+

        Creating a VideoView

        @@ -74,35 +74,35 @@ void OnFinished( VideoView& view ) 
         class VideoViewController: public ConnectionTracker
 {
-  public:
-    VideoViewController( Application& application )
-    : mApplication( application )
-    {
-      mApplication.InitSignal().Connect( this, &VideoViewController::Create );
-    }
-
-    void Create( Application& application )
-    {
-      // Set the handle
-      mView = Toolkit::VideoView::New( "videofile.mp4" );
-      Stage::GetCurrent().Add( mView );
-      mView.SetParentOrigin( ParentOrigin::CENTER );
-      mView.SetAnchorPoint( AnchorPoint::CENTER );
-      mView.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
-      mView.SetSize( WIDTH, HEIGHT );
-      mView.Play();
-    }
-
-  private:
-    Application& mApplication;
-    VideoView mView;
+  public:
+    VideoViewController( Application& application )
+    : mApplication( application )
+    {
+      mApplication.InitSignal().Connect( this, &VideoViewController::Create );
+    }
+
+    void Create( Application& application )
+    {
+      // Set the handle
+      mView = Toolkit::VideoView::New( "videofile.mp4" );
+      Stage::GetCurrent().Add( mView );
+      mView.SetParentOrigin( ParentOrigin::CENTER );
+      mView.SetAnchorPoint( AnchorPoint::CENTER );
+      mView.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
+      mView.SetSize( WIDTH, HEIGHT );
+      mView.Play();
+    }
+
+  private:
+    Application& mApplication;
+    VideoView mView;
 }
        - +
        Note - You can set the video file to be played in the VideoView::New() function, or by modifying VIDEO property with SetProperty( VideoView::Property::VIDEO, "videofile2.mp4" ). + You can set the video file to be played in the VideoView::New() function, or by modifying VIDEO property with SetProperty( VideoView::Property::VIDEO, "videofile2.mp4" ).

        Modifying VideoView Properties

        @@ -117,8 +117,8 @@ Property::Value value = mView.GetProperty( VideoView::Property::VOLUME ); Value.Get( oldMap ); Property::Map newMap; -newMap.Insert( "volumeLeft", 1.0f ); -newMap.Insert( "volumeRight", 0.5f ); +newMap.Insert( "volumeLeft", 1.0f ); +newMap.Insert( "volumeRight", 0.5f ); mView.SetProperty( VideoView::Property::VOLUME, newMap ); diff --git a/org.tizen.guides/html/native/ui/dali/visuals_n.htm b/org.tizen.guides/html/native/ui/dali/visuals_n.htm index bd4b3b6..e7de216 100644 --- a/org.tizen.guides/html/native/ui/dali/visuals_n.htm +++ b/org.tizen.guides/html/native/ui/dali/visuals_n.htm @@ -5,7 +5,7 @@ - + @@ -67,12 +67,12 @@

        Color Visual

        -

        The color visual renders a solid color to the control's quad.

        +

        The color visual renders a solid color to the control's quad.

        Figure: Color visual

        Color visual

        -

        The following table lists the supported properties. The visual type is Visual::COLOR or "COLOR".

        +

        The following table lists the supported properties. The visual type is Visual::COLOR or "COLOR".

        Table: Image visual properties

        @@ -106,13 +106,13 @@ control.SetProperty( Control::Property::BACKGROUND, map );

        Gradient Visual

        -

        The gradient visual renders a smooth transition of colors to the control's quad. Both linear (left in the following figure) and radial (right in the following figure) gradients are supported.

        +

        The gradient visual renders a smooth transition of colors to the control's quad. Both linear (left in the following figure) and radial (right in the following figure) gradients are supported.

        Figure: Gradient visual

        Gradient visual linear Gradient visual radial

        -

        The following table lists the supported properties. The visual type is Visual::GRADIENT or "GRADIENT".

        +

        The following table lists the supported properties. The visual type is Visual::GRADIENT or "GRADIENT".

        Table: Gradient visual properties

        @@ -292,7 +292,7 @@ control.SetProperty( Control::Property::BACKGROUND, map );

        Image Visual

        -

        The image visual renders an image into the control's quad. Depending on the extension of the image, a different visual is provided to render the image onto the screen:

        +

        The image visual renders an image into the control's quad. Depending on the extension of the image, a different visual is provided to render the image onto the screen:

        • Normal (Quad)
          • @@ -302,12 +302,12 @@ control.SetProperty( Control::Property::BACKGROUND, map );

          Normal Image

          -

          The normal image visual renders a raster image (such as JPG or PNG) into the control's quad.

          +

          The normal image visual renders a raster image (such as JPG or PNG) into the control's quad.

          Figure: Normal image visual

          Normal image visual

          -

          The following table lists the supported properties. The visual type is Visual::IMAGE or "IMAGE".

          +

          The following table lists the supported properties. The visual type is Visual::IMAGE or "IMAGE".

          Table: Normal image visual properties

        @@ -363,18 +363,18 @@ control.SetProperty( Control::Property::BACKGROUND, map ); Dali::Toolkit::Control control = Dali::Toolkit::Control::New(); Dali::Property::Map map; map[Visual::Property::TYPE] = Dali::Toolkit::Visual::IMAGE; -map[ImageVisual::Property::URL] = "path-to-image.jpg"; +map[ImageVisual::Property::URL] = "path-to-image.jpg"; control.SetProperty( Control::Property::BACKGROUND, map );

        N-Patch Image

        -

        The n-patch image visual renders an n-patch or a 9-patch image into the control's quad.

        +

        The n-patch image visual renders an n-patch or a 9-patch image into the control's quad.

        Figure: N-patch image visual

        N-patch image visual

        -

        The following table lists the supported properties. The visual type is Visual::IMAGE or "IMAGE".

        +

        The following table lists the supported properties. The visual type is Visual::IMAGE or "IMAGE".

        Table: N-patch image visual properties

        @@ -409,13 +409,13 @@ control.SetProperty( Control::Property::BACKGROUND, map ); Dali::Toolkit::Control control = Dali::Toolkit::Control::New(); Dali::Property::Map map; map[Visual::Property::TYPE] = Dali::Toolkit::Visual::IMAGE; -map[Dali::Toolkit::ImageVisual::Property::URL] = "path-to-image.9.png"; +map[Dali::Toolkit::ImageVisual::Property::URL] = "path-to-image.9.png"; control.SetProperty( Control::Property::BACKGROUND, map );

        SVG Image

        -

        The SVG image visual renders an SVG image into the control's quad. It supports the following features from the SVG Tiny 1.2 Specification:

        +

        The SVG image visual renders an SVG image into the control's quad. It supports the following features from the SVG Tiny 1.2 Specification:

        • Basic shapes
          • @@ -437,7 +437,7 @@ control.SetProperty( Control::Property::BACKGROUND, map );

          Figure: SVG image visual

          SVG image visual

          -

          The following table lists the supported properties. The visual type is Visual::IMAGE or "IMAGE".

          +

          The following table lists the supported properties. The visual type is Visual::IMAGE or "IMAGE".

          Table: SVG image visual properties

        @@ -465,7 +465,7 @@ control.SetProperty( Control::Property::BACKGROUND, map ); Dali::Toolkit::Control control = Dali::Toolkit::Control::New(); Dali::Property::Map map; map[Visual::Property::TYPE] = Dali::Toolkit::Visual::IMAGE; -map[Dali::Toolkit::ImageVisual::Property::URL] = "path-to-image.svg"; +map[Dali::Toolkit::ImageVisual::Property::URL] = "path-to-image.svg"; control.SetSize( 200.f, 200.f ); control.SetProperty( Control::Property::BACKGROUND, map ); @@ -473,12 +473,12 @@ control.SetProperty( Control::Property::BACKGROUND, map );

        Border Visual

        -

        The border visual renders a solid color as an internal border to the control's quad.

        +

        The border visual renders a solid color as an internal border to the control's quad.

        Figure: Border visual

        Border visual

        -

        The following table lists the supported properties. The visual type is Visual::BORDER or "BORDER".

        +

        The following table lists the supported properties. The visual type is Visual::BORDER or "BORDER".

        Table: Border visual properties

        @@ -533,7 +533,7 @@ control.SetProperty( Control::Property::BACKGROUND, map );

        Figure: Mesh visual

        Mesh visual

        -

        The following table lists the supported properties. The visual type is Visual::MESH or "MESH".

        +

        The following table lists the supported properties. The visual type is Visual::MESH or "MESH".

        Table: Mesh visual properties

        @@ -634,9 +634,9 @@ Dali::Stage stage = Dali::Stage::GetCurrent(); Dali::Toolkit::Control control = Dali::Toolkit::Control::New(); Dali::Property::Map map; map[Visual::Property::TYPE] = Dali::Toolkit::Visual::MESH; -map[MeshVisual::Property::OBJECT_URL] = "home/models/Dino.obj"; -map[MeshVisual::Property::MATERIAL_URL] = "home/models/Dino.mtl"; -map[MeshVisual::Property::TEXTURES_PATH] = "home/images/"; +map[MeshVisual::Property::OBJECT_URL] = "home/models/Dino.obj"; +map[MeshVisual::Property::MATERIAL_URL] = "home/models/Dino.mtl"; +map[MeshVisual::Property::TEXTURES_PATH] = "home/images/"; control.SetProperty( Control::Property::BACKGROUND, map ); @@ -648,7 +648,7 @@ control.SetProperty( Control::Property::BACKGROUND, map );

        Figure: Primitive visual

        Primitive visual

        -

        The following table lists the supported properties. The visual type is Visual::PRIMITIVE or "PRIMITIVE".

        +

        The following table lists the supported properties. The visual type is Visual::PRIMITIVE or "PRIMITIVE".

        Table: Primitive visual properties

        @@ -666,7 +666,7 @@ control.SetProperty( Control::Property::BACKGROUND, map ); - + @@ -898,13 +898,13 @@ control.SetProperty( Control::Property::BACKGROUND, map );
      7. Slices: -

        For spheres and conical frustrums, "slices" determine how many divisions there are as you go around the object.

        +

        For spheres and conical frustrums, "slices" determine how many divisions there are as you go around the object.

        Slices

      8. Stacks: -

        For spheres, "stacks" determines how many layers there are as you go down the object.

        +

        For spheres, "stacks" determines how many layers there are as you go down the object.

        Stacks

        9. @@ -912,12 +912,12 @@ control.SetProperty( Control::Property::BACKGROUND, map );

        Wireframe Visual

        -

        The wireframe visual renders a wireframe around a control's quad. It is mainly used for debugging and is the visual that replaces all other visuals when Visual Debug Rendering is switched on. To switch Visual Debug Rendering on, set the DALI_DEBUG_RENDERING environment variable to 1 before launching the DALi application.

        - +

        The wireframe visual renders a wireframe around a control's quad. It is mainly used for debugging and is the visual that replaces all other visuals when Visual Debug Rendering is switched on. To switch Visual Debug Rendering on, set the DALI_DEBUG_RENDERING environment variable to 1 before launching the DALi application.

        +

        Figure: Wireframe visual

        Wireframe visual

        -

        The visual type is Visual::WIREFRAME or "WIREFRAME".

        +

        The visual type is Visual::WIREFRAME or "WIREFRAME".

        Usage:

        diff --git a/org.tizen.guides/html/native/ui/efl/accessibility_architecture_n.htm b/org.tizen.guides/html/native/ui/efl/accessibility_architecture_n.htm index cfba98a..8f21611 100644 --- a/org.tizen.guides/html/native/ui/efl/accessibility_architecture_n.htm +++ b/org.tizen.guides/html/native/ui/efl/accessibility_architecture_n.htm @@ -5,20 +5,20 @@ - + - Accessibility Architecture - + Accessibility Architecture + - +

        Mobile native Wearable native

        - +

        Dependencies

        -
        +
        -

        Accessibility Architecture

        +

        Accessibility Architecture

        -

        The Assistive Technology Service Provider Interface (or AT-SPI2) is an API for developing accessible applications for open platforms. The accessibility implementation for the Tizen platform is based on a solution available for the desktop versions of Elementary, such as Elementary ATSPI.

        +

        The Assistive Technology Service Provider Interface (or AT-SPI2) is an API for developing accessible applications for open platforms. The accessibility implementation for the Tizen platform is based on a solution available for the desktop versions of Elementary, such as Elementary ATSPI.

        The Elementary ATSPI enables applications to interact with graphical Elementary components visible on the screen. For example, an accessibility client, such as a screen reader, can access the text in labels and descriptions of any application running on the screen, read it to the user, or interpret a UI component using its defined role.

        The following figure shows the general view of the accessibility framework architecture for Tizen 3.0.

        - -

        Figure: Accessibility framework architecture

        -

        Accessibility framework architecture

        + +

        Figure: Accessibility framework architecture

        +

        Accessibility framework architecture

        The following figure and table show the component model of the accessibility framework architecture for Tizen 3.0 and the related components.

        - -

        Figure: Component model

        + +

        Figure: Component model

        Component model

        - +

        Table: Components

        shape INTEGER or STRING The specific shape to render.PrimitiveVisual::Shape::SPHERE or "SPHERE"PrimitiveVisual::Shape::SPHERE or "SPHERE" See the Shape values table.
        @@ -93,21 +93,21 @@ - +
        TTS Text-to-speech synthesizer on Tizen

        The following figure shows the EFL Elementary ATSPI implementation architecture.

        -

        Figure: Implementation architecture

        -

        Implementation architecture

        +

        Figure: Implementation architecture

        +

        Implementation architecture

        Operational Model of the Screen Reader

        The general outline of the screen reader navigation operation recognizes gestures based on multi-touch pointer events. It queries the accessibility object tree of the active application, and determines which UI element must be highlighted and read.

        The following figure shows the operational model.

        -

        Figure: Screen reader operational model

        -

        Screen reader operational model

        - +

        Figure: Screen reader operational model

        +

        Screen reader operational model

        + diff --git a/org.tizen.guides/html/native/ui/efl/accessibility_config_n.htm b/org.tizen.guides/html/native/ui/efl/accessibility_config_n.htm index 1ecb376..b945a87 100644 --- a/org.tizen.guides/html/native/ui/efl/accessibility_config_n.htm +++ b/org.tizen.guides/html/native/ui/efl/accessibility_config_n.htm @@ -5,25 +5,25 @@ - + - Configuring Accessibility in a Device - + Configuring Accessibility in a Device + - +

        Mobile native Wearable native

        - +

        Dependencies

        • Tizen 2.4 and Higher for Mobile
          • -
        • Tizen 3.0 and Higher for Wearable
          • +
        • Tizen 3.0 and Higher for Wearable

        Content

        -
        +
        -

        Configuring Accessibility in a Device

        +

        Configuring Accessibility in a Device

        Tizen provides the following accessibility features:

        • Font size -

          The user can configure system-wide font size settings, such as enlarge the fonts to suit visually-impaired users' needs.

          • -
        • Screen reader +

          The user can configure system-wide font size settings, such as enlarge the fonts to suit visually-impaired users' needs.

          • +
        • Screen reader

          Visually-impaired users can interact with a Tizen device through intuitive touch screen gestures. The screen reader reacts to the gestures by examining the elements of the graphical user interface, reading aloud, and highlighting the currently focused content of the screen.

        You can enable one or more accessibility features at the same time to better suit the device to your needs and preferences. Some features (such as the screen reader) require the use of a small set of specific gestures to operate them, while others (such as changing font size) only need to be enabled in the device settings.

        @@ -54,14 +54,14 @@

        Enabling the Screen Reader

        To enable the screen reader:

        -
        1. Install and launch the UI Components application. +
          1. Install and launch the UI Components application.

            UI Components is a mobile native sample application included in the Tizen Studio. You can install it through the Tizen Studio.

          2. Select Accessibility > Screen Reader.
          3. Enable the Screen Reader (TTS) setting.
          -

          Figure: Enabling the screen reader

          -

          Enabling the screen reader Enabling the screen reader Enabling the screen reader

          - +

          Figure: Enabling the screen reader

          +

          Enabling the screen reader Enabling the screen reader Enabling the screen reader

          +

          Once the screen reader is enabled, you can configure it by setting the speech rate and the language:

            @@ -69,9 +69,9 @@

            To set the speech rate, which is the speed of the voice output provided by the screen reader:

            1. In the built-in Settings application, select Language and Input > TTS.
            2. Select the preferred speech rate by hovering one finger over the Speech rate scale. The sample voice output is produced at a corresponding speech rate.
            - -

            Figure: Setting the speech rate

            -

            Setting the speech rate Setting the speech rate Setting the speech rate

            + +

            Figure: Setting the speech rate

            +

            Setting the speech rate Setting the speech rate Setting the speech rate

          • To set the language, which is the language of the voice output provided by the screen reader:

            @@ -87,7 +87,7 @@ Note Changing the font size in the accessibility settings overrides the font size in all applications.
        - +

        To change the system font size:

        1. In the built-in Settings application, select Display > Font.
        2. Select the font size: @@ -95,12 +95,12 @@
        3. To select a preferred font size, hover a finger over the Size scale. The sample text in a corresponding font size is displayed above the size scale.
        4. To restore the font size predefined by the manufacturer, select Default font.
        - -

        Figure: Changing the font size

        -

        Changing the font size Changing the font size Changing the font size

        - +

        Figure: Changing the font size

        +

        Changing the font size Changing the font size Changing the font size

        + +
        diff --git a/org.tizen.guides/html/native/ui/efl/accessibility_implementation_n.htm b/org.tizen.guides/html/native/ui/efl/accessibility_implementation_n.htm index 94ce98f..c6ebaff 100644 --- a/org.tizen.guides/html/native/ui/efl/accessibility_implementation_n.htm +++ b/org.tizen.guides/html/native/ui/efl/accessibility_implementation_n.htm @@ -5,20 +5,20 @@ - + - Implementing Accessible Applications - + Implementing Accessible Applications + - +

        Mobile native Wearable native

        - +

        Dependencies

        -
        +
        -

        Implementing Accessible Applications

        +

        Implementing Accessible Applications

        When implementing an accessible application, follow the good accessibility practices. This topic uses an EFL Elementary sample application to demonstrate how you can implement accessibility features in your application.

        - +

        Good Practices for Implementing Accessibility

        An accessible application requires the following features to be implemented:

        @@ -56,7 +56,7 @@

      9. Text equivalents for images, audio, and multimedia

        -

        To a screen reader, any graphics on the screen, such as photos or videos, are invisible. Therefore, images and diagrams conveying important information must have text equivalents for users using screen readers. Such descriptions must briefly present all necessary information. For example, the text equivalent for a circle diagram presenting statistics showing that 20% of the population like product X can be "circle diagram: 20% of the population like X". Purely decorative images do not need text descriptions, such as "pretty blue background".

        +

        To a screen reader, any graphics on the screen, such as photos or videos, are invisible. Therefore, images and diagrams conveying important information must have text equivalents for users using screen readers. Such descriptions must briefly present all necessary information. For example, the text equivalent for a circle diagram presenting statistics showing that 20% of the population like product X can be "circle diagram: 20% of the population like X". Purely decorative images do not need text descriptions, such as "pretty blue background".

        Similarly, it is advised to add text equivalents or subtitles to audio or audio-video content for the benefit of deaf and hard of hearing users.

        10. @@ -78,7 +78,7 @@

        Supplementing color coding

        Color coding must not be the only way of conveying information since some people are not able to distinguish between different colors. This does not only concern individuals with diagnosed color vision disabilities, as it is estimated that about 10% of the male population is color blind to some extent. Even contrasting color pairs can be an issue, such as the commonly used red and green.

        Color coding can and must be used, but it must always be supplemented by other means of conveying the same information, such as appropriate labels, graphics, or font formatting.

        -

        For example, do not ask the user to "press the green button to confirm or the red button to reject" and supply 2 colored but otherwise identical buttons. Instead, add Confirm and Reject labels to the buttons. If you do not have enough room for that much text, use a symbolic label like OK and X.

        +

        For example, do not ask the user to "press the green button to confirm or the red button to reject" and supply 2 colored but otherwise identical buttons. Instead, add Confirm and Reject labels to the buttons. If you do not have enough room for that much text, use a symbolic label like OK and X.

      10. Minimalism

        @@ -104,7 +104,7 @@
        11. -

        Creating an Accessible Application

        +

        Creating an Accessible Application

        You can use the mobile native UI Components sample application provided within the Tizen Studio to see how the most important accessibility features are implemented in practice. The sample application contains an AT-SPI2 compliant screen reader, which you can use to test the accessibility features in a device. Enable the screen reader by running the sample application and selecting Accessibility > Screen Reader > Screen Reader (TTS).

        In the Tizen 2.4 release, the screen reader is available only inside the UI Components application. This means that when the UI Components application is terminated or paused and sent to the background, the screen reader is automatically disabled, and when the UI Components application is restored, the screen reader is enabled.

        @@ -119,28 +119,28 @@

        Making UI Components Readable

        -

        Since the screen reader is a fundamental accessibility feature for low-vision and visually-impaired persons, making your application readable by the screen reader is a priority task. The following example shows how to make your application readable to the AT-SPI2 compliant screen reader.

        +

        Since the screen reader is a fundamental accessibility feature for low-vision and visually-impaired persons, making your application readable by the screen reader is a priority task. The following example shows how to make your application readable to the AT-SPI2 compliant screen reader.

        The screen reader reads out information about the currently pointed or focused UI component. The UI component information is provided to the screen reader using the AT-SPI2 standard protocol and consists of the following information items:

          -
        • Label: +
        • Label:

          The label on the component is, for example, Ok or Cancel (in case of a button). The label maps to the name property of the AT-SPI2 object and is equivalent to the result of the elm_object_text_get() function. The property can be also overwritten using the elm_atspi_accessible_name_set() function.

          • -
        • Traits: -

          The traits are the component type or role, for example, "Button" (in case of a button). The trait maps to the role property of the AT-SPI2 object.

          +
        • Traits: +

          The traits are the component type or role, for example, "Button" (in case of a button). The trait maps to the role property of the AT-SPI2 object.

          • -
        • State: -

          The value or status of the component is, for example, "Disabled" (in case of a disabled button).

          +
        • State: +

          The value or status of the component is, for example, "Disabled" (in case of a disabled button).

          • -
        • Description (optional attribute): -

          The hint or guide to explain the component is, for example, "This button closes your application" (in case of a button). The description maps to the description property of the AT-SPI2 object.

          +
        • Description (optional attribute): +

          The hint or guide to explain the component is, for example, "This button closes your application" (in case of a button). The description maps to the description property of the AT-SPI2 object.

        The screen reader reads the information in the following order when the user selects the button by using the 1-finger-tap gesture. The user also can select a button by using a 1-finger-touch-and-move gesture.

          -
        • Ok (Label) > "Button" (Traits) > "This button closes your application" (Description)
          • -
        • Cancel (Label) > "Button" (Traits) > "Disabled" (State)
          • +
        • Ok (Label) > "Button" (Traits) > "This button closes your application" (Description)
          • +
        • Cancel (Label) > "Button" (Traits) > "Disabled" (State)

        The following table lists the functions you can use to set EFL Elementary UI component information to be read by the screen reader, and to support internationalization (i18n) for the information.

        @@ -163,7 +163,7 @@ void elm_atspi_accessible_role_set(Elm_Interface_Atspi_Accessible *obj, Elm_Atspi_Role role) - Set the accessible role. + Set the accessible role.
        • obj: Elementary object
        • role: New accessible role for the object
          • @@ -173,7 +173,7 @@ void elm_atspi_accessible_description_set(Elm_Interface_Atspi_Accessible *obj, const char *text) Set the accessible description. -
            +
            • obj: Elementary object
            • text: Description text for the object
            @@ -190,13 +190,13 @@ - - + +

            Figure: Readable components in the UI Components sample

            Readable components in the UI Components sample

            - +

            The Elementary library sets the default information (label, traits, state) for the components, except for an icon and image. You can override the default information in various ways:

            • Button with a custom name @@ -205,22 +205,22 @@ /* File: src/accessibility/screen_reader/description.c */ btn = elm_button_add(layout); -elm_object_text_set(btn, "Test Name"); +elm_object_text_set(btn, "Test Name"); -

              If the user highlights the button, the screen reader says "Test Name, button" (it reads out the component custom name and default trait).

              +

              If the user highlights the button, the screen reader says "Test Name, button" (it reads out the component custom name and default trait).

            • Button without a name and description -

              If you define a button with an icon image only, no name or description is provided by default.

              +

              If you define a button with an icon image only, no name or description is provided by default.

               /* File: src/accessibility/screen_reader/description.c */
 
 btn = elm_button_add(layout);
 img = elm_image_add(btn);
 elm_image_file_set(img, IMG_PATH, NULL);
-elm_object_part_content_set(btn, "icon", img);
+elm_object_part_content_set(btn, "icon", img);
              -

              If the user highlights the button, the screen reader says "button" (it reads out the component default trait only).

              +

              If the user highlights the button, the screen reader says "button" (it reads out the component default trait only).

            • Button with an internationalized description @@ -240,40 +240,40 @@ BuildRequires: gettext-tools /* File: po/CMakeLists.txt */ SET(POFILES en_US.po it_IT.po) -SET(MSGFMT "/usr/bin/msgfmt") +SET(MSGFMT "/usr/bin/msgfmt") FOREACH(pofile ${POFILES}) -    SET(pofile ${CMAKE_CURRENT_SOURCE_DIR}/${pofile}) -    MESSAGE(PO: " ${pofile}") -    GET_FILENAME_COMPONENT(absPofile ${pofile} ABSOLUTE) -    GET_FILENAME_COMPONENT(lang ${absPofile} NAME_WE) -    SET(moFile ${CMAKE_CURRENT_BINARY_DIR}/${lang}.mo) -    ADD_CUSTOM_COMMAND( -        OUTPUT ${moFile} -        COMMAND ${MSGFMT} -o ${moFile} ${absPofile} -        DEPENDS ${absPofile}) -    INSTALL(FILES ${moFile} -        DESTINATION ${LOCALEDIR}/${lang}/LC_MESSAGES RENAME ${PACKAGE}.mo) -    SET(moFiles ${moFiles} ${moFile}) + SET(pofile ${CMAKE_CURRENT_SOURCE_DIR}/${pofile}) + MESSAGE(PO: " ${pofile}") + GET_FILENAME_COMPONENT(absPofile ${pofile} ABSOLUTE) + GET_FILENAME_COMPONENT(lang ${absPofile} NAME_WE) + SET(moFile ${CMAKE_CURRENT_BINARY_DIR}/${lang}.mo) + ADD_CUSTOM_COMMAND( + OUTPUT ${moFile} + COMMAND ${MSGFMT} -o ${moFile} ${absPofile} + DEPENDS ${absPofile}) + INSTALL(FILES ${moFile} + DESTINATION ${LOCALEDIR}/${lang}/LC_MESSAGES RENAME ${PACKAGE}.mo) + SET(moFiles ${moFiles} ${moFile}) ENDFOREACH(pofile) ADD_CUSTOM_TARGET(po ALL DEPENDS ${moFiles}) /* File: po/en_US.po */ -msgid "IDS_BUTTON_DESCRIPTION" -msgstr "One finger double tap to activate" +msgid "IDS_BUTTON_DESCRIPTION" +msgstr "One finger double tap to activate" -msgid "IDS_BUTTON_NAME" -msgstr "Button accessibility name" +msgid "IDS_BUTTON_NAME" +msgstr "Button accessibility name" /* File: po/it_IT.po */ -msgid "IDS_BUTTON_DESCRIPTION" -msgstr "Un dito doppio tap per attivare" +msgid "IDS_BUTTON_DESCRIPTION" +msgstr "Un dito doppio tap per attivare" -msgid "IDS_BUTTON_NAME" -msgstr "Button nome di accessibilità" +msgid "IDS_BUTTON_NAME" +msgstr "Button nome di accessibilità" /* File: src/main.c */ @@ -284,14 +284,14 @@ textdomain(PACKAGE); /* File: src/accessibility/screen_reader/description.c */ btn = elm_button_add(layout); -elm_object_text_set(btn, "Test Name"); -elm_object_style_set(btn, "default"); -elm_object_part_content_set(layout, "button_description", btn); -elm_atspi_accessible_description_set(btn, "IDS_BUTTON_DESCRIPTION"); +elm_object_text_set(btn, "Test Name"); +elm_object_style_set(btn, "default"); +elm_object_part_content_set(layout, "button_description", btn); +elm_atspi_accessible_description_set(btn, "IDS_BUTTON_DESCRIPTION"); elm_atspi_accessible_translation_domain_set(btn, PACKAGE); -

              If the user highlights the button and the display language is set to English (US), the screen reader says "Test Name, button, one finger double tap to activate" (it reads out the component custom name, default trait, and description from the en_US.po file). If the display language is changed, the description string from the relevant PO file is used.

              +

              If the user highlights the button and the display language is set to English (US), the screen reader says "Test Name, button, one finger double tap to activate" (it reads out the component custom name, default trait, and description from the en_US.po file). If the display language is changed, the description string from the relevant PO file is used.

            • Button with an accessible name @@ -300,26 +300,26 @@ elm_atspi_accessible_translation_domain_set(btn, PACKAGE); /* File: src/accessibility/screen_reader/description.c */ btn = elm_button_add(layout); -elm_object_text_set(btn, "Test Name"); -elm_object_style_set(btn, "default"); -elm_object_part_content_set(layout, "button_a11y_name", btn); -elm_atspi_accessible_name_set(btn, "IDS_BUTTON_NAME"); +elm_object_text_set(btn, "Test Name"); +elm_object_style_set(btn, "default"); +elm_object_part_content_set(layout, "button_a11y_name", btn); +elm_atspi_accessible_name_set(btn, "IDS_BUTTON_NAME"); elm_atspi_accessible_translation_domain_set(btn, PACKAGE); -

              If the user highlights the button, the screen reader says "Button accessibility name, button" (it reads out the component accessible name from the en_US.po file and the default trait). If the display language is changed, the accessible name string from the relevant PO file is used.

              +

              If the user highlights the button, the screen reader says "Button accessibility name, button" (it reads out the component accessible name from the en_US.po file and the default trait). If the display language is changed, the accessible name string from the relevant PO file is used.

              The elm_atspi_accessible_name_set() function overrides the custom name set earlier with the elm_object_text_set() function.

            -

            You can also create a custom reading of multi-style components. Sometimes, it is necessary to have different voice output depending on the style assigned to the UI component. The default style is handled "out of the box" by the accessibility framework, but you must handle any alternative styles on the application side. The elementary checkbox component offers a good example of alternative styles:

            +

            You can also create a custom reading of multi-style components. Sometimes, it is necessary to have different voice output depending on the style assigned to the UI component. The default style is handled "out of the box" by the accessibility framework, but you must handle any alternative styles on the application side. The elementary checkbox component offers a good example of alternative styles:

              -
            • default style in a checkbox: -

              The reading must be "<label>, <state>", where <label> is a text assigned to the checkbox and <state> is read as "selected" or "not selected", depending on the checkbox state.

              • -
            • favorite style in a checkbox: -

              The reading must be "Favorite button, <state>", where <state> is read as "selected" or "not selected", depending on the checkbox state.

              • -
            • on&off style in a checkbox: -

              The reading must be "On/off button, <state>", where <state> is read as "on" or "off", depending on the checkbox state.

              • +
            • default style in a checkbox: +

              The reading must be "<label>, <state>", where <label> is a text assigned to the checkbox and <state> is read as "selected" or "not selected", depending on the checkbox state.

              • +
            • favorite style in a checkbox: +

              The reading must be "Favorite button, <state>", where <state> is read as "selected" or "not selected", depending on the checkbox state.

              • +
            • on&off style in a checkbox: +

              The reading must be "On/off button, <state>", where <state> is read as "on" or "off", depending on the checkbox state.

            The following source code snippet demonstrates how to handle the favorite and on&off checkbox styles in the application source code:

            @@ -327,13 +327,13 @@ elm_atspi_accessible_translation_domain_set(btn, PACKAGE); /* File: src/check.c */ check = elm_check_add(box); -elm_object_style_set(check, "favorite"); -elm_atspi_accessible_name_set(check, "Favorite button"); +elm_object_style_set(check, "favorite"); +elm_atspi_accessible_name_set(check, "Favorite button"); check = elm_check_add(box); -elm_object_style_set(check, "on&off"); +elm_object_style_set(check, "on&off"); elm_atspi_accessible_role_set(check, ELM_ATSPI_ROLE_TOGGLE_BUTTON); -elm_atspi_accessible_name_set(check, "On, off"); +elm_atspi_accessible_name_set(check, "On, off"); @@ -372,15 +372,15 @@ elm_atspi_accessible_name_set(check, "On, off"); -

            The following figure illustrates the UI reading order example in the UI Components sample application. In the top part of the screen, the components have been ordered explicitly by the developer by setting the ATSPI standard relations between accessible objects corresponding to these components. In the bottom part of the screen, the components have no relation-based navigation set at all. This results in the natural reading order of the UI elements maintained implicitly by the screen reader itself. The natural reading order is a heuristic based on the UI elements' geometrical position on the screen (top to bottom, and left to right reading direction).

            +

            The following figure illustrates the UI reading order example in the UI Components sample application. In the top part of the screen, the components have been ordered explicitly by the developer by setting the ATSPI standard relations between accessible objects corresponding to these components. In the bottom part of the screen, the components have no relation-based navigation set at all. This results in the natural reading order of the UI elements maintained implicitly by the screen reader itself. The natural reading order is a heuristic based on the UI elements' geometrical position on the screen (top to bottom, and left to right reading direction).

            Figure: UI reading order in the UI Components sample

            UI reading order in the UI Components sample

            The following code illustrates how the customized reading order for the top part of the screen has been implemented. The component relations are defined with ATSPI_RELATION_FLOWS_TO and ATSPI_RELATION_FLOWS_FROM parameters. In addition to the normal relations used when navigating forward, inverse relations are defined as well to ensure proper behavior when navigating backward.

            - -

            You can have various independent relation-based navigation chains on one screen. Each relation-based navigation chain is resolved locally and has priority over the default navigation order maintained by the screen reader. When one of the ends of a relation-based navigation chain is reached, the highlight frame goes forward along to the actual navigation direction to the closest component in the default navigation order. It omits interim components of the relation-based navigation chains. In this example, when the navigation command "next" is called from the c button, the highlight frame goes from the c button to the Default reading order label.

            + +

            You can have various independent relation-based navigation chains on one screen. Each relation-based navigation chain is resolved locally and has priority over the default navigation order maintained by the screen reader. When one of the ends of a relation-based navigation chain is reached, the highlight frame goes forward along to the actual navigation direction to the closest component in the default navigation order. It omits interim components of the relation-based navigation chains. In this example, when the navigation command "next" is called from the c button, the highlight frame goes from the c button to the Default reading order label.

             /* File: src/accessibility/screen_reader/reading_order.c */
@@ -394,7 +394,7 @@ Evas_Object *labelCustom;
 
 /* Creating buttons with custom order */
 btnA = elm_button_add(layout);
-elm_object_text_set(btnA, "a");
+elm_object_text_set(btnA, "a");
 
 /*
    Inform the assistive technology that UI information
@@ -412,14 +412,14 @@ elm_atspi_accessible_relationship_append(btnE, ELM_ATSPI_RELATION_FLOWS_FROM, bt
 elm_atspi_accessible_relationship_append(btnD, ELM_ATSPI_RELATION_FLOWS_FROM, labelCustom);
            -

            Navigation relations can also be used to exclude some components from the sequential navigation (for example, they are not reachable using the "next" or "previous" navigation commands triggered on 1-finger flicks). In the example, the a button was by-passed by setting a navigation relation between the Custom reading order label and the d button. However, the a button can still be reached by direct navigation (1-finger single tap or 1-finger hover). To entirely exclude the component from navigation (including direct navigation), set the ATSPI_ROLE_REDUNDANT_OBJECT role for the component using the elm_atspi_accessible_role_set() function.

            +

            Navigation relations can also be used to exclude some components from the sequential navigation (for example, they are not reachable using the "next" or "previous" navigation commands triggered on 1-finger flicks). In the example, the a button was by-passed by setting a navigation relation between the Custom reading order label and the d button. However, the a button can still be reached by direct navigation (1-finger single tap or 1-finger hover). To entirely exclude the component from navigation (including direct navigation), set the ATSPI_ROLE_REDUNDANT_OBJECT role for the component using the elm_atspi_accessible_role_set() function.

            Customizing the Highlight Frame

            The accessibility framework provides a highlight frame around the currently selected or focused UI component, and you can customize its size, shape, and color. The following code snippets demonstrate how to adjust the style of the highlight frame from the default yellow style (left in the figure) to a custom red style (right in the figure).

            -

            Figure: Highlight frame in the UI Components sample

            -

            Highlight frame in the UI Components sample Highlight frame in the UI Components sample

            +

            Figure: Highlight frame in the UI Components sample

            +

            Highlight frame in the UI Components sample Highlight frame in the UI Components sample

            The following code snippets has been simplified to make the example clearer. Irrelevant code has been omitted, and long variables and resource names have been shortened to avoid line wrapping. The full version of the source code is available in the following files:

            @@ -454,57 +454,57 @@ elm_atspi_accessible_relationship_append(btnD, ELM_ATSPI_RELATION_FLOWS_FROM, la 
             group
 {
-   name: "elm/button/base/custom2";
-
-   data.item: "access_highlight" "on";
-   images.image: "../../res/images/c_h_2.png" COMP;
-
-   parts
-   {
-      part
-      {
-         name: "highlight";
-         clip_to: "highlight_clip";
-         description
-         {
-            state: "default" 0.0;
-            image.normal: "../../res/images/c_h_2.png";
-            image.border: 10 10 10 10;
-            image.middle: 0;
-            fill.smooth: 0;
-            rel1.to: "elm.text";
-            rel1.offset: 30 5;
-            rel2.to: "elm.text";
-            rel2.offset: -30 0;
-            visible: 0;
-         }
-         description
-         {
-            state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-   }
-   programs
-   {
-      program
-      {
-         name: "show_new_highlight";
-         signal: "elm,action,access_highlight,show";
-         source: "elm";
-         action: STATE_SET "visible" 0.0;
-         target: "highlight";
-      }
-      program
-      {
-         name: "hide_new_highlight";
-         signal: "elm,action,access_highlight,hide";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "highlight";
-      }
-   }
+   name: "elm/button/base/custom2";
+
+   data.item: "access_highlight" "on";
+   images.image: "../../res/images/c_h_2.png" COMP;
+
+   parts
+   {
+      part
+      {
+         name: "highlight";
+         clip_to: "highlight_clip";
+         description
+         {
+            state: "default" 0.0;
+            image.normal: "../../res/images/c_h_2.png";
+            image.border: 10 10 10 10;
+            image.middle: 0;
+            fill.smooth: 0;
+            rel1.to: "elm.text";
+            rel1.offset: 30 5;
+            rel2.to: "elm.text";
+            rel2.offset: -30 0;
+            visible: 0;
+         }
+         description
+         {
+            state: "visible" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+   }
+   programs
+   {
+      program
+      {
+         name: "show_new_highlight";
+         signal: "elm,action,access_highlight,show";
+         source: "elm";
+         action: STATE_SET "visible" 0.0;
+         target: "highlight";
+      }
+      program
+      {
+         name: "hide_new_highlight";
+         signal: "elm,action,access_highlight,hide";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "highlight";
+      }
+   }
 }
            @@ -514,16 +514,16 @@ group static Evas_Object* create_custom_frame(Evas_Object *parent) { -    Evas_Object *btn; -    Evas_Object *layout; + Evas_Object *btn; + Evas_Object *layout; -    layout = elm_layout_add(parent); + layout = elm_layout_add(parent); -    btn = elm_button_add(layout); + btn = elm_button_add(layout); -    elm_object_style_set(btn, "custom2"); + elm_object_style_set(btn, "custom2"); -    return layout; + return layout; } diff --git a/org.tizen.guides/html/native/ui/efl/accessibility_n.htm b/org.tizen.guides/html/native/ui/efl/accessibility_n.htm index 66c077f..30f3f95 100644 --- a/org.tizen.guides/html/native/ui/efl/accessibility_n.htm +++ b/org.tizen.guides/html/native/ui/efl/accessibility_n.htm @@ -5,20 +5,20 @@ - + - Accessibility - + Accessibility + - +

            Mobile native Wearable native

            - +

            Dependencies

            -
            +
            -

            Accessibility

            +

            Accessibility

            Accessibility features have become an essential part of high quality software. Their goal is to empower disabled users to use new technologies. This is especially important to low-vision and visually-impaired users who possibly have no access whatsoever to software unless it incorporates appropriate accessibility solutions.

            -

            Tizen provides accessibility features for developing applications for disabled users:

            +

            Tizen provides accessibility features for developing applications for disabled users:

            • Accessibility Architecture @@ -49,24 +49,24 @@
            • Implementing Accessible Applications

              You can make your application accessible by following good accessibility practices. Using an EFL Elementary sample application, you can see in practice how to implement readable components for the Screen Reader, and customize the UI reading order and the highlight frame appearance.

            - +

            Benefits of Accessibility

            Adding accessibility features in your application brings various benefits:

            • Using a universal design

              Developing products that can be used by everyone, including often neglected minorities, such as disabled or elderly users, is a good software design practice and as such must be reinforced whenever possible.

              • -
            • Considering disabled users' needs +
            • Considering disabled users' needs

              Disabled users often find it difficult or even completely impossible to use regular applications. Putting a little effort into making your application accessible can make all the difference.

            • Increasing the audience of your application

              Disabled people make up a considerable portion of society. It is estimated that 10 to 15% of the global population is disabled. In Europe alone, there are about 80 million people with disabilities. Making your application accessible can increase its potential audience.

            • Distinguishing your application -

              Many of the applications currently available on the market are not accessible. Making yours accessible positively distinguishes it from your competitors' products, and can create a marketing advantage.

              • +

              Many of the applications currently available on the market are not accessible. Making yours accessible positively distinguishes it from your competitors' products, and can create a marketing advantage.

            • Complying with legal acts and policies

              Some organizations can be required by law or internal policies to make their products accessible. One of the examples is Section 508 of the Rehabilitation Act of 1973 which obliges federal agencies in the United States to make their electronic and information technology accessible to disabled users.

            - - + +
            diff --git a/org.tizen.guides/html/native/ui/efl/component_background_mn.htm b/org.tizen.guides/html/native/ui/efl/component_background_mn.htm index 57c8e4d..db0adeb 100644 --- a/org.tizen.guides/html/native/ui/efl/component_background_mn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_background_mn.htm @@ -5,13 +5,13 @@ - + - Background + Background @@ -34,21 +34,21 @@

            Related Info

            - +

            Background

            The background UI component is used to set a solid background decoration to a window or a container object. It works like an image, but has some background-specific properties. It can be set to a tiled, centered, scaled, or stretched mode. The background is the most simple UI component in that it emits no signals. For more information, see the Background API.

            - +

            This feature is supported in mobile applications only.

            - +

            Basic Usage

            - +

            To use a background component in your application:

            1. Add a background with the elm_bg_add() function: @@ -67,13 +67,13 @@ elm_bg_color_set(bg, 64, 127, 256);
            2. Set an Edje group as a background using the elm_bg_file_set() function: 
              -elm_bg_file_set(bg, "/path/to/the/edje", "group name");
+elm_bg_file_set(bg, "/path/to/the/edje", "group name");
            3. Set an image file as a background using the elm_bg_file_set() function.

              In case of an image background, you can set additional options.

              -elm_bg_file_set(bg, "/path/to/the/image", NULL);
+elm_bg_file_set(bg, "/path/to/the/image", NULL);
          @@ -114,11 +114,11 @@ box = elm_box_add(bg); elm_object_content_set(bg, box); label = elm_label_add(box); -elm_object_text_set(label, "overlay swallow part"); +elm_object_text_set(label, "overlay swallow part"); evas_object_show(label); elm_box_pack_end(box,label); -elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, NULL); +elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, NULL); @@ -135,7 +135,7 @@ elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, NULL);
          • ELM_BG_OPTION_CENTER: Centers the background image.
          • ELM_BG_OPTION_SCALE: Scales the background image, retaining the aspect ratio.
            • -
          • ELM_BG_OPTION_STRETCH: Stretches the background image to fill the UI component's area.
            • +
          • ELM_BG_OPTION_STRETCH: Stretches the background image to fill the UI component's area.
          • ELM_BG_OPTION_TILE: Tiles the background image at its original size.
          @@ -196,7 +196,7 @@ elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, NULL); + + - Background + Background @@ -35,10 +35,10 @@ - +

          Background

          @@ -47,9 +47,9 @@

          The background UI component is used to set a solid background decoration to a window or a container object. It works like an image, but has some background-specific properties. It can be set to a tiled, centered, scaled, or stretched mode. The background is the most simple UI component in that it emits no signals. For more information, see the Background API.

          This feature is supported in wearable applications only.

          - +

          Basic Usage

          - +

          To use a background component in your application:

          1. Add a background with the elm_bg_add() function: @@ -68,13 +68,13 @@ elm_bg_color_set(bg, 64, 127, 256);
          2. Set an Edje group as a background using the elm_bg_file_set() function: 
            -elm_bg_file_set(bg, "/path/to/the/edje", "group name");
+elm_bg_file_set(bg, "/path/to/the/edje", "group name");
          3. Set an image file as a background using the elm_bg_file_set() function.

            In case of an image background, you can set additional options.

            -elm_bg_file_set(bg, "/path/to/the/image", NULL);
+elm_bg_file_set(bg, "/path/to/the/image", NULL);
        @@ -116,11 +116,11 @@ box = elm_box_add(bg); elm_object_content_set(bg, box); label = elm_label_add(box); -elm_object_text_set(label, "overlay swallow part"); +elm_object_text_set(label, "overlay swallow part"); evas_object_show(label); elm_box_pack_end(box,label); -elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, "empty"); +elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, "empty"); @@ -136,7 +136,7 @@ elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, "empty&
        • ELM_BG_OPTION_CENTER: Centers the background image.
        • ELM_BG_OPTION_SCALE: Scales the background image, retaining the aspect ratio.
          • -
        • ELM_BG_OPTION_STRETCH: Stretches the background image to fill the UI component's area.
          • +
        • ELM_BG_OPTION_STRETCH: Stretches the background image to fill the UI component's area.
        • ELM_BG_OPTION_TILE: Tiles the background image at its original size.

        Table: Background options

        @@ -191,7 +191,7 @@ elm_naviframe_item_push(nf, "Background", NULL, NULL, bg, "empty& + + - Button + Button @@ -35,10 +35,10 @@

        Related Info

        - +

        Button

        @@ -46,9 +46,9 @@

        The button UI component works as a clickable input element to trigger events. For more information, see the Button API.

        This feature is supported in mobile applications only.

        - +

        Basic Usage

        - +

        To use a button component in your application:

        1. Add a button with the elm_button_add() function: @@ -62,19 +62,19 @@ button = elm_button_add(parent);
          • Set a style to the button with the elm_object_style_set() function. If you use the default style, you can skip this step. 
            -elm_object_style_set(button, "circle");
+elm_object_style_set(button, "circle");
          • Set a label to the button with the elm_object_text_set() function, if the style supports a text part. 
            -elm_object_text_set(button, "Home");
+elm_object_text_set(button, "Home");
          • Set an image object to the button with the elm_object_part_content_set() function, if the style supports a swallow part. 
             Evas_Object *icon;
 
-elm_object_part_content_set(button, "icon", icon);
+elm_object_part_content_set(button, "icon", icon);
          @@ -82,21 +82,21 @@ elm_object_part_content_set(button, "icon", icon);
        2. Register the callback functions.

          The following example shows how to define and register a callback for the clicked signal:

          -evas_object_smart_callback_add(button, "clicked", clicked_cb, data);
+evas_object_smart_callback_add(button, "clicked", clicked_cb, data);
 
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Button clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Button clicked\n");
 }
        - +

        The following example shows a simple use case of the button component.

        - -

        Example: Button use case

        + +

        Example: Button use case

        @@ -115,19 +115,19 @@ Evas_Object *icon; /* Add a box to contain a button and push the box into the naviframe */ box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Button", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Button", NULL, NULL, box, NULL); /* Add a button and set a style */ button = elm_button_add(box); -elm_object_style_set(button, "circle"); +elm_object_style_set(button, "circle"); /* Set a text to the button */ -elm_object_text_set(button, "Home"); +elm_object_text_set(button, "Home"); /* Add an icon and set it as a content */ icon = elm_icon_add(button); -elm_icon_standard_set(icon, "home"); -elm_object_part_content_set(button, "icon", icon); +elm_icon_standard_set(icon, "home"); +elm_object_part_content_set(button, "icon", icon); evas_object_show(button); elm_box_pack_end(box, button); @@ -139,11 +139,11 @@ elm_box_pack_end(box, button);
        - +

        Features

        - +

        You can use the autorepeat feature in your application. Once a button is pressed, a repeated signal is emitted repeatedly until the button is released.

        - +

        • To disable the autorepeat feature:

          @@ -280,13 +280,13 @@ elm_button_autorepeat_gap_timeout_set(button, 0.5);
 
 
          You can register callback functions connected to the following signals for a button object.
          
 
-   
          Table: Button callback signals
           
+   
          Table: Button callback signals
          
 
-          
-          
-          
+         
+         
+         
@@ -308,7 +308,7 @@ elm_button_autorepeat_gap_timeout_set(button, 0.5);
          
-    
+   
          
    
       
          SignalDescriptionevent_infoSignalDescriptionevent_info
       
          
       
          
         clickedThe button is released after being pressed.
          NULL
       
          
 
          
 
 
          
@@ -330,7 +330,7 @@ elm_button_autorepeat_gap_timeout_set(button, 0.5);
 
  
+
          
 
 
 	
+	
 	
 	
 	
 	
 
-	Button  
+	Button
 
 
 
@@ -36,10 +36,10 @@
        -
        +

        Button

        @@ -74,14 +74,14 @@ button = elm_button_add(parent); 
         Evas_Object *ic;
 ic = elm_icon_add(button);
-elm_image_file_set(ic, "icon.png", NULL);
-elm_object_part_content_set(button, "icon", ic);
+elm_image_file_set(ic, "icon.png", NULL);
+elm_object_part_content_set(button, "icon", ic);
      11. To add text to the label, use the elm_object_text_set() function: 
        -elm_object_text_set(button, "Click me!");
+elm_object_text_set(button, "Click me!");

        12. Using the Button Styles

        @@ -104,10 +104,10 @@ elm_object_text_set(button, "Click me!"); 
         /* Rectangular screen button style */
-elm_object_style_set(button, "nextdepth");
+elm_object_style_set(button, "nextdepth");
 
 /* Circular screen button style */
-elm_object_style_set(button, "bottom");
+elm_object_style_set(button, "bottom");

        Using the Button Callbacks

        @@ -132,15 +132,15 @@ elm_object_style_set(button, "bottom"); 
         {
-    evas_object_smart_callback_add(button, "clicked", clicked_cb, data);
+    evas_object_smart_callback_add(button, "clicked", clicked_cb, data);
 }
 
-/* Callback for the "clicked" signal */
+/* Callback for the "clicked" signal */
 /* Called when the button is clicked by the user */
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Button clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Button clicked\n");
 }
        @@ -188,7 +188,7 @@ elm_button_autorepeat_gap_timeout_set(button, 0.5); +
        + - Calendar + Calendar @@ -34,10 +34,10 @@

        Related Info

        - +

        Calendar

        @@ -45,17 +45,17 @@

        The calendar UI component displays month views. For more information, see the Calendar API.

        This feature is supported in mobile applications only.

        - -

        Figure: Calendar component

        -

        Calendar component

        - + +

        Figure: Calendar component

        +

        Calendar component

        +

        Basic Usage

        - +

        To use a calendar component in your application:

        1. Add a calendar with the elm_calendar_add() function.
        2. Select the month to display with the elm_calendar_selected_time_set() function: - + 
           Evas_Object *calendar;
 Evas_Object *parent;
@@ -66,11 +66,11 @@ time(&the_time); /* Get the current time */
 calendar = elm_calendar_add(parent);
 elm_calendar_selected_time_set(calendar, gmtime(&the_time));
          - +
        3. Configure the month view:
          • -

            Change the first day of the week (by default, Sunday).

            +

            Change the first day of the week (by default, Sunday).

            To change the first weekday to Monday:

             elm_calendar_first_day_of_week_set(calendar, ELM_DAY_MONDAY);
@@ -78,7 +78,7 @@ elm_calendar_first_day_of_week_set(calendar, ELM_DAY_MONDAY);
 
 
          • Modify the names of the weekdays using the elm_calendar_weekdays_names_set() function:
            
 
            -const char *weekname[7] = {"A", "B", "C", "D", "E", "F", "G"};
+const char *weekname[7] = {"A", "B", "C", "D", "E", "F", "G"};
 elm_calendar_weekdays_names_set(calendar, &weekname);
 
            • 
 
@@ -89,20 +89,20 @@ struct tm *sunday = gmtime(&the_time);
 sunday->tm_mday -= sunday->tm_wday;
 sunday->tm_wday = 0;
 
-elm_calendar_mark_add(calendar, "holiday", sunday, ELM_CALENDAR_WEEKLY);
+elm_calendar_mark_add(calendar, "holiday", sunday, ELM_CALENDAR_WEEKLY);
        4. Register the callback functions.

          The following example shows how to define and register a callback for the changed signal:

          -evas_object_smart_callback_add(calendar, "changed", changed_cb, data);
+evas_object_smart_callback_add(calendar, "changed", changed_cb, data);
 
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Calendar is changed. \n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Calendar is changed. \n");
 }
-
          +
        @@ -129,23 +129,23 @@ changed_cb(void *data, Evas_Object *obj, void *event_info)

        You can register callback functions connected to the following signals for a calendar object.

        -

        Table: Calendar callback signals

        +

        Table: Calendar callback signals

        - + - + - - - + + + - +
        SignalDescriptionevent_infoSignalDescriptionevent_info
        changed The selected date is changed. NULL
        @@ -167,7 +167,7 @@ changed_cb(void *data, Evas_Object *obj, void *event_info) +
        + - Check + Check @@ -34,20 +34,20 @@

        Related Info

        -
        +

        Check

        The check UI component accepts user input by the method of toggling. It is similar to the radio component, except that it does not work as a group. For more information, see the Check API.

        - +

        This feature is supported in mobile applications only.

        - +

        Basic Usage

        - +

        To use a check component in your application:

        1. Add a check component with the elm_check_add() function: @@ -61,24 +61,24 @@ check = elm_check_add(parent);
          • Set a style to the check component with the elm_object_style_set() function. If you use the default style, you can skip this step. 
            -elm_object_style_set(check, "favorite");
+elm_object_style_set(check, "favorite");
          • Set a label to the check component with the elm_object_text_set() or elm_object_part_text_set() function: 
             /* Default style */
-elm_object_text_set(check, "Check");
+elm_object_text_set(check, "Check");
 
 /* on&off style */
-elm_object_part_text_set(check, "on", "True");
-elm_object_part_text_set(check, "off", "False");
+elm_object_part_text_set(check, "on", "True");
+elm_object_part_text_set(check, "off", "False");
          • Set an icon to the button with the elm_object_part_content_set() function and pass the icon part name as a parameter. 
             Evas_Object *icon;
 
-elm_object_part_content_set(check, "icon", icon);
+elm_object_part_content_set(check, "icon", icon);
          @@ -86,12 +86,12 @@ elm_object_part_content_set(check, "icon", icon);
        2. Register the callback functions.

          The following example shows how to define and register a callback for the changed signal:

          -evas_object_smart_callback_add(check, "changed", changed_cb, data);
+evas_object_smart_callback_add(check, "changed", changed_cb, data);
 
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
 }
          3. @@ -100,7 +100,7 @@ changed_cb(void *data, Evas_Object *obj, void *event_info)

          The following example shows a simple use case of the check component.

          Example: Check use case

          - +
          @@ -118,7 +118,7 @@ Evas_Object *check; box = elm_box_add(nf); elm_object_content_set(nf, box); evas_object_show(box); -elm_naviframe_item_push(nf, "Check", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Check", NULL, NULL, box, NULL); check = elm_check_add(box); evas_object_show(check); @@ -131,7 +131,7 @@ elm_box_pack_end(box, check);
          - +

          Styles

          The following table lists the available component styles.

          @@ -165,32 +165,32 @@ elm_box_pack_end(box, check); - +

          Callbacks

          You can register callback functions connected to the following signals for a check object.

          -

          Table: Check callback signals

          +

          Table: Check callback signals

          - - - + + + - +
          SignalDescriptionevent_infoSignalDescriptionevent_info
          changed The check component value changes. NULL
          - +
          Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
          - +
          Note Except as noted, this content is licensed under LGPLv2.1+. @@ -205,7 +205,7 @@ elm_box_pack_end(box, check); +
          + - Circle Datetime - + Circle Datetime + - + +

        Circle Datetime

        @@ -48,8 +48,8 @@

        For more information, see the Efl Extension Circle Datetime API.

        -

        Figure: Circle datetime component

        -

        Circle datetime component

        +

        Figure: Circle datetime component

        +

        Circle datetime component

        Adding a Circle Datetime Component

        diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_genlist_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_genlist_wn.htm index 4c6aecc..cfd1af4 100644 --- a/org.tizen.guides/html/native/ui/efl/component_circ_genlist_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_circ_genlist_wn.htm @@ -5,20 +5,20 @@ - + - Circle Genlist - + Circle Genlist + - + +

        Circle Genlist

        @@ -49,8 +49,8 @@

        For more information, see the Efl Extension Circle Genlist API.

        -

        Figure: Circle genlist component

        -

        Circle genlist component

        +

        Figure: Circle genlist component

        +

        Circle genlist component

        Adding a Circle Genlist Component

        @@ -75,8 +75,8 @@ circle_genlist = eext_circle_object_genlist_add(genlist, surface);

        The following example sets the horizontal scrollbar off and the vertical scrollbar always on:

         eext_circle_object_genlist_scroller_policy_set(circle_genlist,
-                                               ELM_SCROLLER_POLICY_OFF,
-                                               ELM_SCROLLER_POLICY_ON);
+                                               ELM_SCROLLER_POLICY_OFF,
+                                               ELM_SCROLLER_POLICY_ON);

        Activating a Rotary Event

        @@ -104,7 +104,7 @@ eext_rotary_object_event_activated_set(circle_genlist, EINA_TRUE);
      12. eext_circle_object_disabled_set()
      13. eext_circle_object_disabled_get()
        14. -

      14. You can modify the circle genlist item properties with the eext_circle_object_item_XXX() functions.

        +

      15. You can modify the circle genlist item properties with the eext_circle_object_item_XXX() functions.

        The circle genlist has the following items:

        16. Circle Object

        @@ -97,14 +97,14 @@ eext_circle_object_value_min_max_set(circle_obj, 0.0, 10.0); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_value_min_max_set(circle_obj, "default", 0.0, 10.0); +eext_circle_object_item_value_min_max_set(circle_obj, "default", 0.0, 10.0);

        To get the current minimum and maximum values of the item, use the eext_circle_object_item_value_min_max_get() function.

      16. Set the value: - +
        Note The value cannot be lower than the minimum value or higher than the maximum value. @@ -128,7 +128,7 @@ eext_circle_object_value_set(circle_obj, 5.0); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_value_set(circle_obj, "default", 5.0); +eext_circle_object_item_value_set(circle_obj, "default", 5.0);

        To get the current value of the item, use the eext_circle_object_item_value_get() function.

        17. @@ -159,7 +159,7 @@ eext_circle_object_angle_set(circle_obj, 45.0); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_angle_set(circle_obj, "default", 45.0); +eext_circle_object_item_angle_set(circle_obj, "default", 45.0);

        To get the current angle of the item, use the eext_circle_object_item_angle_get() function.

        @@ -186,8 +186,8 @@ eext_circle_object_angle_offset_set(circle_obj, 30.0); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_angle_set(circle_obj, "default", 45.0); -eext_circle_object_item_angle_offset_set(circle_obj, "default", 30.0); +eext_circle_object_item_angle_set(circle_obj, "default", 45.0); +eext_circle_object_item_angle_offset_set(circle_obj, "default", 30.0);

        To get the current angle of the item, use the eext_circle_object_item_angle_offset_get() function.

        @@ -213,7 +213,7 @@ eext_circle_object_angle_min_max_set(circle_obj, 0.0, 90.0); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_angle_min_max_set(circle_obj, "default", 0.0, 90.0); +eext_circle_object_item_angle_min_max_set(circle_obj, "default", 0.0, 90.0);

        To get the current minimum and maximum angles of the item, use the eext_circle_object_item_angle_min_max_get() function.

        @@ -244,7 +244,7 @@ eext_circle_object_line_width_set(circle_obj, 20); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_line_width_set(circle_obj, "default", 20); +eext_circle_object_item_line_width_set(circle_obj, "default", 20);

        To get the current line width of the item, use the eext_circle_object_item_line_width_get() function.

        @@ -270,7 +270,7 @@ eext_circle_object_color_set(circle_obj, 255, 0, 0, 255); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_value_set(circle_obj, "default", 255, 0, 0, 255); +eext_circle_object_item_value_set(circle_obj, "default", 255, 0, 0, 255);

        To get the current color of the item, use the eext_circle_object_item_color_get() function.

        @@ -295,7 +295,7 @@ eext_circle_object_radius_set(circle_obj, 50.0); Evas_Object *circle_obj; circle_obj = eext_circle_object_add(parent, surface); -eext_circle_object_item_radius_set(circle_obj, "default", 50.0); +eext_circle_object_item_radius_set(circle_obj, "default", 50.0);

        To get the current radius of the item, use the eext_circle_object_item_radius_get() function.

        diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_option_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_option_wn.htm index f8599d1..f95316b 100644 --- a/org.tizen.guides/html/native/ui/efl/component_circ_option_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_circ_option_wn.htm @@ -5,20 +5,20 @@ - + - More Option - + More Option + - + +

        More Option

        @@ -49,10 +49,10 @@

        The basic view of the more option contains a cue button (shown on the left in the following figure). When the cue button is clicked, the selector view opens from the cue location (shown on the right in the figure). When the back motion is done in the selector view, the selector view disappears.

        -

        The selector view can emit events when an item or the selector are clicked, and it can receive a rotary event. However, you do not need to call the eext_rotary_object_event_activated_set() function to activate the rotary event, since the function is called automatically according to the elm_panel state.

        +

        The selector view can emit events when an item or the selector are clicked, and it can receive a rotary event. However, you do not need to call the eext_rotary_object_event_activated_set() function to activate the rotary event, since the function is called automatically according to the elm_panel state.

        -

        Figure: More option component

        -

        More option component

        +

        Figure: More option component

        +

        More option component

        Adding a More Option Component

        To create a more option component, use the eext_more_option_add() function:

        @@ -71,22 +71,22 @@ more_option = eext_more_option_add(parent); 
         {
-    Evas_Object *img = NULL;
+    Evas_Object *img = NULL;
 
-    /* Append item */
-    Eext_Object_Item *item = eext_more_option_item_append(parent);
+    /* Append item */
+    Eext_Object_Item *item = eext_more_option_item_append(parent);
      17. Configure the item (for more information, see Configuring the More Option and Items).

        In the following example, the main and sub text are set for the item, and an icon is added as the item content:

        -    /* Set the text in the rotary_selector */
-    eext_more_option_item_part_text_set(item, "selector,main_text", "test1");
-    eext_more_option_item_part_text_set(item, "selector,sub_text", "test1");
-    /* Set the content icon */
-    img = elm_image_add(parent);
-    eext_more_option_item_part_content_set(item, "item,icon", img);
-    elm_image_file_set(img, "/music_controller_btn_play.png", NULL);
+    /* Set the text in the rotary_selector */
+    eext_more_option_item_part_text_set(item, "selector,main_text", "test1");
+    eext_more_option_item_part_text_set(item, "selector,sub_text", "test1");
+    /* Set the content icon */
+    img = elm_image_add(parent);
+    eext_more_option_item_part_content_set(item, "item,icon", img);
+    elm_image_file_set(img, "/music_controller_btn_play.png", NULL);
 }
      @@ -159,15 +159,15 @@ eext_more_option_direction_set(more_option, EEXT_MORE_OPTION_DIRECTION_RIGHT); 
       {
-    evas_object_smart_callback_add(more_option, "more,option,opened", _opened_cb, data);
+    evas_object_smart_callback_add(more_option, "more,option,opened", _opened_cb, data);
 }
 
-/* Callback for the "more,option,opened" signal */
+/* Callback for the "more,option,opened" signal */
 /* Called when the rotary selector is shown */
 void
 _opened_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Open the More Option\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Open the More Option\n");
 }
      diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_progressbar_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_progressbar_wn.htm index 774ac3d..8d98239 100644 --- a/org.tizen.guides/html/native/ui/efl/component_circ_progressbar_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_circ_progressbar_wn.htm @@ -5,20 +5,20 @@ - + - Circle Progressbar - + Circle Progressbar + - + +

      Circle Progressbar

      @@ -57,7 +57,7 @@ Evas_Object *circle_progressbar; Evas_Object *parent; circle_progressbar = eext_circle_object_progressbar_add(parent, -                                                        surface); + surface);
    3. @@ -101,9 +101,9 @@ circle_surface = eext_circle_surface_conformant_add(conf); /* Add a layout and push the layout into the naviframe */ /* EDJ_PATH is folder path, it contains the progressbar_circle.edj file */ ly = elm_layout_add(nf); -elm_layout_file_set(ly, EDJ_PATH "progressbar_circle.edj", "eext_progressbar_layout"); +elm_layout_file_set(ly, EDJ_PATH "progressbar_circle.edj", "eext_progressbar_layout"); evas_object_show(ly); -elm_naviframe_item_push(nf, "Progress", NULL, NULL, ly, NULL); +elm_naviframe_item_push(nf, "Progress", NULL, NULL, ly, NULL); /* Add a progressbar and set a circle surface to render the progressbar */ pb = eext_circle_object_progressbar_add(ly, circle_surface); @@ -112,63 +112,63 @@ eext_circle_object_value_min_max_set(pb, 0.0, 100.0); /* Set a progressbar value */ eext_circle_object_value_set(pb, 65); /* Set a part content */ -elm_object_part_content_set(ly, "elm.swallow.content", pb); +elm_object_part_content_set(ly, "elm.swallow.content", pb); evas_object_show(pb); /* Get a progressbar value and set a text */ char buf[255]; int value = eext_circle_object_value_get(pb); -snprintf(buf, sizeof(buf), "%d %%", (int)value); -elm_object_part_text_set(ly, "elm.text.progressbar", buf); +snprintf(buf, sizeof(buf), "%d %%", (int)value); +elm_object_part_text_set(ly, "elm.text.progressbar", buf); /* progressbar_circle.edc */ collections { -   group { -      name: "eext_progressbar_layout"; -      parts { -         part { -            name: "base"; -            type: SPACER; -            scale: 1; -            description { -               state: "default" 0.0; -               min: 360 360; -               max: 360 360; -               fixed: 1 1; -            } -         } -         part { -            name: "elm.swallow.content"; -            type: SWALLOW; -            scale: 1; -            description { -               state: "default" 0.0; -               rel1.to: "base"; -               rel2.to: "base"; -            } -         } -         part { -            name: "elm.text.progressbar"; -            type: TEXT; -            scale: 1; -            description { -               state: "default" 0.0; -               fixed: 1 1; -               rel1.to: "base"; -               rel2.to: "base"; -               rel1.relative: 0.5 0.5; -               rel2.relative: 0.5 0.5; -               text { -                  font: "Tizen:style=Regular"; -                  size: 50; -                  min: 1 1; -               } -               color: 255 255 255 255; -            } -         } -      } -   } + group { + name: "eext_progressbar_layout"; + parts { + part { + name: "base"; + type: SPACER; + scale: 1; + description { + state: "default" 0.0; + min: 360 360; + max: 360 360; + fixed: 1 1; + } + } + part { + name: "elm.swallow.content"; + type: SWALLOW; + scale: 1; + description { + state: "default" 0.0; + rel1.to: "base"; + rel2.to: "base"; + } + } + part { + name: "elm.text.progressbar"; + type: TEXT; + scale: 1; + description { + state: "default" 0.0; + fixed: 1 1; + rel1.to: "base"; + rel2.to: "base"; + rel1.relative: 0.5 0.5; + rel2.relative: 0.5 0.5; + text { + font: "Tizen:style=Regular"; + size: 50; + min: 1 1; + } + color: 255 255 255 255; + } + } + } + } } @@ -211,7 +211,7 @@ collections {
    4. -

      You can modify the circle progressbar item properties with the eext_circle_object_item_XXX() functions.

      +

      You can modify the circle progressbar item properties with the eext_circle_object_item_XXX() functions.

      The circle progressbar has the following items:

      • default: Default circle item that draws the progressbar.
        • diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_rotary_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_rotary_wn.htm index 1b90c53..89846a7 100644 --- a/org.tizen.guides/html/native/ui/efl/component_circ_rotary_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_circ_rotary_wn.htm @@ -5,20 +5,20 @@ - + - Rotary Selector - + Rotary Selector + - + +

        Rotary Selector

        @@ -50,9 +50,9 @@

        The rotary selector handle can use the elm_layout functions, because the rotary selector handle is an elm_layout object.

        -

        Figure: Rotary selector component

        -

        Rotary selector component

        - +

        Figure: Rotary selector component

        +

        Rotary selector component

        +

        Adding a Rotary Selector Component

        To create a rotary selector, use the eext_rotary_selector_add() function:

        @@ -97,25 +97,25 @@ item = eext_rotary_selector_item_append(rotary_selector); 
         /* Set item icon */
 image = elm_image_add(rotary_selector);
-elm_image_file_set(image, "music_controller_btn_play.png", NULL);
+elm_image_file_set(image, "music_controller_btn_play.png", NULL);
 
-eext_rotary_selector_item_part_content_set(item, "item,icon",
-                                           EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL,
-                                           image);
+eext_rotary_selector_item_part_content_set(item, "item,icon",
+                                           EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL,
+                                           image);
 
 /* Set selector content icon */
 image = elm_image_add(rotary_selector);
-elm_image_file_set(image, "music_controller_btn.png", NULL);
-eext_rotary_selector_item_part_content_set(item, "selector,icon",
-                                           EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL,
-                                           image);
+elm_image_file_set(image, "music_controller_btn.png", NULL);
+eext_rotary_selector_item_part_content_set(item, "selector,icon",
+                                           EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL,
+                                           image);
      • Define the item texts. The text is displayed in the selector when the item is selected.

        In the following example, the main text is defined for the new item:

         /* Set selector main text */
-eext_rotary_selector_item_part_text_set(item, "selector,main_text", "Options");
+eext_rotary_selector_item_part_text_set(item, "selector,main_text", "Options");

        The following table shows the functions you can use to set the main and sub text of an item.

        @@ -142,7 +142,7 @@ eext_rotary_selector_item_part_text_set(item, "selector,main_text", &q
    - +

    Configuring the Selector and Items

    You can configure the color and content of various rotary selector parts.

    @@ -181,7 +181,7 @@ eext_rotary_selector_item_part_text_set(item, "selector,main_text", &q

    eext_rotary_selector_part_color_set()

    eext_rotary_selector_part_content_get()

    Selector content

    - +

    You can also configure the selector and item appearance based on their current state:

    @@ -193,9 +193,9 @@ eext_rotary_selector_item_part_text_set(item, "selector,main_text", &q

    For example, to set the selector color for a normal state selector:

    -eext_rotary_selector_part_color_set(selector, "selector,bg_image",
-                                    EEXT_ROTARY_SELECTOR_SELECTOR_STATE_NORMAL,
-                                    100, 100, 100, 255);
+eext_rotary_selector_part_color_set(selector, "selector,bg_image",
+                                    EEXT_ROTARY_SELECTOR_SELECTOR_STATE_NORMAL,
+                                    100, 100, 100, 255);
  • The available selector item states are:
    • EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL: Item is in a normal state.
      • @@ -203,11 +203,11 @@ eext_rotary_selector_part_color_set(selector, "selector,bg_image",

      For example, to set the item color for a normal state item:

      -eext_rotary_selector_item_part_color_set(item, "item,icon",
-                                         EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL,
-                                         100, 100, 100, 255);
+eext_rotary_selector_item_part_color_set(item, "item,icon",
+                                         EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL,
+                                         100, 100, 100, 255);
    - +

    Using the Rotary Selector Callbacks

    To receive notifications about the rotary selector events, listen to the following signals:

    @@ -224,15 +224,15 @@ eext_rotary_selector_item_part_color_set(item, "item,icon",

    To register and define a callback for the item,clicked signal:

     {
-    evas_object_smart_callback_add(rotary_selector, "item,clicked", item_clicked_cb, data);
+    evas_object_smart_callback_add(rotary_selector, "item,clicked", item_clicked_cb, data);
 }
 
-/* Callback for the "item,clicked" signal */
+/* Callback for the "item,clicked" signal */
 /* Called when the item is clicked by the user */
 void
 item_clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Item clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Item clicked\n");
 }
    diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_scroller_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_scroller_wn.htm index 0a5a9f3..743d6e2 100644 --- a/org.tizen.guides/html/native/ui/efl/component_circ_scroller_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_circ_scroller_wn.htm @@ -5,20 +5,20 @@ - + - Circle Scroller - + Circle Scroller + - +

    Wearable native

    - +

    Dependencies

      @@ -27,7 +27,7 @@

      Content

      • Adding a Circle Scroller Component
        • -
      • Configuring the Circle Scroller
        • +
      • Configuring the Circle Scroller
      • Activating a Rotary Event
      • Configuring the Circle Properties
        • @@ -52,10 +52,10 @@

        For more information, see the Efl Extension Circle Scroller API.

        -

        Figure: Circle scroller component

        -

        Circle scroller component

        +

        Figure: Circle scroller component

        +

        Circle scroller component

        -

        Adding a Circle Scroller Component

        +

        Adding a Circle Scroller Component

        To create a circle scroller component, use the eext_circle_object_scroller_add() function. Pass a elm_scroller component as the first parameter and a circle surface as the second parameter.

        @@ -82,10 +82,10 @@ circle_scroller = eext_circle_object_scroller_add(scroller, surface);
 
 
         eext_circle_object_scroller_policy_set(circle_scroller, ELM_SCROLLER_POLICY_AUTO,
-                                       ELM_SCROLLER_POLICY_OFF);
+                                       ELM_SCROLLER_POLICY_OFF);
 
        
 
-
        To get the current scroller policy, use the eext_circle_object_scroller_policy_get() function.
         
+
        To get the current scroller policy, use the eext_circle_object_scroller_policy_get() function.
        
 
 
        Activating a Rotary Event
        
 
@@ -111,7 +111,7 @@ eext_rotary_object_event_activated_set(circle_scroller, EINA_TRUE);
 	
      • eext_circle_object_disabled_set()
        • 
 	
      • eext_circle_object_disabled_get()
        •
      -

    • You can modify the circle scroller item properties with the eext_circle_object_item_XXX() functions.

      +

    • You can modify the circle scroller item properties with the eext_circle_object_item_XXX() functions.

      The circle scroller has the following items:

    Circle Slider

    The circle slider UI component changes corresponding to rotary events. The circle slider not only extends the UI feature of the slider component (elm_slider), but also replaces the functionalities of the elm_slider in the circular design. For more information, see the Efl Extension Circle Slider API.

    - +

    This feature is supported in wearable applications only.

    - +

    Basic Usage

    To use a circle slider component in your application:

    @@ -56,7 +56,7 @@ Evas_Object *slider = NULL; slider = eext_circle_object_slider_add(ad->nf, -                                       ad->circle_surface); + ad->circle_surface);
  • Configure the circle slider features. @@ -72,15 +72,15 @@ slider = eext_circle_object_slider_add(ad->nf,
  • Register the callback functions.

    The following example shows how to define and register a callback for the value,changed signal:

    -evas_object_smart_callback_add(slider, "value,changed", _value_changed_cb, NULL);
+evas_object_smart_callback_add(slider, "value,changed", _value_changed_cb, NULL);
 
-/* Callback for the "value,changed" signal */
+/* Callback for the "value,changed" signal */
 /* Called when the value of the circle slider is changed */
 static void
 _value_changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    double _val = eext_circle_object_value_get(obj);
-    dlog_print(DLOG_INFO, LOG_TAG, "Circle slider value changed. %0.1f\n", _val);
+    double _val = eext_circle_object_value_get(obj);
+    dlog_print(DLOG_INFO, LOG_TAG, "Circle slider value changed. %0.1f\n", _val);
 }
    • @@ -113,7 +113,7 @@ eext_circle_object_value_set(slider, 5.0); eext_circle_object_color_set(slider, 255, 0, 0, 255); eext_rotary_object_event_activated_set(slider, EINA_TRUE); -evas_object_smart_callback_add(slider, "value,changed", _value_changed_cb, 0); +evas_object_smart_callback_add(slider, "value,changed", _value_changed_cb, 0); @@ -243,7 +243,7 @@ eext_circle_object_value_set(slider, 5.0); eext_circle_object_color_set(slider, 255, 0, 0, 255); /* Set background color */ -eext_circle_object_item_color_set(slider, "bg", 0, 0, 255, 255); +eext_circle_object_item_color_set(slider, "bg", 0, 0, 255, 255); @@ -269,11 +269,11 @@ eext_circle_object_item_color_set(slider, "bg", 0, 0, 255, 255); - +
    Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. -
    + diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_spinner_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_spinner_wn.htm index 99b81e9..4e7f448 100644 --- a/org.tizen.guides/html/native/ui/efl/component_circ_spinner_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_circ_spinner_wn.htm @@ -5,20 +5,20 @@ - + - Circle Spinner - + Circle Spinner + - +

    Wearable native

    - +

    Dependencies

      @@ -27,7 +27,7 @@

      Content

      @@ -44,7 +44,7 @@

      Circle Spinner

      This feature is supported in wearable applications only.

      - +

      The circle spinner component extends the spinner component (elm_spinner) by visualizing its value. The circle spinner increases or decreases the value of the elm_spinner through a clockwise or counter-clockwise rotary event.

      Figure: Circle spinner component

      @@ -62,7 +62,7 @@ spinner = elm_spinner_add(parent);
    • Set the object style as circle: 
      -elm_object_style_set(spinner, "circle");
+elm_object_style_set(spinner, "circle");
    • Create an eext_spinner object using the eext_circle_object_spinner_add() function. Pass a circle surface as the second parameter. 
      diff --git a/org.tizen.guides/html/native/ui/efl/component_circ_surface_wn.htm b/org.tizen.guides/html/native/ui/efl/component_circ_surface_wn.htm
index f7020ca..5430989 100644
--- a/org.tizen.guides/html/native/ui/efl/component_circ_surface_wn.htm
+++ b/org.tizen.guides/html/native/ui/efl/component_circ_surface_wn.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Circle Surface 
-  
+  Circle Surface
+ 
  
- 
+
  
      
 	
      
 		
      Wearable native
      
 	
      
-	
+
 	
      
 	
      Dependencies
      
 		
        
@@ -44,7 +44,7 @@
 
 
        This feature is supported in wearable applications only.
        
 
-
        The circle surface component manages and renders circle objects. Multiple circle objects can be connected to 1 circle surface as candidates of an object to be rendered. When 1 circle object is set as visible, the surface renders the circle object and hides the others.
         
+
        The circle surface component manages and renders circle objects. Multiple circle objects can be connected to 1 circle surface as candidates of an object to be rendered. When 1 circle object is set as visible, the surface renders the circle object and hides the others.
        
 
 
        For more information, see the Efl Extension Circle Surface API.
        
 
diff --git a/org.tizen.guides/html/native/ui/efl/component_colorselector_mn.htm b/org.tizen.guides/html/native/ui/efl/component_colorselector_mn.htm
index 7e5af7a..d5d4da7 100644
--- a/org.tizen.guides/html/native/ui/efl/component_colorselector_mn.htm
+++ b/org.tizen.guides/html/native/ui/efl/component_colorselector_mn.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Colorselector  
+	Colorselector
 
 
 
@@ -45,9 +45,9 @@
 
 
        The colorselector UI component allows users to select a color. For more information, see the Colorselector API.
        
    
        This feature is supported in mobile applications only.
        
- 
+
 
        Basic Usage
        
- 
+
 
        To use a colorselector component in your application:
        
 
          
    
        1. Add a colorselector with the elm_colorselector_add() function:
@@ -60,34 +60,34 @@ colorsel = elm_colorselector_add(parent);
    
        2. Set a mode to the colorselector with the elm_colorselector_mode_set() function. Currently, only the palette mode is available in Tizen.
 
           elm_colorselector_mode_set(colorsel,
-                           ELM_COLORSELECTOR_PALETTE);
+                           ELM_COLORSELECTOR_PALETTE);
 
          
    
          3. 
    
        3. Set a name to the palette with the elm_colorselector_palette_name_set() function. If you use the default palette, you can skip this step.
          4. 
    
        4. Add colors to the palette. If you use the default style, you can skip this step, since the default palette already has the colors selected.
 
          The new palette is saved by the elementary configuration and you can load it again later.
          
 
          The palette mode displays several color items for the user to select from. It is possible to add new items, or to update the color of the current item. The list of color items is called a palette, and it is associated with a unique identifier. You can create a new series of colors (a new palette) and save it under another identifier. By default, the palette mode uses the default palette, which contains 14 colors.
          
-   
+
    
          5. 
    
        5. Register the callback functions.
    
          When a color in the colorselector is clicked, the color set to the colorselector component changes.
    Retrieve the currently selected color with the elm_colorselector_color_set() function.
          
    
          The following example shows how to define and register a callback for the changed signal:
          
 
          -evas_object_smart_callback_add(colorselector, "changed", changed_cb, data);
+evas_object_smart_callback_add(colorselector, "changed", changed_cb, data);
 
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The color has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The color has changed\n");
 }
-
           
-   
+
      +

      • The following example shows a simple use case of the colorselector component.

      -

      Example: Colorselector use case

      +

      Example: Colorselector use case

      @@ -106,7 +106,7 @@ colsel = elm_colorselector_add(nf); elm_colorselector_mode_set(colsel, ELM_COLORSELECTOR_PALETTE); evas_object_show(colsel); -elm_naviframe_item_push(nf, "Colorselector", NULL, NULL, colsel, NULL); +elm_naviframe_item_push(nf, "Colorselector", NULL, NULL, colsel, NULL);
      @@ -115,10 +115,10 @@ elm_naviframe_item_push(nf, "Colorselector", NULL, NULL, colsel, NULL)
      - +

      The following example shows how to add a new palette called mypalette, with 3 colors (red, green, and blue).

      - -

      Example: Customized colorselector

      + +

      Example: Customized colorselector

      @@ -129,7 +129,7 @@ Evas_Object *conf; Evas_Object *nf; Evas_Object *colsel; Elm_Object_Item *nf_it; - + /* Starting right after the basic EFL UI layout code */ /* win - conformant - naviframe */ @@ -137,9 +137,9 @@ colsel = elm_colorselector_add(nf); elm_colorselector_mode_set(colsel, ELM_COLORSELECTOR_PALETTE); evas_object_show(colsel); -elm_naviframe_item_push(nf, "Colorselector", NULL, NULL, colsel, NULL); - -elm_colorselector_palette_name_set(colorsel, "mypalette"); +elm_naviframe_item_push(nf, "Colorselector", NULL, NULL, colsel, NULL); + +elm_colorselector_palette_name_set(colorsel, "mypalette"); elm_colorselector_palette_color_add(colorsel, 255, 0, 0, 255); elm_colorselector_palette_color_add(colorsel, 0, 255, 0, 255); elm_colorselector_palette_color_add(colorsel, 0, 0, 255, 255); @@ -151,7 +151,7 @@ elm_colorselector_palette_color_add(colorsel, 0, 0, 255, 255);
      - +

      Styles

      The following table lists the available component styles.

      @@ -171,21 +171,21 @@ elm_colorselector_palette_color_add(colorsel, 0, 0, 255, 255); - +

      Callbacks

      You can register callback functions connected to the following signals for a colorselector object.

      -

      Table: Colorselector callback signals

      +

      Table: Colorselector callback signals

      - + - + - - - + + + @@ -202,14 +202,14 @@ elm_colorselector_palette_color_add(colorsel, 0, 0, 255, 255); - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      changedThe color item is long-pressed. The long-pressed color item
      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
      - +
      Note Except as noted, this content is licensed under LGPLv2.1+. @@ -224,7 +224,7 @@ elm_colorselector_palette_color_add(colorsel, 0, 0, 255, 255); +
      + - Ctxpopup + Ctxpopup @@ -46,11 +46,11 @@

      The ctxpopup UI component pops up and shows a list of items inside it. For more information, see the Ctxpopup API.

      - +

      This feature is supported in mobile applications only.

      - +

      Basic Usage

      - +

      To use a ctxpopup component in your application:

      1. Add a ctxpopup with the elm_ctxpopup_add() function: @@ -62,22 +62,22 @@ ctxpopup = elm_ctxpopup_add(parent);
      2. Configure the ctxpopup features.
      3. Append items to the ctxpopup with the elm_ctxpopup_item_append() function. - The function takes 5 parameters: the pointer of the ctxpopup, a file path of an icon, a text, a callback function to call when the item is clicked, and the parameter passed to the callback. + The function takes 5 parameters: the pointer of the ctxpopup, a file path of an icon, a text, a callback function to call when the item is clicked, and the parameter passed to the callback. 
        -elm_ctxpopup_item_append(ctxpopup, "icon.png",
-                         "Call",
-                         _item_selected_cb,
-                         NULL);
+elm_ctxpopup_item_append(ctxpopup, "icon.png",
+                         "Call",
+                         _item_selected_cb,
+                         NULL);
      4. Register the callback functions.
      - -

      When shown, the ctxpopup automatically selects an area inside its parent object's view to optimally fit into it. Set the object view with the elm_ctxpopup_hover_parent_set() function.

      - + +

      When shown, the ctxpopup automatically selects an area inside its parent object's view to optimally fit into it. Set the object view with the elm_ctxpopup_hover_parent_set() function.

      +

      The following example shows a simple use case of the ctxpopup component.

      - -

      Example: Ctxpopup use case

      + +

      Example: Ctxpopup use case

      @@ -95,11 +95,11 @@ Evas_Object *btn; box = elm_box_add(nf); elm_object_content_set(nf, box); evas_object_show(box); -elm_naviframe_item_push(nf, "Ctxpopup", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Ctxpopup", NULL, NULL, box, NULL); btn = elm_button_add(box); -elm_object_text_set(btn, "Click to see ctxpopup"); -evas_object_smart_callback_add(btn, "clicked", _btn_clicked_cb, nf); +elm_object_text_set(btn, "Click to see ctxpopup"); +evas_object_smart_callback_add(btn, "clicked", _btn_clicked_cb, nf); evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, 0); elm_box_pack_end(box, btn); evas_object_show(btn); @@ -107,19 +107,19 @@ evas_object_show(btn); static void _btn_clicked_cb(void *data, Evas_Object *obj, void *event_info) { -    Evas_Object *nf = data; -    Evas_Coord x, y, w, h; + Evas_Object *nf = data; + Evas_Coord x, y, w, h; -    Evas_Object *ctxpopup = elm_ctxpopup_add(nf); + Evas_Object *ctxpopup = elm_ctxpopup_add(nf); -    elm_ctxpopup_item_append(ctxpopup, "Item 1", NULL, ctxpopup_item_select_cb, NULL); -    elm_ctxpopup_item_append(ctxpopup, "Item 2", NULL, ctxpopup_item_select_cb, NULL); -    elm_ctxpopup_item_append(ctxpopup, "Item 3", NULL, ctxpopup_item_select_cb, NULL); -    elm_ctxpopup_item_append(ctxpopup, "Item 4", NULL, ctxpopup_item_select_cb, NULL); + elm_ctxpopup_item_append(ctxpopup, "Item 1", NULL, ctxpopup_item_select_cb, NULL); + elm_ctxpopup_item_append(ctxpopup, "Item 2", NULL, ctxpopup_item_select_cb, NULL); + elm_ctxpopup_item_append(ctxpopup, "Item 3", NULL, ctxpopup_item_select_cb, NULL); + elm_ctxpopup_item_append(ctxpopup, "Item 4", NULL, ctxpopup_item_select_cb, NULL); -    evas_object_geometry_get(obj, &x, &y, &w, &h); -    evas_object_move(ctxpopup, x + (w / 2), y + (h / 2)); -    evas_object_show(ctxpopup); + evas_object_geometry_get(obj, &x, &y, &w, &h); + evas_object_move(ctxpopup, x + (w / 2), y + (h / 2)); + evas_object_show(ctxpopup); } @@ -130,7 +130,7 @@ _btn_clicked_cb(void *data, Evas_Object *obj, void *event_info)
      - +

      Features

      To configure the ctxpopup features:

        @@ -152,9 +152,9 @@ elm_ctxpopup_auto_hide_disabled_set(ctxpopup, EINA_TRUE); 
         elm_ctxpopup_direction_priority_set(ctxpopup, ELM_CTXPOPUP_DIRECTION_UP,
-                                    ELM_CTXPOPUP_DIRECTION_LEFT,
-                                    ELM_CTXPOPUP_DIRECTION_DOWN,
-                                    ELM_CTXPOPUP_DIRECTION_RIGHT);
+                                    ELM_CTXPOPUP_DIRECTION_LEFT,
+                                    ELM_CTXPOPUP_DIRECTION_DOWN,
+                                    ELM_CTXPOPUP_DIRECTION_RIGHT);
      • @@ -167,7 +167,7 @@ elm_ctxpopup_dismiss(ctxpopup);

        Items

        -

        The ctxpopup can contain a small number of items. Each item can have a label, an icon, or both.

        +

        The ctxpopup can contain a small number of items. Each item can have a label, an icon, or both.

        To manage the ctxpopup items:

          @@ -179,7 +179,7 @@ elm_ctxpopup_dismiss(ctxpopup); Elm_Object_Item *it; Evas_Object *icon; -it = elm_ctxpopup_item_append(ctxpopup, "test", icon, _ctxpopup_item_cb, NULL); +it = elm_ctxpopup_item_append(ctxpopup, "test", icon, _ctxpopup_item_cb, NULL);
        1. @@ -188,7 +188,7 @@ it = elm_ctxpopup_item_append(ctxpopup, "test", icon, _ctxpopup_item_c
        2. To change the item label to New label: 
          -elm_object_item_part_text_set(it, "default", "New label");
+elm_object_item_part_text_set(it, "default", "New label");
        3. @@ -196,9 +196,9 @@ elm_object_item_part_text_set(it, "default", "New label"); 
           Evas_Object *home_icon = elm_icon_add(ctxpopup);
-elm_icon_standard_set(home_icon, "home");
+elm_icon_standard_set(home_icon, "home");
 
-elm_object_item_part_content_set(it, "icon", home_icon);
+elm_object_item_part_content_set(it, "icon", home_icon);
    • @@ -207,7 +207,7 @@ elm_object_item_part_content_set(it, "icon", home_icon); static void _ctxpopup_item_cb(void *data, Evas_Object *obj, void *event_info) { -    dlog_print(DLOG_INFO, LOG_TAG, "ctxpopup item selected\n"); + dlog_print(DLOG_INFO, LOG_TAG, "ctxpopup item selected\n"); }
      • @@ -218,7 +218,7 @@ _ctxpopup_item_cb(void *data, Evas_Object *obj, void *event_info)

      The following table lists the available component styles.

      In Tizen 2.4, dropdown styles are no longer supported. Use a hoversel component for those instead.

      - +

      Table: Ctxpopup styles

      @@ -250,27 +250,27 @@ _ctxpopup_item_cb(void *data, Evas_Object *obj, void *event_info)

      You can register callback functions connected to the following signals for a ctxpopup object.

      -

      Table: Ctxpopup callback signals

      +

      Table: Ctxpopup callback signals

      - - - + + + - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      dismissed The ctxpopup is dismissed. NULL
      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
      - +
      Note Except as noted, this content is licensed under LGPLv2.1+. @@ -285,7 +285,7 @@ _ctxpopup_item_cb(void *data, Evas_Object *obj, void *event_info) +
      + @@ -40,7 +40,7 @@
    • Elementary API for Wearable Native
    -
    +

    Ctxpopup

    @@ -52,7 +52,7 @@

    For more information, see the Ctxpopup API.

    Figure: Ctxpopup component

    Ctxpopup component

    - +

    Figure: Ctxpopup hierarchy

    Ctxpopup hierarchy

    @@ -68,7 +68,7 @@ Evas_Object *parent; ctxpopup = elm_ctxpopup_add(parent); -

    When shown, the ctxpopup automatically selects an area inside its parent object's view to optimally fit into it. Set the object view with the elm_ctxpopup_hover_parent_set() function.

    +

    When shown, the ctxpopup automatically selects an area inside its parent object's view to optimally fit into it. Set the object view with the elm_ctxpopup_hover_parent_set() function.

    Using the Ctxpopup Styles

    The ctxpopup has the following styles for the rectangular screen:

    @@ -78,14 +78,14 @@ ctxpopup = elm_ctxpopup_add(parent);

    The ctxpopup has the following styles for the circular screen:

    • select_mode
      • -
    • select_mode/top, select_mode/bottom +
    • select_mode/top, select_mode/bottom

      These 2 styles can be used as a pair.

    To set the style to, for example, default:

    -elm_object_style_set(ctxpopup, "default");
+elm_object_style_set(ctxpopup, "default");

    Configuring the Ctxpopup

    @@ -109,7 +109,7 @@ elm_ctxpopup_auto_hide_disabled_set(ctxpopup, EINA_TRUE);

    Managing the Ctxpopup Items

    -

    The ctxpopup can contain a small number of items. Each item can have a label, an icon, or both.

    +

    The ctxpopup can contain a small number of items. Each item can have a label, an icon, or both.

    To manage the ctxpopup items:

      @@ -119,7 +119,7 @@ elm_ctxpopup_auto_hide_disabled_set(ctxpopup, EINA_TRUE); 
       Elm_Object_Item *it;
 
-it = elm_ctxpopup_item_append(ctxpopup, "test", NULL, _ctxpopup_item_cb, NULL);
+it = elm_ctxpopup_item_append(ctxpopup, "test", NULL, _ctxpopup_item_cb, NULL);
    1. @@ -128,7 +128,7 @@ it = elm_ctxpopup_item_append(ctxpopup, "test", NULL, _ctxpopup_item_c
    2. To change the item label to New label: 
      -elm_object_item_part_text_set(it, "default", "New label");
+elm_object_item_part_text_set(it, "default", "New label");
    3. @@ -136,9 +136,9 @@ elm_object_item_part_text_set(it, "default", "New label"); 
       Evas_Object *home_icon = elm_icon_add(ctxpopup);
-elm_icon_standard_set(home_icon, "home");
+elm_icon_standard_set(home_icon, "home");
 
-elm_object_item_part_content_set(it, "icon", home_icon);
+elm_object_item_part_content_set(it, "icon", home_icon);
    4. @@ -147,7 +147,7 @@ elm_object_item_part_content_set(it, "icon", home_icon); static void _ctxpopup_item_cb(void *data, Evas_Object *obj, void *event_info) { -    dlog_print(DLOG_INFO, LOG_TAG, "ctxpopup item selected\n"); + dlog_print(DLOG_INFO, LOG_TAG, "ctxpopup item selected\n"); }
      5. @@ -161,24 +161,24 @@ _ctxpopup_item_cb(void *data, Evas_Object *obj, void *event_info) Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
    - +

    The event_info callback parameter is NULL.

    To register and define a callback for the dismissed signal:

     {
-    evas_object_smart_callback_add(ctxpopup, "dismissed", dismissed_cb, data);
+    evas_object_smart_callback_add(ctxpopup, "dismissed", dismissed_cb, data);
 }
 
-/* Callback for the "dismissed" signal */
+/* Callback for the "dismissed" signal */
 /* Called when the ctxpopup is dismissed */
 void
 dismissed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Ctxpopup dismissed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Ctxpopup dismissed\n");
 }
-
    +
    Note @@ -194,7 +194,7 @@ dismissed_cb(void *data, Evas_Object *obj, void *event_info) +
    + - Customizing UI Components - + Customizing UI Components + - + +
    -

    Customizing UI Components

    - -

    This topic explains how to customize UI components. Before learning the process of customization, you must understand the concept of "style" and "theme" in EFL and how EFL applies the right style for a UI component.

    +

    Customizing UI Components

    + +

    This topic explains how to customize UI components. Before learning the process of customization, you must understand the concept of "style" and "theme" in EFL and how EFL applies the right style for a UI component.

    EFL provides the EDC script as a way to define a look for UI components. For detailed information on how to write an EDC script, see Layouting with EDC.

    Style, Theme, and EDC

    @@ -57,38 +57,38 @@ Evas_Object *check; check = elm_check_add(parent); -elm_object_style_set(check, "favorite"); +elm_object_style_set(check, "favorite"); - +

    A theme is defined in EDC (.edc) files, and they are compiled into an EDJ (.edj) file during the project building. An EDC file is a collection of group blocks, and one group is composed of parts and programs. A theme corresponds to one EDJ file, and a style corresponds to 1 group in an EDJ file.

    - +

    The following example shows some groups in an EDC file (check.edc), which correspond to the styles of the check component in mobile profile:

    - + 
     group {
-   name: "elm/check/base/default";
-   /* Other content */
+   name: "elm/check/base/default";
+   /* Other content */
 }
- 
+
 group {
-   name: "elm/check/base/favorite";
-   /* Other content */
+   name: "elm/check/base/favorite";
+   /* Other content */
 }
- 
+
 group {
-   name: "elm/check/base/on&off";
-   /* Other content */
+   name: "elm/check/base/on&off";
+   /* Other content */
 }
    - +

    The groups have a certain format of names according to the naming rule of Elementary. These 3 groups define 3 different styles for the check component: default, favorite, and on&off.

    - +

    Customization

    - +

    In the best scenario, every application can find the style it needs in the already provided theme. However, you can sometimes need customized styles. EFL allows you to define a new style and add it to an existing theme, or even make a new theme.

    - +

    To customize a UI component:

    - +
    1. Create a project for a basic EDC UI application.

      See Creating Your First Tizen Mobile Native Application or Creating Your First Tizen Wearable Native Application for creating a EDC UI project.

      2. @@ -98,7 +98,7 @@ group { 
       char edj_path[PATH_MAX] = {0,};
 
-app_get_resource("/edje/custom.edj", edj_path, (int)PATH_MAX);
+app_get_resource("/edje/custom.edj", edj_path, (int)PATH_MAX);
    2. Write a style in the EDC file.
      3. @@ -110,10 +110,10 @@ app_get_resource("/edje/custom.edj", edj_path, (int)PATH_MAX);

      The following code snippet shows how to add the new theme file as an extension:

       char edj_path[PATH_MAX] = {0,};
- 
+
 /* Get the full path of the EDJ file */
-app_get_resource("/edje/custom.edj", edj_path, (int)PATH_MAX);
- 
+app_get_resource("/edje/custom.edj", edj_path, (int)PATH_MAX);
+
 /* Load the check custom style as an extension */
 elm_theme_extension_add(NULL, edj_path);
      @@ -127,24 +127,24 @@ Evas_Object *check; check = elm_check_add(parent); /* Set the newly defined custom style */ -elm_object_style_set(check, "custom"); +elm_object_style_set(check, "custom");
    - +

    You can see the above steps implemented in the ThemeExtension sample application.

    - +

    Extension and Overlay

    - +

    To attach an EDJ file to an existing theme, you can use:

    - +
    • Extension -

      A theme extension enables you to extend a theme with only a part of the UI component's style (not all of it).

      +

      A theme extension enables you to extend a theme with only a part of the UI component's style (not all of it).

      Applications can add and delete a theme in the list of extensions with the following calls:

      -elm_theme_extension_add(NULL, "./theme_button_style_custom.edj");
-elm_theme_extension_del(NULL, "./theme_button_style_custom.edj");
+elm_theme_extension_add(NULL, "./theme_button_style_custom.edj");
+elm_theme_extension_del(NULL, "./theme_button_style_custom.edj");

      The above example assumes that the theme_button_style_custom.edj file contains a new button style called custom.

      • @@ -153,11 +153,11 @@ elm_theme_extension_del(NULL, "./theme_button_style_custom.edj");

      If a new style called default is created for a button component and it is added as an overlay, Elementary uses the overlay for all button components overriding the default theme.

      - +

      Applications can add and delete a theme in the list of overlays with the following calls:

      -elm_theme_overlay_add(NULL, "./theme_button.edj");
-elm_theme_overlay_del(NULL, "./theme_button.edj");
+elm_theme_overlay_add(NULL, "./theme_button.edj");
+elm_theme_overlay_del(NULL, "./theme_button.edj");

      The above example assumes that the theme_button.edj file only contains a new theme for the button component.

      @@ -169,9 +169,9 @@ elm_theme_overlay_del(NULL, "./theme_button.edj");
    - +

    The following process shows how Elementary loads a style of a certain name:

    - +
    1. Check the list of overlays registered on the current theme.
    2. If the right style is not found, check the default theme.
      3. @@ -180,32 +180,32 @@ elm_theme_overlay_del(NULL, "./theme_button.edj");

      This means that the style with the certain name is not defined in the current theme.

    - +

    For example, if you make your own EDJ file and name a group elm/button/base/default:

    • If you use the elm_theme_overlay_add function, the newly defined style is applied to a button object.
    • If you use the elm_theme_extension_add function, the newly defined style is not applied, since there is a group with the same name in the default theme.
    - +
    Note When using the elm_theme_extension_add() or elm_theme_overlay_add() function to add a new theme extension or overlay to a theme object (the default theme), Elementary calls the elm_theme_flush() function to flush the Elementary theme caches. This means that the theme of all UI components that use the default theme is reloaded.
    - +

    Example: Creating a Customized Style for the Check Component

    - +

    An easy way to create a customized style is to copy one of the existing styles and modify some parts or programs. The following example shows how to define a custom style of the check component based on the default style. The aim is to update the background and the check images of the UI component with custom images.

    - -

    When customizing a style, you need to respect the parts and signals in the default style. If something is missing, it can break the UI component's behavior. You can add new SWALLOW parts, if you want to control more content from the application. However, removing existing SWALLOW parts can change the UI component's behavior.

    - + +

    When customizing a style, you need to respect the parts and signals in the default style. If something is missing, it can break the UI component's behavior. You can add new SWALLOW parts, if you want to control more content from the application. However, removing existing SWALLOW parts can change the UI component's behavior.

    +

    To create a customized check component style:

    1. Copy the group corresponding to the default style to a new file and rename the group to custom to create a new custom style:

       group
 {
-   name: "elm/check/base/custom";
-   /* Copy of the content of "default" style */
+   name: "elm/check/base/custom";
+   /* Copy of the content of "default" style */
 }
      2. @@ -215,71 +215,71 @@ group 
       part
 {
-   name: "bg";
-   mouse_events: 0;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      rel1.offset: 1 1;
-      rel2.relative: 0.0 1.0;
-      rel2.offset: 1 -2;
-      align: 0.0 0.5;
-      min: 16 16;
-      max: 16 16;
-      aspect: 1.0 1.0;
-      aspect_preference: VERTICAL;
-      image
-      {
-         normal: "check_base.png";
-         border: 5 5 5 5;
-         middle: 0;
-      }
-      fill.smooth: 0;
-   }
+   name: "bg";
+   mouse_events: 0;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      rel1.offset: 1 1;
+      rel2.relative: 0.0 1.0;
+      rel2.offset: 1 -2;
+      align: 0.0 0.5;
+      min: 16 16;
+      max: 16 16;
+      aspect: 1.0 1.0;
+      aspect_preference: VERTICAL;
+      image
+      {
+         normal: "check_base.png";
+         border: 5 5 5 5;
+         middle: 0;
+      }
+      fill.smooth: 0;
+   }
 }
 part
 {
-   name: "check";
-   mouse_events: 0;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      rel1
-      {
-         to: "bg";
-         offset: 1 1;
-      }
-      rel2
-      {
-         to: "bg";
-         offset: -2 -2;
-      }
-      visible: 0;
-      color: 255 255 255 255;
-      image.normal: "check.png";
-   }
-   description
-   {
-      state: "visible" 0.0;
-      inherit: "default" 0.0;
-      visible: 1;
-   }
-   description
-   {
-      state: "disabled" 0.0;
-      inherit: "default" 0.0;
-      visible: 0;
-      color: 128 128 128 128;
-   }
-   description
-   {
-      state: "disabled_visible" 0.0;
-      inherit: "default" 0.0;
-      color: 128 128 128 128;
-      visible: 1;
-   }
+   name: "check";
+   mouse_events: 0;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      rel1
+      {
+         to: "bg";
+         offset: 1 1;
+      }
+      rel2
+      {
+         to: "bg";
+         offset: -2 -2;
+      }
+      visible: 0;
+      color: 255 255 255 255;
+      image.normal: "check.png";
+   }
+   description
+   {
+      state: "visible" 0.0;
+      inherit: "default" 0.0;
+      visible: 1;
+   }
+   description
+   {
+      state: "disabled" 0.0;
+      inherit: "default" 0.0;
+      visible: 0;
+      color: 128 128 128 128;
+   }
+   description
+   {
+      state: "disabled_visible" 0.0;
+      inherit: "default" 0.0;
+      color: 128 128 128 128;
+      visible: 1;
+   }
 }
      @@ -294,40 +294,40 @@ part Note This example assumes that the custom images are the same size as the default images.
    - + 
     part
 {
-   name: "bg";
-   description
-   {
-      state: "default" 0.0;
-      image
-      {
-         normal: "check_base_custom.png";
-         border: 5 5 5 5;
-         middle: 0;
-      }
-   }
+   name: "bg";
+   description
+   {
+      state: "default" 0.0;
+      image
+      {
+         normal: "check_base_custom.png";
+         border: 5 5 5 5;
+         middle: 0;
+      }
+   }
 }
 part
 {
-   name: "check";
-   description
-   {
-      state: "default" 0.0;
-      image.normal: "check_custom.png";
-   }
+   name: "check";
+   description
+   {
+      state: "default" 0.0;
+      image.normal: "check_custom.png";
+   }
 }
    - +
    Note Except as noted, this content is licensed under LGPLv2.1+.
    - +
    diff --git a/org.tizen.guides/html/native/ui/efl/component_datetime_mn.htm b/org.tizen.guides/html/native/ui/efl/component_datetime_mn.htm index ef2cb8e..44cd6fc 100644 --- a/org.tizen.guides/html/native/ui/efl/component_datetime_mn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_datetime_mn.htm @@ -5,13 +5,13 @@ - + - Datetime + Datetime @@ -46,28 +46,28 @@

    The datetime UI component displays date and time values. For more information, see the Datetime API.

    This feature is supported in mobile applications only.

    - +

    Basic Usage

    - +

    To use a datetime component in your application:

    1. Add a datetime component with the elm_datetime_add() function: 
       Evas_Object *datetime;
- 
+
 datetime = elm_datetime_add(parent);
      2. -
    2. Set a style and format. The datetime format is a combination of LIBC standard characters, such as "%d %b %Y %I : %M %M". For more information about the format characters, see the Datetime API. +
    3. Set a style and format. The datetime format is a combination of LIBC standard characters, such as "%d %b %Y %I : %M %M". For more information about the format characters, see the Datetime API.
      • Set a style to the datetime component with the elm_object_style_set() function. If you use the default style, you can skip this step. 
        -elm_object_style_set(datetime, "date_layout");
+elm_object_style_set(datetime, "date_layout");
      • Set a format using the elm_datetime_format_set() function: 
        -elm_datetime_format_set(datetime, "%d%b%Y");
+elm_datetime_format_set(datetime, "%d%b%Y");
      @@ -76,19 +76,19 @@ elm_datetime_format_set(datetime, "%d%b%Y");
    4. Register the callback functions.

      The following example shows how to define and register a callback for the changed signal:

      -evas_object_smart_callback_add(datetime, "changed", changed_cb, data);
+evas_object_smart_callback_add(datetime, "changed", changed_cb, data);
 
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Datetime value changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Datetime value changed\n");
 }

    The following example shows a simple use case of the datetime component.

    - +

    Example: Datetime use case

    @@ -110,15 +110,15 @@ struct tm *time_info; /* Add a box to contain a datetime and push the box into the naviframe */ box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Datetime", NULL, NULL, box, NULL); - +elm_naviframe_item_push(nf, "Datetime", NULL, NULL, box, NULL); + /* Add a datetime and set a style */ datetime = elm_datetime_add(box); evas_object_size_hint_align_set(datetime, EVAS_HINT_FILL, EVAS_HINT_FILL); -elm_object_style_set(datetime, "date_layout"); +elm_object_style_set(datetime, "date_layout"); /* Set a format for datetime */ -elm_datetime_format_set(datetime, "%d/%b/%Y"); +elm_datetime_format_set(datetime, "%d/%b/%Y"); /* Get a current local time to set as datetime value */ time(NULL); @@ -135,9 +135,9 @@ elm_box_pack_end(box, datetime);
    - +

    Options

    - +

    You can set value ranges for the datetime component:

    - +

    To set the maximum time for the datetime component:

     elm_datetime_value_max_set(datetime, tm);
    - +

    To set the minimum time for the datetime component:

     elm_datetime_value_min_set(datetime, tm);
@@ -171,7 +171,7 @@ elm_datetime_value_min_set(datetime, tm);
    
  • ELM_DATETIME_MINUTE: Indicates the minute field.
    • 
    
  • ELM_DATETIME_AMPM: Indicates the AM/PM field.
    • 
 
- 
+
 
    To set a value range for a specific field:
    
 
     elm_datetime_field_limit_set(datetime, ELM_DATETIME_DATE, 10, 20);
@@ -210,7 +210,7 @@ elm_datetime_field_limit_set(datetime, ELM_DATETIME_DATE, 10, 20);
 
    
 	Note
 	Pay attention to the following UX issue since Tizen 2.3:
- 
+
 
    The time_layout and time_layout_24hr styles need a full-length format that includes the year, month, day, hour, minute, and AM/PM. Each style shows specific fields from the format, limited by the UX concept:
    
 
 
      
@@ -227,12 +227,12 @@ elm_datetime_field_limit_set(datetime, ELM_DATETIME_DATE, 10, 20);
 
      You can register callback functions connected to the following signals for a datetime object.
      
 
 
-   
      Table: Datetime callback signals
       
+   
      Table: Datetime callback signals
      
-          
-          
-          
+         
+         
+         
@@ -244,14 +244,14 @@ elm_datetime_field_limit_set(datetime, ELM_DATETIME_DATE, 10, 20);
          
-    
+   
      
    
       
      SignalDescriptionevent_infoSignalDescriptionevent_info
       
      
       
      
          changedThe system locale changes.
          NULL
       
      
 
      
- 
+
 
      
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
 
      
- 
+
 
      
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
@@ -266,7 +266,7 @@ elm_datetime_field_limit_set(datetime, ELM_DATETIME_DATE, 10, 20);
 
  
+
      
 
 
 	
+	
 	
 	
 	
 	
 
-	Datetime  
+	Datetime
 
 
 
@@ -36,10 +36,10 @@
 		
 	
    
-	
+
 
 
    
 
    Datetime
    
@@ -50,11 +50,11 @@
 
 
    For more information, see the Datetime API.
    
 
-
    Figure: Datetime component
     
-
    Datetime component 
     
- 
-
    Figure: Datetime hierarchy
     
-
     Datetime hierarchy 
     
+
    Figure: Datetime component
    
+
    Datetime component 
    
+
+
    Figure: Datetime hierarchy
    
+
     Datetime hierarchy 
    
 
 
    Adding a Datetime Component
    
 
@@ -86,17 +86,17 @@
 
 
    To set the style to, for example, datepicker_layout:
    
 
    -elm_object_style_set(datetime, "datepicker_layout");
+elm_object_style_set(datetime, "datepicker_layout");
 
    
 
 
    Setting the Datetime Format
    
 
 
    The date and time format can be configured with the elm_datetime_format_set() function using a combination of allowed Libc date format specifiers.
    
-
    To set the format to "HH : MM":
    
+
    To set the format to "HH : MM":
    
 
 
    -elm_object_style_set(datetime, "timepicker_layout");
-elm_datetime_format_set(datetime, "%d/%b/%Y%I:%M");
+elm_object_style_set(datetime, "timepicker_layout");
+elm_datetime_format_set(datetime, "%d/%b/%Y%I:%M");
 
    
 
 
    For a complete list of available specifiers, see the Datetime API.
    
@@ -107,30 +107,30 @@ elm_datetime_format_set(datetime, "%d/%b/%Y%I:%M");
 
      
 
    • changed: The datetime field values are changed.
      • 
 
    • language,changed: The system locale changes.
      • 
-
     
+
 
 
    
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
 
    
- 
+
 
    In both these signals, the event_info callback parameter is NULL.
    
 
 
    To register and define a callback for the changed signal:
    
 
 
     {
-    evas_object_smart_callback_add(datetime, "changed", changed_cb, data);
+    evas_object_smart_callback_add(datetime, "changed", changed_cb, data);
 }
 
-/* Callback for the "changed" signal */
+/* Callback for the "changed" signal */
 /* Called when the datetime fields change */
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Datetime field changed. \n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Datetime field changed. \n");
 }
    
- 
+
 
    
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
@@ -145,8 +145,8 @@ changed_cb(void *data, Evas_Object *obj, void *event_info)
 
  
- 
+
    
+
 
 	
+	
 	
 	
 	
 	
 
-	Entry  
+	Entry
 
 
 
@@ -38,10 +38,10 @@
 			
    Related Info
    
 		
 	
    
-
    	
+
 
 
    
 
    Entry
    
@@ -57,17 +57,17 @@
    
  • Read/write from a file
    • 
    
  • Theme style overrides
    • 
   
-   
+
 
    The entry component includes an Evas Textblock in it, which means that it supports the features of the textblock component, such as text wrapping and formatted markup text.
    
 
 
    For more information, see the Entry API.
    
-   
-
    Figure: Entry component
     
-
     Entry component Entry component 
     
- 
-
    Figure: Entry hierarchy
     
-
     Entry hierarchy 
        
-   
+
+
    Figure: Entry component
    
+
     Entry component Entry component 
    
+
+
    Figure: Entry hierarchy
    
+
     Entry hierarchy 
    
+
 
    Adding an Entry Component
    
 
 
    To create an entry component, use the elm_entry_add() function. You can set the text inside it with the elm_entry_entry_set() function.
    
@@ -77,7 +77,7 @@ Evas_Object *entry;
 Evas_Object *parent;
 
 entry = elm_entry_add(parent);
-elm_entry_entry_set(entry, "A short text.");
+elm_entry_entry_set(entry, "A short text.");
 
    
 
 
    Managing the Text
    
@@ -90,13 +90,13 @@ Add text to the entry:
 
    • Append text to the end of the existing content:
 
 
      -elm_entry_entry_append(entry, "END");
+elm_entry_entry_append(entry, "END");
 
      
 
      • 
 
    • 
 
      Insert text at the current cursor position:
      
 
      -elm_entry_entry_insert(entry, "CURSOR");
+elm_entry_entry_insert(entry, "CURSOR");
 
      
 
    
 
  • 
@@ -150,8 +150,8 @@ elm_entry_selection_paste(entry);
 static Elm_Entry_Filter_Limit_Size
 limit_size =
 {
-    .max_char_count = 8,
-    .max_byte_count = 0
+    .max_char_count = 8,
+    .max_byte_count = 0
 };
 
 /*
@@ -164,13 +164,13 @@ elm_entry_markup_filter_append(entry, elm_entry_filter_limit_size, &limit_si
  • To define a list of accepted or rejected characters, append the filter with the Elm_Entry_Filter_Accept_Set structure. -

    The following example shows how to reject the '+', '-', '*', and '/' characters:

    +

    The following example shows how to reject the '+', '-', '*', and '/' characters:

     static Elm_Entry_Filter_Accept_Set
 accept_set =
 {
-    .accepted = NULL,
-    .rejected = "+*-/"
+    .accepted = NULL,
+    .rejected = "+*-/"
 };
 
 elm_entry_markup_filter_append(entry, elm_entry_filter_accept_set, &accept_set);
@@ -184,7 +184,7 @@ elm_entry_markup_filter_append(entry, elm_entry_filter_accept_set, &accept_s
 
     /* Set the file in which the entry text is saved */
 /* Implicitly load the existing file content */
-elm_entry_file_set(entry, "/tmp/test.txt", ELM_TEXT_FORMAT_MARKUP_UTF8);
+elm_entry_file_set(entry, "/tmp/test.txt", ELM_TEXT_FORMAT_MARKUP_UTF8);
 
    
 
 
    You can also deactivate the automatic saving feature and explicitly save the content when needed:
    
@@ -234,18 +234,18 @@ elm_entry_cursor_pos_set(entry, 15);
    • -
  • Make a text selection while moving the cursor. +
  • Make a text selection while moving the cursor.

    The following example starts a selection at the current cursor position, moves 5 characters right, and ends the selection:

     elm_entry_cursor_selection_begin(entry);
 
 for (i = 0; i < 5; i++)
-    elm_entry_cursor_next(entry);
+    elm_entry_cursor_next(entry);
 
 elm_entry_cursor_selection_end(entry);
    • - +

    Configuring the Entry

    To configure the entry functionality:

    @@ -325,23 +325,23 @@ elm_entry_line_wrap_set(entry, ELM_WRAP_WORD); static Evas_Object* item_provider(void *images EINA_UNUSED, Evas_Object *en, const char *item) { -    Evas_Object *o = NULL; -    char buf[1024]; + Evas_Object *o = NULL; + char buf[1024]; -    if (!strcmp(item, "itemprovider")) { -        snprintf(buf, sizeof(buf), "%s/tizen.png", ICON_DIR); -        o = evas_object_image_filled_add(evas_object_evas_get(en)); -        evas_object_image_file_set(o, buf, NULL); -    } + if (!strcmp(item, "itemprovider")) { + snprintf(buf, sizeof(buf), "%s/tizen.png", ICON_DIR); + o = evas_object_image_filled_add(evas_object_evas_get(en)); + evas_object_image_file_set(o, buf, NULL); + } -    return o; + return o; } Evas_Object *entry; Entry = elm_entry_add(layout); -elm_object_text_set(entry, "Item Provider" -                    "<item size=50x50 vsize=full href=itemprovider></item>"); +elm_object_text_set(entry, "Item Provider" + "<item size=50x50 vsize=full href=itemprovider></item>"); elm_entry_item_provider_append(entry, item_provider, NULL); @@ -354,14 +354,14 @@ Evas_Object *entry; Entry = elm_entry_add(layout); elm_entry_text_style_user_push(entry, -                               "DEFAULT='font=Tizen:style=Light -                                         font_size=50 color=#00f align=center'"); + "DEFAULT='font=Tizen:style=Light + font_size=50 color=#00f align=center'");

    The DEFAULT element sets the style properties to a default style that is applied to the complete text. For more information on style properties, such as font, font size, and color, see Textblock Objects.

    -

    Figure: Overriding style

    -

    Overriding style

    +

    Figure: Overriding style

    +

    Overriding style

  • Modify the content and text parts of the default theme:
      @@ -371,14 +371,14 @@ elm_entry_text_style_user_push(entry, Evas_Object *icon; ic = elm_icon_add(entry); -elm_image_file_set(ic, "icon.png", NULL); -elm_object_part_content_set(entry, "end", icon); +elm_image_file_set(ic, "icon.png", NULL); +elm_object_part_content_set(entry, "end", icon);
    • You can modify 2 text parts of the default theme: default (entry text) and guide (entry placeholder).

      The following example shows how to set the placeholder text to Hello World:

      -elm_object_part_text_set(entry, "guide", "Hello World");
+elm_object_part_text_set(entry, "guide", "Hello World");
    • @@ -429,7 +429,7 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE elm/entry/base/default elm/entry/base/default - elm.guide: for the guide text + elm.guide: for the guide text

    elm.text: for the main text

    The guide text is automatically erased when the main text is entered. @@ -440,13 +440,13 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE

    You can register callback functions connected to the following signals for an entry object.

    -

    Table: Entry callback signals

    +

    Table: Entry callback signals

    - - - + + + @@ -465,7 +465,7 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE - + @@ -475,7 +475,7 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE - + @@ -485,7 +485,7 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE - + @@ -495,7 +495,7 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE - + @@ -608,26 +608,26 @@ elm_entry_input_panel_return_key_type_set(entry, ELM_INPUT_PANEL_RETURN_KEY_TYPE - +
    SignalDescriptionevent_infoSignalDescriptionevent_info
    aborted
    anchor,downThe mouse button is pressed on an anchor.The mouse button is pressed on an anchor. Elm_Entry_Anchor_Info object
    anchor,inThe mouse cursor is moved into an anchor.The mouse cursor is moved into an anchor. Elm_Entry_Anchor_Info object
    anchor,upThe mouse button is released on an anchor.The mouse button is released on an anchor. Elm_Entry_Anchor_Info object
    changed,userThe text within the entry is changed because of user interaction.The text within the entry is changed because of user interaction. Edje_Entry_Change_Info object
    The request is undone. NULL
    - +
    Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
    - +

    The following example shows how to define and register a callback for the focused signal:

    -evas_object_smart_callback_add(entry, "focused", focused_cb, data);
+evas_object_smart_callback_add(entry, "focused", focused_cb, data);
 
-/* Callback for the "focused" signal */
+/* Callback for the "focused" signal */
 /* Called when the entry receives the focus */
 void
 focused_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Entry focused\n");
-} 
+    dlog_print(DLOG_INFO, LOG_TAG, "Entry focused\n");
+}
    @@ -644,7 +644,7 @@ focused_cb(void *data, Evas_Object *obj, void *event_info) +
    + @@ -58,17 +58,17 @@
  • Theme style overrides
    • -

    The entry component includes an Evas Textblock in it, which means that it supports the features of the textblock component, such as text wrapping and formatted markup text.

    - +

    The entry component includes an Evas Textblock in it, which means that it supports the features of the textblock component, such as text wrapping and formatted markup text.

    +

    For more information, see the Entry API.

    Figure: Entry component

    Entry component

    - +

    Figure: Entry hierarchy

    Entry hierarchy

    - - + +

    Adding an Entry Component

    To create an entry component, use the elm_entry_add() function. You can set the text inside it with the elm_entry_entry_set() function.

    @@ -78,7 +78,7 @@ Evas_Object *entry; Evas_Object *parent; entry = elm_entry_add(parent); -elm_entry_entry_set(entry, "A short text."); +elm_entry_entry_set(entry, "A short text.");

    Managing the Text

    @@ -91,13 +91,13 @@ Add text to the entry:
  • @@ -151,8 +151,8 @@ elm_entry_selection_paste(entry); static Elm_Entry_Filter_Limit_Size limit_size = { -    .max_char_count = 8, -    .max_byte_count = 0 + .max_char_count = 8, + .max_byte_count = 0 }; /* @@ -165,13 +165,13 @@ elm_entry_markup_filter_append(entry, elm_entry_filter_limit_size, &limit_si
  • To define a list of accepted or rejected characters, append the filter with the Elm_Entry_Filter_Accept_Set structure. -

    The following example shows how to reject the '+', '-', '*', and '/' characters:

    +

    The following example shows how to reject the '+', '-', '*', and '/' characters:

     static Elm_Entry_Filter_Accept_Set
 accept_set =
 {
-    .accepted = NULL,
-    .rejected = "+*-/"
+    .accepted = NULL,
+    .rejected = "+*-/"
 };
 
 elm_entry_markup_filter_append(entry, elm_entry_filter_accept_set, &accept_set);
@@ -185,7 +185,7 @@ elm_entry_markup_filter_append(entry, elm_entry_filter_accept_set, &accept_s
 
     /* Set the file in which the entry text is saved */
 /* Implicitly load the existing file content */
-elm_entry_file_set(entry, "/tmp/test.txt", ELM_TEXT_FORMAT_MARKUP_UTF8);
+elm_entry_file_set(entry, "/tmp/test.txt", ELM_TEXT_FORMAT_MARKUP_UTF8);
 
    
 
 
    You can also deactivate the automatic saving feature and explicitly save the content when needed:
    
@@ -235,18 +235,18 @@ elm_entry_cursor_pos_set(entry, 15);
    • -
  • Make a text selection while moving the cursor. +
  • Make a text selection while moving the cursor.

    The following example starts a selection at the current cursor position, moves 5 characters right, and ends the selection:

     elm_entry_cursor_selection_begin(entry);
 
 for (i = 0; i < 5; i++)
-    elm_entry_cursor_next(entry);
+    elm_entry_cursor_next(entry);
 
 elm_entry_cursor_selection_end(entry);
    • - +

    Configuring the Entry

    To configure the entry functionality:

    @@ -333,14 +333,14 @@ elm_entry_line_wrap_set(entry, ELM_WRAP_WORD); Evas_Object *icon; ic = elm_icon_add(entry); -elm_image_file_set(ic, "icon.png", NULL); -elm_object_part_content_set(entry, "end", icon); +elm_image_file_set(ic, "icon.png", NULL); +elm_object_part_content_set(entry, "end", icon);
  • You can modify 2 text parts of the default theme: elm.text (entry text) and elm.guide (entry placeholder).

    The following example shows how to set the placeholder text to Hello World:

    -elm_object_part_text_set(entry, "elm.guide", "Hello World");
+elm_object_part_text_set(entry, "elm.guide", "Hello World");

    • Using the Entry Callbacks

    @@ -349,27 +349,27 @@ elm_object_part_text_set(entry, "elm.guide", "Hello World"); - +
    Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -400,16 +400,16 @@ elm_object_part_text_set(entry, "elm.guide", "Hello World"); 
     {
-    evas_object_smart_callback_add(entry, "focused", focused_cb, data);
+    evas_object_smart_callback_add(entry, "focused", focused_cb, data);
 }
 
-/* Callback for the "focused" signal */
+/* Callback for the "focused" signal */
 /* Called when the entry receives the focus */
 void
 focused_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Entry focused\n");
-} 
+    dlog_print(DLOG_INFO, LOG_TAG, "Entry focused\n");
+}
    @@ -426,7 +426,7 @@ focused_cb(void *data, Evas_Object *obj, void *event_info) +
    + - Flip + Flip @@ -34,10 +34,10 @@

    Related Info

    - +

    Flip

    @@ -46,12 +46,12 @@

    The flip UI component is used for a transition effect, which can hold 2 Evas_Objects and flip between them using several predefined animations. For more information, see the Flip API.

    This feature is supported in mobile applications only.

    - -

    Figure: Flip hierarchy

    -

    Flip hierarchy

    - + +

    Figure: Flip hierarchy

    +

    Flip hierarchy

    +

    Basic Usage

    - +

    To use a flip component in your application:

    1. Add a flip with the elm_flip_add() function: @@ -63,8 +63,8 @@ flip = elm_flip_add(parent);
    2. Add content to the flip using the elm_object_part_content_set() function. Use the front and back part names to define the 2 Evas_Objects used as content: 
      -elm_object_part_content_set(flip, "front", content1);
-elm_object_part_content_set(flip, "back", content2);
+elm_object_part_content_set(flip, "front", content1);
+elm_object_part_content_set(flip, "back", content2);
    3. Run a flip animation using the elm_flip_go() function. The ELM_FLIP_CUBE_UP animation mode flips up the front content object as if it was on a side of a cube, letting the down facing side of the cube appear with the back content object. For a complete list of animation modes, see elm_flip_go() Remarks. @@ -76,12 +76,12 @@ elm_flip_go(flip, ELM_FLIP_CUBE_UP);

      The following example shows how to define and register a callback for the animate,begin signal.

      -evas_object_smart_callback_add(entry, "animate,begin", anim_start_cb, data);
+evas_object_smart_callback_add(entry, "animate,begin", anim_start_cb, data);
 
 void
 anim_start_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Animation starts\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Animation starts\n");
 }
    @@ -126,9 +126,9 @@ elm_flip_interaction_direction_hitsize_set(flip, ELM_FLIP_DIRECTION_RIGHT, 1);

    Table: Flip callback signals

    - Signal - Description - event_info + Signal + Description + event_info animate,begin @@ -140,9 +140,9 @@ elm_flip_interaction_direction_hitsize_set(flip, ELM_FLIP_DIRECTION_RIGHT, 1); The flip animation is finished. NULL - + - +
    Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -162,7 +162,7 @@ elm_flip_interaction_direction_hitsize_set(flip, ELM_FLIP_DIRECTION_RIGHT, 1); +
    + - Flipselector + Flipselector @@ -38,7 +38,7 @@
  • Elementary API for Mobile Native
    • -
    +

    Flipselector

    @@ -46,9 +46,9 @@

    The flipselector UI component has a set of text items and flips up or down the selector to change the text on it. For more information, see the Flipselector API.

    This feature is supported in mobile applications only.

    - +

    Basic Usage

    - +

    To use a flipselector component in your application:

    1. Add a flipselector with the elm_flipselector_add() function: @@ -63,37 +63,37 @@ flipsel = elm_flipselector_add(parent); Elm_Object_Item *flip_it; flip_it = elm_flipselector_item_append(flipsel, -                                       "99", -                                       it_select_cb, -                                       NULL); + "99", + it_select_cb, + NULL); /* Called when the flip_it object is selected */ -void +void it_select_cb(void *data, Evas_Object *obj, -             void *event_info) + void *event_info) { -    dlog_print(DLOG_INFO, LOG_TAG, -               "flip_it selected\n"); + dlog_print(DLOG_INFO, LOG_TAG, + "flip_it selected\n"); }
    2. Register the callback functions.

      The following example shows how to define and register a callback for the selected signal:

      -evas_object_smart_callback_add(flipsel, "selected", _flip_selected_cb, NULL);
+evas_object_smart_callback_add(flipsel, "selected", _flip_selected_cb, NULL);
 
 static void
 _flip_selected_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    Elm_Object_Item *flip_it = event_info;
+    Elm_Object_Item *flip_it = event_info;
 
-    /* Code that does the desired action */
+    /* Code that does the desired action */
 }

    The following example shows a simple use case of the flipselector component.

    -

    Example: Flipselector use case

    +

    Example: Flipselector use case

    @@ -113,16 +113,16 @@ int i; flipsel = elm_flipselector_add(nf); for (i = 0; i <= 99; i++) { -    snprintf(buf, 8, "%u", i); -    elm_flipselector_item_append(flipsel, buf, flipselector_item_select_cb, NULL); + snprintf(buf, 8, "%u", i); + elm_flipselector_item_append(flipsel, buf, flipselector_item_select_cb, NULL); } -elm_naviframe_item_push(nf, "Flipselector", NULL, NULL, flipsel, NULL); +elm_naviframe_item_push(nf, "Flipselector", NULL, NULL, flipsel, NULL); -void +void flipselector_item_select_cb(void *data, Evas_Object *obj, void *event_info) { -    Elm_Object_Item *it = event_info; -    printf("label of selected item is: %s\n", elm_object_item_text_get(it)); + Elm_Object_Item *it = event_info; + printf("label of selected item is: %s\n", elm_object_item_text_get(it)); } @@ -197,30 +197,30 @@ elm_flipselector_item_selected_set(flip_it, EINA_TRUE);

    You can register callback functions connected to the following signals for a flipselector object.

    -

    Table: Flipselector callback signals

    +

    Table: Flipselector callback signals

    - - - + + + - + - + - + - +
    SignalDescriptionevent_infoSignalDescriptionevent_info
    selectedThe flipselector's selected text item changes.The flipselector's selected text item changes. NULL
    overflowedThe flipselector's current selection changes from the first item to the last one.The flipselector's current selection changes from the first item to the last one. NULL
    underflowedThe flipselector's current selection changes from the last item to the first one.The flipselector's current selection changes from the last item to the first one. NULL
    @@ -242,7 +242,7 @@ elm_flipselector_item_selected_set(flip_it, EINA_TRUE); +
    + - Managing UI Component Focus - + Managing UI Component Focus + - + +

    Managing UI Component Focus

    - +

    Focus is a common UI concept, which refers to the state of the currently selected or otherwise active UI component on the screen. A UI component is focused when it is selected to receive an input event, such as a mouse button click or key press, from the user. A UI component application has, at all times, only 1 focused object to determine where the input event goes to within the application window.

    @@ -50,7 +50,7 @@

    There are 2 main ways to set focus on a graphical element:

      -
    • Direct (immediate) selection +
    • Direct (immediate) selection

      The user performs this selection by clicking an element using the touch screen or mouse.

      Direct selection does not really need any kind of special treatment, as the user explicitly selects the UI component to interact with.

    • Relative selection @@ -66,9 +66,9 @@
    • Object is enabled
    • Object accepts focus

      To set an object as focusable, or to determine whether the object is focusable, use the elm_object_focus_allow_set() and elm_object_focus_allow_get() functions.

      • -
    • Object's subtree (if any) is focusable +
    • Object's subtree (if any) is focusable

      To set an object and its children as focusable, or to determine whether the object and its children are focusable, use the elm_object_tree_focus_allow_set() and elm_object_tree_focus_allow_get() functions.

      • -
    • All of the subtrees in the object's parents are focusable
      • +
    • All of the subtrees in the object's parents are focusable

    If any of these conditions do not apply, the object is unfocusable.

    @@ -89,7 +89,7 @@ - +

    Focus Chain

    The order in which the focus moves from one UI component to another is called the focus chain. The default focus chain is the order in which the UI components have been added to the canvas.

    @@ -98,9 +98,9 @@ Note If the components are added programmatically in a different order than they appear on the screen, the default focus chain can be quite confusing. In that case, you must customize the focus chain to make it work as expected.
    - -

    When the user wants to switch the focus to the next object, Elementary searches the first focusable object in the focus chain. If there is a disabled or read-only object in the focus chain, the focus skips over it to the next object in the requested direction.

    - + +

    When the user wants to switch the focus to the next object, Elementary searches the first focusable object in the focus chain. If there is a disabled or read-only object in the focus chain, the focus skips over it to the next object in the requested direction.

    +

    When the focus is changed using key presses, Elementary handles the key presses automatically. According to which key is pressed, Elementary switches the focus to the selected direction. For example, if the user presses the Tab key, the focus moves to the next object in the natural (default focus chain) order. On the other hand, if the user presses the direction keys, the focus moves to the next object in the requested direction.

    Customizing the Focus Chain

    @@ -129,8 +129,8 @@

    Get the next object in a specific direction using the elm_object_focus_next_object_get() function.

    -
  • Customizing the entire application's focus chain -

    To customize the application's focus chain:

    +
  • Customizing the entire application's focus chain +

    To customize the application's focus chain:

     Evas_Object *main;
@@ -161,12 +161,12 @@ elm_object_focus_custom_chain_prepend(main, obj4, obj1);
 
 
    
 	Note
-	The object-specific focus exit overrides the application's focus chain. This means that if an object is part of a focus chain and, in addition, has the next focused object defined, the next object takes precedence over the focus chain.
+	The object-specific focus exit overrides the application's focus chain. This means that if an object is part of a focus chain and, in addition, has the next focused object defined, the next object takes precedence over the focus chain.
 	 
    Consider the above focus chain example: if obj4 has obj5 defined as its next object, the actual focus chain is obj5, obj3, obj4, obj5 (the chain loops back to obj5 after obj4 instead of moving on the obj1, as defined in the application focus chain).
    
 
    
 
 
    If an Evas object has several sub-objects, set its focus chain using the same functions as for the application. Elementary first follows the main focus chain, and then the focus chain of each UI component, as applicable.
    
- 
+
    • diff --git a/org.tizen.guides/html/native/ui/efl/component_gengrid_mn.htm b/org.tizen.guides/html/native/ui/efl/component_gengrid_mn.htm index 0141866..27572e0 100644 --- a/org.tizen.guides/html/native/ui/efl/component_gengrid_mn.htm +++ b/org.tizen.guides/html/native/ui/efl/component_gengrid_mn.htm @@ -5,13 +5,13 @@ - + - Gengrid + Gengrid @@ -34,22 +34,22 @@

    Related Info

    - +

    Gengrid

    - +

    The gengrid UI component is based on the same idea as genlist. It aims at displaying objects on a grid layout and rendering only the visible ones. For more information, see the Gengrid API.

    This feature is supported in mobile applications only.

    -

    To save up memory and speed up processing when many items exist, the gengrid has the concept of "realization" when managing items. It means that a gengrid item creates its text and content when the user scrolls the grid and the item shows up on the display (realize), and frees them when the item is scrolled out of the screen (unrealize). To enable the item realization, you must create and fill an Elm_Gengrid_Item_Class structure (gengrid item class) that informs the gengrid component which callbacks to call when an item is created or deleted. When the item is created, the text and content are retrieved by calling the text_get and content_get functions defined in the gengrid item class.

    +

    To save up memory and speed up processing when many items exist, the gengrid has the concept of "realization" when managing items. It means that a gengrid item creates its text and content when the user scrolls the grid and the item shows up on the display (realize), and frees them when the item is scrolled out of the screen (unrealize). To enable the item realization, you must create and fill an Elm_Gengrid_Item_Class structure (gengrid item class) that informs the gengrid component which callbacks to call when an item is created or deleted. When the item is created, the text and content are retrieved by calling the text_get and content_get functions defined in the gengrid item class.

    Basic Usage

    - +

    To use a gengrid component in your application:

    1. Add a gengrid with the elm_gengrid_add() function: @@ -66,7 +66,7 @@ gengrid = elm_gengrid_add(parent); 
       Elm_Gengrid_Item_Class *itc = elm_gengrid_item_class_new();
 
-itc->item_style = "default"; 
+itc->item_style = "default";
 itc->func.text_get = _item_label_get;
 itc->func.content_get = _item_content_get;
 itc->func.del = _item_del;
@@ -78,10 +78,10 @@ itc->func.del = _item_del;
 static char*
 _item_label_get(void *data, Evas_Object *obj, const char *part)
 {
-    if (!strcmp(part, "elm.text"))
-        return strdup("text");
-    else
-        return NULL;
+    if (!strcmp(part, "elm.text"))
+        return strdup("text");
+    else
+        return NULL;
 }
      2. @@ -91,24 +91,24 @@ _item_label_get(void *data, Evas_Object *obj, const char *part) static Evas_Object* _item_content_get(void *data, Evas_Object *obj, const char *part) { -    if (!strcmp(part, "elm.swallow.icon")) { -        Evas_Object *img = elm_image_add(obj); -        elm_image_file_Set(img, "sample.png", NULL); - -        return img; -    } else { -        return NULL; -    } -} + if (!strcmp(part, "elm.swallow.icon")) { + Evas_Object *img = elm_image_add(obj); + elm_image_file_Set(img, "sample.png", NULL); + + return img; + } else { + return NULL; + } +}
    2. Define the del function. -

      This function is called when the gengrid item is deleted. It deletes any data that has been allocated at the item's creation.

      +

      This function is called when the gengrid item is deleted. It deletes any data that has been allocated at the item's creation.

       static void
 _item_del(void *data, Evas_Object *obj)
 {
-    printf("item(%d) is now deleted", (int) data);
+    printf("item(%d) is now deleted", (int) data);
 }
      3. @@ -117,10 +117,10 @@ _item_del(void *data, Evas_Object *obj)
    3. Append items to the gengrid with the elm_gengrid_item_append() function. 
       elm_gengrid_item_append(gengrid, /* Gengrid object */
-                        itc, /* Gengrid item class */
-                        (void *)i, /* Item data */
-                        _item_selected_cb, /* "selected" callback */
-                        (void *)i); /* Callback data */
+                        itc, /* Gengrid item class */
+                        (void *)i, /* Item data */
+                        _item_selected_cb, /* "selected" callback */
+                        (void *)i); /* Callback data */
    4. Register the callback functions for the gengrid and its items. @@ -129,7 +129,7 @@ elm_gengrid_item_append(gengrid, /* Gengrid object */ static void _item_selected_cb(void *data, Evas_Object *obj, void *event_info) { -    printf("item(%d) is selected", (int) data); + printf("item(%d) is selected", (int) data); }
      5. @@ -194,12 +194,12 @@ elm_gengrid_multi_select_set(gengrid, EINA_TRUE);

      To use the popup gengrid style with the default item style:

      -elm_object_style_set(gengrid, "popup");
-gic->item_style = "default";
+elm_object_style_set(gengrid, "popup");
+gic->item_style = "default";
      -

      Figure: Gengrid styles

      -

      Gengrid styles

      +

      Figure: Gengrid styles

      +

      Gengrid styles

      The following table provides further details of the available gengrid item styles.

      Table: Gengrid item styles

      @@ -243,13 +243,13 @@ gic->item_style = "default";

      You can register callback functions connected to the following signals for a gengrid object.

      -

      Table: Gengrid callback signals

      +

      Table: Gengrid callback signals

      - - - + + + @@ -304,51 +304,51 @@ gic->item_style = "default"; - + - + - + - - + + - + - + - - + + - - + + - + - + @@ -408,9 +408,9 @@ gic->item_style = "default"; - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      activated
      drag,stop The item in the list has stopped being dragged.Elm_Object_ItemElm_Object_Item
      drag The item in the list is being dragged.Elm_Object_Item object that contains the dragged itemElm_Object_Item object that contains the dragged item
      scroll,drag,start Dragging the content is started.NULLNULL
      scroll,drag,stopDragging the content is stopped.NULLDragging the content is stopped.NULL
      scroll Scrolling is ongoing.NULLNULL
      edge,top The genlist is scrolled to the top edge.NULLNULL
      edge,bottomThe genlist is scrolled to the bottom edge.NULLThe genlist is scrolled to the bottom edge.NULL
      edge,leftThe genlist is scrolled to the left edge.NULLThe genlist is scrolled to the left edge.NULL
      edge,right The genlist is scrolled to the right edge.NULLNULL
      movedA genlist item is moved in the reorder mode.A genlist item is moved in the reorder mode. Elm_Object_Item object that contains the moved item
      The reorder animation stops.
      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -430,7 +430,7 @@ gic->item_style = "default"; +
      + - Genlist + Genlist @@ -35,10 +35,10 @@

      Related Info

    -
    +

    Genlist

    @@ -46,7 +46,7 @@

    The genlist UI component displays a scrollable list of items. It allows you to manage a lot of items while still being fast and having a low memory footprint, as only visible items are allocated in the memory. For more information, see the Genlist API.

    This feature is supported in mobile applications only.

    -

    To save up memory and speed up processing when many items exist, genlist has the concept of "realization" when managing items. It means that a genlist item creates its text and content when the user scrolls the list and the item shows up on the display (realize), and frees them when the item is scrolled out of the screen (unrealize). Since item realization is dynamic, you cannot set content in advance. You need to fill the item in the form of a callback function. That is the key point of using a genlist component.

    +

    To save up memory and speed up processing when many items exist, genlist has the concept of "realization" when managing items. It means that a genlist item creates its text and content when the user scrolls the list and the item shows up on the display (realize), and frees them when the item is scrolled out of the screen (unrealize). Since item realization is dynamic, you cannot set content in advance. You need to fill the item in the form of a callback function. That is the key point of using a genlist component.

    Basic Usage

    @@ -66,7 +66,7 @@ genlist = elm_genlist_add(parent); 
     Elm_Genlist_Item_Class *itc = elm_genlist_item_class_new();
 
-itc->item_style = "default"; 
+itc->item_style = "default";
 itc->func.text_get = _item_label_get;
 itc->func.content_get = _item_content_get;
 itc->func.del = _item_del;
@@ -78,10 +78,10 @@ itc->func.del = _item_del;
 static char*
 _item_label_get(void *data, Evas_Object *obj, const char *part)
 {
-    if (!strcmp(part, "elm.text"))
-        return strdup("text");
-    else
-        return NULL;
+    if (!strcmp(part, "elm.text"))
+        return strdup("text");
+    else
+        return NULL;
 }
    @@ -91,24 +91,24 @@ _item_label_get(void *data, Evas_Object *obj, const char *part) static Evas_Object* _item_content_get(void *data, Evas_Object *obj, const char *part) { -    if (!strcmp(part, "elm.swallow.icon")) { -        Evas_Object *img = elm_image_add(obj); -        elm_image_file_Set(img, "sample.png", NULL); - -        return img; -    } else { -        return NULL; -    } -} + if (!strcmp(part, "elm.swallow.icon")) { + Evas_Object *img = elm_image_add(obj); + elm_image_file_Set(img, "sample.png", NULL); + + return img; + } else { + return NULL; + } +}
  • Define the del function. -

    This function is called when the genlist item is deleted. It deletes any data that has been allocated at the item's creation.

    +

    This function is called when the genlist item is deleted. It deletes any data that has been allocated at the item's creation.

     static void
 _item_del(void *data, Evas_Object *obj)
 {
-    printf("item(%d) is now deleted", (int)data);
+    printf("item(%d) is now deleted", (int)data);
 }
    • @@ -117,7 +117,7 @@ _item_del(void *data, Evas_Object *obj)
  • Append items to the genlist with the elm_genlist_item_append() function. 
     elm_genlist_item_append(genlist, itc, (void *)i, NULL, ELM_GENLIST_ITEM_NONE,
-                        _item_selected_cb, (void *)i);
+                        _item_selected_cb, (void *)i);
  • Register the callback functions for the genlist and its items. @@ -126,7 +126,7 @@ elm_genlist_item_append(genlist, itc, (void *)i, NULL, ELM_GENLIST_ITEM_NONE, static void _item_selected_cb(void *data, Evas_Object *obj, void *event_info) { -    printf("item(%d) is selected", (int)data); + printf("item(%d) is selected", (int)data); }
    • @@ -152,57 +152,57 @@ Elm_Genlist_Item_Class *itc; genlist = elm_genlist_add(nf); evas_object_show(genlist); -elm_naviframe_item_push(nf, "Genlist", NULL, NULL, genlist, NULL); +elm_naviframe_item_push(nf, "Genlist", NULL, NULL, genlist, NULL); itc = elm_genlist_item_class_new(); -itc->item_style = "default"; +itc->item_style = "default"; itc->func.content_get = _item_content_get; itc->func.text_get = _item_label_get; itc->func.del = _item_del; int i; for (i = 0; i < 10; i++) { -    elm_genlist_item_append(genlist, /* Genlist object */ -                            itc, /* Genlist item class */ -                            (void *)i, /* Item data */ -                            NULL, /* Parent item */ -                            ELM_GENLIST_ITEM_NONE, /* Item type */ -                            NULL, /* Select callback */ -                            NULL); /* Callback data */ + elm_genlist_item_append(genlist, /* Genlist object */ + itc, /* Genlist item class */ + (void *)i, /* Item data */ + NULL, /* Parent item */ + ELM_GENLIST_ITEM_NONE, /* Item type */ + NULL, /* Select callback */ + NULL); /* Callback data */ } elm_genlist_item_class_free(itc); _item_label_get(void *data, Evas_Object *obj, const char *part) { -    char buf[16]; -    int i = (int) data; -    if (!strcmp(part, "elm.text")) { -        sprintf(buf, "text %d", i); + char buf[16]; + int i = (int) data; + if (!strcmp(part, "elm.text")) { + sprintf(buf, "text %d", i); -        return strdup(buf); -    } + return strdup(buf); + } -    else return NULL; + else return NULL; } static Evas_Object* _item_content_get(void *data, Evas_Object *obj, const char *part) { -    if (!strcmp(part, "elm.swallow.icon")) { -        Evas_Object *img = elm_image_add(obj); -        ret = elm_image_file_set(img, ICON_DIR"/tizen.png", NULL); -        evas_object_size_hint_min_set(img, ELM_SCALE_SIZE(30), ELM_SCALE_SIZE(30)); + if (!strcmp(part, "elm.swallow.icon")) { + Evas_Object *img = elm_image_add(obj); + ret = elm_image_file_set(img, ICON_DIR"/tizen.png", NULL); + evas_object_size_hint_min_set(img, ELM_SCALE_SIZE(30), ELM_SCALE_SIZE(30)); -        return img; -    } + return img; + } -    else return NULL; + else return NULL; } static void _item_del(void *data, Evas_Object *obj) { -    printf("item(%d) is now deleted", (int) data); + printf("item(%d) is now deleted", (int) data); } @@ -252,34 +252,34 @@ int i; int j; itc = elm_genlist_item_class_new(); -itc->item_style = "default"; +itc->item_style = "default"; itc->func.content_get = _item_content_get; itc->func.text_get = _item_label_get; itc->func.del = _item_del; gitc = elm_genlist_item_class_new(); -gitc->item_style = "group_index"; +gitc->item_style = "group_index"; gitc->func.text_get = _group_item_label_get; gitc->func.del = _item_del; for (i = 1; i < 10; i++) { -    g = elm_genlist_item_append(genlist, -                                gitc, -                                (void *)i, -                                NULL, -                                ELM_GENLIST_ITEM_GROUP, /* Group item */ -                                NULL, -                                NULL); -    for (j = 1; j < 4; j++) { -        elm_genlist_item_append(genlist, -                                itc, -                                (void *)j, -                                g, /* Pass group item as a parameter */ -                                ELM_GENLIST_ITEM_NONE, /* Child item */ -                                NULL, -                                NULL); -    } + g = elm_genlist_item_append(genlist, + gitc, + (void *)i, + NULL, + ELM_GENLIST_ITEM_GROUP, /* Group item */ + NULL, + NULL); + for (j = 1; j < 4; j++) { + elm_genlist_item_append(genlist, + itc, + (void *)j, + g, /* Pass group item as a parameter */ + ELM_GENLIST_ITEM_NONE, /* Child item */ + NULL, + NULL); + } } elm_genlist_item_class_free(itc); elm_genlist_item_class_free(gitc); @@ -312,71 +312,71 @@ Elm_Genlist_Item_Class *titc; Elm_Object_Item *it; int i; -/* Register the callback functions to make the genlist "expanded" or "contracted" when "selected" */ -evas_object_smart_callback_add(genlist, "selected", gl_selected_cb, NULL); -evas_object_smart_callback_add(genlist, "expanded", gl_expanded_cb, NULL); -evas_object_smart_callback_add(genlist, "contracted", gl_contracted_cb, NULL); +/* Register the callback functions to make the genlist "expanded" or "contracted" when "selected" */ +evas_object_smart_callback_add(genlist, "selected", gl_selected_cb, NULL); +evas_object_smart_callback_add(genlist, "expanded", gl_expanded_cb, NULL); +evas_object_smart_callback_add(genlist, "contracted", gl_contracted_cb, NULL); titc = elm_genlist_item_class_new(); -titc->item_style = "group_index/expandable"; +titc->item_style = "group_index/expandable"; titc->func.text_get = _group_item_label_get; titc->func.del = _item_del; for (i = 1; i < 10; i++) { -    it = elm_genlist_item_append(genlist, -                                 titc, -                                 (void *)i, -                                 NULL, -                                 ELM_GENLIST_ITEM_TREE, /* Tree item */ -                                 NULL, -                                 NULL); -    /* Expand each item */ -    /* This causes the "expanded" callback to be called */ -    elm_genlist_item_expanded_set(it, EINA_TRUE); + it = elm_genlist_item_append(genlist, + titc, + (void *)i, + NULL, + ELM_GENLIST_ITEM_TREE, /* Tree item */ + NULL, + NULL); + /* Expand each item */ + /* This causes the "expanded" callback to be called */ + elm_genlist_item_expanded_set(it, EINA_TRUE); } static void gl_selected_cb(void *data, Evas_Object *obj, void *event_info) { -    Elm_Object_Item *it = event_info; -    Eina_Bool expanded = EINA_FALSE; + Elm_Object_Item *it = event_info; + Eina_Bool expanded = EINA_FALSE; -    expanded = elm_genlist_item_expanded_get(it); -    elm_genlist_item_expanded_set(it, !expanded); + expanded = elm_genlist_item_expanded_get(it); + elm_genlist_item_expanded_set(it, !expanded); } static void gl_expanded_cb(void *data EINA_UNUSED, Evas_Object *obj EINA_UNUSED, void *event_info) { -    Elm_Object_Item *it = event_info; -    Evas_Object *genlist = elm_object_item_widget_get(it); -    Elm_Genlist_Item_Class *itc; -    int i; - -    itc = elm_genlist_item_class_new(); -    itc->item_style = "default"; -    itc->func.content_get = _item_content_get; -    itc->func.text_get = _item_label_get; -    itc->func.del = _item_del; - -    for (i = 1; i < 4; i++) { -        elm_genlist_item_append(genlist, -                                itc, -                                (void *)i, -                                it, /* Set the selected item as parent */ -                                ELM_GENLIST_ITEM_NONE, -                                NULL, -                                NULL); -    } -    elm_genlist_item_class_free(itc); + Elm_Object_Item *it = event_info; + Evas_Object *genlist = elm_object_item_widget_get(it); + Elm_Genlist_Item_Class *itc; + int i; + + itc = elm_genlist_item_class_new(); + itc->item_style = "default"; + itc->func.content_get = _item_content_get; + itc->func.text_get = _item_label_get; + itc->func.del = _item_del; + + for (i = 1; i < 4; i++) { + elm_genlist_item_append(genlist, + itc, + (void *)i, + it, /* Set the selected item as parent */ + ELM_GENLIST_ITEM_NONE, + NULL, + NULL); + } + elm_genlist_item_class_free(itc); } static void gl_contracted_cb(void *data EINA_UNUSED, Evas_Object *obj EINA_UNUSED, void *event_info) { -    Elm_Object_Item *it = event_info; + Elm_Object_Item *it = event_info; -    elm_genlist_item_subitems_clear(it); + elm_genlist_item_subitems_clear(it); } @@ -395,7 +395,7 @@ gl_contracted_cb(void *data EINA_UNUSED, Evas_Object *obj EINA_UNUSED, void *eve

    The genlist and item size can be managed through the mode set by the elm_genlist_mode_set() function:

    • ELM_LIST_COMPRESS -

      The genlist respects its container's geometry. Even if there are items exceeding the genlist in the transverse axis, the genlist is not scrollable in that direction.

      • +

      The genlist respects its container's geometry. Even if there are items exceeding the genlist in the transverse axis, the genlist is not scrollable in that direction.

    • ELM_LIST_SCROLL

      Same as ELM_LIST_COMPRESS, but if there are items exceeding the genlist in the transverse axis, the genlist is scrollable in that direction.

    • ELM_LIST_LIMIT @@ -422,11 +422,11 @@ gl_contracted_cb(void *data EINA_UNUSED, Evas_Object *obj EINA_UNUSED, void *eve static void select_cb(void *data, Evas_Object *obj, void *event_info) { -    Elm_Object_Item *it = (Elm_Object_Item *)event_info; -    /* Cancel select and highlight when item is selected */ -    elm_genlist_item_selected_set(it, EINA_FALSE); + Elm_Object_Item *it = (Elm_Object_Item *)event_info; + /* Cancel select and highlight when item is selected */ + elm_genlist_item_selected_set(it, EINA_FALSE); } - +

      Calling this function does not show or hide any child of an item (if it is a parent). You must manually delete and create them on the callbacks of the expanded or contracted signals.

    @@ -451,7 +451,7 @@ Update only specific parts:

    The genlist items have a gradient opacity from the top to the bottom rather than an explicit divider from Tizen 2.4. Each item is identified by its color made by blending its opacity and background color (or image). The solid prefix in a genlist style name means that genlist items have an explicit divider and background color. To set a genlist with a solid background color:

    -elm_object_style_set(genlist, "solid/default");
+elm_object_style_set(genlist, "solid/default");

    The following table lists the available component styles.

    @@ -506,7 +506,7 @@ elm_object_style_set(genlist, "solid/default"); - +

    Item Styles

    The genlist item style determines the number of parts for text and content, and their arrangement within the item. For example, a default style item has 1 text part (elm.text), and 2 content parts (elm.swallow.icon and elm.swallow.end).

    @@ -556,7 +556,7 @@ elm_object_style_set(genlist, "solid/default"); elm/genlist/item/multiline/default elm/genlist/item/multiline/default - elm.text + elm.text

    elm.text.multiline

    elm.swallow.bg @@ -626,9 +626,9 @@ elm_object_style_set(genlist, "solid/default"); - - - + + + @@ -653,7 +653,7 @@ elm_object_style_set(genlist, "solid/default"); - + @@ -703,12 +703,12 @@ elm_object_style_set(genlist, "solid/default"); - + - + @@ -718,47 +718,47 @@ elm_object_style_set(genlist, "solid/default"); - + - + - + - - + + - + - + - - + + - - + + - + @@ -767,17 +767,17 @@ elm_object_style_set(genlist, "solid/default"); - - + + - - + + - + @@ -792,17 +792,17 @@ elm_object_style_set(genlist, "solid/default"); - + - + - + @@ -812,12 +812,12 @@ elm_object_style_set(genlist, "solid/default"); - + - + @@ -830,14 +830,14 @@ elm_object_style_set(genlist, "solid/default"); - +
    SignalDescriptionevent_infoSignalDescriptionevent_info
    activated
    expanded The item is to be expanded with the elm_genlist_item_expanded_set() function. The callback fills in the child items.Elm_Object_ItemElm_Object_Item
    contracted
    drag,stop The item in the list has stopped being dragged.Elm_Object_ItemElm_Object_Item
    drag The item in the list is being dragged.Elm_Object_Item object that contains the dragged itemElm_Object_Item object that contains the dragged item
    longpressed
    scroll,anim,start The scrolling animation is started.NULLNULL
    scroll,anim,stop The scrolling animation is stopped.NULLNULL
    scroll,drag,start Dragging the content is started.NULLNULL
    scroll,drag,stopDragging the content is stopped.NULLDragging the content is stopped.NULL
    scroll Scrolling is ongoing.NULLNULL
    edge,top The genlist is scrolled to the top edge.NULLNULL
    edge,bottomThe genlist is scrolled to the bottom edge.NULLThe genlist is scrolled to the bottom edge.NULL
    edge,leftThe genlist is scrolled to the left edge.NULLThe genlist is scrolled to the left edge.NULL
    edge,right The genlist is scrolled to the right edge.NULLNULL
    multi,swipe,left
    multi,swipe,rightThe genlist is multi-touch-swiped right.Elm_Object_Item object that contains the swiped itemThe genlist is multi-touch-swiped right.Elm_Object_Item object that contains the swiped item
    multi,swipe,upThe genlist is multi-touch-swiped up.Elm_Object_Item object that contains the swiped itemThe genlist is multi-touch-swiped up.Elm_Object_Item object that contains the swiped item
    multi,swipe,downThe genlist is multi-touch-swiped down.The genlist is multi-touch-swiped down. Elm_Object_Item object that contains the swiped item
    swipeThe genlist is swiped.The genlist is swiped. Elm_Object_Item object that contains the swiped item
    movedA genlist item is moved in the reorder mode.A genlist item is moved in the reorder mode. Elm_Object_Item object that contains the moved item
    moved,afterA genlist item is moved after another item in the reorder mode. To access the relative previous item, use the elm_genlist_item_prev_get() function. This signal is called along with the moved signal.A genlist item is moved after another item in the reorder mode. To access the relative previous item, use the elm_genlist_item_prev_get() function. This signal is called along with the moved signal. Elm_Object_Item object that contains the moved item
    language,changedThe program language changes.The program language changes. NULL
    tree,effect,finishedA genlist tree effect is finished.A genlist tree effect is finished. NULL
    The genlist item is released by mouse up. Elm_Object_Item object that contains the released item
    Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
    - +
    Note Except as noted, this content is licensed under LGPLv2.1+. @@ -852,7 +852,7 @@ elm_object_style_set(genlist, "solid/default"); +
    + - Genlist + Genlist @@ -51,7 +51,7 @@

    Genlist is a UI component that displays a scrollable list of items. It allows you to manage a lot of items while still being fast and having a low memory footprint, as only the visible items are allocated in the memory.

    For more information, see the Genlist API.

    - +

    Figure: Genlist component

    Genlist component

    @@ -89,20 +89,20 @@ genlist = elm_genlist_add(parent);

    The following figures show examples of the item styles.

    -

    Figure: 1text item style

    -

    1 text item style

    +

    Figure: 1text item style

    +

    1 text item style

    -

    Figure: 1text.1icon.1 item style

    -

    1text.1icon.1 item style

    +

    Figure: 1text.1icon.1 item style

    +

    1text.1icon.1 item style

    -

    Figure: 2text.1icon.1 item style

    -

    2text.1icon.1 item style

    +

    Figure: 2text.1icon.1 item style

    +

    2text.1icon.1 item style

    For more information on creating a new genlist item style, see Customizing UI Components.

    Defining the Genlist Item Class

    -

    To save up memory and speed up processing when many items exist, the genlist has the concept of "realization" when managing items. It means that a genlist item creates its text and content when the user scrolls the list and the item shows up on the display (realize), and frees them when the item is scrolled out of the screen (unrealize). To enable the item realization, you must create and fill an Elm_Genlist_Item_Class structure (genlist item class) that informs the genlist component which callbacks to call when an item is created or deleted.

    +

    To save up memory and speed up processing when many items exist, the genlist has the concept of "realization" when managing items. It means that a genlist item creates its text and content when the user scrolls the list and the item shows up on the display (realize), and frees them when the item is scrolled out of the screen (unrealize). To enable the item realization, you must create and fill an Elm_Genlist_Item_Class structure (genlist item class) that informs the genlist component which callbacks to call when an item is created or deleted.

    You can use the genlist item class for the following purposes:

    • Setting the item styles
      • @@ -112,7 +112,7 @@ genlist = elm_genlist_add(parent); 
       Elm_Genlist_Item_Class *itc = elm_genlist_item_class_new();
 
-itc->item_style = "default";
+itc->item_style = "default";
 itc->decorate_item_style = NULL;
 itc->decorate_all_item_style = NULL;
 itc->func.text_get = _item_label_get;
@@ -126,13 +126,13 @@ itc->func.del = _item_del;
 
      The func structure contains pointers to functions that are called when an item is going to be realized or deleted. All of them receive a data parameter that points to the same data passed to the elm_genlist_item_append() function and related item creation functions, and an obj parameter that points to the genlist object itself.
      
   
        
    
      • text_get()
-   
        The PART parameter is the name string of one of the existing text parts in the Edje group implementing the item's theme. It has to return a string (duplicated with the strdup() function) corresponding to the PART parameter. The caller is in charge of freeing the string when done.
        • 
+   
        The PART parameter is the name string of one of the existing text parts in the Edje group implementing the item's theme. It has to return a string (duplicated with the strdup() function) corresponding to the PART parameter. The caller is in charge of freeing the string when done.
        
 
    
      • content_get()
    
        The PART parameter is the name string of one of the existing swallow parts in the Edje group. The function returns a valid object handle or NULL (when no content is desired). The object is deleted by the genlist on its deletion or when the item is unrealized.
        • 
 
    
      • state_get()
-   
        The PART parameter is the name string of one of the state parts in the Edje group implementing the item's theme. It returns EINA_FALSE for false/off or EINA_TRUE for true/on. The default is false. When the state is true, the genlist emits a signal to the PART parameter's theming Edje object using elm,state,xxx,active as the emission parameter and elm as the source parameter. xxx is the name of the (state) part.
        • 
+   
        The PART parameter is the name string of one of the state parts in the Edje group implementing the item's theme. It returns EINA_FALSE for false/off or EINA_TRUE for true/on. The default is false. When the state is true, the genlist emits a signal to the PART parameter's theming Edje object using elm,state,xxx,active as the emission parameter and elm as the source parameter. xxx is the name of the (state) part.
        
 
    
      • del()
    
        This function is called when the genlist item is deleted. It deletes any data that is allocated at the item creation.
        • 
@@ -168,7 +168,7 @@ itc->func.del = _item_del;
 
 
      • Inspect list elements:
 
        To help inspect the list items, move to the item at the top of the list with the elm_genlist_first_item_get() function, which returns the item pointer. The elm_genlist_last_item_get() function moves to the item at the end of the list. The elm_genlist_item_next_get() and elm_genlist_item_prev_get() functions move to the next and previous items relative to the indicated item. Using these calls you can go through the entire item list or tree.
        
- 
+
 
        
 	Note
 	As a tree, the items are flattened on the list, so the elm_genlist_item_parent_get() function gives you the name of the parent item (even to skip them if needed).
@@ -196,81 +196,81 @@ itc->func.del = _item_del;
 
        Using the Genlist Callbacks
        
 
 
        To receive notifications about the genlist events, listen to the following signals:
        
-   
           
-   
        • activated: The item is double-clicked or pressed (enter | return | spacebar). 
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the activated item.
          •  
-   
        • clicked,double: The item is double-clicked.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the double-clicked item.
          •  
-   
        • selected: The item is selected.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the selected item.
          •  
-   
        • unselected: The item is unselected.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the unselected item.
          •  
-   
        • expanded: The item is to be expanded with the elm_genlist_item_expanded_set() function. The callback fills in the child items.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the item to be expanded.
          •  
-   
        • contracted: The item is to be contracted with the elm_genlist_item_expanded_set() function. The callback deletes the child items.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the item to be contracted.
          •  
-   
        • expand,request: The user wants to expand a tree branch item. The callback decides whether the item can expand (if it has any children) and calls the elm_genlist_item_expanded_set() function to set the state.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the item to be expanded.
          •  
-   
        • contract,request: The user wants to contract a tree branch item. The callback decides whether the item can contract (if it has any children) and calls the elm_genlist_item_expanded_set() function to set the state.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the item to be contracted.
          •  
-   
        • realized: The item is created as a real evas object.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the item to be created.
          •  
-   
        • unrealized: An item is going to be unrealized. Provided content objects are deleted and the item object is deleted or put into a floating cache.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the item to be deleted.
          •  
-   
        • drag,start,up: The item in the list is dragged (not scrolled) up.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
          •  
-   
        • drag,start,down: The item in the list is dragged (not scrolled) down.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
          •  
-   
        • drag,start,left: The item in the list is dragged (not scrolled) left.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
          •  
-   
        • drag,start,right: The item in the list is dragged (not scrolled) right.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
          •  
-   
        • drag,stop: The item in the list has stopped being dragged.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
          •  
-   
        • drag: The item in the list is being dragged.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
          •  
-   
        • longpressed: The item is pressed for a certain amount of time. The default specified time is 1 second.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the pressed item.
          •  
-   
        • scroll,anim,start: The scrolling animation is started.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • scroll,anim,stop: The scrolling animation is stopped.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • scroll,drag,start: Dragging the content is started.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • scroll,drag,stop: Dragging the content is stopped.  
-   
          The event_info callback parameter is NULL.
          •  
-
-   
        • edge,top: The genlist is scrolled to the top edge.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • edge,bottom: The genlist is scrolled to the bottom edge.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • edge,left: The genlist is scrolled to the left edge.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • edge,right: The genlist is scrolled to the right edge.  
-   
          The event_info callback parameter is NULL.
          •  
-   
        • multi,swipe,left: The genlist is multi-touch-swiped left.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
          •  
-   
        • multi,swipe,right: The genlist is multi-touch-swiped right.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
          •  
-   
        • multi,swipe,up: The genlist is multi-touch-swiped up.  
-   
          The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
          •  
-   
        • multi,swipe,down: The genlist is multi-touch-swiped down.  
+   
            
+   
          • activated: The item is double-clicked or pressed (enter | return | spacebar).
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the activated item.
            • 
+   
          • clicked,double: The item is double-clicked.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the double-clicked item.
            • 
+   
          • selected: The item is selected.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the selected item.
            • 
+   
          • unselected: The item is unselected.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the unselected item.
            • 
+   
          • expanded: The item is to be expanded with the elm_genlist_item_expanded_set() function. The callback fills in the child items.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the item to be expanded.
            • 
+   
          • contracted: The item is to be contracted with the elm_genlist_item_expanded_set() function. The callback deletes the child items.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the item to be contracted.
            • 
+   
          • expand,request: The user wants to expand a tree branch item. The callback decides whether the item can expand (if it has any children) and calls the elm_genlist_item_expanded_set() function to set the state.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the item to be expanded.
            • 
+   
          • contract,request: The user wants to contract a tree branch item. The callback decides whether the item can contract (if it has any children) and calls the elm_genlist_item_expanded_set() function to set the state.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the item to be contracted.
            • 
+   
          • realized: The item is created as a real evas object.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the item to be created.
            • 
+   
          • unrealized: An item is going to be unrealized. Provided content objects are deleted and the item object is deleted or put into a floating cache.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the item to be deleted.
            • 
+   
          • drag,start,up: The item in the list is dragged (not scrolled) up.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
            • 
+   
          • drag,start,down: The item in the list is dragged (not scrolled) down.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
            • 
+   
          • drag,start,left: The item in the list is dragged (not scrolled) left.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
            • 
+   
          • drag,start,right: The item in the list is dragged (not scrolled) right.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
            • 
+   
          • drag,stop: The item in the list has stopped being dragged.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
            • 
+   
          • drag: The item in the list is being dragged.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the dragged item.
            • 
+   
          • longpressed: The item is pressed for a certain amount of time. The default specified time is 1 second.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the pressed item.
            • 
+   
          • scroll,anim,start: The scrolling animation is started.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • scroll,anim,stop: The scrolling animation is stopped.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • scroll,drag,start: Dragging the content is started.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • scroll,drag,stop: Dragging the content is stopped.
+   
            The event_info callback parameter is NULL.
            • 
+
+   
          • edge,top: The genlist is scrolled to the top edge.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • edge,bottom: The genlist is scrolled to the bottom edge.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • edge,left: The genlist is scrolled to the left edge.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • edge,right: The genlist is scrolled to the right edge.
+   
            The event_info callback parameter is NULL.
            • 
+   
          • multi,swipe,left: The genlist is multi-touch-swiped left.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
            • 
+   
          • multi,swipe,right: The genlist is multi-touch-swiped right.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
            • 
-   
          • multi,pinch,out: The genlist is multi-touch-pinched out.  
+   
          • multi,swipe,up: The genlist is multi-touch-swiped up.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
            • 
+   
          • multi,swipe,down: The genlist is multi-touch-swiped down.
+   
            The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
            • 
+   
          • multi,pinch,out: The genlist is multi-touch-pinched out.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the pinched item.
            • 
-   
          • multi,pinch,in: The genlist is multi-touch-pinched in.  
+   
          • multi,pinch,in: The genlist is multi-touch-pinched in.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the pinched item.
            • 
-   
          • swipe: The genlist is swiped.  
+   
          • swipe: The genlist is swiped.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the swiped item.
            • 
-   
          • moved: A genlist item is moved in the reorder mode.  
+   
          • moved: A genlist item is moved in the reorder mode.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the moved item.
            • 
-   
          • moved,after: A genlist item is moved after another item in the reorder mode. To access the relative previous item, use the elm_genlist_item_prev_get() function. This signal is called along with the moved signal.  
+   
          • moved,after: A genlist item is moved after another item in the reorder mode. To access the relative previous item, use the elm_genlist_item_prev_get() function. This signal is called along with the moved signal.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the moved item.
            • 
-   
          • moved,before: A genlist item is moved before another item in the reorder mode. To access the relative next item, use the elm_genlist_item_next_get() function. This signal is called along with the moved signal.  
+   
          • moved,before: A genlist item is moved before another item in the reorder mode. To access the relative next item, use the elm_genlist_item_next_get() function. This signal is called along with the moved signal.
    
            The event_info callback parameter points at an Elm_Object_Item object that contains the moved item.
            • 
-   
          • language,changed The program language is changed.  
+   
          • language,changed The program language is changed.
    
            The event_info callback parameter is NULL.
            • 
-   
          • tree,effect,finished: A genlist tree effect is finished.  
+   
          • tree,effect,finished: A genlist tree effect is finished.
    
            The event_info callback parameter is NULL.
            • 
   
          
 
@@ -278,7 +278,7 @@ itc->func.del = _item_del;
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
 
        
-  
+
 
        
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
@@ -293,7 +293,7 @@ itc->func.del = _item_del;
 
  
+
        
 
 
 	
+	
 	
 	
 	
 	
 
-	GLView  
+	GLView
 
 
 
@@ -49,8 +49,8 @@
 
        For more information, see the OpenGL ES guide and the GLView API.
        
 
       
        Figure: GLView component
        
-  
        GLView component
         
-  
+  
        GLView component
        
+
       
        Figure: GLView hierarchy
        
   
        GLView hierarchy
        
 
@@ -125,17 +125,17 @@ elm_glview_render_func_set(glview, _draw_gl_cb);
 
 
        You can register callback functions connected to the following signals for a glview object:
        
 
-   
        Table: GLView callback signals
         
+   
        Table: GLView callback signals
        
 
-          
-          
-          
+         
+         
+         
-          
+         
@@ -143,26 +143,26 @@ elm_glview_render_func_set(glview, _draw_gl_cb);
          
-    
+   
        
    
       
        SignalDescriptionevent_infoSignalDescriptionevent_info
       
        
       
        
          focusedThe GLView component is focused.The GLView component is focused.
          Elm_Focus_Info object
      
        
       
        The GLView object is unfocused.
          NULL
       
        
 
        
- 
+
 
        
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
 
        
- 
+
 
        The following example shows how to define and register a callback for the focused signal:
        
 
        -evas_object_smart_callback_add(glview, "focused", focused_cb, data);
+evas_object_smart_callback_add(glview, "focused", focused_cb, data);
 
-/* Callback for the "focused" signal */
+/* Callback for the "focused" signal */
 /* Called when the GLView is focused */
 void
 focused_cb(void *data, Evas_Object *obj, void  *event_info)
 {
-    Elm_Focus_Info *fi = event_info;
+    Elm_Focus_Info *fi = event_info;
 
-    dlog_print(DLOG_INFO, LOG_TAG, "GLView is focused\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "GLView is focused\n");
 }
 
        
 
@@ -180,7 +180,7 @@ focused_cb(void *data, Evas_Object *obj, void  *event_info)
 
  
+
    + - GLView + GLView @@ -35,10 +35,10 @@
    - +

    GLView

    @@ -50,10 +50,10 @@

    For more information, see the OpenGL ES guide and the GLView API.

    -

    Figure: GLView component

    -

    GLView component

    - -

    Figure: GLView hierarchy

    +

    Figure: GLView component

    +

    GLView component

    + +

    Figure: GLView hierarchy

    GLView hierarchy

    Adding a GLView Component

    @@ -128,7 +128,7 @@ elm_glview_render_func_set(glview, _draw_gl_cb);

    To receive notifications about the GLView events, listen to the following signals:

      -
    • focused: The GLView component is focused. +
    • focused: The GLView component is focused.

      The event_info callback parameter points at an Elm_Focus_Info object.

    • unfocused: The GLView object is unfocused.
    @@ -141,17 +141,17 @@ elm_glview_render_func_set(glview, _draw_gl_cb);

    To register and define a callback for the focused signal:

     {
-    evas_object_smart_callback_add(glview, "focused", focused_cb, data);
+    evas_object_smart_callback_add(glview, "focused", focused_cb, data);
 }
 
-/* Callback for the "focused" signal */
+/* Callback for the "focused" signal */
 /* Called when the GLView is focused */
 void
 focused_cb(void *data, Evas_Object *obj, void  *event_info)
 {
-    Elm_Focus_Info *fi = event_info;
+    Elm_Focus_Info *fi = event_info;
 
-    dlog_print(DLOG_INFO, LOG_TAG, "GLView is focused\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "GLView is focused\n");
 }
    @@ -169,7 +169,7 @@ focused_cb(void *data, Evas_Object *obj, void *event_info) +
    + - Hoversel + Hoversel @@ -35,27 +35,27 @@

    Related Info

    - +

    Hoversel

    This feature is supported in mobile applications only.

    - +

    The hoversel component is a button that pops up a list of items (automatically choosing the direction to display).

    The hoversel component inherits from the button component, which means that button functions can be used on the hoversel component.

    For more information, see the Hoversel API.

    -

    Figure: Hoversel component

    +

    Figure: Hoversel component

    Hoversel component

    - -

    Figure: Hoversel hierarchy

    + +

    Figure: Hoversel hierarchy

    Hoversel hierarchy

    Adding a Hoversel Component

    @@ -69,7 +69,7 @@ Evas_Object *parent; /* Create a hoversel */ hoversel = elm_hoversel_add(parent); -

    When activated, the hoversel automatically selects the direction in which to display itself in its parent object's view.

    +

    When activated, the hoversel automatically selects the direction in which to display itself in its parent object's view.

    Configuring the Hoversel

    @@ -114,16 +114,16 @@ expanded = elm_hoversel_expanded_get(hoversel);

    To manage items:

    1. Add an item using the elm_hoversel_item_add() function. -

      To add an item with a "test" label and the _hoversel_item_cb clicked callback:

      +

      To add an item with a "test" label and the _hoversel_item_cb clicked callback: 

       Elm_Object_Item *it;
 
 it = elm_hoversel_item_add(hoversel, /* Hoversel object */
-                           "test", /* Item label */
-                           NULL, /* Icon file */
-                           ELM_ICON_NONE, /* Icon type */
-                           _hoversel_item_cb, /* Clicked callback for the item */
-                           NULL); /* Callback data */
+                           "test", /* Item label */
+                           NULL, /* Icon file */
+                           ELM_ICON_NONE, /* Icon type */
+                           _hoversel_item_cb, /* Clicked callback for the item */
+                           NULL); /* Callback data */

      The signal for the clicked callback is related to an individual item, not the entire hoversel.

    2. @@ -134,11 +134,11 @@ Eina_List *items; items = elm_hoversel_items_get(hoversel);

    3. Change the item label using the elm_object_item_part_text_set() function.

      -

      To change the item label to "New Label":

      +

      To change the item label to "New Label":

      -Elm_Object_Item *it = elm_hoversel_item_add(hoversel, "test", NULL,
-                                            ELM_ICON_NONE, NULL, NULL);
-elm_object_item_part_text_set(it, "default", "New label");
+Elm_Object_Item *it = elm_hoversel_item_add(hoversel, "test", NULL,
+                                            ELM_ICON_NONE, NULL, NULL);
+elm_object_item_part_text_set(it, "default", "New label");

    4. Delete all items together with the elm_hoversel_clear() function:

      @@ -154,9 +154,9 @@ elm_hoversel_clear(hoversel);
 
-          
-          
-          
+         
+         
+         
@@ -183,25 +183,25 @@ elm_hoversel_clear(hoversel);
          
-    
+   
      
    
       
      SignalDescriptionevent_infoSignalDescriptionevent_info
       
      
       
      
          clickedThe program language changes.
          NULL
       
      
 
      
- 
+
 
      
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
 
      
- 
+
 
      The following example shows how to define and register a callback for the dismissed signal:
      
 
 
      -evas_object_smart_callback_add(hoversel, "dismissed", dismissed_cb, data);
+evas_object_smart_callback_add(hoversel, "dismissed", dismissed_cb, data);
 
-/* Callback for the "dismissed" signal */
+/* Callback for the "dismissed" signal */
 /* Called when the hoversel is dismissed */
 void
 dismissed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Hoversel dismissed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Hoversel dismissed\n");
 }
 
      
 
@@ -219,7 +219,7 @@ dismissed_cb(void *data, Evas_Object *obj, void *event_info)
 
  
+
    + - Icon + Icon @@ -43,21 +43,21 @@

    Icon

    -

    The icon UI component is used to display standard icon images ("delete", "home", and "apps") or images coming from a custom file (such as PNG, JPG, and Edje) on icon contexts. The icon component inherits from the image component, which means that image functions can be used on icon objects. For more information, see the Icon API.

    +

    The icon UI component is used to display standard icon images ("delete", "home", and "apps") or images coming from a custom file (such as PNG, JPG, and Edje) on icon contexts. The icon component inherits from the image component, which means that image functions can be used on icon objects. For more information, see the Icon API.

    This feature is supported in mobile applications only.

    - +

    In the following cases, use an icon instead of an image:

    • You need a thumbnail version of an original image.
    • You need freedesktop.org-provided icon images.
    • You need theme-provided icon images (Edje groups).
    - - - + + +

    Basic Usage

    - +

    To use an icon component in your application:

    1. Add an icon with the elm_icon_add() function: @@ -74,7 +74,7 @@ Evas_Object *icon; Evas_Object *parent; icon = elm_icon_add(parent); -elm_icon_standard_set(icon, "Home"); +elm_icon_standard_set(icon, "Home");
    2. Register the callback functions.
      3. @@ -85,18 +85,18 @@ elm_icon_standard_set(icon, "Home");

    3. You can use an image in the file system (for example, /tmp/Home.png):

      -elm_image_file_set(icon, "/tmp/Home.png", NULL);
+elm_image_file_set(icon, "/tmp/Home.png", NULL);

      You can also use a group in an Edje file (for example, /tmp/Home.edj):

      -elm_image_file_set(icon, "/tmp/Home.edj", "elm/icon/Home/default");
+elm_image_file_set(icon, "/tmp/Home.edj", "elm/icon/Home/default");

    4. You can generate and use a thumbnail:

      -elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);
+elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);

      The elm_icon_thumb_set() function sets the file in the icon and enables the use of a cached thumbnail, if it already exists. Otherwise, it creates a new thumbnail and caches it for future use. The Ethumb library support is required for the thumbnail usage.

      @@ -105,7 +105,7 @@ elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);

      The following example shows a simple use case of the icon component.

      -

      Example: Icon use case

      +

      Example: Icon use case

      @@ -126,22 +126,22 @@ Elm_Object_Item *nf_it; box = elm_box_add(nf); elm_object_content_set(nf, box); evas_object_show(box); -elm_naviframe_item_push(nf, "Icon", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Icon", NULL, NULL, box, NULL); icon = elm_icon_add(box); -elm_icon_standard_set(icon, "apps"); +elm_icon_standard_set(icon, "apps"); evas_object_size_hint_min_set(icon, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50)); evas_object_show(icon); elm_box_pack_end(box, icon); icon = elm_icon_add(box); -elm_icon_standard_set(icon, "home"); +elm_icon_standard_set(icon, "home"); evas_object_size_hint_min_set(icon, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50)); evas_object_show(icon); elm_box_pack_end(box, icon); icon = elm_icon_add(box); -elm_icon_standard_set(icon, "clock"); +elm_icon_standard_set(icon, "clock"); evas_object_size_hint_min_set(icon, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50)); evas_object_show(icon); elm_box_pack_end(box, icon); @@ -386,16 +386,16 @@ elm_box_pack_end(box, icon);

      You can register callback functions connected to the following signals for an icon object.

      -

      Table: Icon callback signals

      +

      Table: Icon callback signals

      - + - + - - - + + + @@ -407,9 +407,9 @@ elm_box_pack_end(box, icon); - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      thumb,doneThe elm_icon_thumb_set() function fails. NULL
      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -429,7 +429,7 @@ elm_box_pack_end(box, icon); +
      + @@ -45,14 +45,14 @@

      This feature is supported in wearable applications only.

      -

      The icon component is used to display standard icon images, such as "delete", "home", and "apps", in an icon context.

      +

      The icon component is used to display standard icon images, such as "delete", "home", and "apps", in an icon context.

      The icon component inherits from the image component, which means that image functions can be used on the icon component.

      For more information, see the Icon API.

      Figure: Icon hierarchy

      -

      Icon hierarchy

      +

      Icon hierarchy

      Adding an Icon Component

      @@ -64,7 +64,7 @@ Evas_Object *icon; Evas_Object *parent; icon = elm_icon_add(parent); -elm_icon_standard_set(icon, "Home"); +elm_icon_standard_set(icon, "Home");

      Changing the Image File

      @@ -74,18 +74,18 @@ elm_icon_standard_set(icon, "Home");

    5. You can use an image in the filesystem (for example, /tmp/Home.png):

      -elm_image_file_set(icon, "/tmp/Home.png", NULL);
+elm_image_file_set(icon, "/tmp/Home.png", NULL);

      You can also use a group in an Edje file (for example, /tmp/Home.edj):

      -elm_image_file_set(icon, "/tmp/Home.edj", "elm/icon/Home/default");
+elm_image_file_set(icon, "/tmp/Home.edj", "elm/icon/Home/default");

    6. You can generate and use a thumbnail:

      -elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);
+elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);

      The elm_icon_thumb_set() function sets the file in the icon and enables the use of a cached thumbnail, if it already exists. Otherwise, it creates a new thumbnail and caches it for future use. The Ethumb library support is required for the thumbnail usage.

      @@ -99,7 +99,7 @@ elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);
    7. thumb,done: The elm_icon_thumb_set() function is completed with success.
    8. thumb,error: The elm_icon_thumb_set() function fails.
      9. - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -121,7 +121,7 @@ elm_icon_thumb_set(icon, "/tmp/Home.png", NULL); +
      + @@ -48,11 +48,11 @@

      For more information, see the Image API.

      -

      Figure: Image component

      -

      Image component

      +

      Figure: Image component

      +

      Image component

      -

      Figure: Image hierarchy

      -

      Image hierarchy

      +

      Figure: Image hierarchy

      +

      Image hierarchy

      Adding an Image Component

      @@ -76,7 +76,7 @@ elm_image_resizable_set(image, EINA_TRUE, EINA_TRUE);
    9. -

      To keep the original aspect ratio when resizing the image, define how the image fits into the object's area:

      +

      To keep the original aspect ratio when resizing the image, define how the image fits into the object's area:

       /* Tell the image to keep original aspect ratio */
 elm_image_aspect_fixed_set(image, EINA_TRUE);
@@ -105,7 +105,7 @@ elm_image_preload_disabled_set(image, EINA_TRUE);
   
        
    
      • ELM_IMAGE_ORIENT_0: No orientation change.
        • 
    
      • ELM_IMAGE_ROTATE_90: Rotate the image 90 degrees clockwise.
        • 
-   
      • ELM_IMAGE_ROTATE_180: Rotate the image 180 degrees clockwise.
        •    
+   
      • ELM_IMAGE_ROTATE_180: Rotate the image 180 degrees clockwise.
        • 
    
      • ELM_IMAGE_ROTATE_270: Rotate the image 90 degrees counter-clockwise.
        • 
    
      • ELM_IMAGE_FLIP_HORIZONTAL: Flip the image horizontally.
        • 
    
      • ELM_IMAGE_FLIP_VERTICAL: Flip the image vertically.
        • 
@@ -127,8 +127,8 @@ elm_image_orient_set(image, ELM_IMAGE_ROTATE_180);
 
 
         if (elm_image_animated_available_get(image)) {
-    elm_image_animated_set(image, EINA_TRUE);
-    elm_image_animated_play_set(image, EINA_TRUE);
+    elm_image_animated_set(image, EINA_TRUE);
+    elm_image_animated_play_set(image, EINA_TRUE);
 }
 
        
 
@@ -142,9 +142,9 @@ if (elm_image_animated_available_get(image)) {
 
-          
-          
-          
+         
+         
+         
@@ -156,9 +156,9 @@ if (elm_image_animated_available_get(image)) {
          
-    
+   
        
    
       
        SignalDescriptionevent_infoSignalDescriptionevent_info
       
        
       
        
          dropThe image is clicked.
          NULL
       
        
 
        
- 
+
 
        
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
@@ -166,16 +166,16 @@ if (elm_image_animated_available_get(image)) {
 
 
        The following example shows how to define and register a callback for the clicked signal:
        
 
        -evas_object_smart_callback_add(image, "clicked", clicked_cb, data);
+evas_object_smart_callback_add(image, "clicked", clicked_cb, data);
 
-/* Callback for the "clicked" signal */
+/* Callback for the "clicked" signal */
 /* Called when the user clicks on the image */
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Image clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Image clicked\n");
 }
-
          
+
      Note @@ -191,7 +191,7 @@ clicked_cb(void *data, Evas_Object *obj, void *event_info) +
      + @@ -49,10 +49,10 @@

      For more information, see the Image API.

      Figure: Image component

      -

      Image component

      +

      Image component

      Figure: Image hierarchy

      -

      Image hierarchy

      +

      Image hierarchy

      Adding an Image Component

      @@ -75,8 +75,8 @@ elm_image_no_scale_set(image, EINA_TRUE); elm_image_resizable_set(image, EINA_TRUE, EINA_TRUE);
      10. -
    10. -

      To keep the original aspect ratio when resizing the image, define how the image fits into the object's area:

      +
    11. +

      To keep the original aspect ratio when resizing the image, define how the image fits into the object's area:

       /* Tell the image to keep original aspect ratio */
 elm_image_aspect_fixed_set(image, EINA_TRUE);
@@ -105,7 +105,7 @@ elm_image_preload_disabled_set(image, EINA_TRUE);
   
        
    
      • ELM_IMAGE_ORIENT_0: No orientation change.
        • 
    
      • ELM_IMAGE_ROTATE_90: Rotate the image 90 degrees clockwise.
        • 
-   
      • ELM_IMAGE_ROTATE_180: Rotate the image 180 degrees clockwise.
        •    
+   
      • ELM_IMAGE_ROTATE_180: Rotate the image 180 degrees clockwise.
        • 
    
      • ELM_IMAGE_ROTATE_270: Rotate the image 90 degrees counter-clockwise.
        • 
    
      • ELM_IMAGE_FLIP_HORIZONTAL: Flip the image horizontally.
        • 
    
      • ELM_IMAGE_FLIP_VERTICAL: Flip the image vertically.
        • 
@@ -124,7 +124,7 @@ elm_image_orient_set(image, ELM_IMAGE_ROTATE_180);
 
        To receive notifications about the image events, listen to the following signals:
        
   
          
    
        • drop: An image typed object is dropped onto the object in question. 
          The event_info callback parameter is the path to that image file.
          • 
-   
        • clicked: The image is clicked. 
+   
        • clicked: The image is clicked.
    
          The event_info callback parameter is NULL.
          • 
   
        
 
@@ -133,20 +133,20 @@ elm_image_orient_set(image, ELM_IMAGE_ROTATE_180);
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
    -

    To register and define a callback for the clicked signal:

    +

    To register and define a callback for the clicked signal:

     {
-    evas_object_smart_callback_add(image, "clicked", clicked_cb, data);
+    evas_object_smart_callback_add(image, "clicked", clicked_cb, data);
 }
 
-/* Callback for the "clicked" signal */
+/* Callback for the "clicked" signal */
 /* Called when the user clicks on the image */
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Image clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Image clicked\n");
 }
-
    +
    Note @@ -162,7 +162,7 @@ clicked_cb(void *data, Evas_Object *obj, void *event_info) +
    + @@ -44,12 +44,12 @@

    Index

    The index UI component gives you an index for fast access to a group of other UI items. The index component is by default hidden, but it appears when the user clicks over its reserved area in the canvas. For more information, see the Index API.

    - +

    This feature is supported in mobile applications only.

    - - + +

    Basic Usage

    - +

    To use an index component in your application:

    1. Add an index with the elm_index_add() function: @@ -60,9 +60,9 @@ index = elm_index_add(parent);
    2. Configure the index and set its style.
      3. -
    3. Append items to the index with the elm_index_item_append() function. The function takes 5 parameters: the pointer of the toolbar, a file path of an icon, a text, a callback function to call when the item is clicked, and the parameter passed to the callback. +
    4. Append items to the index with the elm_index_item_append() function. The function takes 5 parameters: the pointer of the toolbar, a file path of an icon, a text, a callback function to call when the item is clicked, and the parameter passed to the callback. 
      -elm_index_item_append(index, "A", _item_selected_cb, NULL);
+elm_index_item_append(index, "A", _item_selected_cb, NULL);
    5. Register the callback functions.
      6. @@ -91,12 +91,12 @@ index = elm_index_add(nf); for (i = 0; i < 26; i++) { -    sprintf(buf, "%c", ('A' + i)); -    elm_index_item_append(index, buf, NULL, NULL); + sprintf(buf, "%c", ('A' + i)); + elm_index_item_append(index, buf, NULL, NULL); } evas_object_show(index); -elm_naviframe_item_push(nf, "Index", NULL, NULL, index, NULL); +elm_naviframe_item_push(nf, "Index", NULL, NULL, index, NULL); @@ -108,7 +108,7 @@ elm_naviframe_item_push(nf, "Index", NULL, NULL, index, NULL);

      Index Usage with a List

      -

      The most common usage of an index is with a list. When a list has many items, you can "bring in" a list item by touching the corresponding index item instead of scrolling the list. Remember that index and list are independent UI components. You need to do an extra job to use an index to control a list.

      +

      The most common usage of an index is with a list. When a list has many items, you can "bring in" a list item by touching the corresponding index item instead of scrolling the list. Remember that index and list are independent UI components. You need to do an extra job to use an index to control a list.

      To connect index items with list items:

      1. Overlap an index on the top of a list using a container object such as a layout or a table.
        2. @@ -116,24 +116,24 @@ elm_naviframe_item_push(nf, "Index", NULL, NULL, index, NULL); 
         Elm_Object_Item *it;
 
-it = elm_list_item_append(list, "tizen", NULL, NULL, NULL, NULL);
-elm_index_item_append(index, "T", NULL, it);
-
        +it = elm_list_item_append(list, "tizen", NULL, NULL, NULL, NULL); +elm_index_item_append(index, "T", NULL, it); +
      2. Register a callback function to the index for the changed signal. Bring in the corresponding list item in the callback function. The event_info parameter is the changed index item and the elm_object_item_data_get() function retrieves the list item passed to elm_index_item_append() function. 
        -void 
+void
 index_changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    elm_list_item_bring_in(elm_object_item_data_get(event_info));
+    elm_list_item_bring_in(elm_object_item_data_get(event_info));
 }
-
        +

      The following example shows an index with a list.

      -

      Example: Index with list

      +

      Example: Index with list

      @@ -169,20 +169,20 @@ evas_object_show(index); for (i = 0; i < 26; i++) { -    sprintf(buf, "%c", ('A' + i)); -    sprintf(str_buf, "%s string", buf); -    it = elm_list_item_append(list, str_buf, NULL, NULL, NULL, NULL); + sprintf(buf, "%c", ('A' + i)); + sprintf(str_buf, "%s string", buf); + it = elm_list_item_append(list, str_buf, NULL, NULL, NULL, NULL); -    elm_index_item_append(index, buf, NULL, it); + elm_index_item_append(index, buf, NULL, it); } -evas_object_smart_callback_add(index, "changed", index_changed_cb, list); -elm_naviframe_item_push(naviframe, "Index", NULL, NULL, table, NULL); +evas_object_smart_callback_add(index, "changed", index_changed_cb, list); +elm_naviframe_item_push(naviframe, "Index", NULL, NULL, table, NULL); static void index_changed_cb(void *data, Evas_Object *obj, void *event_info) { -    elm_list_item_bring_in(elm_object_item_data_get(event_info)); + elm_list_item_bring_in(elm_object_item_data_get(event_info)); } @@ -199,7 +199,7 @@ index_changed_cb(void *data, Evas_Object *obj, void *event_info)

      To set the style, use the elm_object_style_set() function:

      -elm_object_style_set(index, "pagecontrol");
+elm_object_style_set(index, "pagecontrol");

      The following table lists the available component styles.

      @@ -215,7 +215,7 @@ elm_object_style_set(index, "pagecontrol"); - + @@ -238,28 +238,28 @@ elm_index_horizontal_set(index, EINA_TRUE);

      You can register callback functions connected to the following signals for an index object.

      -

      Table: Index callback signals

      +

      Table: Index callback signals

      elm/index/base/vertical/default elm/index/base/vertical/defaultThis style has a one-finger-wide area on the right side of the index component's container. Generally, this style is used together with lists, generic lists, or generic grids.This style has a one-finger-wide area on the right side of the index component's container. Generally, this style is used together with lists, generic lists, or generic grids.
      elm/index/base/vertical/pagecontrol
      - - - + + + - + - + - + @@ -271,7 +271,7 @@ elm_index_horizontal_set(index, EINA_TRUE); - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      changed The selected index item changes.The selected item's data pointerThe selected item's data pointer
      delay,changed The selected index item changes, but after a small idling period.The selected item's data pointerThe selected item's data pointer
      selected The user selects an item by releasing the mouse button.The selected item's data pointerThe selected item's data pointer
      level,upThe user moves a finger from the second level to the first level. NULL
      @@ -293,7 +293,7 @@ elm_index_horizontal_set(index, EINA_TRUE); +
      + @@ -47,15 +47,15 @@

      The index component gives you an index for fast access to a group of other UI items. The index component is by default hidden, but it appears when the user clicks over its reserved area in the canvas.

      -

      In the default theme, the index component is a one-finger-wide area on the right side of the index component's container. Generally, it is used together with lists, generic lists, or generic grids.

      +

      In the default theme, the index component is a one-finger-wide area on the right side of the index component's container. Generally, it is used together with lists, generic lists, or generic grids.

      For more information, see the Index API.

      - -

      Figure: Index component

      -

      Index component

      - -

      Figure: Index hierarchy

      -

      Index hierarchy

      + +

      Figure: Index component

      +

      Index component

      + +

      Figure: Index hierarchy

      +

      Index hierarchy

      Adding an Index Component

      @@ -76,7 +76,7 @@ index = elm_index_add(parent); 
       Elm_Object_Item *list_item1;
 Elm_Object_Item *list_item2;
-elm_index_item_append(index, "A", it_select_cb, list_item1);
+elm_index_item_append(index, "A", it_select_cb, list_item1);

      The elm_index_item_append() function appends the indexes to the existing ones. It is also possible to prepend index items with the elm_index_item_prepend() function.

      @@ -85,7 +85,7 @@ elm_index_item_append(index, "A", it_select_cb, list_item1); 
       Elm_Object_Item *it[5];
 for (i = 0; i < 5; ++i)
-    it[i] = elm_index_item_append(index, NULL, it_select_cb, (void *)i);
+    it[i] = elm_index_item_append(index, NULL, it_select_cb, (void *)i);
    6. @@ -95,7 +95,7 @@ for (i = 0; i < 5; ++i) void it_select_cb(void *data, Evas_Object *obj, void *event_info) { -    dlog_print(DLOG_INFO, LOG_TAG, "Item1 selected\n"); + dlog_print(DLOG_INFO, LOG_TAG, "Item1 selected\n"); }
      7. @@ -106,16 +106,16 @@ it_select_cb(void *data, Evas_Object *obj, void *event_info)

      To receive notifications about the index events, listen to the following signals:

        -
      • changed: The selected index item changes. -

        The event_info callback parameter is the selected item's data pointer.

        • -
      • delay,changed: The selected index item changes, but after a small idling period. -

        The event_info callback parameter is the selected item's data pointer.

        • -
      • selected: The user selects an item by releasing the mouse button. -

        The event_info callback parameter is the selected item's data pointer.

        • +
      • changed: The selected index item changes. +

        The event_info callback parameter is the selected item's data pointer.

        • +
      • delay,changed: The selected index item changes, but after a small idling period. +

        The event_info callback parameter is the selected item's data pointer.

        • +
      • selected: The user selects an item by releasing the mouse button. +

        The event_info callback parameter is the selected item's data pointer.

      • level,up: The user moves a finger from the first level to the second level.
      • level,down: The user moves a finger from the second level to the first level.
      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -126,12 +126,12 @@ it_select_cb(void *data, Evas_Object *obj, void *event_info) static void _index_selected_cb(void *data, Evas_Object *obj, void *event_info) { -    Elm_Object_Item *lit = event_info; + Elm_Object_Item *lit = event_info; -    /* Code that does the desired action */ + /* Code that does the desired action */ } -evas_object_smart_callback_add(index, "selected", _index_selected_cb, NULL); +evas_object_smart_callback_add(index, "selected", _index_selected_cb, NULL);
      @@ -148,7 +148,7 @@ evas_object_smart_callback_add(index, "selected", _index_selected_cb, +
      + @@ -37,7 +37,7 @@
    7. Elementary API for Mobile Native
    - +

    Label

    @@ -45,9 +45,9 @@

    The label UI component displays texts with a simple HTML-like markup. For more information, see the Label API.

    This feature is supported in mobile applications only.

    - +

    Basic Usage

    - +

    To use a label component in your application:

    1. Add a label with the elm_label_add() function: @@ -59,18 +59,18 @@ label = elm_label_add(parent);
    2. Set a text to the label with the elm_object_text_set() function. Label is based on textblock, which means you can use every markup for textblock to a text in a label. 
      -elm_object_text_set(label, "This is a label.");
+elm_object_text_set(label, "This is a label.");
    3. Register the callback functions.

      The following example shows how to define and register a callback for the slide,end signal:

      -evas_object_smart_callback_add(label, "slide,end", slide_end_cb, data);
+evas_object_smart_callback_add(label, "slide,end", slide_end_cb, data);
 
 void
 slide_end_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Slide has reach the end.\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Slide has reach the end.\n");
 }
      4. @@ -97,10 +97,10 @@ Evas_Object *label; box = elm_box_add(nf); elm_object_content_set(nf, box); evas_object_show(box); -elm_naviframe_item_push(nf, "Label", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Label", NULL, NULL, box, NULL); label = elm_label_add(box); -elm_object_text_set(label, "This is a label"); +elm_object_text_set(label, "This is a label"); evas_object_show(label); elm_box_pack_end(box, label); @@ -130,23 +130,23 @@ elm_label_slide_duration_set(label, 3); default - No animation is used. + No animation is used. marker - The text is centered and bolded. + The text is centered and bolded. slide_long - The text appears from the right of the screen and slides until it disappears in the left of the screen (reappearing on the right again). + The text appears from the right of the screen and slides until it disappears in the left of the screen (reappearing on the right again). slide_short - The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the position is reset. + The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the position is reset. slide_bounce - The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the animation reverses, moving the text to the left. + The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the animation reverses, moving the text to the left. @@ -160,9 +160,9 @@ elm_label_slide_duration_set(label, 3); - - - + + + @@ -176,7 +176,7 @@ elm_label_slide_duration_set(label, 3); - + @@ -189,7 +189,7 @@ elm_label_slide_duration_set(label, 3); - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      language,changed
      anchor,clickedThe anchor is clicked.The anchor is clicked. Elm_Label_Anchor_Info object
      The anchor is released by mouse up. Elm_Label_Anchor_Info object
      @@ -211,7 +211,7 @@ elm_label_slide_duration_set(label, 3); +
      + - Label + Label @@ -35,10 +35,10 @@
    -
    +

    Label

    @@ -49,11 +49,11 @@

    For more information, see the Label API.

    -

    Figure: Label component

    -

    Label component

    - -

    Figure: Label hierarchy

    -

    Label hierarchy

    +

    Figure: Label component

    +

    Label component

    + +

    Figure: Label hierarchy

    +

    Label hierarchy

    Adding a Label Component

    @@ -62,7 +62,7 @@ 
     Evas_Object *label = elm_label_add(win);
 
-elm_object_text_set(label, "Some long text for our label, that is not so long");
+elm_object_text_set(label, "Some long text for our label, that is not so long");

    Configuring the Label

    @@ -72,17 +72,17 @@ elm_object_text_set(label, "Some long text for our label, that is not so lo

  • Modify the style with which the label component displays text.

    The following styles are available:

    -
      -
    • default: No animation
      • -
    • marker: The text is centered and bolded.
      • -
    • slide_long: The text appears from the right of the screen and slides until it disappears in the left of the screen (reappearing on the right again).
      • +
        +
      • default: No animation
        • +
      • marker: The text is centered and bolded.
        • +
      • slide_long: The text appears from the right of the screen and slides until it disappears in the left of the screen (reappearing on the right again).
      • slide_roll: The text appears from the left of the label and slides to the right to show the overflow, and then appears from the right of the label again.
        • -
      • slide_short: The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the position is reset.
        • -
      • slide_bounce: The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the animation reverses, moving the text to the left.
        • +
      • slide_short: The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the position is reset.
        • +
      • slide_bounce: The text appears in the left of the label and slides to the right to show the overflow. When all of the text has been shown, the animation reverses, moving the text to the left.
      -elm_object_style_set(label, "slide_roll");
+elm_object_style_set(label, "slide_roll");
    • @@ -101,32 +101,32 @@ elm_label_slide_mode_set(label, ELM_LABEL_SLIDE_MODE_ALWAYS);
      • language,changed: The program language is changed.
      • slide,end: The slide reaches the end.
        • -
      • anchor,clicked: The anchor is clicked. +
      • anchor,clicked: The anchor is clicked.

        The event_info callback parameter points to an Elm_Label_Anchor_Info object.

        • -
      • anchor,mouse,down: The anchor is pressed by mouse down. +
      • anchor,mouse,down: The anchor is pressed by mouse down.

        The event_info callback parameter points to an Elm_Label_Anchor_Info object.

        • -
      • anchor,mouse,up: The anchor is released by mouse up. +
      • anchor,mouse,up: The anchor is released by mouse up.

        The event_info callback parameter points to an Elm_Label_Anchor_Info object.

      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
      - +

      To register and define a callback for the slide,end signal:

       {
-    evas_object_smart_callback_add(label, "slide,end", slide_end_cb, data);
+    evas_object_smart_callback_add(label, "slide,end", slide_end_cb, data);
 }
 
-/* Callback for the "slide,end" signal */
+/* Callback for the "slide,end" signal */
 /* Called when the label slide reaches the end */
 void
 slide_end_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Slide has reach the end.\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Slide has reach the end.\n");
 }
      @@ -144,7 +144,7 @@ slide_end_cb(void *data, Evas_Object *obj, void *event_info) +
    • + - List + List @@ -28,35 +28,35 @@

    Content

    Related Info

    - +

    List

    This feature is supported in mobile applications only.

    - +

    The list is a very simple UI component used to manage a limited number of items. For lists with a lot of items, use the Genlist.

    For more information, see the List API.

    - -

    Figure: List component

    -

    List component

    - -

    Figure: List hierarchy

    -

    List hierarchy

    - + +

    Figure: List component

    +

    List component

    + +

    Figure: List hierarchy

    +

    List hierarchy

    +

    Adding a List Component

    To add a list component, use the elm_list_add() function:

    @@ -82,21 +82,21 @@ int i; static void _selected_item_cb(void *data, Evas_Object *obj, void *event_info) { -    Elm_Object_Item *list_it = elm_list_selected_item_get(obj); -    Eina_Bool selected = elm_list_item_selected_get(list_it); -    dlog_print(DLOG_INFO, LOG_TAG, "item is %s\n", selected? "selected": "unselected"); + Elm_Object_Item *list_it = elm_list_selected_item_get(obj); + Eina_Bool selected = elm_list_item_selected_get(list_it); + dlog_print(DLOG_INFO, LOG_TAG, "item is %s\n", selected? "selected": "unselected"); } for (i = 0; i < 10; i++) { -    Evas_Object *ic; -    char tmp[8]; -    snprintf(tmp, sizeof(tmp), "Item %02d", i); -    /* Create an icon */ -    ic = elm_icon_add(win); -    /* Set the file to the icon file */ -    elm_image_file_set(ic, "path/to/file", NULL); -    /* Add the item to the list */ -    elm_list_item_append(list, tmp, ic, NULL, _selected_item_cb, NULL); + Evas_Object *ic; + char tmp[8]; + snprintf(tmp, sizeof(tmp), "Item %02d", i); + /* Create an icon */ + ic = elm_icon_add(win); + /* Set the file to the icon file */ + elm_image_file_set(ic, "path/to/file", NULL); + /* Add the item to the list */ + elm_list_item_append(list, tmp, ic, NULL, _selected_item_cb, NULL); } @@ -117,17 +117,17 @@ Elm_Object_Item *it; /* Retrieve the current selected item */ it = elm_list_selected_item_get(list); if (!it) -    return; + return; ic = elm_icon_add(win); /* Set the file to the icon file */ -elm_image_file_set(ic, "path/to/file", NULL); +elm_image_file_set(ic, "path/to/file", NULL); /* Change the first icon */ -elm_object_item_part_content_set(it, "start", ic); +elm_object_item_part_content_set(it, "start", ic); /* Change the second icon */ -elm_object_item_part_content_set(it, "end", ic); +elm_object_item_part_content_set(it, "end", ic); /* Change the label */ -elm_object_item_text_set(it, "I've been selected !"); +elm_object_item_text_set(it, "I've been selected !");

    Accessing and Selecting List Items

    @@ -176,7 +176,7 @@ Elm_Object_Item *it; selected_items = elm_list_selected_items_get(list); EINA_LIST_FOREACH(selected_items, l, it) -    elm_list_item_selected_set(it, EINA_FALSE); + elm_list_item_selected_set(it, EINA_FALSE);
  • Moving within the list: @@ -202,28 +202,28 @@ elm_list_item_bring_in(next);

    Using the List Callbacks

    -

    To receive notifications about the list events, listen to the following signals:

    -
      -
    • activated: The item is double-clicked or pressed (enter | return | spacebar). -

      The event_info callback parameter points at the activated item.

      • -
    • clicked,double: The item is double-clicked. -

      The event_info callback parameter points at the double-clicked item.

      • -
    • selected: The item is selected. -

      The event_info callback parameter points at the selected item.

      • -
    • unselected: The item is unselected. -

      The event_info callback parameter points at the unselected item.

      • -
    • longpressed: The item is long-pressed. -

      The event_info callback parameter points at the long-pressed item.

      • -
    • edge,top: The list is scrolled to the top edge.
      • -
    • edge,bottom: The list is scrolled to the bottom edge.
      • -
    • edge,left: The list is scrolled to the left edge.
      • -
    • edge,right: The list is scrolled to the right edge.
      • -
    • highlighted: An item on the list is highlighted. -

      The event_info callback parameter points at the highlighted item.

      • -
    • unhighlighted: An item in the list is unhighlighted. -

      The event_info callback parameter points at the unhighlighted item.

      • +

      To receive notifications about the list events, listen to the following signals:

      +
        +
      • activated: The item is double-clicked or pressed (enter | return | spacebar). +

        The event_info callback parameter points at the activated item.

        • +
      • clicked,double: The item is double-clicked. +

        The event_info callback parameter points at the double-clicked item.

        • +
      • selected: The item is selected. +

        The event_info callback parameter points at the selected item.

        • +
      • unselected: The item is unselected. +

        The event_info callback parameter points at the unselected item.

        • +
      • longpressed: The item is long-pressed. +

        The event_info callback parameter points at the long-pressed item.

        • +
      • edge,top: The list is scrolled to the top edge.
        • +
      • edge,bottom: The list is scrolled to the bottom edge.
        • +
      • edge,left: The list is scrolled to the left edge.
        • +
      • edge,right: The list is scrolled to the right edge.
        • +
      • highlighted: An item on the list is highlighted. +

        The event_info callback parameter points at the highlighted item.

        • +
      • unhighlighted: An item in the list is unhighlighted. +

        The event_info callback parameter points at the unhighlighted item.

      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -233,18 +233,18 @@ elm_list_item_bring_in(next); 
       {
-    Evas_Object *list;
+    Evas_Object *list;
 
-    evas_object_smart_callback_add(list, "clicked,double", double_clicked_cb, data);
+    evas_object_smart_callback_add(list, "clicked,double", double_clicked_cb, data);
 }
 
-/* Callback for the "clicked,double" signal */
+/* Callback for the "clicked,double" signal */
 /* Called when the button is double-clicked by the user */
 void
 double_clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    elm_Object_Item *it = event_info;
-    elm_list_selected_item_set(it, EINA_FALSE);
+    elm_Object_Item *it = event_info;
+    elm_list_selected_item_set(it, EINA_FALSE);
 }
      @@ -262,7 +262,7 @@ double_clicked_cb(void *data, Evas_Object *obj, void *event_info) +
      + @@ -32,7 +32,7 @@
    • Modifying List Items
    • Accessing and Selecting List Items
    • Using the List Callbacks
      • - +

    Related Info

    • -
    +

    List

    This feature is supported in wearable applications only.

    - +

    The list is a very simple UI component used to manage a limited number of items. For lists with a lot of items, use the Genlist.

    For more information, see the List API.

    - +

    Figure: List component

    -

    List component

    - +

    List component

    +

    Figure: List hierarchy

    -

    List hierarchy

    - +

    List hierarchy

    +

    Adding a List Component

    To add a list component, use the elm_list_add() function:

    @@ -84,21 +84,21 @@ int i; static void _selected_item_cb(void *data, Evas_Object *obj, void *event_info) { -    Elm_Object_Item *list_it = elm_list_selected_item_get(obj); -    Eina_Bool selected = elm_list_item_selected_get(list_it); -    dlog_print(DLOG_INFO, LOG_TAG, "item is %s\n", selected? "selected": "unselected"); + Elm_Object_Item *list_it = elm_list_selected_item_get(obj); + Eina_Bool selected = elm_list_item_selected_get(list_it); + dlog_print(DLOG_INFO, LOG_TAG, "item is %s\n", selected? "selected": "unselected"); } for (i = 0; i < 10; i++) { -    Evas_Object *ic; -    char tmp[8]; -    snprintf(tmp, sizeof(tmp), "Item %02d", i); -    /* Create an icon */ -    ic = elm_icon_add(win); -    /* Set the file to the icon file */ -    elm_image_file_set(ic, "path/to/file", NULL); -    /* Add the item to the list */ -    elm_list_item_append(list, tmp, ic, NULL, _selected_item_cb, NULL); + Evas_Object *ic; + char tmp[8]; + snprintf(tmp, sizeof(tmp), "Item %02d", i); + /* Create an icon */ + ic = elm_icon_add(win); + /* Set the file to the icon file */ + elm_image_file_set(ic, "path/to/file", NULL); + /* Add the item to the list */ + elm_list_item_append(list, tmp, ic, NULL, _selected_item_cb, NULL); } @@ -119,17 +119,17 @@ Elm_Object_Item *it; /* Retrieve the current selected item */ it = elm_list_selected_item_get(list); if (!it) -    return; + return; ic = elm_icon_add(win); /* Set the file to the icon file */ -elm_image_file_set(ic, "path/to/file", NULL); +elm_image_file_set(ic, "path/to/file", NULL); /* Change the first icon */ -elm_object_item_part_content_set(it, "start", ic); +elm_object_item_part_content_set(it, "start", ic); /* Change the second icon */ -elm_object_item_part_content_set(it, "end", ic); +elm_object_item_part_content_set(it, "end", ic); /* Change the label */ -elm_object_item_text_set(it, "I've been selected !"); +elm_object_item_text_set(it, "I've been selected !");

    Accessing and Selecting List Items

    @@ -170,7 +170,7 @@ elm_list_multi_select_set(list, EINA_TRUE);

    To retrieve all selected items and set their state to unselected:

    -Evas_Object *list; 
+Evas_Object *list;
 Eina_List *l;
 Eina_List *selected_items;
 /* Elm_Object_Item list */
@@ -178,7 +178,7 @@ Elm_Object_Item *it;
 
 selected_items = elm_list_selected_items_get(list);
 EINA_LIST_FOREACH(selected_items, l, it)
-    elm_list_item_selected_set(it, EINA_FALSE);
+    elm_list_item_selected_set(it, EINA_FALSE);
  • Moving within the list: @@ -204,26 +204,26 @@ elm_list_item_bring_in(next);

    Using the List Callbacks

    -

    To receive notifications about the list events, listen to the following signals:

    -
      -
    • activated: The item is double-clicked or pressed (enter | return | spacebar). -

      The event_info callback parameter points at the activated item.

      • -
    • clicked,double: The item is double-clicked. -

      The event_info callback parameter points at the double-clicked item.

      • -
    • selected: The item is selected. -

      The event_info callback parameter points at the selected item.

      • -
    • unselected: The item is unselected. -

      The event_info callback parameter points at the unselected item.

      • -
    • longpressed: The item is long-pressed. -

      The event_info callback parameter points at the long-pressed item.

      • -
    • edge,top: The list is scrolled to the top edge.
      • -
    • edge,bottom: The list is scrolled to the bottom edge.
      • -
    • edge,left: The list is scrolled to the left edge.
      • -
    • edge,right: The list is scrolled to the right edge.
      • -
    • highlighted: An item on the list is highlighted. -

      The event_info callback parameter points at the highlighted item.

      • -
    • unhighlighted: An item in the list is unhighlighted. -

      The event_info callback parameter points at the unhighlighted item.

      • +

      To receive notifications about the list events, listen to the following signals:

      +
        +
      • activated: The item is double-clicked or pressed (enter | return | spacebar). +

        The event_info callback parameter points at the activated item.

        • +
      • clicked,double: The item is double-clicked. +

        The event_info callback parameter points at the double-clicked item.

        • +
      • selected: The item is selected. +

        The event_info callback parameter points at the selected item.

        • +
      • unselected: The item is unselected. +

        The event_info callback parameter points at the unselected item.

        • +
      • longpressed: The item is long-pressed. +

        The event_info callback parameter points at the long-pressed item.

        • +
      • edge,top: The list is scrolled to the top edge.
        • +
      • edge,bottom: The list is scrolled to the bottom edge.
        • +
      • edge,left: The list is scrolled to the left edge.
        • +
      • edge,right: The list is scrolled to the right edge.
        • +
      • highlighted: An item on the list is highlighted. +

        The event_info callback parameter points at the highlighted item.

        • +
      • unhighlighted: An item in the list is unhighlighted. +

        The event_info callback parameter points at the unhighlighted item.

      @@ -235,18 +235,18 @@ elm_list_item_bring_in(next); 
       {
-    Evas_Object *list;
+    Evas_Object *list;
 
-    evas_object_smart_callback_add(list, "clicked,double", double_clicked_cb, data);
+    evas_object_smart_callback_add(list, "clicked,double", double_clicked_cb, data);
 }
 
-/* Callback for the "clicked,double" signal */
+/* Callback for the "clicked,double" signal */
 /* Called when the button is double-clicked by the user */
 void
 double_clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    elm_Object_Item *it = event_info;
-    elm_list_selected_item_set(it, EINA_FALSE);
+    elm_Object_Item *it = event_info;
+    elm_list_selected_item_set(it, EINA_FALSE);
 }
      @@ -264,7 +264,7 @@ double_clicked_cb(void *data, Evas_Object *obj, void *event_info) +
      + @@ -37,7 +37,7 @@
    • Elementary API for Mobile Native
    • -
    +

    Map

    @@ -80,12 +80,12 @@ elm_map_region_bring_in(map, 2.2, 48.8);
  • Register the callback functions.

    The following example shows how to define and register a callback for the clicked signal:

    -evas_object_smart_callback_add(map, "clicked", clicked_cb, data);
+evas_object_smart_callback_add(map, "clicked", clicked_cb, data);
 
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Map clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Map clicked\n");
 }
    @@ -95,9 +95,9 @@ clicked_cb(void *data, Evas_Object *obj, void *event_info)

    The following example shows a simple use case of the map component.

    Example: Map use case

    - + - + - @@ -259,7 +259,7 @@ src="../../../images/progressbar_process_small_wn.png" />

    (circular)

    + + @@ -37,7 +37,7 @@
  • Elementary API for Mobile Native
    • - +

    Radio

    @@ -45,11 +45,11 @@

    The radio UI component displays 1 or more options and allows users to select 1 of them. For more information, see the Radio API.

    This feature is supported in mobile applications only.

    - - + +

    Basic Usage

    - +

    To use a radio component in your application:

    1. Add a radio button with the elm_radio_add() function: @@ -64,14 +64,14 @@ radio = elm_radio_add(parent);
    2. Set a label to the radio button with the elm_object_text_set() function, if the style supports a text part: 
      -elm_object_text_set(radio, "option 1");
+elm_object_text_set(radio, "option 1");
    3. Set an image object to the button with the elm_object_part_content_set() function and pass the part name as a parameter: 
       Evas_Object *icon;
 
-elm_object_part_content_set(radio, "icon", icon);
+elm_object_part_content_set(radio, "icon", icon);
      4. @@ -82,7 +82,7 @@ elm_object_part_content_set(radio, "icon", icon); 
       elm_radio_state_value_set(radio, 1);
      - +
    4. Group the radio buttons with the elm_radio_group_add() function. You can set one of the radio buttons as selected with the elm_radio_value_set() function. 
       elm_radio_group_add(radio, group);
@@ -94,12 +94,12 @@ elm_radio_group_add(radio, group);
 
    5. Register the callback functions.
 
      The following example shows how to define and register a callback for the changed signal:
      
 
      -evas_object_smart_callback_add(radio, "changed", changed_cb, data);
+evas_object_smart_callback_add(radio, "changed", changed_cb, data);
 
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
 }
 
      
 
      6. 
@@ -107,7 +107,7 @@ changed_cb(void *data, Evas_Object *obj, void *event_info)
 
 
      The following example shows a simple use case of the radio component.
      
 
-
      Example: Radio use case
       
+
      Example: Radio use case
    @@ -114,7 +114,7 @@ Evas_Object *map; /* Add a box to contain a map and push the box into the naviframe */ box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Map", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Map", NULL, NULL, box, NULL); /* Add a map */ map = elm_map_add(box); @@ -164,9 +164,9 @@ elm_box_pack_end(box, map); - - - + + + @@ -205,12 +205,12 @@ elm_box_pack_end(box, map); - + - + @@ -220,12 +220,12 @@ elm_box_pack_end(box, map); - + - + @@ -283,7 +283,7 @@ elm_box_pack_end(box, map); - +
    SignalDescriptionevent_infoSignalDescriptionevent_info
    clicked
    scroll,anim,startThe scrolling animation starts.The scrolling animation starts. NULL
    scroll,anim,stopThe scrolling animation stops.The scrolling animation stops. NULL
    zoom,stopThe zoom animation stops.The zoom animation stops. NULL
    zoom,changeThe zoom is changed when using an auto zoom mode.The zoom is changed when using an auto zoom mode. NULL
    The map is loaded. NULL
    @@ -305,7 +305,7 @@ elm_box_pack_end(box, map); +
    + - Multibuttonentry + Multibuttonentry @@ -32,10 +32,10 @@

    Related Info

    - +
    @@ -77,7 +77,7 @@ +
    + @@ -37,7 +37,7 @@
  • Elementary API for Mobile Native
    • - +

    Notify

    @@ -45,9 +45,9 @@

    The notify UI component displays a container in a particular region of the parent object. It can receive some content, and become automatically hidden after a certain amount of time. The popup component is very similar to the notify component, but supports many common layouts. For more information, see the Notify API.

    This feature is supported in mobile applications only.

    - +

    Basic Usage

    - +

    To use a notify component in your application:

    1. Add a notify component with the elm_notify_add() function: @@ -74,12 +74,12 @@ elm_object_content_set(notify, label);
    2. Register the callback functions.

      The following example shows how to define and register a callback for the timeout signal:

      -evas_object_smart_callback_add(notify, "timeout", timeout_cb, data);
+evas_object_smart_callback_add(notify, "timeout", timeout_cb, data);
 
-void 
+void
 timeout_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Notify timeout");
+    dlog_print(DLOG_INFO, LOG_TAG, "Notify timeout");
 }
      3. @@ -109,7 +109,7 @@ elm_notify_timeout_set(notify, 5.0); /* Add a label to notify */ label = elm_label_add(notify); -elm_object_test_set(label, "A label in notify"); +elm_object_test_set(label, "A label in notify"); evas_object_show(label); elm_object_content_set(notify, label); @@ -132,7 +132,7 @@ evas_object_show(notify);

      Using the elm_notify_align_set() function, you can set the notify component alignment.

      -

      The second and third parameters have a value between 0.0 and 1.0, meaning the alignment of the notify component's position within the parent window. The ELM_NOTIFY_ALIGN_FILL value can be used to fill the notify component in each axis direction.

      +

      The second and third parameters have a value between 0.0 and 1.0, meaning the alignment of the notify component's position within the parent window. The ELM_NOTIFY_ALIGN_FILL value can be used to fill the notify component in each axis direction.

      To align the notify object on the bottom center of the parent object:

      @@ -158,9 +158,9 @@ elm_notify_timeout_set(notify, 5.0);
 
- 
- 
- 
+
+
+
@@ -194,7 +194,7 @@ elm_notify_timeout_set(notify, 5.0);
 
  
+	
+	
 
-	Panel  
+	Panel
@@ -33,21 +33,21 @@
 			
      Related Info
      
-	
+
      
 
      Panel
      
-	
+
 
      The panel UI component can contain subobjects. It can be expanded or contracted by clicking on the button on its edge. The panel component inherits from the layout component, which means that layout functions can be used on the panel component. For more information, see the Panel API.
      
 	
      This feature is supported in mobile applications only.
      
-	
+
 
      Basic Usage
      
 
 
      To use a panel component in your application:
      
- 
+
 
        
 
      1. Add a panel with the elm_panel_add() function:
 
        @@ -67,20 +67,20 @@ elm_panel_orient_set(panel, ELM_PANEL_ORIENT_TOP);
 
         Evas_Object *button;
 
-elm_object_part_content_set(panel, "default", button);
+elm_object_part_content_set(panel, "default", button);
 
        
 
        2. 
 
 
      2. Register the callback functions.
 
        The following example shows how to define and register a callback for the scroll signal:
        
 
        -evas_object_smart_callback_add(panel, "scroll", panel_scroll_cb, data);
+evas_object_smart_callback_add(panel, "scroll", panel_scroll_cb, data);
 
-void 
+void
 panel_scroll_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    Elm_Panel_Scroll_Info *ev = event_info;
-    dlog_print(DLOG_INFO, LOG_TAG, "Panel scroll to: %f, %f\n", ev->rel_x, ev->rel_y);
+    Elm_Panel_Scroll_Info *ev = event_info;
+    dlog_print(DLOG_INFO, LOG_TAG, "Panel scroll to: %f, %f\n", ev->rel_x, ev->rel_y);
 }
 
        
 
        3. 
@@ -106,7 +106,7 @@ Evas_Object *button;
 box = elm_box_add(nf);
 evas_object_show(box);
 elm_object_content_set(nf, box);
-elm_naviframe_item_push(nf, "Panel", NULL, NULL, box, NULL);
+elm_naviframe_item_push(nf, "Panel", NULL, NULL, box, NULL);
 
 /* Add an expanded panel to (dis)appear from the top to the box */
 panel = elm_panel_add(box);
@@ -118,10 +118,10 @@ evas_object_show(panel);
 
 /* Add a button to the panel */
 button = elm_button_add(panel);
-elm_object_text_set(button, "Top Button");
+elm_object_text_set(button, "Top Button");
 evas_object_size_hint_weight_set(button, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(button, EVAS_HINT_FILL, EVAS_HINT_FILL);
-elm_object_part_content_set(panel, "default", button);
+elm_object_part_content_set(panel, "default", button);
 evas_object_show(button);
 
 /* Add a contracted panel to (dis)appear from the bottom to the box */
@@ -135,10 +135,10 @@ evas_object_show(panel);
 
 /* Add a button to the panel */
 button = elm_button_add(panel);
-elm_object_text_set(button, "Bottom Button");
+elm_object_text_set(button, "Bottom Button");
 evas_object_size_hint_weight_set(button, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(button, EVAS_HINT_FILL, EVAS_HINT_FILL);
-elm_object_part_content_set(panel, "default", button);
+elm_object_part_content_set(panel, "default", button);
 evas_object_show(button);
 
  
@@ -188,7 +188,7 @@ evas_object_show(button);
 
  
+
      
 
 
 	
+	
 	
 	
 	
 	
 
-	Photocam  
+	Photocam
 
 
 
@@ -34,10 +34,10 @@
 			
      Related Info
      
 		
 	
      
-	
+
      
 
      Photocam
      
@@ -47,12 +47,12 @@
   
      The photocam component displays high resolution photos taken from digital cameras. It provides a way to zoom in the photo, load it fast, and fit it nicely on the screen. It is optimized for the .jpeg image format and has a low memory footprint.
      
 
   
      The photocam component implements the scroller interface, which means that scroller functions can be used with the photocam component.
      
-  
+
   
      For more information, see the Photocam API.
      
-  
-  
      Figure: Photocam hierarchy
       
-
       Photocam hierarchy 
       
-  
+
+  
      Figure: Photocam hierarchy
      
+
       Photocam hierarchy 
      
+
 
      Adding a Photocam Component
      
 
 
      To create a photocam component, use the elm_photocam_add() function. You can set the image file with the elm_photocam_file_set() function.
      
@@ -61,7 +61,7 @@
 Evas_Object *photocam;
 
 photocam = elm_photocam_add(win);
-elm_photocam_file_set(photocam, "/tmp/photo.jpeg");
+elm_photocam_file_set(photocam, "/tmp/photo.jpeg");
 
 
 
      Using the Photocam Zoom
      
@@ -96,25 +96,25 @@ elm_photocam_image_region_bring_in(photocam, 200, 200, 400, 300);
 
      Using the Photocam Callbacks
      
 
 
      To receive notifications about the photocam events, listen to the following signals:
      
-
         
-   
      • clicked: The photo is clicked without dragging around.
        •  
-   
      • press: The photo is pressed.
        •  
-   
      • longpressed: The photo is pressed down for a long time without dragging around.
        •  
-   
      • clicked,double: The photo is double-clicked.
        •  
-   
      • load: The photo load begins.
        •  
-   
      • loaded: The image file load is complete for the first view (a low resolution blurry version).
        •  
-   
      • load,detail: A photo detailed data load begins.
        •  
-   
      • loaded,detail: The image file load is complete for the detailed image data (a full resolution version).
        •  
-   
      • zoom,start: The zoom animation starts.
        •  
-   
      • zoom,stop: The zoom animation stops.
        •  
-   
      • zoom,change: The zoom is changed when using an auto zoom mode.
        •  
-   
      • scroll: The content is scrolled.
        •  
-   
      • scroll,anim,start: The scrolling animation starts.
        •  
-   
      • scroll,anim,stop: The scrolling animation stops.
        •  
-   
      • scroll,drag,start: Dragging the content around starts.
        •  
-   
      • scroll,drag,stop: Dragging the content around stops.
        •  
+
          
+   
        • clicked: The photo is clicked without dragging around.
          • 
+   
        • press: The photo is pressed.
          • 
+   
        • longpressed: The photo is pressed down for a long time without dragging around.
          • 
+   
        • clicked,double: The photo is double-clicked.
          • 
+   
        • load: The photo load begins.
          • 
+   
        • loaded: The image file load is complete for the first view (a low resolution blurry version).
          • 
+   
        • load,detail: A photo detailed data load begins.
          • 
+   
        • loaded,detail: The image file load is complete for the detailed image data (a full resolution version).
          • 
+   
        • zoom,start: The zoom animation starts.
          • 
+   
        • zoom,stop: The zoom animation stops.
          • 
+   
        • zoom,change: The zoom is changed when using an auto zoom mode.
          • 
+   
        • scroll: The content is scrolled.
          • 
+   
        • scroll,anim,start: The scrolling animation starts.
          • 
+   
        • scroll,anim,stop: The scrolling animation stops.
          • 
+   
        • scroll,drag,start: Dragging the content around starts.
          • 
+   
        • scroll,drag,stop: Dragging the content around stops.
          • 
   
        
-  
+
 
        
 	Note
 	The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen.
@@ -128,15 +128,15 @@ elm_photocam_image_region_bring_in(photocam, 200, 200, 400, 300);
 void
 message_port_cb(int local_port_id, const char *remote_app_id, bundle *message)
 {
-    evas_object_smart_callback_add(photocam, "loaded", loaded_cb, data);
+    evas_object_smart_callback_add(photocam, "loaded", loaded_cb, data);
 }
 
-/* Callback for the "loaded" signal */
+/* Callback for the "loaded" signal */
 /* Called when the photo file has been loaded in a low resolution */
 void
 loaded_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The photo has been loaded\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The photo has been loaded\n");
 }
 
 
@@ -154,7 +154,7 @@ loaded_cb(void *data, Evas_Object *obj, void *event_info)
 
  
+
        
 
 
 	
+	
 	
 	
 	
 	
 
-	Plug  
+	Plug
 
 
 
@@ -34,10 +34,10 @@
 			
        Related Info
        
 		
 	
      
-
      	
+
      
 
      Plug
      
@@ -48,10 +48,10 @@
 
 
      For more information, see the Plug API.
      
 
-  
      Figure: Plug hierarchy
       
-
       Plug hierarchy 
       
+  
      Figure: Plug hierarchy
      
+
       Plug hierarchy 
      
 
-
      Adding a Plug Component
        
+
      Adding a Plug Component
      
 
 
      To create a plug component, use the elm_plug_add() function:
      
 
@@ -72,7 +72,7 @@ plug = elm_plug_add(parent);
 
      To connect to a service named plug_test on the number 0:
      
 
 
      -elm_plug_connect(plug, "plug_test", 0, EINA_FALSE);
+elm_plug_connect(plug, "plug_test", 0, EINA_FALSE);
 
      
 
 
    3. 
@@ -87,10 +87,10 @@ Evas_Object *plug_img = elm_plug_image_object_get(plug);
 	The socket to connect to must be started with the elm_win_socket_listen() function in the other process on the remote window object (remote_win):
 
       /* Create a remote window in the other process */
-Elm_Win *remote_win = elm_win_add(NULL, "Window Socket",
-                                  ELM_WIN_SOCKET_IMAGE);
-/* Create a socket named "plug_test" and listen to it */
-elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
+Elm_Win *remote_win = elm_win_add(NULL, "Window Socket",
+                                  ELM_WIN_SOCKET_IMAGE);
+/* Create a socket named "plug_test" and listen to it */
+elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
 
      
 
      4. 
 
@@ -101,11 +101,11 @@ elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
 
 
      To receive notifications about the plug events, listen to the following signals:
      
 
        
-
      • clicked: The image is clicked (press/release). 
+
      • clicked: The image is clicked (press/release).
 
        The event_info callback parameter is NULL.
        • 
-
      • image,deleted: The server side is deleted. 
+
      • image,deleted: The server side is deleted.
 
        The event_info callback parameter is NULL.
        • 
-
      • image,resized: The server side is resized. 
+
      • image,resized: The server side is resized.
 
        The event_info callback parameter is Evas_Coord_Size (2 integers).
        • 
 
      
 
@@ -117,15 +117,15 @@ elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
 
      To register and define a callback for the clicked signal:
      
 
       {
-    evas_object_smart_callback_add(plug, "clicked", clicked_cb, data);
+    evas_object_smart_callback_add(plug, "clicked", clicked_cb, data);
 }
 
-/* Callback for the "clicked" signal */
+/* Callback for the "clicked" signal */
 /* Called when the plug is clicked */
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Plug is clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Plug is clicked\n");
 }
 
      
 
@@ -143,7 +143,7 @@ clicked_cb(void *data, Evas_Object *obj, void *event_info)
 
  
+
      
 
 
 	
+	
 	
 	
 	
 	
 
-	Plug  
+	Plug
 
 
 
@@ -35,10 +35,10 @@
 		
 	
      
-	
+
      
 
      Plug
      
@@ -49,10 +49,10 @@
 
 
      For more information, see the Plug API.
      
 
-  
      Figure: Plug hierarchy
       
-
       Plug hierarchy 
       
+  
      Figure: Plug hierarchy
      
+
       Plug hierarchy 
      
 
-
      Adding a Plug Component
        
+
      Adding a Plug Component
      
 
 
      To create a plug component, use the elm_plug_add() function:
      
 
@@ -73,7 +73,7 @@ plug = elm_plug_add(parent);
 
      To connect to a service named plug_test on the number 0:
      
 
 
      -elm_plug_connect(plug, "plug_test", 0, EINA_FALSE);
+elm_plug_connect(plug, "plug_test", 0, EINA_FALSE);
 
      
 
 
    4. 
@@ -88,10 +88,10 @@ Evas_Object *plug_img = elm_plug_image_object_get(plug);
 	The socket to connect to must be started with the elm_win_socket_listen() function in the other process on the remote window object (remote_win):
 
       /* Create a remote window in the other process */
-Elm_Win *remote_win = elm_win_add(NULL, "Window Socket",
-                                  ELM_WIN_SOCKET_IMAGE);
-/* Create a socket named "plug_test" and listen to it */
-elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
+Elm_Win *remote_win = elm_win_add(NULL, "Window Socket",
+                                  ELM_WIN_SOCKET_IMAGE);
+/* Create a socket named "plug_test" and listen to it */
+elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
 
      
 
      5. 
 
@@ -102,11 +102,11 @@ elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
 
 
      To receive notifications about the plug events, listen to the following signals:
      
 
        
-
      • clicked: The image is clicked (press/release). 
+
      • clicked: The image is clicked (press/release).
 
        The event_info callback parameter is NULL.
        • 
-
      • image,deleted: The server side is deleted. 
+
      • image,deleted: The server side is deleted.
 
        The event_info callback parameter is NULL.
        • 
-
      • image,resized: The server side is resized. 
+
      • image,resized: The server side is resized.
 
        The event_info callback parameter is Evas_Coord_Size (2 integers).
        • 
 
      
 
@@ -118,15 +118,15 @@ elm_win_socket_listen(remote_win, "plug_test", 0, EINA_FALSE);
 
      To register and define a callback for the clicked signal:
      
 
       {
-    evas_object_smart_callback_add(plug, "clicked", clicked_cb, data);
+    evas_object_smart_callback_add(plug, "clicked", clicked_cb, data);
 }
 
-/* Callback for the "clicked" signal */
+/* Callback for the "clicked" signal */
 /* Called when the plug is clicked */
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Plug is clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Plug is clicked\n");
 }
 
      
 
@@ -144,7 +144,7 @@ clicked_cb(void *data, Evas_Object *obj, void *event_info)
 
  
+
      
 
 
 	
+	
 	
 	
 	
@@ -35,10 +35,10 @@
 			
      Related Info
      
 		
 	
      
-	
+
      
 
      Popup
      
@@ -62,15 +62,15 @@ popup = elm_popup_add(parent);
    
    
    5. Set the title text using the title,text part name:
 
      -elm_object_part_text_set(popup, "title,text",
-                         "Popup Title");
+elm_object_part_text_set(popup, "title,text",
+                         "Popup Title");
 
      
    
      6. 
    
    6. Set the content of the popup:
       
        
          
      • Simple text:
 
        -elm_object_text_set(popup, "Popup text");
+elm_object_text_set(popup, "Popup text");
 
        
          
        • 
          
      • Evas object:
@@ -91,25 +91,25 @@ Evas_Object *button2;
 
 /* Create the 2 buttons */
 button1 = elm_button_add(popup);
-elm_object_text_set(button1, "OK");
+elm_object_text_set(button1, "OK");
 
 button2 = elm_button_add(popup);
-elm_object_text_set(button2, "Cancel");
+elm_object_text_set(button2, "Cancel");
 
 /* Set the buttons to the action area */
-elm_object_part_content_set(popup, "button1";, button1);
-elm_object_part_content_set(popup, "button2", button2);
+elm_object_part_content_set(popup, "button1";, button1);
+elm_object_part_content_set(popup, "button2", button2);
 
    
        • 
    
      • Register the callback functions.
    
        The following example shows how to define and register a callback for the dismissed signal:
        
 
        -evas_object_smart_callback_add(popup, "dismissed", dismissed_cb, data);
+evas_object_smart_callback_add(popup, "dismissed", dismissed_cb, data);
 
 void
 dismissed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    evas_object_del(obj);
+    evas_object_del(obj);
 }
 
        
    
        • 
@@ -141,25 +141,25 @@ elm_popup_align_set(popup, ELM_NOTIFY_ALIGN_FILL, 1.0);
 evas_object_size_hint_weight_set(popup, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 
 /* Set a text to title and content part */
-elm_object_part_text_set(popup, "title,text", "Title");
-elm_object_text_set(popup, "This Popup has title area, content area and action area set, "
-                           "action area has two buttons OK and Cancel.");
+elm_object_part_text_set(popup, "title,text", "Title");
+elm_object_text_set(popup, "This Popup has title area, content area and action area set, "
+                           "action area has two buttons OK and Cancel.");
 
-/* Add an "OK" button to popup */
+/* Add an "OK" button to popup */
 button = elm_button_add(popup);
-elm_object_style_set(button, "popup");
-elm_object_text_set(button, "OK");
-elm_object_part_content_set(popup, "button1", button);
+elm_object_style_set(button, "popup");
+elm_object_text_set(button, "OK");
+elm_object_part_content_set(popup, "button1", button);
 
-/* Add a "Cancel" button to popup */
+/* Add a "Cancel" button to popup */
 button = elm_button_add(popup);
-elm_object_style_set(button, "popup");
-elm_object_text_set(button, "Cancel");
-elm_object_part_content_set(popup, "button2", button);
+elm_object_style_set(button, "popup");
+elm_object_text_set(button, "Cancel");
+elm_object_part_content_set(popup, "button2", button);
 
 /* Add a callback function to popup */
 eext_object_event_callback_add(popup, EEXT_CALLBACK_BACK, eext_popup_back_cb, NULL);
-evas_object_smart_callback_add(popup, "block,clicked", popup_block_clicked_cb, NULL);
+evas_object_smart_callback_add(popup, "block,clicked", popup_block_clicked_cb, NULL);
 
 evas_object_show(popup);
 
@@ -233,7 +233,7 @@ elm_popup_dismiss(popup);
    
      7. 
 
 
      SignalDescriptionevent_infoSignalDescriptionevent_info
 
      
 
      
 timeout
 
 
 
 	
 	
 	
 	
 
 
 
 		
 	
 
 
 
 
 
 
 
 
 
 
      
 
      
 
-
      The theme_bg style is a unique style for supporting the genlist component's banded effect.
      
+
      The theme_bg style is a unique style for supporting the genlist component's banded effect.
      
 
 
      Callbacks
      
 
@@ -284,7 +284,7 @@ elm_popup_dismiss(popup);
 
  
+
    + @@ -40,7 +40,7 @@
  • Elementary API for Wearable Native
    • - +

    Popup

    @@ -56,10 +56,10 @@

    For more information, see the Popup API.

    -

    Figure: Popup component

    +

    Figure: Popup component

    Popup component

    - -

    Figure: Popup hierarchy

    + +

    Figure: Popup hierarchy

    Popup hierarchy

    Adding a Popup Component

    @@ -99,7 +99,7 @@ popup = elm_popup_add(parent);

    To set the style to, for example, toast:

    -elm_object_style_set(popup, "toast");
+elm_object_style_set(popup, "toast");
    @@ -114,7 +114,7 @@ elm_object_style_set(popup, "toast");
  • Set the title text as Test popup using the title,text part name.
    • -elm_object_part_text_set(popup, "title,text", "Test popup");
+elm_object_part_text_set(popup, "title,text", "Test popup");
  • @@ -122,7 +122,7 @@ elm_object_part_text_set(popup, "title,text", "Test popup");
    • Simple text: 
      -elm_object_text_set(popup, "simple text");
+elm_object_text_set(popup, "simple text");
    • Evas object: @@ -143,20 +143,20 @@ Evas_Object *button2; /* Create the 2 buttons */ button1 = elm_button_add(popup); -elm_object_style_set(button1, "popup"); +elm_object_style_set(button1, "popup"); evas_object_size_hint_weight_set(button1, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -elm_object_text_set(button1, "Cancel"); +elm_object_text_set(button1, "Cancel"); button2 = elm_button_add(popup) -elm_object_style_set(button2, "popup"); +elm_object_style_set(button2, "popup"); evas_object_size_hint_weight_set(button2, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -elm_object_text_set(button2, "OK"); +elm_object_text_set(button2, "OK"); evas_object_show(popup); /* Set the buttons to the action area */ -elm_object_part_content_set(popup, "button1", button1); -elm_object_part_content_set(popup, "button2", button2); +elm_object_part_content_set(popup, "button1", button1); +elm_object_part_content_set(popup, "button2", button2);
      • @@ -168,11 +168,11 @@ elm_object_part_content_set(popup, "button2", button2);

      Set the circular popup item and layout style:

       /* Set the item style */
-elm_object_style_set(popup, "circle");
+elm_object_style_set(popup, "circle");
 
 /* Set the layout style */
 layout = elm_layout_add(popup);
-elm_layout_theme_set(layout, "layout", "popup", "content/circle/buttons2");
+elm_layout_theme_set(layout, "layout", "popup", "content/circle/buttons2");
    • @@ -180,7 +180,7 @@ elm_layout_theme_set(layout, "layout", "popup", "conten

      Set the title text to Test popup using the elm.text.title part name:

       /* Set the title text */
-elm_object_part_text_set(layout, "elm.text.title", "Text popup");
+elm_object_part_text_set(layout, "elm.text.title", "Text popup");
    • @@ -188,7 +188,7 @@ elm_object_part_text_set(layout, "elm.text.title", "Text popup&qu
      • Simple text: 
        -elm_object_part_text_set(layout, "elm.text.content", "Test popup");
+elm_object_part_text_set(layout, "elm.text.content", "Test popup");
      • Evas object: @@ -215,24 +215,24 @@ Evas_Object *icon; /* Create the 2 buttons */ button1 = elm_button_add(popup); -elm_object_style_set(button1, "popup/circle/left"); +elm_object_style_set(button1, "popup/circle/left"); icon = elm_image_add(button1); -elm_image_file_set(icon, ICON_DIR"/b_option_list_icon_share.png", NULL); +elm_image_file_set(icon, ICON_DIR"/b_option_list_icon_share.png", NULL); evas_object_size_hint_weight_set(icon, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -elm_object_part_content_set(button1, "elm.swallow.content", icon); +elm_object_part_content_set(button1, "elm.swallow.content", icon); evas_object_show(icon); button2 = elm_button_add(popup); -elm_object_style_set(button2, "popup/circle/right"); +elm_object_style_set(button2, "popup/circle/right"); icon = elm_image_add(button2); -elm_image_file_set(icon, ICON_DIR"/b_option_list_icon_delete.png", NULL); +elm_image_file_set(icon, ICON_DIR"/b_option_list_icon_delete.png", NULL); evas_object_size_hint_weight_set(icon, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -elm_object_part_content_set(button2, "elm.swallow.content", icon); +elm_object_part_content_set(button2, "elm.swallow.content", icon); evas_object_show(icon); /* Set the buttons to the action area */ -elm_object_part_content_set(popup, "button1", button1); -elm_object_part_content_set(popup, "button2", button2); +elm_object_part_content_set(popup, "button1", button1); +elm_object_part_content_set(popup, "button2", button2);
        • @@ -265,13 +265,13 @@ elm_popup_timeout_set(popup, 5.0); 
         {
-    evas_object_smart_callback_add(popup, "timeout", _timeout_cb, data);
+    evas_object_smart_callback_add(popup, "timeout", _timeout_cb, data);
 }
 
 static void
 _timeout_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Timeout \n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Timeout \n");
 }
        @@ -289,7 +289,7 @@ _timeout_cb(void *data, Evas_Object *obj, void *event_info) +
    • + - Progressbar + Progressbar @@ -35,10 +35,10 @@

    Related Info

    - +

    Progressbar

    @@ -62,15 +62,15 @@ progressbar = elm_progressbar_add(parent);
    • Set a style to the progressbar with the elm_object_style_set() function. If you use the default style, you can skip this step. 
      -elm_object_style_set(progressbar, "pending");
+elm_object_style_set(progressbar, "pending");
    • Set a label to the progressbar with the elm_object_text_set() or elm_object_part_text_set() function: 
       /* Default style (elm.text.top.right) */
-elm_object_text_set(progressbar, "text");
+elm_object_text_set(progressbar, "text");
 
-elm_object_part_text_set(progressbar, "elm.text.bottom.left", "text");
+elm_object_part_text_set(progressbar, "elm.text.bottom.left", "text");
    @@ -93,12 +93,12 @@ elm_progressbar_pulse(progressbar, EINA_TRUE);
  • Register the callback functions.

    The following example shows how to define and register a callback for the changed signal:

    -evas_object_smart_callback_add(progressbar, "changed", changed_cb, data);
+evas_object_smart_callback_add(progressbar, "changed", changed_cb, data);
 
-void 
+void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
 }
    • @@ -123,9 +123,9 @@ Evas_Object *progressbar; /* Add a box to contain the progressbar and push the box into the naviframe */ box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Progressbar", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Progressbar", NULL, NULL, box, NULL); -/* Add a progressbar and set a "default" style */ +/* Add a progressbar and set a "default" style */ progressbar = elm_progressbar_add(box); /* Set the progressbar alignment. The progressbar fills whole parent area */ @@ -134,13 +134,13 @@ evas_object_size_hint_align_set(progressbar, EVAS_HINT_FILL, EVAS_HINT_FILL); evas_object_size_hint_weight_set(progressbar, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); /* Set the progressbar format */ -elm_progressbar_unit_format_set(progressbar, "%1.2f%%"); +elm_progressbar_unit_format_set(progressbar, "%1.2f%%"); /* Set the progressbar value */ elm_progressbar_value_set(progressbar, 0.6); /* Set a text to the progressbar */ -elm_object_text_set(progressbar, "progressbar"); +elm_object_text_set(progressbar, "progressbar"); evas_object_show(progressbar); elm_box_pack_end(box, progressbar); @@ -167,7 +167,7 @@ elm_box_pack_end(box, progressbar); 
     /* Supported style: default */
 elm_progressbar_value_set(progressbar, 0.2);
-
    +

  • Read the current value:

    @@ -182,26 +182,26 @@ double value = elm_progressbar_value_get(progressbar);
  • Set a label to the progressbar with the elm_object_text_set() function, if the style supports a text part. 
     /* Supported styles: default, pending */
-elm_object_text_set(progressbar, "progressbar");
+elm_object_text_set(progressbar, "progressbar");
    • -
  • According to the style, the elm_object_part_text_set() function is used in order to do the setting in the other location. +
  • According to the style, the elm_object_part_text_set() function is used in order to do the setting in the other location. 
    -elm_object_part_text_set(progressbar, "elm.text.bottom.left", "progressbar");
+elm_object_part_text_set(progressbar, "elm.text.bottom.left", "progressbar");

  • Set the unit label with the elm_progressbar_unit_format_set() function.

    To set the unit label to be a float number with 2 decimals:

    -elm_progressbar_unit_format_set(progressbar, "%1.2f%%");
+elm_progressbar_unit_format_set(progressbar, "%1.2f%%");

    If you set the elm.text.bottom.right text part, you cannot use a unit label. You can choose 1 unit label or the bottom right label. The default unit label format is %.0f%%.

  • Invert the progressbar. -

    In the inverted mode the high values are on the left and the low values on the right.

    +

    In the inverted mode the high values are on the left and the low values on the right.

     /* Supported style: default */
 elm_progressbar_inverted_set(progressbar, EINA_TRUE);
@@ -308,7 +308,7 @@ elm_progressbar_inverted_set(progressbar, EINA_TRUE);
 
  
+
    • + - Progressbar + Progressbar @@ -36,10 +36,10 @@
    - +

    Progressbar

    @@ -60,15 +60,15 @@ progressbar = elm_progressbar_add(parent);
  • Set a style available for a rectangular or circular UI screen.

    Set a style to the progressbar with the elm_object_style_set() function. If you use the default style, you can skip this step.

    -elm_object_style_set(progressbar, "pending_list");
+elm_object_style_set(progressbar, "pending_list");
  • Activate the progressbar:
      -
    • Set the progressbar pulse mode to activate the progressbar with the elm_progressbar_pulse_set() function: +
    • Set the progressbar pulse mode to activate the progressbar with the elm_progressbar_pulse_set() function: 
       elm_progressbar_pulse_set(progressbar,
-                          EINA_TRUE);
+                          EINA_TRUE);

      The pulse mode makes the progressbar loop infinitely between the start and end position. If you activate the pulse mode in the default style, the unit is invisible.

      • @@ -82,12 +82,12 @@ elm_progressbar_pulse(progressbar, EINA_TRUE);
    • Register the callback functions.

      The following example shows how to define and register a callback for the changed signal:

      -evas_object_smart_callback_add(progressbar, "changed", changed_cb, data);
+evas_object_smart_callback_add(progressbar, "changed", changed_cb, data);
 
-void 
+void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
 }
      • @@ -110,9 +110,9 @@ Evas_Object *progressbar; /* Add a box to contain the progressbar and push the box into the naviframe */ box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Progressbar", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Progressbar", NULL, NULL, box, NULL); -/* Add a progressbar and set a "default" style */ +/* Add a progressbar and set a "default" style */ progressbar = elm_progressbar_add(box); /* Set the progressbar alignment. The progressbar fills whole parent area */ @@ -157,7 +157,7 @@ double value = elm_progressbar_value_get(progressbar);
  • Invert the progressbar. -

    In the inverted mode the high values are on the left and the low values on the right.

    +

    In the inverted mode the high values are on the left and the low values on the right.

     /* Supported style: default */
 elm_progressbar_inverted_set(progressbar, EINA_TRUE);
@@ -213,7 +213,7 @@ src="../../../images/progressbar_process_small_wn.png" />
    (circular)
    		•
    elm/progressbar/horizontal/process/popup/smallelm/progressbar/horizontal/pending

    (circular)
    @@ -125,13 +125,13 @@ Evas_Object *group; box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Radio", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Radio", NULL, NULL, box, NULL); /* Radio 1 */ /* Add a radio */ radio = elm_radio_add(box); /* Configure the radio */ -elm_object_text_set(radio, "Radio 1"); +elm_object_text_set(radio, "Radio 1"); elm_radio_state_value_set(radio, 1); evas_object_show(radio); elm_box_pack_end(box, radio); @@ -140,7 +140,7 @@ group = radio; /* Radio 2 */ radio = elm_radio_add(box); -elm_object_text_set(radio, "Radio 2"); +elm_object_text_set(radio, "Radio 2"); elm_radio_state_value_set(radio, 2); evas_object_show(radio); elm_box_pack_end(box, radio); @@ -149,7 +149,7 @@ elm_radio_group_add(radio, group); /* Radio 3 */ radio = elm_radio_add(box); -elm_object_text_set(radio, "Radio 3"); +elm_object_text_set(radio, "Radio 3"); elm_radio_state_value_set(radio, 3); evas_object_show(radio); elm_box_pack_end(box, radio); @@ -195,19 +195,19 @@ elm_radio_value_set(group, 1);

    You can register callback functions connected to the following signals for a radio object.

    Table: Radio callback signals

    -
    +
    - - - + + + - +
    CallbackDescriptionevent_infoCallbackDescriptionevent_info
    changed The radio button is selected. NULL
    @@ -229,7 +229,7 @@ elm_radio_value_set(group, 1); +
    + @@ -38,7 +38,7 @@
  • Elementary API for Wearable Native
    • -
    +

    Radio

    @@ -46,9 +46,9 @@

    The radio UI component displays 1 or more options and allows users to select 1 of them. For more information, see the Radio API.

    This feature is supported in wearable applications only.

    - +

    Basic Usage

    - +

    To use a radio component in your application:

    1. Add a radio button with the elm_radio_add() function: @@ -76,12 +76,12 @@ elm_radio_group_add(radio, group);
    2. Register the callback functions.

      The following example shows how to define and register a callback for the changed signal:

      -evas_object_smart_callback_add(radio, "changed", changed_cb, data);
+evas_object_smart_callback_add(radio, "changed", changed_cb, data);
 
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The value has changed\n");
 }
      3. @@ -107,7 +107,7 @@ Evas_Object *group; box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Radio", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Radio", NULL, NULL, box, NULL); /* Radio 1 */ /* Add a radio */ @@ -222,7 +222,7 @@ elm_radio_value_set(group, 1); +
    + @@ -37,22 +37,22 @@
  • Elementary API for Mobile Native
    • - +

    Segmentcontrol

    This feature is supported in mobile applications only.

    - +

    The segmentcontrol component consists of several segment items. A segment item is similar to a discrete 2-state button. Any time, only one segment item can be selected. A segment item is composed of a label (text) and an icon.

    The segmentcontrol component inherits from the layout component, which means that layout functions can be used on the segmentcontrol component.

    For more information, see the SegmentControl API.

    -

    Figure: Segmentcontrol component (with text on left and with icons on right)

    +

    Figure: Segmentcontrol component (with text on left and with icons on right)

    Segmentcontrol with text Segmentcontrol with icons

    - +

    Figure: Segmentcontrol hierarchy

    Segmentcontrol hierarchy

    @@ -72,22 +72,22 @@ segcontrol = elm_segment_control_add(parent);

    To manage segmentcontrol items:

      -
    • Add items to the segmentcontrol component with the elm_segment_control_item_add() function. +
    • Add items to the segmentcontrol component with the elm_segment_control_item_add() function.

      In the following example, 4 items containing only text labels (no icons) are added:

       Elm_Object_Item *it;
 int count;
 int idx;
 
-elm_segment_control_item_add(segcontrol, NULL, "item1");
-elm_segment_control_item_add(segcontrol, NULL, "item2");
-elm_segment_control_item_add(segcontrol, NULL, "item3");
-it = elm_segment_control_item_add(segcontrol, NULL, "item4");
+elm_segment_control_item_add(segcontrol, NULL, "item1");
+elm_segment_control_item_add(segcontrol, NULL, "item2");
+elm_segment_control_item_add(segcontrol, NULL, "item3");
+it = elm_segment_control_item_add(segcontrol, NULL, "item4");

      To insert an item at a specific position starting from 0:

      -elm_segment_control_item_insert_at(segcontrol, NULL, "item7", 2);
+elm_segment_control_item_insert_at(segcontrol, NULL, "item7", 2);
    • Set the state of the item to selected: @@ -135,17 +135,17 @@ elm_object_disabled_set(segcontrol, EINA_TRUE);

      To register and define a callback for the changed signal:

       {
-    evas_object_smart_callback_add(segcontrol, "changed", changed_cb, data);
+    evas_object_smart_callback_add(segcontrol, "changed", changed_cb, data);
 }
 
-/* Callback for the "changed" signal */
+/* Callback for the "changed" signal */
 /* Called when the selected segment item changes */
 void
 changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    Elm_Object_Item *it = event_info;
-    dlog_print(DLOG_INFO, LOG_TAG, "The selected segment item is %s\n",
-               elm_object_item_text_get(it));
+    Elm_Object_Item *it = event_info;
+    dlog_print(DLOG_INFO, LOG_TAG, "The selected segment item is %s\n",
+               elm_object_item_text_get(it));
 }
      @@ -163,7 +163,7 @@ changed_cb(void *data, Evas_Object *obj, void *event_info) +
    + @@ -38,7 +38,7 @@
  • Elementary API for Mobile Native
    • - +

    Slider

    @@ -63,15 +63,15 @@ slider = elm_slider_add(parent);
    • Set the slider style: 
      -/* Default: "default" */
-elm_object_style_set(slider, "default");
+/* Default: "default" */
+elm_object_style_set(slider, "default");
    • Set other options. 
       elm_slider_inverted_set(slider, EINA_FALSE);
 elm_slider_indicator_show_set(slider, EINA_TRUE);
-elm_slider_indicator_format_set(slider, "%.1f");
+elm_slider_indicator_format_set(slider, "%.1f");
    @@ -79,13 +79,13 @@ elm_slider_indicator_format_set(slider, "%.1f");
  • Register the callback functions.

    The following example shows how to define and register a callback for the changed signal:

    -evas_object_smart_callback_add(slider, "changed", slider_changed_cb, 0);
+evas_object_smart_callback_add(slider, "changed", slider_changed_cb, 0);
 
 static void
 slider_changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    double v = elm_slider_value_get(obj);
-    dlog_print(DLOG_INFO, LOG_TAG, "The slider value has changed: %0.1f\n", v);
+    double v = elm_slider_value_get(obj);
+    dlog_print(DLOG_INFO, LOG_TAG, "The slider value has changed: %0.1f\n", v);
 }
    • @@ -108,14 +108,14 @@ Evas_Object *nf; /* (win - conformant - naviframe) */ box = elm_box_add(nf); -elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); /* Add a slider */ slider = elm_slider_add(box); evas_object_size_hint_align_set(slider, EVAS_HINT_FILL, 0.5); /* Set a style */ -elm_object_style_set(slider, "center_point"); +elm_object_style_set(slider, "center_point"); /* Set the slider range */ elm_slider_min_max_set(slider, 0.0, 10.0); @@ -155,16 +155,16 @@ Evas_Object *nf; Evas_Object *box; /* Add a box to contain a slider */ box = elm_box_add(nf); -elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); /* Add a slider */ slider = elm_slider_add(box); evas_object_size_hint_align_set(slider, EVAS_HINT_FILL, 0.5); /* Set styles in various ways */ -elm_object_style_set(slider, "default"); +elm_object_style_set(slider, "default"); elm_slider_indicator_show_set(slider, EINA_TRUE); -elm_slider_indicator_format_set(slider, "%.2f"); +elm_slider_indicator_format_set(slider, "%.2f"); /* Set the slider range */ elm_slider_min_max_set(slider, 0.0, 10.0); @@ -198,7 +198,7 @@ Evas_Object *nf; Evas_Object *box; box = elm_box_add(nf); -elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); /* Add a slider */ slider = elm_slider_add(box); @@ -234,13 +234,13 @@ elm_box_pack_end(box, slider); 
     box = elm_box_add(nf);
-elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL);
+elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL);
 
 /* Add a slider */
 slider = elm_slider_add(box);
 evas_object_size_hint_align_set(slider, EVAS_HINT_FILL, 0.5);
 
-elm_object_style_set(slider, "warning");
+elm_object_style_set(slider, "warning");
 elm_slider_inverted_set(slider, EINA_TRUE);
 
 evas_object_show(slider);
@@ -346,7 +346,7 @@ elm_box_pack_end(box, slider);
 
  
+
    + @@ -38,7 +38,7 @@
  • Elementary API for Wearable Native
    • - +

    Slider

    @@ -64,9 +64,9 @@ slider = elm_slider_add(parent);
  • Set the slider indicator: 
     elm_slider_indicator_show_set(slider,
-                              EINA_TRUE);
+                              EINA_TRUE);
 elm_slider_indicator_format_set(slider,
-                                "%.0f");
+                                "%.0f");
  • Set the range and value of the slider: @@ -81,13 +81,13 @@ elm_slider_value_set(slider, 5.0);
  • Register the callback functions.

    The following example shows how to define and register a callback for the changed signal:

    -evas_object_smart_callback_add(slider, "changed", slider_changed_cb, NULL);
+evas_object_smart_callback_add(slider, "changed", slider_changed_cb, NULL);
 
 void
 slider_changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    double _val = elm_slider_value_get(obj);
-    dlog_print(DLOG_INFO, LOG_TAG, "Slider value changed. %0.1f\n", _val);
+    double _val = elm_slider_value_get(obj);
+    dlog_print(DLOG_INFO, LOG_TAG, "Slider value changed. %0.1f\n", _val);
 }
    • @@ -110,14 +110,14 @@ Evas_Object *nf; /* (win - conformant - naviframe) */ box = elm_box_add(nf); -elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); +elm_naviframe_item_push(nf, "Slider", NULL, NULL, box, NULL); /* Add a slider */ slider = elm_slider_add(box); evas_object_size_hint_align_set(slider, EVAS_HINT_FILL, 0.5); /* Indicator shows the value of the slider */ elm_slider_indicator_show_set(slider, EINA_TRUE); -elm_slider_indicator_format_set(slider, "%.0f"); +elm_slider_indicator_format_set(slider, "%.0f"); /* Set the slider range */ elm_slider_min_max_set(slider, 0.0, 10.0); @@ -211,7 +211,7 @@ elm_box_pack_end(box, slider); +
    + - Spinner + Spinner @@ -35,10 +35,10 @@

    Related Info

    - +

    Spinner

    @@ -50,11 +50,11 @@

    The spinner component inherits from the layout component, which means that layout functions can be used on the spinner component.

    For more information, see the Spinner API.

    - -

    Figure: Spinner component

    + +

    Figure: Spinner component

    Spinner component

    - -

    Figure: Spinner hierarchy

    + +

    Figure: Spinner hierarchy

    Spinner hierarchy

    Adding a Spinner Component

    @@ -95,7 +95,7 @@ spin = elm_spinner_add(parent);

    Set the spinner style with the elm_object_style_set() function.

    To set the style to, for example, vertical:

    -elm_object_style_set(spinner, "vertical");
+elm_object_style_set(spinner, "vertical");
  • @@ -113,7 +113,7 @@ char *style = elm_object_style_get(spinner);

  • Set the label format:

    -elm_spinner_label_format_set(spin, "%1.2f meters");
+elm_spinner_label_format_set(spin, "%1.2f meters");
  • @@ -149,9 +149,9 @@ elm_spinner_interval_set(spin, 0.1); Evas_Object *spin2 = elm_spinner_add(parent); elm_spinner_min_max_set(spin2, 1, 3); -elm_spinner_special_value_add(spin2, 1, "One"); -elm_spinner_special_value_add(spin2, 2, "Two"); -elm_spinner_special_value_add(spin2, 3, "Three"); +elm_spinner_special_value_add(spin2, 1, "One"); +elm_spinner_special_value_add(spin2, 2, "Two"); +elm_spinner_special_value_add(spin2, 3, "Three");
    • @@ -174,15 +174,15 @@ elm_spinner_special_value_add(spin2, 3, "Three"); 
     {
-    evas_object_smart_callback_add(spin, "delay,changed", delay_changed_cb, data);
+    evas_object_smart_callback_add(spin, "delay,changed", delay_changed_cb, data);
 }
 
-/* Callback for the "delay,changed" signal */
+/* Callback for the "delay,changed" signal */
 /* Called a short time after the spinner value changes */
 void
 delay_changed_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "The spinner value has changed\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "The spinner value has changed\n");
 }
    @@ -200,7 +200,7 @@ delay_changed_cb(void *data, Evas_Object *obj, void *event_info) +
    + - Toolbar + Toolbar @@ -35,10 +35,10 @@

    Related Info

    - +

    Toolbar

    @@ -47,9 +47,9 @@

    The toolbar UI component has a scrollable list of items which can be selected. Only one item can be selected at a time. For more information, see the Toolbar API.

    This feature is supported in mobile applications only.

    - +

    Basic Usage

    - +

    To use a toolbar component in your application:

    1. Add a toolbar with the elm_toolbar_add() function: @@ -60,12 +60,12 @@ toolbar = elm_toolbar_add(parent);
    2. Configure the toolbar options.
      3. -
    3. Append items to the toolbar with elm_toolbar_item_append() function. The function takes 5 parameters: the pointer of the toolbar, a file path of an icon, a text, a callback function to call when the item is clicked, and the parameter passed to the callback. +
    4. Append items to the toolbar with elm_toolbar_item_append() function. The function takes 5 parameters: the pointer of the toolbar, a file path of an icon, a text, a callback function to call when the item is clicked, and the parameter passed to the callback. 
      -elm_toolbar_item_append(toolbar, "icon.png",
-                        "Tab",
-                        _item_selected_cb,
-                        NULL);
+elm_toolbar_item_append(toolbar, "icon.png",
+                        "Tab",
+                        _item_selected_cb,
+                        NULL);

      The following example shows how to add 2 items and define callbacks for when they are clicked:

      @@ -74,21 +74,21 @@ elm_toolbar_item_append(toolbar, "icon.png", Elm_Object_Item *home_it; Elm_Object_Item *help_it; -home_it = elm_toolbar_item_append(toolbar, "home", "Home", -                                  _home_item_pressed_cb, NULL); -help_it = elm_toolbar_item_append(toolbar, "help", "Help", -                                  _help_item_pressed_cb, NULL); - +home_it = elm_toolbar_item_append(toolbar, "home", "Home", + _home_item_pressed_cb, NULL); +help_it = elm_toolbar_item_append(toolbar, "help", "Help", + _help_item_pressed_cb, NULL); + static void _home_item_pressed_cb(void *data, Evas_Object *obj, void *event_info) { -    dlog_print(DLOG_INFO, LOG_TAG, "Home item clicked \n"); + dlog_print(DLOG_INFO, LOG_TAG, "Home item clicked \n"); } static void _help_item_pressed_cb(void *data, Evas_Object *obj, void *event_info) { -    dlog_print(DLOG_INFO, LOG_TAG, "Help item clicked \n"); + dlog_print(DLOG_INFO, LOG_TAG, "Help item clicked \n"); }
      5. @@ -96,16 +96,16 @@ _help_item_pressed_cb(void *data, Evas_Object *obj, void *event_info)
    5. Register the callback functions.

      The following example shows how to define and register a callback for the clicked signal:

      -evas_object_smart_callback_add(toolbar, "clicked", clicked_cb, data);
+evas_object_smart_callback_add(toolbar, "clicked", clicked_cb, data);
 
-/* Callback for the "clicked" signal */
+/* Callback for the "clicked" signal */
 /* Called when a toolbar item is double-clicked and selected */
 void
 clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    Elm_Toolbar_Item * item = event_info;
+    Elm_Toolbar_Item * item = event_info;
 
-    dlog_print(DLOG_INFO, LOG_TAG, "Item clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Item clicked\n");
 }
      @@ -114,7 +114,7 @@ clicked_cb(void *data, Evas_Object *obj, void *event_info)

      The following example shows a simple use case of the toolbar component.

      -

      Example: Toolbar use case

      +

      Example: Toolbar use case

      @@ -125,25 +125,25 @@ Evas_Object *conf; Evas_Object *nf; Evas_Object *tb; Elm_Object_Item *nf_it; - + /* Starting right after the basic EFL UI layout code */ /* win - conformant - naviframe */ - + /* Add a toolbar */ tb = elm_toolbar_add(nf); evas_object_show(tb); - + /* Configure the toolbar */ elm_toolbar_shrink_mode_set(tb, ELM_TOOLBAR_SHRINK_EXPAND); elm_toolbar_transverse_expanded_set(tb, EINA_TRUE); - + /* Append items */ -elm_toolbar_item_append(tb, NULL, "Tab1", NULL, NULL); -elm_toolbar_item_append(tb, NULL, "Tab2", NULL, NULL); - +elm_toolbar_item_append(tb, NULL, "Tab1", NULL, NULL); +elm_toolbar_item_append(tb, NULL, "Tab2", NULL, NULL); + /* Set the toolbar as a part of the naviframe item */ -nf_it = elm_naviframe_item_push(nf, "Test", NULL, NULL, NULL, "tabbar/notitle"); -elm_object_item_part_content_set(nf_it, "tabbar", tb); +nf_it = elm_naviframe_item_push(nf, "Test", NULL, NULL, NULL, "tabbar/notitle"); +elm_object_item_part_content_set(nf_it, "tabbar", tb);
      @@ -152,7 +152,7 @@ elm_object_item_part_content_set(nf_it, "tabbar", tb);
      - +

      Options

      You can set the shrink and select mode of the toolbar, and set the items to be displayed homogeneously. You can also define a state for the toolbar item.

      @@ -171,9 +171,9 @@ elm_object_item_part_content_set(nf_it, "tabbar", tb); 
       elm_toolbar_shrink_mode_set(toolbar, ELM_TOOLBAR_SHRINK_EXPAND);
      - +

      The following examples illustrate the shrink modes.

      - +

      Table: Shrink mode example

      @@ -202,9 +202,9 @@ elm_toolbar_shrink_mode_set(toolbar, ELM_TOOLBAR_SHRINK_EXPAND);
    6. ELM_OBJECT_SELECT_MODE_NONE
    7. ELM_OBJECT_SELECT_MODE_DISPLAY_ONLY
      8. - +

      To set a select mode:

      - + 
       elm_toolbar_select_mode_set(toolbar, ELM_OBJECT_SELECT_MODE_ALWAYS);
      @@ -216,30 +216,30 @@ elm_toolbar_select_mode_set(toolbar, ELM_OBJECT_SELECT_MODE_ALWAYS); 
       elm_toolbar_homogeneous_set(toolbar, EINA_FALSE);
      - +

      Item State

      - +

      You can define 2 or more states for an item. Each state has its own icon, label, and function to call when an item is clicked.

      - +

      To create 2 states to the an item with the same icon but 2 different labels:

      - + 
       Elm_Object_Item *it;
-it = elm_toolbar_item_append(toolbar, NULL, "Tab1", NULL, NULL);
- 
-elm_toolbar_item_state_add(it, "icon.png", "State 1", _item_pressed_cb, NULL);
-elm_toolbar_item_state_add(it, "icon.png", "State 2", _item_pressed_cb, NULL);
+it = elm_toolbar_item_append(toolbar, NULL, "Tab1", NULL, NULL);
+
+elm_toolbar_item_state_add(it, "icon.png", "State 1", _item_pressed_cb, NULL);
+elm_toolbar_item_state_add(it, "icon.png", "State 2", _item_pressed_cb, NULL);

      You can cycle through the item states to set the state you want:

       elm_toolbar_item_state_set(it, elm_toolbar_item_state_next(it));
      - +

      Styles

      To set the style to navigationbar:

      -elm_object_style_set(toolbar, "navigationbar");
+elm_object_style_set(toolbar, "navigationbar");

      The following table lists the available component styles.

      @@ -280,14 +280,14 @@ elm_object_style_set(toolbar, "navigationbar"); - + - +
      elm.text elm.swallow.iconThis style is for the toolbar's item. Use the elm_toolbar_item_append() function to set the text and the icon.This style is for the toolbar's item. Use the elm_toolbar_item_append() function to set the text and the icon.
      elm/toolbar/item/navigationbar elm.text N/AThis style is for the toolbar's item. Use the elm_toolbar_item_append() function to set the text and the icon.This style is for the toolbar's item. Use the elm_toolbar_item_append() function to set the text and the icon.
      @@ -296,13 +296,13 @@ elm_object_style_set(toolbar, "navigationbar");

      You can register callback functions connected to the following signals for a toolbar object.

      -

      Table: Toolbar callback signals

      +

      Table: Toolbar callback signals

      - - - + + + @@ -359,7 +359,7 @@ elm_object_style_set(toolbar, "navigationbar"); - +
      SignalDescriptionevent_infoSignalDescriptionevent_info
      clickedThe user stops dragging the toolbar. NULL
      @@ -381,7 +381,7 @@ elm_object_style_set(toolbar, "navigationbar"); +
      + - Tooltip + Tooltip @@ -34,16 +34,16 @@

      Related Info

    -
    +

    Tooltip

    The tooltip component is a smart object that shows content in a frame when the mouse hovers over the parent object. It provides tips or information about the parent object. A tooltip component is not a UI component as such, so it does not emit signals. For more information, see the Tooltip API.

    - +

    This feature is supported in mobile applications only.

    Basic Usage

    @@ -61,8 +61,8 @@ Evas_Object *button = elm_button_add(parent); evas_object_show(button); - -elm_object_tooltip_text_set(button, "The tooltip text"); + +elm_object_tooltip_text_set(button, "The tooltip text");
  • You can set content to the tooltip using the elm_object_tooltip_content_cb_set() function. @@ -71,18 +71,18 @@ elm_object_tooltip_text_set(button, "The tooltip text"); 
     elm_object_tooltip_content_cb_set(obj, tooltip_content_cb,
-                                  data, tooltip_content_del_cb);
+                                  data, tooltip_content_del_cb);
 
 Evas_Object*
 tooltip_content_cb(void *data, Evas_Object *obj, Evas_Object *tooltip)
 {
-    /* Create the tooltip content */
+    /* Create the tooltip content */
 }
 
-void 
+void
 tooltip_content_del_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    /* Destroy the tooltip content */
+    /* Destroy the tooltip content */
 }
    • @@ -91,7 +91,7 @@ tooltip_content_del_cb(void *data, Evas_Object *obj, void *event_info)
  • Set a style to the tooltip with the elm_object_tooltip_style_set() function. If you use the default style, you can skip this step. 
    -elm_object_tooltip_style_set(obj, "transparent");
+elm_object_tooltip_style_set(obj, "transparent");
  • @@ -120,7 +120,7 @@ elm_object_tooltip_unset(obj);

    • The following example shows a simple use case of the tooltip component on a button component.

    - +

    Example: Tooltip use case

    @@ -133,7 +133,7 @@ Evas_Object *nf; Evas_Object *box; Evas_Object *button; Evas_Object *icon; - + /* Starting right after the basic EFL UI layout code */ /* (win - conformant - naviframe) */ @@ -141,15 +141,15 @@ box = elm_box_add(nf); /* Add a button and set a style */ button = elm_button_add(box); -elm_object_style_set(button, "circle"); +elm_object_style_set(button, "circle"); /* Add an icon and set it as a content */ icon = elm_icon_add(button); -elm_icon_standard_set(icon, "home"); -elm_object_part_content_set(button, "icon", icon); +elm_icon_standard_set(icon, "home"); +elm_object_part_content_set(button, "icon", icon); /* Set a tooltip on a button */ -elm_object_tooltip_text_set(button, "The tooltip text"); +elm_object_tooltip_text_set(button, "The tooltip text"); elm_box_pack_end(box, button); evas_object_show(button); @@ -163,7 +163,7 @@ evas_object_show(box);
    - +

    Features

    You can activate the window mode for the tooltip with the elm_object_tooltip_window_mode_set() function.

    @@ -215,7 +215,7 @@ elm_object_tooltip_window_mode_get(parent); +
    + - Win + Win @@ -33,10 +33,10 @@

    Related Info

    - +

    Win

    @@ -55,49 +55,49 @@ static void create_base_gui(appdata_s *ad) { -    /* Window */ -    /* -     Create and initialize elm_win, -     which is mandatory to manipulate the window -    */ -    ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -    elm_win_autodel_set(ad->win, EINA_TRUE); + /* Window */ + /* + Create and initialize elm_win, + which is mandatory to manipulate the window + */ + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_autodel_set(ad->win, EINA_TRUE); -    if (elm_win_wm_rotation_supported_get(ad->win)) { -        int rots[4] = {0, 90, 180, 270}; -        elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); -    } + if (elm_win_wm_rotation_supported_get(ad->win)) { + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + } -    evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); -    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); -    /* Conformant */ -    /* -     Create and initialize elm_conformant, -     which is mandatory for the base GUI to have a proper size -     when the indicator or virtual keypad is visible -    */ -    ad->conform = elm_conformant_add(ad->win); -    elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); -    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(ad->win, ad->conform); -    evas_object_show(ad->conform); + /* Conformant */ + /* + Create and initialize elm_conformant, + which is mandatory for the base GUI to have a proper size + when the indicator or virtual keypad is visible + */ + ad->conform = elm_conformant_add(ad->win); + elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); + evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, ad->conform); + evas_object_show(ad->conform); -    evas_object_show(ad->win); + evas_object_show(ad->win); } static void win_delete_request_cb(void *data, Evas_Object *obj, void *event_info) { -    ui_app_exit(); + ui_app_exit(); } static void win_back_cb(void *data, Evas_Object *obj, void *event_info) { -    appdata_s *ad = data; -    /* Let the window go to the hide state */ -    elm_win_lower(ad->win); + appdata_s *ad = data; + /* Let the window go to the hide state */ + elm_win_lower(ad->win); } @@ -107,7 +107,7 @@ win_back_cb(void *data, Evas_Object *obj, void *event_info) - +

    The basic template code includes the following steps:

    1. Add a window with the elm_win_util_standard_add() function. @@ -119,9 +119,9 @@ Evas_Object *win; Evas_Object *bg; /* Add a window */ -win = elm_win_add(NULL, "name", ELM_WIN_BASIC); +win = elm_win_add(NULL, "name", ELM_WIN_BASIC); /* Set a title to the window */ -elm_win_title_set(win, "title"); +elm_win_title_set(win, "title"); /* Add a background and set it as the contents of the window */ bg = elm_bg_add(win); evas_object_size_hint_weight_set(bg, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); @@ -152,12 +152,12 @@ elm_win_resize_object_add(win, obj);

      You can register callback functions connected to the following signals for a win object.

      Table: Win callback signals

      - +
      - - - + + + @@ -256,7 +256,7 @@ elm_win_resize_object_add(win, obj);
      SignalDescriptionevent_infoSignalDescriptionevent_info
      delete,request
      - +
      Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -276,7 +276,7 @@ elm_win_resize_object_add(win, obj); +
      + - Win + Win @@ -34,10 +34,10 @@
    -
    +

    Win

    @@ -45,11 +45,11 @@

    Win stands for window, and the win component is a graphical control element containing the graphical user interface of a program. The window component is the bottom-most UI component in an EFL application. In most cases, when an application is launched, a window that fits into the device screen is created and shown. For more information, see the Win API.

    This feature is supported in wearable applications only.

    - +

    Basic Usage

    - +

    A window is created automatically when you create a Tizen native UI application project with a template. The following example is a part of the template code handling a window component and the corresponding screenshot.

    - +

    Example: Win use case

    @@ -59,49 +59,49 @@ static void create_base_gui(appdata_s *ad) { -    /* Window */ -    /* -     Create and initialize elm_win, -     which is mandatory to manipulate the window -    */ -    ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -    elm_win_autodel_set(ad->win, EINA_TRUE); - -    if (elm_win_wm_rotation_supported_get(ad->win)) { -        int rots[4] = {0, 90, 180, 270}; -        elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); -    } - -    evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); -    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); - -    /* Conformant */ -    /* -     Create and initialize elm_conformant, -     which is mandatory for the base GUI to have a proper size -     when the indicator or virtual keypad is visible -    */ -    ad->conform = elm_conformant_add(ad->win); -    elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); -    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(ad->win, ad->conform); -    evas_object_show(ad->conform); - -    evas_object_show(ad->win); + /* Window */ + /* + Create and initialize elm_win, + which is mandatory to manipulate the window + */ + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_autodel_set(ad->win, EINA_TRUE); + + if (elm_win_wm_rotation_supported_get(ad->win)) { + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + } + + evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + + /* Conformant */ + /* + Create and initialize elm_conformant, + which is mandatory for the base GUI to have a proper size + when the indicator or virtual keypad is visible + */ + ad->conform = elm_conformant_add(ad->win); + elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); + evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, ad->conform); + evas_object_show(ad->conform); + + evas_object_show(ad->win); } static void win_delete_request_cb(void *data, Evas_Object *obj, void *event_info) { -    ui_app_exit(); + ui_app_exit(); } static void win_back_cb(void *data, Evas_Object *obj, void *event_info) { -    appdata_s *ad = data; -    /* Let the window go to the hide state */ -    elm_win_lower(ad->win); + appdata_s *ad = data; + /* Let the window go to the hide state */ + elm_win_lower(ad->win); } @@ -125,9 +125,9 @@ Evas_Object *win; Evas_Object *bg; /* Add a window */ -win = elm_win_add(NULL, "name", ELM_WIN_BASIC); +win = elm_win_add(NULL, "name", ELM_WIN_BASIC); /* Set a title to the window */ -elm_win_title_set(win, "title"); +elm_win_title_set(win, "title"); /* Add a background and set it as the contents of the window */ bg = elm_bg_add(win); evas_object_size_hint_weight_set(bg, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); @@ -158,13 +158,13 @@ elm_win_resize_object_add(win, obj);

    You can register callback functions connected to the following signals for a win object.

    -

    Table: Win callback signals

    +

    Table: Win callback signals

    - - - + + + @@ -268,7 +268,7 @@ elm_win_resize_object_add(win, obj);
    SignalDescriptionevent_infoSignalDescriptionevent_info
    delete,request
    - +
    Note The signal list in the API reference can be more extensive, but only the above signals are actually supported in Tizen. @@ -288,7 +288,7 @@ elm_win_resize_object_add(win, obj); +
    + - Configuring UI Components + Configuring UI Components @@ -30,7 +30,7 @@

    Related Info

    -
    +
    @@ -46,7 +46,7 @@

    When configuring UI components, you can manage Elementary profiles and Elementary options.

    -

    Managing Elementary Profiles

    +

    Managing Elementary Profiles

    An Elementary profile is a set of preconfigured options that affects the entire look and feel of an application. The options linked to a specific profile form an Elementary configuration, which can be used to store the desired set of options for use in multiple sessions. Once loaded, the Elementary profile configures all the options and sets the look and feel of your Elementary application.

    @@ -59,7 +59,7 @@ Eina_List *list = elm_config_profile_list_get();
  • Set a particular profile: 
    -elm_config_profile_set("myprofile");
+elm_config_profile_set("myprofile");
  • Get the current profile: @@ -79,26 +79,26 @@ elm_config_reload();

    The following code snippet is a configuration example from the base.src configuration file:

    -group "Elm_Config" struct {
-   value "scale" double: 3.0;
-   value "finger_size" int: 50;
-   value "cache_flush_enable" uchar: 0;
-   value "cache_flush_poll_interval" int: 512;
-   value "font_cache" int: 512;
-   value "image_cache" int: 4096;
-   value "edje_cache" int: 32;
-   value "edje_collection_cache" int: 64;
-   value "glayer_long_tap_start_timeout" double: 0.5;
-   value "glayer_double_tap_timeout" double: 0.33;
-   value "thumbscroll_bounce_enable" uchar: 0;
-   value "thumbscroll_bounce_friction" double: 0.5;
-   value "longpress_timeout" double: 0.5;
-   value "tooltip_delay" double: 1.0;
-   value "password_show_last" uchar: 1;
-   value "password_show_last_timeout" double: 2.0;
-   value "engine" string: "software_x11";
-   value "selection_clear_enable" uchar: 1;
-   value "fps" double: 60.0;
+group "Elm_Config" struct {
+   value "scale" double: 3.0;
+   value "finger_size" int: 50;
+   value "cache_flush_enable" uchar: 0;
+   value "cache_flush_poll_interval" int: 512;
+   value "font_cache" int: 512;
+   value "image_cache" int: 4096;
+   value "edje_cache" int: 32;
+   value "edje_collection_cache" int: 64;
+   value "glayer_long_tap_start_timeout" double: 0.5;
+   value "glayer_double_tap_timeout" double: 0.33;
+   value "thumbscroll_bounce_enable" uchar: 0;
+   value "thumbscroll_bounce_friction" double: 0.5;
+   value "longpress_timeout" double: 0.5;
+   value "tooltip_delay" double: 1.0;
+   value "password_show_last" uchar: 1;
+   value "password_show_last_timeout" double: 2.0;
+   value "engine" string: "software_x11";
+   value "selection_clear_enable" uchar: 1;
+   value "fps" double: 60.0;
 }

    You can set the following options in the Elementary configuration:

    @@ -157,7 +157,7 @@ elm_config_glayer_double_tap_timeout_set(0.5);
  • To manage scrolling:
      -
    • Make the scroller bounce when it reaches its viewport's edge during scrolling by using the elm_config_scroll_bounce_enabled_set() function: +
    • Make the scroller bounce when it reaches its viewport's edge during scrolling by using the elm_config_scroll_bounce_enabled_set() function: 
       elm_config_scroll_bounce_enabled_set(EINA_TRUE);
      @@ -206,7 +206,7 @@ elm_config_tooltip_delay_set(2.0); elm_config_password_show_last_set(EINA_TRUE);
      • -
    • Set the visibility timeout (how many seconds the input is visible): +
    • Set the visibility timeout (how many seconds the input is visible): 
       elm_config_password_show_last_timeout_set(5.0);
      @@ -217,41 +217,41 @@ elm_config_password_show_last_timeout_set(5.0);

      You can define the rendering engine that Elementary uses to draw the windows. The following rendering engines are supported:

        -
      • "software_x11"
        • -
      • "fb"
        • -
      • "directfb"
        • -
      • "software_16_x11"
        • -
      • "software_8_x11"
        • -
      • "xrender_x11"
        • -
      • "opengl_x11"
        • -
      • "software_gdi"
        • -
      • "software_16_wince_gdi"
        • -
      • "sdl"
        • -
      • "software_16_sdl"
        • -
      • "opengl_sdl"
        • -
      • "buffer"
        • -
      • "ews"
        • -
      • "opengl_cocoa"
        • -
      • "psl1ght"
        • +
      • "software_x11"
        • +
      • "fb"
        • +
      • "directfb"
        • +
      • "software_16_x11"
        • +
      • "software_8_x11"
        • +
      • "xrender_x11"
        • +
      • "opengl_x11"
        • +
      • "software_gdi"
        • +
      • "software_16_wince_gdi"
        • +
      • "sdl"
        • +
      • "software_16_sdl"
        • +
      • "opengl_sdl"
        • +
      • "buffer"
        • +
      • "ews"
        • +
      • "opengl_cocoa"
        • +
      • "psl1ght"
      -elm_config_engine_set("opengl_x11");
+elm_config_engine_set("opengl_x11");
      • -
    • To activate the access mode: +
    • To activate the access mode:

      Set the access mode as active, so that information about an Elementary object is read when the object receives an EVAS_CALLBACK_MOUSE_IN event.

      • -
    • To configure the selection mode: +
    • To configure the selection mode:

      Set the selection mode so that the selection is cleared when the entry component is unfocused:

       elm_config_selection_unfocused_clear_set(EINA_TRUE);
      • -
    • To enable mirroring: +
    • To enable mirroring:

      Elementary allows UI mirroring both on a single object and on the entire UI. If mirroring is enabled, an Elementary UI component displays as if there was a vertical mirror in the middle of it. Only the controls and the disposition of the UI component are mirrored. Text is not mirrored.

      @@ -267,7 +267,7 @@ elm_config_fps_set(60.0);
    - +
    • diff --git a/org.tizen.guides/html/native/ui/efl/container_box_n.htm b/org.tizen.guides/html/native/ui/efl/container_box_n.htm index 7ff1232..d9e568f 100644 --- a/org.tizen.guides/html/native/ui/efl/container_box_n.htm +++ b/org.tizen.guides/html/native/ui/efl/container_box_n.htm @@ -5,13 +5,13 @@ - + - Box + Box @@ -30,27 +30,27 @@

    Content

    Related Info

    - +

    Box

    The box container arranges UI components in a linear order, horizontally or vertically. It is a non-graphical object: it adds no graphics to or around the objects it holds. For more information, see the Box API (in mobile and wearable applications).

    - +

    Figure: Box component structure

    Box component structure

    - +

    Basic Usage

    - +

    To build a layout with a box:

    1. Add a box with the elm_box_add() function: @@ -69,16 +69,16 @@ elm_box_horizontal_set(box, EINA_TRUE); 
       Evas_Object *box;
 Evas_Object btn;
- 
+
 btn = elm_button_add(parent);
 elm_box_pack_end(box, btn);
    - +

    The following example shows a simple use case of the box component, where 5 button objects are packed into a vertical box. The elm_box_pack_end() function is used to pack each button into the end of the box.

    - -

    Example: Box use case

    + +

    Example: Box use case

    @@ -98,19 +98,19 @@ int i; /* Add a box and push it into the naviframe */ box = elm_box_add(nf); evas_object_show(box); -elm_naviframe_item_push(nf, "Box", NULL, NULL, box, NULL); - +elm_naviframe_item_push(nf, "Box", NULL, NULL, box, NULL); + for (i = 1; i <= 5; i++) { -    btn = elm_button_add(box); -    snprintf(tmp, sizeof(tmp), "Button %d", i); -    elm_object_text_set(btn, tmp); - -    /* Set size hints for weight and align */ -    evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, 0.5); - -    evas_object_show(btn); -    elm_box_pack_end(box, btn); + btn = elm_button_add(box); + snprintf(tmp, sizeof(tmp), "Button %d", i); + elm_object_text_set(btn, tmp); + + /* Set size hints for weight and align */ + evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, 0.5); + + evas_object_show(btn); + elm_box_pack_end(box, btn); } @@ -133,28 +133,28 @@ for (i = 1; i <= 5; i++) {

    When building a box layout, you must use size hint functions to adjust the size and position of each element inside it:

    • Basically, an object contained in a box takes up space based on its minimum size.
      • -
    • If the sum of the objects' minimum size is bigger than the size of the box parent, the box takes up all the space occupied by the parent, and the size of the parent may be extended to hold the box.
      • -
    • If the sum of the objects' minimum size is smaller than the space given for the box, the objects are positioned at the center by default.
      • +
    • If the sum of the objects' minimum size is bigger than the size of the box parent, the box takes up all the space occupied by the parent, and the size of the parent may be extended to hold the box.
      • +
    • If the sum of the objects' minimum size is smaller than the space given for the box, the objects are positioned at the center by default.

    You can adjust the position of the image objects using the elm_box_align_set() function. The function takes 2 double values, a horizontal value and a vertical value, representing the percentage between 0.0 and 1.0 of the alignment in the horizontal and vertical axes. Remember that a box has a linear structure: the alignment only takes effect in the opposite direction than the one defined with the elm_box_horizontal_set() function.

    In the following example, 2 images are packed into a box. The minimum size hints are set to the image objects with the elm_object_size_hint_min_set() function. Since the sum of the minimum size is smaller than the box area, which is equal to the window area in this case, the images are bound together and positioned at the center.

    -

    Table: Various box layouts

    +

    Table: Various box layouts

    - 
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -168,13 +168,13 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -190,13 +190,13 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -212,7 +212,7 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -220,7 +220,7 @@ elm_box_pack_end(box, image);
 evas_object_size_hint_weight_set(image, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -236,7 +236,7 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -245,7 +245,7 @@ elm_box_pack_end(box, image);
 evas_object_size_hint_align_set(image, 0.0, 0.0);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -262,7 +262,7 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -271,7 +271,7 @@ elm_box_pack_end(box, image);
 evas_object_size_hint_align_set(image, 1.0, 1.0);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -288,7 +288,7 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -297,7 +297,7 @@ elm_box_pack_end(box, image);
 evas_object_size_hint_align_set(image, EVAS_HINT_FILL, EVAS_HINT_FILL);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -314,7 +314,7 @@ elm_box_pack_end(box, image);
          
     image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -323,7 +323,7 @@ elm_box_pack_end(box, image);
 evas_object_size_hint_align_set(image, EVAS_HINT_FILL, EVAS_HINT_FILL);
 
 image = elm_image_add(box);
-elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(image, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(image, 200, 200);
 evas_object_show(image);
 elm_box_pack_end(box, image);
@@ -353,7 +353,7 @@ elm_box_pack_end(box, image);
 
  
+
 
 	
+	
 	
 	
 	
 	
 
-	Conformant  
+	Conformant
 
 
 
@@ -30,28 +30,28 @@
 		
    Content
    
 		
 		
    Related Info
    
 			
 	
-	
+
 
 
    
 
    Conformant
    
 
 
    The conformant container accounts for the space taken by the indicator, virtual keyboard, and softkey windows. The content area of the conformant is resized and positioned based on the space available. For more information, see the Conformant API (in mobile and wearable applications).
    
- 
+
 
    Figure: Conformant component structure
    
  
    Conformant component structure
    
- 
+
 
    Basic Usage
    
- 
+
 
    To build a layout with a conformant:
    
 
      
    
    1. Add a conformant with the elm_conformant_add() function:
@@ -78,9 +78,9 @@ elm_object_content_set(conformant, main_view);
 
-          
-          
-          
+         
+         
+         
@@ -129,7 +129,7 @@ elm_object_content_set(conformant, main_view);
 
  
+	
+	
 
-	Grid  
+	Grid
@@ -29,17 +29,17 @@
 		
      Content
      Related Info
      
-	
+
      
 
      Grid
      
@@ -48,7 +48,7 @@
 
 
      Figure: Grid component structure
      
 
      Grid component structure
      
- 
+
 
      Basic Usage
      
 
 
      To build a layout with a grid:
      
@@ -94,23 +94,23 @@ Evas_Object *button;
 grid = elm_grid_add(nf);
 elm_object_content_set(nf, grid);
 evas_object_show(grid);
-elm_naviframe_item_push(nf, "Grid", NULL, NULL, grid, NULL);
+elm_naviframe_item_push(nf, "Grid", NULL, NULL, grid, NULL);
 
 /* Add a button to the grid */
 button = elm_button_add(grid);
-elm_object_text_set(button, "Button1");
+elm_object_text_set(button, "Button1");
 elm_grid_pack(grid, button, 10, 10, 40, 20);
 evas_object_show(button);
 
 /* Add a button to the grid */
 button = elm_button_add(grid);
-elm_object_text_set(button, "Button2");
+elm_object_text_set(button, "Button2");
 elm_grid_pack(grid, button, 50, 50, 40, 30);
 evas_object_show(button);
 
 /* Add a button to the grid */
 button = elm_button_add(grid);
-elm_object_text_set(button, "Button3");
+elm_object_text_set(button, "Button3");
 elm_grid_pack(grid, button, 10, 80, 30, 10);
 evas_object_show(button);
 
@@ -136,7 +136,7 @@ evas_object_show(button);
 
  
+
      
 
 	
+	
 	
 	
 	
 	
 
-	Layout  
+	Layout
 
 
 
@@ -32,10 +32,10 @@
 				
    2. Edje API for Mobile Native
      3. 
 				
    3. Elementary API for Mobile Native
      4. 
 				
    4. Edje API for Wearable Native
      5. 
-				
    5. Elementary API for Wearable Native
      6. 	
+				
    6. Elementary API for Wearable Native
      7. 
 			
 	
      
-	
+
      
 
      Layout
      
@@ -43,12 +43,12 @@
 
      The layout container enables you to define a look and feel of the UI with animation and basic event response by using an Edje design file. For more information, see the Layout API (in mobile and wearable applications).
      
 
 
      EDC (Edje data collection) is a script language provided by Edje, which is a library in charge of the high-level layouting in EFL. An EDC file describes how the elements of the UI are positioned. An EDC file has an extension .edc. For more information on the syntax of EDC, see Layouting with EDC.
      
- 
+
 
      Figure: EDC file behavior
      
 
      EDC file behavior
      
- 
+
 
      Basic Usage
      
- 
+
 
      You can customize a layout by writing an EDC file, or use a predefined, frequently used layouts provided by Tizen.
      
 
 
      Customized Layout
      
@@ -58,11 +58,11 @@
    
    7. Create an EDC file in the /res/edje/ directory and define a layout in the EDC file.
 
       collections {
-   group {
-      name: "main";
-      parts {
-      }
-   }
+   group {
+      name: "main";
+      parts {
+      }
+   }
 }
 
      
 
      If you add an example.edc file, the Tizen Studio calls Edje tools automatically to build the final example.edj file when building the project. The EDJ file is installed in the application data path.
      
@@ -79,20 +79,20 @@ layout = elm_layout_add(parent);
 
       char edj_path[128] = {0,};
 
-app_get_resource("/edje/example.edj", edj_path, 128);
-elm_layout_file_set(layout, edj_path, "main");
+app_get_resource("/edje/example.edj", edj_path, 128);
+elm_layout_file_set(layout, edj_path, "main");
 
      
    
      8. 
    
    8. Set objects or texts to the layout with the elm_object_part_content_set() or elm_object_part_text_set() function.
      9. 
    
    9. Elementary can send Edje signals to the EDC part using the elm_layout_signal_emit() function. You can also use the elm_layout_signal_callback_add() function to receive signals.
    
      Use the following code to listen to any signals sent by the layout:
      
 
      -elm_layout_signal_callback_add(layout, "*", "*", _signal_cb, NULL);
+elm_layout_signal_callback_add(layout, "*", "*", _signal_cb, NULL);
 
 static void
 _signal_cb(void *data, Evas_Object *obj, const char *emission, const char *source)
 {
-    printf("Info received from layout: %s %s\n", emission, source);
+    printf("Info received from layout: %s %s\n", emission, source);
 }
 
      
    
      10. 
@@ -100,7 +100,7 @@ _signal_cb(void *data, Evas_Object *obj, const char *emission, const char *sourc
 
 
      The following example shows a simple use case of the layout component, with a simple EDC script in the example.edc file and a connection from the resulted EDJ file to the C code.
      
 
-   
      Example: Layout use case
       
+   
      Example: Layout use case
      
 
      
    
       
      SignalDescriptionevent_infoSignalDescriptionevent_info
       
      
       
      
          virtualkeypad,state,on
 
 
 	
 	
 	
 	
 
 
 
 		
 		
 		
 			
 	
 
 
 
 
      
@@ -109,49 +109,49 @@ _signal_cb(void *data, Evas_Object *obj, const char *emission, const char *sourc
 /* EDC file */
 
 collections {
-   base_scale: 1.0;
-   group {
-      name: "main";
-      parts {
-         part {
-            name: "bg";
-            type: RECT;
-            description {
-               state: "default" 0.0;
-            }
-         }
-         part {
-            name: "text";
-            type: TEXT;
-            scale: 1;
-            effect: FAR_SOFT_SHADOW;
-            description {
-               state: "default" 0.0;
-               rel1.relative: 0.0 0.0;
-               rel2.relative: 1.0 0.5;
-               color: 0 136 170 255;
-               color2: 0 136 170 50;
-               color3: 0 136 170 25;
-               text {
-                  size: 25;
-                  font: "Sans";
-                  text: "Layout Example";
-                  align: 0.5 0.5;
-               }
-            }
-         }
-         part {
-            name: "content";
-            type: SWALLOW;
-            description {
-               state: "default" 0.0;
-               rel1.relative: 0.5 0.6;
-               rel2.relative: 0.5 0.6;
-               min: 200 100;
-            }
-         }
-      }
-   }
+   base_scale: 1.0;
+   group {
+      name: "main";
+      parts {
+         part {
+            name: "bg";
+            type: RECT;
+            description {
+               state: "default" 0.0;
+            }
+         }
+         part {
+            name: "text";
+            type: TEXT;
+            scale: 1;
+            effect: FAR_SOFT_SHADOW;
+            description {
+               state: "default" 0.0;
+               rel1.relative: 0.0 0.0;
+               rel2.relative: 1.0 0.5;
+               color: 0 136 170 255;
+               color2: 0 136 170 50;
+               color3: 0 136 170 25;
+               text {
+                  size: 25;
+                  font: "Sans";
+                  text: "Layout Example";
+                  align: 0.5 0.5;
+               }
+            }
+         }
+         part {
+            name: "content";
+            type: SWALLOW;
+            description {
+               state: "default" 0.0;
+               rel1.relative: 0.5 0.6;
+               rel2.relative: 0.5 0.6;
+               min: 200 100;
+            }
+         }
+      }
+   }
 }
 
 /* C code file */
@@ -167,17 +167,17 @@ char edj_path[128] = {0,};
 /* (win - conformant) */
 
 layout = elm_layout_add(nf);
-app_get_resource("edje/example.edj", edj_path, 128);
-elm_layout_file_set(layout, edj_path, "main");
+app_get_resource("edje/example.edj", edj_path, 128);
+elm_layout_file_set(layout, edj_path, "main");
 evas_object_size_hint_weight_set(layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 eext_object_event_callback_add(layout, EEXT_CALLBACK_BACK, layout_back_cb, ad);
 
 button = elm_button_add(layout);
-elm_object_text_set(button, "Button1");
-elm_layout_content_set(layout, "content", button);
+elm_object_text_set(button, "Button1");
+elm_layout_content_set(layout, "content", button);
 evas_object_show(button);
 
-elm_naviframe_item_push(nf, "Layout", NULL, NULL, layout, NULL);
+elm_naviframe_item_push(nf, "Layout", NULL, NULL, layout, NULL);
 
      
    
       
      
          
          
@@ -186,34 +186,34 @@ elm_naviframe_item_push(nf, "Layout", NULL, NULL, layout, NULL);
       
      
          
 
      
- 
+
 
      Predefined Layout
      
 
 
      You can skip the first step (writing an EDC script) and set a theme to the layout with the elm_layout_theme_set() function instead of the elm_layout_file_set() function.
      
 
 
 
      The following predefined themes are available in the mobile profile:
      
- 
+
 
        
    
      • application/default: This layout can be used to display content inside a window.
 
        -elm_layout_theme_set(layout, "layout", "application", "default");
-elm_object_part_content_set(ly, "elm.swallow.content", view);
+elm_layout_theme_set(layout, "layout", "application", "default");
+elm_object_part_content_set(ly, "elm.swallow.content", view);
 
        
    
        • 
    
      • drawer/panel: This layout can be used to display 2 different views: a background and a main content.
 
        -elm_layout_theme_set(ly, "layout", "drawer", "panel");
-elm_object_part_content_set(ly, "elm.swallow.content", main_view);
-elm_object_part_content_set(ly, "elm.swallow.background", background);
+elm_layout_theme_set(ly, "layout", "drawer", "panel");
+elm_object_part_content_set(ly, "elm.swallow.content", main_view);
+elm_object_part_content_set(ly, "elm.swallow.background", background);
 
        
    
        • 
    
      • nocontents/default: This layout can be used when there is no content to display, such as in a contact or email list.
    
        You can only set texts. There are 2 different texts zones: elm.text and elm.help.text. To change the text:
        
 
        -elm_layout_theme_set(ly, "layout", "nocontents", "default");
-elm_object_part_text_set(ly, "elm.text", "Hi All :)");
-elm_object_part_text_set(ly, "elm.help.text", "Hi All :)");
+elm_layout_theme_set(ly, "layout", "nocontents", "default");
+elm_object_part_text_set(ly, "elm.text", "Hi All :)");
+elm_object_part_text_set(ly, "elm.help.text", "Hi All :)");
 
        
    
        • 
 
      
@@ -232,7 +232,7 @@ elm_object_part_text_set(ly, "elm.help.text", "Hi All :)");
 
  
+
    
 
 	
+	
 	
 	
 	
 	
 
-	Mapbuf  
+	Mapbuf
 
 
 
@@ -31,17 +31,17 @@
 		
 		
    Related Info
    
 			
 	
    
-	
+
 
 
    
 
    Mapbuf
    
@@ -76,7 +76,7 @@ elm_object_content_set(mapbuf, content);
 
 
    
 	Note
-	Calling the elm_object_content_set(mapbuf, content) function is equivalent to calling the elm_object_part_content_set(mapbuf, "default", content) function.
+	Calling the elm_object_content_set(mapbuf, content) function is equivalent to calling the elm_object_part_content_set(mapbuf, "default", content) function.
 
    
 
 
    To activate smooth map rendering and alpha rendering for the mapbuf component:
    
@@ -106,7 +106,7 @@ elm_mapbuf_enabled_set(mapbuf, EINA_TRUE);
 
  
+
    
 
 	
+	
 	
 	
 	
 	
 
-	Naviframe  
+	Naviframe
 
 
 
@@ -30,38 +30,38 @@
 		
    Content
    
 		
 		
    Related Info
    
 			
 	
    
-	
+
 
 
    
 
    Naviframe
    
 
 
    The naviframe container manages many views by stacking them and displaying the top-most one. For more information, see the Naviframe API (in mobile and wearable applications).
    
- 
+
 
    Basic Usage
    
- 
+
 
    To build a layout with a naviframe:
    
 
      
    
    1. Add a naviframe with the elm_naviframe_add() function.
      2. 
    
    2. Add an item (a view) and push it to the stack using the elm_naviframe_item_push() function. The function takes 6 parameters and returns a handler of the item.
 
      -Elm_Object_Item 
+Elm_Object_Item
 *elm_naviframe_item_push(Evas_Object *obj,
-                         const char *title,
-                         Evas_Object *prev_btn,
-                         Evas_Object *next_btn,
-                         Evas_Object *content,
-                         const char *item_style);
+                         const char *title,
+                         Evas_Object *prev_btn,
+                         Evas_Object *next_btn,
+                         Evas_Object *content,
+                         const char *item_style);
 
      
 
        
 
      • In Tizen, the next_btn (fourth parameter) is not shown, so use NULL. The prev_btn (third parameter) is supported, but auto pushing is also supported from Tizen 2.4. As a result, use NULL for prev_btn too, and set the auto-pushed flag (about the prev_btn) to true (like below).
        
@@ -76,21 +76,21 @@ elm_naviframe_prev_btn_auto_pushed_set(nf, EINA_TRUE);
 
        The last parameter is the style of the naviframe item. In Tizen mobile, various item styles are provided:
        
 
        • If an item style supports text parts, fill the text parts with the elm_object_item_part_text_set() function:
 
          -elm_object_item_part_text_set(nf_it, "subtitle", "subtitle");
+elm_object_item_part_text_set(nf_it, "subtitle", "subtitle");
 
          • 
 
        • 
 
          If an item style supports swallow parts, fill the swallow parts with the elm_object_item_part_content_set() function:
          
 
          -elm_object_item_part_content_set(nf_it, "title_left_btn", btn);
+elm_object_item_part_content_set(nf_it, "title_left_btn", btn);
 
          
  
          • 
  
        
-
        The default text part is the title, and the default swallow part is the main content area. You can fill these parts with the elm_naviframe_item_push() function as well.
         
-
       
+
      The default text part is the title, and the default swallow part is the main content area. You can fill these parts with the elm_naviframe_item_push() function as well.
      
+
      3. 
    
    
    3. Repeat step 2 for each view you have. You can pop and delete the top-most view during the process using the elm_naviframe_item_pop() function.
      4. 
 
    
- 
+
 
    The following example shows a simple use case of the naviframe component in a mobile application.
    
 
    Example: Naviframe use case
    
 
@@ -102,14 +102,14 @@ Evas_Object *nf;
 Evas_Object *ly;
 Evas_Object *tb;
 Elm_Object_Item *nf_it;
- 
+
 /* Variables for naviframe item push */
-const char *title_text = "Naviframe";
+const char *title_text = "Naviframe";
 Evas_Object *prev_btn = NULL; /* recommended NULL, replace with elm_naviframe_prev_btn_auto_pushed_set() */
 Evas_Object *next_btn = NULL; /* recommended NULL */
 Evas_Object *empty_content = NULL;
 const char *item_style_default = NULL;
-const char *item_style_tabbar = "tabbar";
+const char *item_style_tabbar = "tabbar";
 
 /* Starting right after the conformant the basic EFL UI layout code */
 /* (win - conformant) */
@@ -121,25 +121,25 @@ evas_object_show(nf);
 
 /* Add a layout */
 ly = elm_layout_add(nf);
-elm_layout_theme_set(ly, "layout", "nocontents", "default");
-elm_object_part_text_set(ly, "elm.text", "Naviframe Content Area");
+elm_layout_theme_set(ly, "layout", "nocontents", "default");
+elm_object_part_text_set(ly, "elm.text", "Naviframe Content Area");
 
 /* Add a toolbar */
 tb = elm_toolbar_add(nf);
 elm_toolbar_shrink_mode_set(tb, ELM_TOOLBAR_SHRINK_EXPAND);
 elm_toolbar_transverse_expanded_set(tb, EINA_TRUE);
-elm_toolbar_item_append(tb, NULL, "Tab1", NULL, NULL);
-elm_toolbar_item_append(tb, NULL, "Tab2", NULL, NULL);
+elm_toolbar_item_append(tb, NULL, "Tab1", NULL, NULL);
+elm_toolbar_item_append(tb, NULL, "Tab2", NULL, NULL);
 evas_object_show(tb);
 
 /* Push a naviframe item (push 2 items in total to show the back button) */
 elm_naviframe_item_push(nf, title_text, prev_btn, next_btn, empty_content, item_style_default);
 
-/* Push a naviframe item, set the style as "tabbar" and pass the layout as content */
+/* Push a naviframe item, set the style as "tabbar" and pass the layout as content */
 nf_it = elm_naviframe_item_push(nf, title_text, prev_btn, next_btn, ly, item_style_tabbar);
 
-/* Set the toolbar into the "tabbar" part of the naviframe item */
-elm_object_item_part_content_set(nf_it, "tabbar", tb);
+/* Set the toolbar into the "tabbar" part of the naviframe item */
+elm_object_item_part_content_set(nf_it, "tabbar", tb);
 
@@ -257,9 +257,9 @@ elm_object_item_part_content_set(nf_it, "tabbar", tb);
 
    
 
          
    
-          
-          
-          
+         
+         
+         
@@ -298,7 +298,7 @@ elm_object_item_part_content_set(nf_it, "tabbar", tb);
 
  
+	
+	
 
-	Panes  
+	Panes
@@ -29,7 +29,7 @@
 		
    Content
    Related Info
    
-	
+
    
 
    Panes
    
 
 
 
    The panes container adds a draggable bar between 2 sections of content. The sections are resized when the bar is dragged. For more information, see the Panes API.
    
-   
+
 
    This feature is supported in mobile applications only.
    
 
 
    Basic Usage
    
- 
+
 
    To use panes in your application:
    
- 
+
 
      
    
    1. Add a panes with the elm_panes_add() function:
 
      @@ -64,41 +64,41 @@ panes = elm_panes_add(parent);
 
       Evas_Object *left_button;
 
-elm_object_part_content_set(panes, "left",
-                            left_button);
+elm_object_part_content_set(panes, "left",
+                            left_button);
 
      
  
      2. 
    
    2. Add a content to the right pane:
 
       Evas_Object *right_button;
 
-elm_object_part_content_set(panes, "right", right_button);
+elm_object_part_content_set(panes, "right", right_button);
 
      
 
      3. 
-   
    3. Set the direction of the panes with the elm_panes_horizontal_set() function. A panes is vertical by default. Horizontal panes have "top" and "bottom" content, while vertical panes have "left" and "right" content.
+   
    4. Set the direction of the panes with the elm_panes_horizontal_set() function. A panes is vertical by default. Horizontal panes have "top" and "bottom" content, while vertical panes have "left" and "right" content.
 
       elm_panes_horizontal_set(panes, EINA_TRUE);
-elm_object_part_content_set(panes, "top", top_button);
-elm_object_part_content_set(panes, "bottom", bottom_button);
+elm_object_part_content_set(panes, "top", top_button);
+elm_object_part_content_set(panes, "bottom", bottom_button);
 
      
    
      5. 
- 
-   
    5. Set the size of the panes with the elm_panes_content_right_size_set function. 
+
+   
    6. Set the size of the panes with the elm_panes_content_right_size_set function.
    
      By default, both sides of the panes have the same size. You can change the size proportion of the panes. If the left content must be displayed over 75% of the panes size, the size must be passed as 0.75. This way, the right content is resized to 25% of the panes size. If displayed vertically, left content is displayed at top, and right content at the bottom.
      
 
       elm_panes_content_left_size_set(panes, 0.75);
 
      
    
      7. 
- 
+
    
    7. Register the callback functions.
    
      The following example shows how to define and register a callback for the clicked,double signal:
      
 
      -evas_object_smart_callback_add(panes, "clicked,double", clicked_double_cb, data);
+evas_object_smart_callback_add(panes, "clicked,double", clicked_double_cb, data);
 
 void
 clicked_double_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Panes double clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Panes double clicked\n");
 }
 
      
    
      8. 
@@ -125,18 +125,18 @@ Evas_Object *right_button;
 panes = elm_panes_add(nf);
 elm_object_content_set(nf, panes);
 evas_object_show(panes);
-elm_naviframe_item_push(nf, "Panes", NULL, NULL, panes, NULL);
+elm_naviframe_item_push(nf, "Panes", NULL, NULL, panes, NULL);
 
 /* Add a button to the left pane */
 left_button = elm_button_add(panes);
-elm_object_text_set(left_button, "Left");
-elm_object_part_content_set(panes, "left", left_button);
+elm_object_text_set(left_button, "Left");
+elm_object_part_content_set(panes, "left", left_button);
 evas_object_show(left_button);
 
 /* Add a button to the right pane */
 right_button = elm_button_add(panes);
-elm_object_text_set(right_button, "Right");
-elm_object_part_content_set(panes, "right", right_button);
+elm_object_text_set(right_button, "Right");
+elm_object_part_content_set(panes, "right", right_button);
 evas_object_show(right_button);
 
          
@@ -155,9 +155,9 @@ evas_object_show(right_button);
 
    
    
       
    SignalDescriptionevent_infoSignalDescriptionevent_info
       
    
       
    
          transition,finished
 
 
 	
 	
 	
 	
 
 
 
 		
 		
 			
 	
 
 
    
-          
-          
-          
+         
+         
+         
@@ -201,7 +201,7 @@ evas_object_show(right_button);
 
  
+	
+	
 
-	Scroller  
+	Scroller
@@ -32,25 +32,25 @@
 			
  • Basic Usage
  • Styles
  • Callbacks
    • 
-			
  • Example
    • 			
+			
  • Example
    • Related Info
    
-	
+
    
 
    Scroller
    
 
 
    The scroller container holds and clips a single object and allows you to scroll across it. This means that the user can use a scroll bar or a finger to drag the viewable region across the object, moving through a much larger area than is contained in the viewport. A scroller always has a default minimum size that is not limited by its content. For more information, see the Scroller API (in mobile and wearable applications).
    
- 
+
 
    Basic Usage
    
- 
+
 
    To build a layout with a scroller:
    
 
      
    
    1. Add a scroller with the elm_scroller_add() function:
@@ -62,7 +62,7 @@ scroller = elm_scroller_add(parent);
 
      2. 
    
    2. Set a style to the scroller with the elm_object_style_set() function. If you use the default style, you can skip this step.
 
      -elm_object_style_set(scroller, "handler");
+elm_object_style_set(scroller, "handler");
 
      3. 
    
    3. Add an object and set it to the scroller with the elm_object_content_set() function:
 
      @@ -75,12 +75,12 @@ elm_object_content_set(scroller, image);
    
    4. Register the callback functions.
     
      The following example shows how to define and register a callback for the scroll,drag,start signal:
      
 
      -evas_object_smart_callback_add(scroller, "scroll,drag,start", _scroll_start_cb, NULL);
+evas_object_smart_callback_add(scroller, "scroll,drag,start", _scroll_start_cb, NULL);
 
 void
 _scroll_start_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    printf("Scroll starts\n");
+    printf("Scroll starts\n");
 }
 
      
    
      5. 
@@ -88,7 +88,7 @@ _scroll_start_cb(void *data, Evas_Object *obj, void *event_info)
 
 
      The following example shows a simple use case of the scroller component, where an image objects is set into a scroller. The minimum size of the image (1600 x 1600 pixels) is larger than the scroller (smaller than 720 * 1280 pixels), so you can scroll across the image.
      
 
-   
      Example: Scroller use case
       
+   
      Example: Scroller use case
      
 
    
    
       
    SignalDescriptionevent_infoSignalDescriptionevent_info
       
    
       
    
          clicked
 
 
 	
 	
 	
 	
 
 
 
 			
 			
 			
 		
 			
 	
 
 
    
@@ -106,11 +106,11 @@ Evas_Object *img;
 /* Add a scroller and push it into the naviframe */
 scroller = elm_scroller_add(nf);
 evas_object_show(scroller);
-elm_naviframe_item_push(nf, "Scroller", NULL, NULL, scroller, NULL);
+elm_naviframe_item_push(nf, "Scroller", NULL, NULL, scroller, NULL);
 
 /* Add an image and set it into the scroller */
 img = elm_image_add(scroller);
-elm_image_file_set(img, ICON_DIR"/tizen.png", NULL);
+elm_image_file_set(img, ICON_DIR"/tizen.png", NULL);
 evas_object_size_hint_min_set(img, 1600, 1600);
 evas_object_show(img);
 elm_object_content_set(scroller, img);
@@ -132,7 +132,7 @@ elm_object_content_set(scroller, img);
 
    Styles
    The following table lists the available component styles.
    
- 
+
    
    Table: Scroller styles
    
    
       
    
 
 
 
    @@ -152,7 +152,7 @@ elm_object_content_set(scroller, img);
       
    
    

    
 
    
- 
+
 
    Callbacks
    
 
 
    You can register callback functions connected to the following signals for a scroller object.
    
@@ -161,9 +161,9 @@ elm_object_content_set(scroller, img);
 
-          
-          
-          
+         
+         
+         
@@ -254,10 +254,10 @@ elm_object_content_set(scroller, img);
 
    Example
    
- 
+
  
    A good example of the scroller use is a picture slideshow: add images to the scroller and limit the scrolling to pages, meaning that one picture at a time is shown.
    
- 
-
    A scroller can limit scrolling to "pages". In this case, the scrolling occurs in page-sized chunks of content rather than in a purely continuous fashion, with the scroller displaying a single page at a time. This feature sets the size of the page relative to the viewport of the scroller. A size of 1.0 equals 1 viewport (horizontally or vertically). A size of 0.0 disables paging for that axis. These settings are mutually exclusive with page size (see the elm_scroller_page_size_set() function). A size of 0.5 equals half a viewport. Usable size values are normally between 0.0 and 1.0, including 1.0. If you only want a single axis to scroll in pages, use 0.0 for the other axis.
    
+
+
    A scroller can limit scrolling to "pages". In this case, the scrolling occurs in page-sized chunks of content rather than in a purely continuous fashion, with the scroller displaying a single page at a time. This feature sets the size of the page relative to the viewport of the scroller. A size of 1.0 equals 1 viewport (horizontally or vertically). A size of 0.0 disables paging for that axis. These settings are mutually exclusive with page size (see the elm_scroller_page_size_set() function). A size of 0.5 equals half a viewport. Usable size values are normally between 0.0 and 1.0, including 1.0. If you only want a single axis to scroll in pages, use 0.0 for the other axis.
    To create a picture slideshow:
      
@@ -281,7 +281,7 @@ evas_object_show(box);
 
      Create all the images and add them to the horizontal box:
      
 
       img = elm_image_add(scroller);
-snprintf(buf, sizeof(buf), IMAGE_DIR"/%d.jpg", i);
+snprintf(buf, sizeof(buf), IMAGE_DIR"/%d.jpg", i);
 elm_image_file_set(img, buf, NULL);
 evas_object_show(img);
 pages = eina_list_append(pages, img);
@@ -300,12 +300,12 @@ elm_scroller_page_show(scroller, 0, 0);
 
      Since you need to be informed when the scroller is resized, add a callback on the EVAS_CALLBACK_RESIZE event for the scroller:
      
 
       evas_object_event_callback_add(scroller, EVAS_CALLBACK_RESIZE,
-                               _scroller_resize_cb, NULL);
+                               _scroller_resize_cb, NULL);
 
      
 
      The callback retrieves the new size of the scroller using the evas_object_geometry_get() function on the object pointer. The pointer is relative to the object that has been resized, which in this case is the scroller itself. Iterate through the images of the scroller and set the minimum size to fit the scroller size:
      
 
       EINA_LIST_FOREACH(images, l, page)
-    evas_object_size_hint_min_set(page, w, h);
+    evas_object_size_hint_min_set(page, w, h);
 
      
 
      Set the page size of the scroller to match the scroller size and display the first page:
      
 
      @@ -329,7 +329,7 @@ elm_scroller_page_show(obj, 0, 0);
 
  
+
 
 	
+	
 	
 	
 	
 	
 
-	Table  
+	Table
 
 
 
@@ -30,17 +30,17 @@
 		
      Content
      
 		
 		
      Related Info
      
 			
 	
-	
+
 
 
      
 
      Table
      
@@ -49,7 +49,7 @@
 
 
      Figure: Table component structure
      
 
      Table component structure
      
- 
+
 
      Basic Usage
      
 
 
      To build a layout with a table:
      
@@ -74,7 +74,7 @@ elm_table_pack(table, btn, 0, 0, 1, 1);
 
      The following example shows a simple use case of the table component, where 5 button objects are packed into a table. The elm_table_pack() function is used to add each button to the table. 1 button takes 2 rows and 1 column, and 4 buttons take only 1 row and column.
      
 
    
      Example: Table use case
      
-
    
    
       
    SignalDescriptionevent_infoSignalDescriptionevent_info
       
    
       
    
          edge,left
 
 
 
 
 
     
+
    
-	
-	
-	
    
    
       
    
          
@@ -95,35 +95,35 @@ elm_table_padding_set(table, 1, 1);
 evas_object_show(table);
 
 btn = elm_button_add(table);
-elm_object_text_set(btn, "Button1");
+elm_object_text_set(btn, "Button1");
 evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, EVAS_HINT_FILL);
 elm_table_pack(table, btn, 0, 0, 1, 1);
 evas_object_show(btn);
 
 btn = elm_button_add(table);
-elm_object_text_set(btn, "Button2");
+elm_object_text_set(btn, "Button2");
 evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, EVAS_HINT_FILL);
 elm_table_pack(table, btn, 1, 0, 1, 1);
 evas_object_show(btn);
 
 btn = elm_button_add(table);
-elm_object_text_set(btn, "Button3");
+elm_object_text_set(btn, "Button3");
 evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, EVAS_HINT_FILL);
 elm_table_pack(table, btn, 0, 1, 1, 1);
 evas_object_show(btn);
 
 btn = elm_button_add(table);
-elm_object_text_set(btn, "Button4");
+elm_object_text_set(btn, "Button4");
 evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, EVAS_HINT_FILL);
 elm_table_pack(table, btn, 0, 2, 1, 1);
 evas_object_show(btn);
 
 btn = elm_button_add(table);
-elm_object_text_set(btn, "Button5");
+elm_object_text_set(btn, "Button5");
 evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, EVAS_HINT_FILL);
 elm_table_pack(table, btn, 1, 1, 1, 2);
@@ -176,7 +176,7 @@ elm_table_homogeneous_set(table, EINA_TRUE);
 
  
+
 
 
 
 
diff --git a/org.tizen.guides/html/native/ui/efl/data_types_n.htm b/org.tizen.guides/html/native/ui/efl/data_types_n.htm
index 031a8bd..d7426d9 100644
--- a/org.tizen.guides/html/native/ui/efl/data_types_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/data_types_n.htm
@@ -26,7 +26,7 @@
 			
  • Tizen 2.3.1 and Higher for Wearable
    • 
 		
         
    Content
    
-        
            
+        
 
-  
+
 
      Iterator Functions
      
 
      Eina provides a set of iterator functions to manipulate data types, such as arrays.
      
 
      These functions allow access to container elements in a generic way, without knowing which container is used (similar to iterators in the C++ STL). Iterators only allow sequential access (that is, from one element to the next one). For random access, Eina provides accessor functions.
      
@@ -86,18 +86,18 @@
 
    • To create a stringshare, declare a string variable and call the eina_stringshare_add() function:
 
       const char *mystr;
-const char *prologue = "Enlightenment is not just a window manager
-                        for Linux/X11 and others";
+const char *prologue = "Enlightenment is not just a window manager
+                        for Linux/X11 and others";
 
 mystr = eina_stringshare_add(prologue);
 
      • 
 
 
    • To retrieve or modify the string data:
 
        
-
      • Retrieve a string for use in a program from a format string using the eina_stringshare_printf() function. If you have a "format" string to pass to a function like printf, you can store it as a stringshare as well.
-
        The following example produces "1 desktop manager to rule them all".
        
+
      • Retrieve a string for use in a program from a format string using the eina_stringshare_printf() function. If you have a "format" string to pass to a function like printf, you can store it as a stringshare as well.
+
        The following example produces "1 desktop manager to rule them all".
        
 
        -const char *myfmtstr = "%d desktop manager to rule them all";
+const char *myfmtstr = "%d desktop manager to rule them all";
 const char *str;
 
 str = eina_stringshare_printf(myfmtstr, 1);
@@ -108,13 +108,13 @@ print(str);
 
 
      • Replace the value of a stringshare with the eina_stringshare_replace() function. Pass the pointer address and the new value to the function.
 
        -eina_stringshare_replace(&str, "One desktop manager to rule them all");
+eina_stringshare_replace(&str, "One desktop manager to rule them all");
 
        
 
        • 
 
 
      • Retrieve the length of the stringshare value with the eina_stringshare_strlen() function.
 
        -printf("length: %d\n", eina_stringshare_strlen(str));
+printf("length: %d\n", eina_stringshare_strlen(str));
 
        
 
        • 
 
      
@@ -145,18 +145,18 @@ mybuffer = eina_strbuf_new();
 
    • 
 
      For basic strings, use the eina_strbuf_append() function:
      
 
      -eina_strbuf_append(mybuffer, "This is my string.");
+eina_strbuf_append(mybuffer, "This is my string.");
 
      
 
      • 
 
    • To append 1 character to your buffer, use the eina_strbuf_append_char() function. You can also append a sized string to the buffer using the eina_strbuf_append_length() function.
 
      -eina_strbuf_append_length(mybuffer, "Buffe", 5);
-eina_strbuf_append_char(mybuffer, 'r');
+eina_strbuf_append_length(mybuffer, "Buffe", 5);
+eina_strbuf_append_char(mybuffer, 'r');
 
      
 
      • 
-
    • To handle "printf" format strings, use the eina_strbuf_append_printf() function to add formatted strings to the buffer:
+
    • To handle "printf" format strings, use the eina_strbuf_append_printf() function to add formatted strings to the buffer:
 
      -eina_strbuf_append_printf(buf, "%s%c", "buffe", 'r');
+eina_strbuf_append_printf(buf, "%s%c", "buffe", 'r');
 
      
 
      • 
 
    
@@ -169,7 +169,7 @@ eina_strbuf_remove(buf, 0, 18);
 
 
 
-
  • To replace characters: 
+
  • To replace characters:
 
 
    • 
 eina_strbuf_replace() replaces a specific occurrence of a given string in the buffer with another string.
      • 
@@ -178,31 +178,31 @@ eina_strbuf_remove(buf, 0, 18);
 
 
    
 
    -eina_strbuf_append(mybuffer, "buffer buffer buffer");
+eina_strbuf_append(mybuffer, "buffer buffer buffer");
 
-/* Replacing 1 occurrence of "buffer" by "B-U-F-F-E-R" */
-eina_strbuf_replace(mybuffer, "buffer", "B-U-F-F-E-R", 1);
+/* Replacing 1 occurrence of "buffer" by "B-U-F-F-E-R" */
+eina_strbuf_replace(mybuffer, "buffer", "B-U-F-F-E-R", 1);
 
-/* Replacing all the occurrences of "buffer" by "B-U-F-F-E-R" */
-eina_strbuf_replace_all(mybuffer, "buffer", "B-U-F-F-E-R");
+/* Replacing all the occurrences of "buffer" by "B-U-F-F-E-R" */
+eina_strbuf_replace_all(mybuffer, "buffer", "B-U-F-F-E-R");
 
-/* Replacing all the occurrences of "B-U-F-F-E-R" by "Buffer" */
-eina_strbuf_replace_all(mybuffer, "B-U-F-F-E-R", "Buffer");
+/* Replacing all the occurrences of "B-U-F-F-E-R" by "Buffer" */
+eina_strbuf_replace_all(mybuffer, "B-U-F-F-E-R", "Buffer");
 
    
 
    • 
 
  • To insert a string at the specified position, use the eina_strbuf_insert() function. Use the eina_strbuf_insert_printf() function with formatted strings.
 
    -eina_strbuf_insert(mybuffer, "More buffer", 10);
+eina_strbuf_insert(mybuffer, "More buffer", 10);
 
 /* Using eina_strbuf_length_get to get the buffer length */
-eina_strbuf_insert_printf(buf, "%s: %d", 6, "length",
-                          eina_strbuf_length_get(buf));
+eina_strbuf_insert_printf(buf, "%s: %d", 6, "length",
+                          eina_strbuf_length_get(buf));
 
    
 
    • 
 
 
  • To get the complete length of the string and the buffer, use the eina_strbuf_string_get() and eina_strbuf_length_get() functions:
 
    -printf("%s: %d\n", eina_strbuf_string_get(mybuffer), eina_strbuf_length_get(buf));
+printf("%s: %d\n", eina_strbuf_string_get(mybuffer), eina_strbuf_length_get(buf));
 
    
 
    • 
 
@@ -244,10 +244,10 @@ INDEX | VALUE
 const char*
 strings[] =
 {
-    "helo", "hera", "starbuck", "kat", "boomer",
-    "hotdog", "longshot", "jammer", "crashdown", "hardball",
-    "duck", "racetrack", "apolo", "husker", "freaker",
-    "skulls", "bulldog", "flat top", "hammerhead", "gonzo"
+    "helo", "hera", "starbuck", "kat", "boomer",
+    "hotdog", "longshot", "jammer", "crashdown", "hardball",
+    "duck", "racetrack", "apolo", "husker", "freaker",
+    "skulls", "bulldog", "flat top", "hammerhead", "gonzo"
 };
 /* Declaring the array (type Eina_Array) */
 Eina_Array *array;
@@ -258,7 +258,7 @@ array = eina_array_new(20);
 
 /* Inserting elements in the array */
 for (i = 0; i < 20; i++)
-    eina_array_push(array, strdup(strings[i]));
+    eina_array_push(array, strdup(strings[i]));
 
 
 
  • To change the allocation step, use the eina_array_step_set() function:
@@ -274,7 +274,7 @@ eina_array_step_set(array, sizeof(*array), 30);
 
     /* Freeing the array elements */
 while (eina_array_count(array))
-    free(eina_array_pop(array));
+    free(eina_array_pop(array));
 
 /* Freeing the array itself */
 eina_array_free(array);
@@ -295,14 +295,14 @@ eina_array_data_set(array, 0, strdup(strings[3]);
 
  • To add elements to the end of the array, use the eina_array_push() function. The function returns EINA_TRUE on success, and EINA_FALSE on failure. The first parameter is the array to store the element, the second one is the data you want to store. If you store strings, remember to allocate the memory first. The example uses the strdup() function to duplicate the string contained in strings[]. This function allocates the memory of the returned string, so you do not have to do it yourself.
 
     for (i = 0; i < 20; i++)
-    eina_array_push(array, strdup(strings[i]));
+    eina_array_push(array, strdup(strings[i]));
 
    
 
    • 
 
 
  • To remove the last element of an array, use the eina_array_pop() function. It takes the array as a parameter, and if the operation is successful, returns a pointer to the data of the removed element.
 
     while (eina_array_count(array))
-    free(eina_array_pop(array));
+    free(eina_array_pop(array));
 
    
 
    • 
 
@@ -317,28 +317,28 @@ while (eina_array_count(array))
 Eina_Bool
 keep(void *data, void *gdata)
 {
-    if (strlen((const char*)data) <= 5)
-        return EINA_TRUE;
+    if (strlen((const char*)data) <= 5)
+        return EINA_TRUE;
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 int
 remove_array()
 {
-    Eina_Array *array;
-    Eina_Array_Iterator iterator;
-    const char *item;
-    unsigned int i;
+    Eina_Array *array;
+    Eina_Array_Iterator iterator;
+    const char *item;
+    unsigned int i;
 
-    /* Creating and populating an array */
+    /* Creating and populating an array */
 
-    /* Removing the undesired elements */
-    eina_array_remove(array, keep, NULL);
+    /* Removing the undesired elements */
+    eina_array_remove(array, keep, NULL);
 
-    /* Flushing and freeing the array */
+    /* Flushing and freeing the array */
 
-    return 0;
+    return 0;
 }
 
    
 
    • 
@@ -385,7 +385,7 @@ const char *item;
 unsigned int i;
 
 EINA_ARRAY_ITER_NEXT(array, i, item, iterator)
-    printf("item #%d: %s\n", i, item);
+    printf("item #%d: %s\n", i, item);
 
 
 
  • Use the eina_array_foreach() function to iterate over the array.
@@ -396,25 +396,25 @@ EINA_ARRAY_ITER_NEXT(array, i, item, iterator)
 static Eina_Bool
 elm_print(const void *container, void *data, void *fdata)
 {
-    printf("%s\n", (char *)data);
+    printf("%s\n", (char *)data);
 
-    return EINA_TRUE;
+    return EINA_TRUE;
 }
 
 int
 iterating_array()
 {
-    Eina_Array *array;
-    unsigned int i;
+    Eina_Array *array;
+    unsigned int i;
 
-    /* Creating and populating an array */
+    /* Creating and populating an array */
 
-    /* Iterating over the array and calling elm_print on each element */
-    eina_array_foreach(array, elm_print, NULL);
+    /* Iterating over the array and calling elm_print on each element */
+    eina_array_foreach(array, elm_print, NULL);
 
-    /* Freeing the element data and array */
+    /* Freeing the element data and array */
 
-    return 0;
+    return 0;
 }
 
 
    • 
@@ -426,68 +426,68 @@ iterating_array()
 static Eina_Bool
 print_one(const void *container, void *data, void *fdata)
 {
-    printf("%s\n", (char*)data);
+    printf("%s\n", (char*)data);
 
-    return EINA_TRUE;
+    return EINA_TRUE;
 }
 
 int
 new_iterator()
 {
-    Eina_Array *array;
-    Eina_Iterator *it;
-    unsigned short int i;
-    void *uninteresting;
-    Eina_Bool rt;
+    Eina_Array *array;
+    Eina_Iterator *it;
+    unsigned short int i;
+    void *uninteresting;
+    Eina_Bool rt;
 
-    /* Creating and populating an array */
+    /* Creating and populating an array */
 
-    it = eina_array_iterator_new(array);
+    it = eina_array_iterator_new(array);
 
-    it = eina_iterator_next(it, &uninteresting);
-    eina_iterator_foreach(it, print_one, NULL);
-    eina_iterator_free(it);
+    it = eina_iterator_next(it, &uninteresting);
+    eina_iterator_foreach(it, print_one, NULL);
+    eina_iterator_free(it);
 
-    return 0;
+    return 0;
 }
 
 
-
  • Use the eina_array_accessor_new() function to get random access to the array elements. 
+
  • Use the eina_array_accessor_new() function to get random access to the array elements.
 
    The function returns a newly allocated accessor associated with the array. If the array is NULL or the counting of array members is less than or equal to 0, this function returns NULL. If the memory cannot be allocated, NULL is returned and EINA_ERROR_OUT_OF_MEMORY is thrown. Otherwise, a valid accessor is returned.
    
 
    To use the accessor to retrieve and print the data of every other array element:
    
 
     int
 random_access()
 {
-    /* Declaration of the array */
-    Eina_Array *array;
-    /* Declaration of the accessor */
-    Eina_Accessor *acc;
+    /* Declaration of the array */
+    Eina_Array *array;
+    /* Declaration of the accessor */
+    Eina_Accessor *acc;
 
-    /* Generic counter */
-    unsigned short int i;
+    /* Generic counter */
+    unsigned short int i;
 
-    /* Variable to put the data retrieved from an array element */
-    void *data;
+    /* Variable to put the data retrieved from an array element */
+    void *data;
 
-    /* Creating and populating an array */
+    /* Creating and populating an array */
 
-    /* Creating the array accessor */
-    acc = eina_array_accessor_new(array);
+    /* Creating the array accessor */
+    acc = eina_array_accessor_new(array);
 
-    /* Random access to the data of the array elements */
-    for (i = 1; i < 10; i += 2) {
-        /* Putting the data in the variable 'data' */
-        eina_accessor_data_get(acc, i, &data);
-        printf("%s\n", (const char *)data);
-    }
+    /* Random access to the data of the array elements */
+    for (i = 1; i < 10; i += 2) {
+        /* Putting the data in the variable 'data' */
+        eina_accessor_data_get(acc, i, &data);
+        printf("%s\n", (const char *)data);
+    }
 
-    /* Freeing the accessor */
-    eina_accessor_free(acc);
+    /* Freeing the accessor */
+    eina_accessor_free(acc);
 
-    /* Freeing the array */
+    /* Freeing the array */
 
-    return 0;
+    return 0;
 }
 
    
 
    • 
@@ -501,7 +501,7 @@ random_access()
 
    An inline array is a container that stores the data itself, not the pointers to the data. This means there is no memory fragmentation, and for small data types, such as char, short, and int, it is more memory-efficient. This is because the data is stored in the cache and is faster to access. The bigger the data gets, however, the less likely it is and the less interesting it becomes.
    
 
    To create an inline array, use the eina_inarray_new() function:
    
 
    • The first parameter is the size of the value. In this example, only the characters are stored, and because of that, only sizeof(char) is passed to the function.
      • 
-
    • The second parameter defines the size of the array allocation step. For example, if you set it to 4, the function returns an inline array of 4 elements, and the next time you grow the inline array, it grows by 4 elements and becomes an array of 8 elements. If you set the step to 0, the function sets a default safe value. 
+
    • The second parameter defines the size of the array allocation step. For example, if you set it to 4, the function returns an inline array of 4 elements, and the next time you grow the inline array, it grows by 4 elements and becomes an array of 8 elements. If you set the step to 0, the function sets a default safe value.
 
      The step can be changed later on using the eina_inarray_step_set() function.
    
 
 
    The eina_inarray_new() function returns a pointer to the new Eina_Inarray variable.
    
@@ -509,16 +509,16 @@ random_access()
 int
 inline_array()
 {
-    /* Declare an inline array variable of the type Eina_Inarray */
-    Eina_Inarray *iarr;
+    /* Declare an inline array variable of the type Eina_Inarray */
+    Eina_Inarray *iarr;
 
-    /* Create an inline array of "char" */
-    iarr = eina_inarray_new(sizeof(char), 0);
+    /* Create an inline array of "char" */
+    iarr = eina_inarray_new(sizeof(char), 0);
 
-    /* When no longer needed, free the array memory */
-    eina_inarray_free(iarr);
+    /* When no longer needed, free the array memory */
+    eina_inarray_free(iarr);
 
-    return 0;
+    return 0;
 }
 
 
@@ -530,7 +530,7 @@ inline_array()
 
    To add data as the last element of the inline array, use the eina_inarray_push() function. The first parameter is a pointer to the array variable returned by the eina_inarray_new() function. The second parameter is the data you want to push to the inline array.
    
 
    If everything runs fine, the function returns the index of the new element. If something goes wrong, it returns -1.
    
 
    -ch = 'a';
+ch = 'a';
 eina_inarray_push(iarr, &ch);
 
    
 
@@ -541,15 +541,15 @@ eina_inarray_push(iarr, &ch);
 
  • The last parameter is a pointer to the content to be added.
    • 
 
    The content of the pointer is copied to the given position in the inline array. All the members from the position to the end of the array are shifted towards the end. If the position is equal to the end of the array, the member is appended. If the position is bigger than the array length, the function fails.
    
 
    -ch = 'a';
+ch = 'a';
 eina_inarray_push(iarr, &ch);
-ch = 'b';
+ch = 'b';
 eina_inarray_push(iarr, &ch);
-ch = 'd';
+ch = 'd';
 eina_inarray_push(iarr, &ch);
 
 /* Adding data on position 3 */
-ch = 'c';
+ch = 'c';
 eina_inarray_insert_at(iarr, 2, &ch);
 
    
 
@@ -558,7 +558,7 @@ eina_inarray_insert_at(iarr, 2, &ch);
 
    In both functions:
    
 
    • The first parameter is a pointer to the array variable returned by the eina_inarray_new() function.
      • 
 
    • The second parameter is the data you want to push to the inline array.
      • 
-
    • The last parameter is the callback comparison function. 
+
    • The last parameter is the callback comparison function.
 
      The Eina_Compare_Cb callback function compares data1 and data2. data1 is the value contained in the inline array and data2 is the data you pass to the eina_inarray_insert() or eina_inarray_insert_sorted() function as the second parameter. If data1 is less than data2, -1 must be returned, if it is greater, 1 must be returned, and if they are equal, 0 must be returned.
    
 
    The following example shows how to insert a value before a greater value:
    
 
    @@ -566,33 +566,33 @@ eina_inarray_insert_at(iarr, 2, &ch);
 Eina_Compare_Cb
 cmp(const void *a, const void *b)
 {
-    return *(int*)a > *(int*)b;
+    return *(int*)a > *(int*)b;
 }
 
 int
 inline_insert()
 {
-    Eina_Inarray *iarr;
-    char ch;
-    char *ch3;
-    int a;
-    int *b;
-
-    /* Creating an inline array */
-
-    /* Adding data to the inline array */
-    a = 97;
-    eina_inarray_push(iarr, &a);
-    a = 98;
-    eina_inarray_push(iarr, &a);
-    a = 100;
-    eina_inarray_push(iarr, &a);
-
-    /* Inserting data with the criteria */
-    a = 99;
-    eina_inarray_insert_sorted(iarr, &a, cmp);
-
-    eina_inarray_free(iarr);
+    Eina_Inarray *iarr;
+    char ch;
+    char *ch3;
+    int a;
+    int *b;
+
+    /* Creating an inline array */
+
+    /* Adding data to the inline array */
+    a = 97;
+    eina_inarray_push(iarr, &a);
+    a = 98;
+    eina_inarray_push(iarr, &a);
+    a = 100;
+    eina_inarray_push(iarr, &a);
+
+    /* Inserting data with the criteria */
+    a = 99;
+    eina_inarray_insert_sorted(iarr, &a, cmp);
+
+    eina_inarray_free(iarr);
 }
 
    
 
@@ -612,7 +612,7 @@ eina_inarray_pop(iarr);
 
     iarr = eina_inarray_new(sizeof(char), 0);
 
-ch = 'a';
+ch = 'a';
 eina_inarray_push(iarr, &ch);
 
 /* Removing data from the array */
@@ -622,7 +622,7 @@ eina_inarray_remove(iarr, &ch);
 
 
  • 
 
    To remove data from a defined position in an inline array, use the eina_inarray_remove_at() function. The first parameter is a pointer to the array variable returned by the eina_inarray_new() function. The second parameter is the index of the element you want to remove from the inline array.
    
-
    The function returns EINA_TRUE on success and EINA_FALSE if something goes wrong. The member is removed from the inline array and any members after it are moved towards the array's head.
    
+
    The function returns EINA_TRUE on success and EINA_FALSE if something goes wrong. The member is removed from the inline array and any members after it are moved towards the array's head.
    
 
     /* Removing data from position 2 */
 eina_inarray_remove_at(iarr, 2);
@@ -639,10 +639,10 @@ eina_inarray_flush(iarr);
 
    • The first parameter is a pointer to the array variable returned by the eina_inarray_new() function.
      • 
 
    • The second parameter is the index of the element you want to remove from the inline array.
      • 
 
    • The last parameter is the data you want to copy in place of the current data.
    
-
    The function returns EINA_TRUE on success, and EINA_FALSE on failure. The given pointer content is copied to the given position in the array. The pointer is not referenced, instead its contents are copied to the member's array using the previously defined member_size. If the position does not exist, the function fails.
    
+
    The function returns EINA_TRUE on success, and EINA_FALSE on failure. The given pointer content is copied to the given position in the array. The pointer is not referenced, instead its contents are copied to the member's array using the previously defined member_size. If the position does not exist, the function fails.
    
 
     /* Replacing the member at position 3 */
-ch = 'd';
+ch = 'd';
 eina_inarray_replace_at(iarr, 3, &ch);
 
    
 
    • 
@@ -650,33 +650,33 @@ eina_inarray_replace_at(iarr, 3, &ch);
 
  • 
 
    To sort an inline array, use the eina_inarray_sort() function, which applies a quick sorting algorithm to the inline array:
    
 
    • The first parameter is a pointer to the array returned by the eina_inarray_new() function.
      • 
-
    • The last parameter is the Eina_Compare_Cb callback comparison function, which compares data1 and data2. 
+
    • The last parameter is the Eina_Compare_Cb callback comparison function, which compares data1 and data2.
 
      data1 and data2 are values contained in the inline array. If the data matches, the function must return 0, if data1 is less than data2, -1 must be returned and if it is greater, 1 must be returned.
    
 
     static int
 short_cmp(const void *pa, const void *pb)
 {
-    const short *a = pa, *b = pb;
+    const short *a = pa, *b = pb;
 
-    return *a - *b;
+    return *a - *b;
 }
 
 int
 sorting_inline_array()
 {
-    Eina_Inarray *array;
-    int i;
+    Eina_Inarray *array;
+    int i;
 
-    /* Creating and populating the inline array */
+    /* Creating and populating the inline array */
 
-    eina_inarray_sort(array, short_cmp);
-    eina_inarray_free(array);
+    eina_inarray_sort(array, short_cmp);
+    eina_inarray_free(array);
 }
 
    
 
 
    Be careful, the data given to the compare function is the pointer to the member memory itself. Do not change it.
    
 
    • 
- 
+
 
 
    Accessing Inline Array Data
    
 
@@ -694,25 +694,25 @@ sorting_inline_array()
 Eina_Compare_Cb
 compare(const void *pa, const void *pb)
 {
-    const short *a = pa, *b = pb;
-    if (*a == *b)
-        return EINA_TRUE;
+    const short *a = pa, *b = pb;
+    if (*a == *b)
+        return EINA_TRUE;
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 int
 search_inline_array()
 {
-    Eina_Inarray *array;
-    int i;
-    int elm_index;
-    int to_search = 3;
+    Eina_Inarray *array;
+    int i;
+    int elm_index;
+    int to_search = 3;
 
-    /* Creating and populating the inline array */
+    /* Creating and populating the inline array */
 
-    elm_index = eina_inarray_search(array, &to_search, compare);
-    eina_inarray_free(array);
+    elm_index = eina_inarray_search(array, &to_search, compare);
+    eina_inarray_free(array);
 }
 
    
 
@@ -723,7 +723,7 @@ search_inline_array()
 
  • 
 
    To get the number of elements in an inline array, use the eina_inarray_count(). The first parameter is a pointer to the array returned by the eina_inarray_new() function. The function returns an unsigned int, the number of elements.
    
 
    -printf("Inline array of integers with %d elements:\n", eina_inarray_count(iarr));
+printf("Inline array of integers with %d elements:\n", eina_inarray_count(iarr));
 
    
 
    • 
 
@@ -747,7 +747,7 @@ a = 99;
 eina_inarray_push(iarr, &a);
 
 EINA_INARRAY_FOREACH(iarr, b)
-    printf("int: %d(pointer: %p)\n", *b, b);
+    printf("int: %d(pointer: %p)\n", *b, b);
 
 
 
  • To process the array data, use the eina_inarray_foreach() function, which invokes the given function on each element of the array with the given data:
@@ -761,32 +761,32 @@ EINA_INARRAY_FOREACH(iarr, b)
 static Eina_Bool
 array_foreach(const void *array __UNUSED__, void *p, void *user_data __UNUSED__)
 {
-    short *member = p;
-    int *i = user_data;
-    (*p)++;
-    (*i)++;
+    short *member = p;
+    int *i = user_data;
+    (*p)++;
+    (*i)++;
 
-    return EINA_TRUE;
+    return EINA_TRUE;
 }
 
 int
 inline_array_foreach()
 {
-    Eina_Inarray *iarr;
-    iarr = eina_inarray_new(sizeof(char), 1);
-    int i;
+    Eina_Inarray *iarr;
+    iarr = eina_inarray_new(sizeof(char), 1);
+    int i;
 
-    for (i = 0; i < numbers_count; i++) {
-        short val = i;
-        eina_inarray_push(iarr, &val);
-    }
+    for (i = 0; i < numbers_count; i++) {
+        short val = i;
+        eina_inarray_push(iarr, &val);
+    }
 
-    i = 0;
-    eina_inarray_foreach(iarr, array_foreach, &i);
+    i = 0;
+    eina_inarray_foreach(iarr, array_foreach, &i);
 
-    eina_inarray_free(iarr);
+    eina_inarray_free(iarr);
 
-    return 0;
+    return 0;
 }
 
 
    • 
@@ -801,32 +801,32 @@ inline_array_foreach()
 static Eina_Bool
 array_foreach(const void *array __UNUSED__, void *p, void *user_data __UNUSED__)
 {
-    short *member = p;
-    int *i = user_data;
-    if (*i == *p)
-        return EINA_TRUE;
+    short *member = p;
+    int *i = user_data;
+    if (*i == *p)
+        return EINA_TRUE;
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 int
 inline_array_foreach_remove()
 {
-    Eina_Inarray *iarr;
-    iarr = eina_inarray_new(sizeof(char), 1);
-    int i;
+    Eina_Inarray *iarr;
+    iarr = eina_inarray_new(sizeof(char), 1);
+    int i;
 
-    for (i = 0; i < numbers_count; i++) {
-        short val = i;
-        eina_inarray_push(iarr, &val);
-    }
+    for (i = 0; i < numbers_count; i++) {
+        short val = i;
+        eina_inarray_push(iarr, &val);
+    }
 
-    i = 6;
-    eina_inarray_foreach_remove(iarr, array_foreach, &i);
+    i = 6;
+    eina_inarray_foreach_remove(iarr, array_foreach, &i);
 
-    eina_inarray_free(iarr);
+    eina_inarray_free(iarr);
 
-    return 0;
+    return 0;
 }
 
 
@@ -838,7 +838,7 @@ inline_array_foreach_remove()
 
 
    Hash Tables
    
 
    The Eina_Hash provides a way to store values in association with a key. For example, if you want to store some tuples into a table, you can do it using the Eina_Hash.
    
-
    The Eina_Hash is implemented using an array of "buckets" where each bucket is a pointer to a structure that is the head of a red-black tree. This implementation makes it very robust against week keys as in the worst case scenario, you can still depend on an efficient binary tree implementation.
    
+
    The Eina_Hash is implemented using an array of "buckets" where each bucket is a pointer to a structure that is the head of a red-black tree. This implementation makes it very robust against week keys as in the worst case scenario, you can still depend on an efficient binary tree implementation.
    
 
 
    Creating a Hash Table
    
 
@@ -865,8 +865,8 @@ inline_array_foreach_remove()
 
  • Create the phone book structure and some static data:
    
 
     struct _Phone_Entry {
-    const char *name; /* Full name */
-    const char *number; /* Phone number */
+    const char *name; /* Full name */
+    const char *number; /* Phone number */
 };
 
 typedef struct _Phone_Entry Phone_Entry;
@@ -874,11 +874,11 @@ typedef struct _Phone_Entry Phone_Entry;
 static Phone_Entry
 _start_entries[] =
 {
-    {"Wolfgang Amadeus Mozart", "+01 23 456-78910"},
-    {"Ludwig van Beethoven", "+12 34 567-89101"},
-    {"Richard Georg Strauss", "+23 45 678-91012"},
-    {"Heitor Villa-Lobos", "+34 56 789-10123"},
-    {NULL, NULL}
+    {"Wolfgang Amadeus Mozart", "+01 23 456-78910"},
+    {"Ludwig van Beethoven", "+12 34 567-89101"},
+    {"Richard Georg Strauss", "+23 45 678-91012"},
+    {"Heitor Villa-Lobos", "+34 56 789-10123"},
+    {NULL, NULL}
 };
 
    
 
    • 
@@ -888,7 +888,7 @@ _start_entries[] =
 static void
 _phone_entry_free_cb(void *data)
 {
-    free(data);
+    free(data);
 }
 
 
    The free callback can be changed later using the eina_hash_free_cb_set() function. You need to pass the hash and the new callback function.
    
@@ -900,12 +900,12 @@ _phone_entry_free_cb(void *data)
 int
 free_data()
 {
-    Eina_Hash *phone_book = NULL;
-    phone_book = eina_hash_string_superfast_new(_phone_entry_free_cb);
+    Eina_Hash *phone_book = NULL;
+    phone_book = eina_hash_string_superfast_new(_phone_entry_free_cb);
 
-    /* Empty the phone book without destroying it */
-    eina_hash_free_buckets(phone_book);
-    eina_hash_free(phone_book);
+    /* Empty the phone book without destroying it */
+    eina_hash_free_buckets(phone_book);
+    eina_hash_free(phone_book);
 }
 
 
@@ -923,21 +923,21 @@ free_data()
 
    The following example shows how to add the initial data declared earlier to the hash:
    
 
     for (i = 0; _start_entries[i].name != NULL; i++)
-    eina_hash_add(phone_book, _start_entries[i].name, strdup(_start_entries[i].number));
+    eina_hash_add(phone_book, _start_entries[i].name, strdup(_start_entries[i].number));
 
    
 
 
    The Eina_Hash offers various ways to add elements to a hash, such as the eina_hash_direct_add() function, which adds the entry without duplicating the string key. The key is stored in the struct, so this function can be used with eina_stringshare to avoid key data duplication.
    
 
     for (i = 0; _start_entries[i].name != NULL; i++) {
-    /* Allocating memory for the phone entry */
-    Phone_Entry *e = malloc(sizeof(Phone_Entry));
+    /* Allocating memory for the phone entry */
+    Phone_Entry *e = malloc(sizeof(Phone_Entry));
 
-    /* Creating an eina_stringshare for the name and the phone number */
-    e->name = eina_stringshare_add(_start_entries[i].name);
-    e->number = eina_stringshare_add(_start_entries[i].number);
+    /* Creating an eina_stringshare for the name and the phone number */
+    e->name = eina_stringshare_add(_start_entries[i].name);
+    e->number = eina_stringshare_add(_start_entries[i].number);
 
-    /* Adding the entry to the hash */
-    eina_hash_direct_add(phone_book, e->name, e);
+    /* Adding the entry to the hash */
+    eina_hash_direct_add(phone_book, e->name, e);
 }
 
    
 
@@ -948,17 +948,17 @@ for (i = 0; _start_entries[i].name != NULL; i++) {
 char *old_phone = NULL;
 char *phone = NULL;
 /* Replace the phone number of Richard Strauss */
-old_phone = eina_hash_modify(phone_book, "Richard Georg Strauss",
-                             strdup("+23 45 111-11111"));
-phone = eina_hash_set(phone_book, "Philippe de Magalhães", strdup("+33 6 111-11111"));
-eina_hash_set(phone_book, "Richard Georg Strauss", strdup("+23 45 111-117711"));
+old_phone = eina_hash_modify(phone_book, "Richard Georg Strauss",
+                             strdup("+23 45 111-11111"));
+phone = eina_hash_set(phone_book, "Philippe de Magalhães", strdup("+33 6 111-11111"));
+eina_hash_set(phone_book, "Richard Georg Strauss", strdup("+23 45 111-117711"));
 
 
 
  • 
 
    To change the key associated with the data without freeing and creating a new entry, use the eina_hash_move() function. You only have to pass the hash, the old key, and the new key. If the operation succeeds, the function returns EINA_TRUE, if not, it returns EINA_FALSE.
    
 
     Eina_Bool res;
-res = eina_hash_move(phone_book, "Philippe de Magalhães", "Filipe de Magalhães");
+res = eina_hash_move(phone_book, "Philippe de Magalhães", "Filipe de Magalhães");
 
    
 
    • 
 
  • 
@@ -966,18 +966,18 @@ res = eina_hash_move(phone_book, "Philippe de Magalhães", "Filip
 
    • Use the eina_hash_del() function to remove the entry identified by a key or data from the given hash table:
 
       Eina_Bool r;
-const char *entry_name = "Heitor Villa-Lobos";
+const char *entry_name = "Heitor Villa-Lobos";
 r = eina_hash_del(phone_book, entry_name, NULL);
 
      • 
 
    • Use the eina_hash_del_by_key() function to remove an entry based on the key:
 
      -r = eina_hash_del_by_key(phone_book, "Richard Georg Strauss");
+r = eina_hash_del_by_key(phone_book, "Richard Georg Strauss");
 
      
 
      • 
 
    • 
 
      Use the eina_hash_del_by_data() function to remove an entry based on the data:
      
 
      -r = eina_hash_del_by_data(phone_book, "+12 34 567-89101");
+r = eina_hash_del_by_data(phone_book, "+12 34 567-89101");
 
      
 
      • 
 
    • 
@@ -989,7 +989,7 @@ r = eina_hash_del_by_data(phone_book, "+12 34 567-89101");
 
    To retrieve an entry based on its key, use the eina_hash_find() function by passing the hash and the key you are looking for:
    
 
     char *phone = NULL;
-const char *entry_name = "Heitor Villa-Lobos";
+const char *entry_name = "Heitor Villa-Lobos";
 
 /* Look for a specific entry and get its phone number */
 phone = eina_hash_find(phone_book, entry_name);
@@ -1003,7 +1003,7 @@ nb_elm = eina_hash_population(phone_book);
 
    
 
 
-
  • To iterate through a hash table, you can use various methods: 
+
  • To iterate through a hash table, you can use various methods:
 
      
 
 
    • To iterate over the hash table, use the eina_hash_foreach() function:
@@ -1018,21 +1018,21 @@ nb_elm = eina_hash_population(phone_book);
 
       static Eina_Bool
 pb_foreach_cb(const Eina_Hash *phone_book, const void *key,
-              void *data, void *fdata)
+              void *data, void *fdata)
 {
-    const char *name = key;
-    const char *number = data;
-    printf("%s: %s\n", name, number);
+    const char *name = key;
+    const char *number = data;
+    printf("%s: %s\n", name, number);
 
-    /* Return EINA_FALSE to stop this callback from being called */
-    return EINA_TRUE;
+    /* Return EINA_FALSE to stop this callback from being called */
+    return EINA_TRUE;
 }
 
-printf("List of phones:\n");
+printf("List of phones:\n");
 
 /* Running the callback on the hash called phone_book */
 eina_hash_foreach(phone_book, pb_foreach_cb, NULL);
-printf("\n");
+printf("\n");
 
      
 
      • 
 
    • To iterate over the keys, use the eina_hash_iterator_key_new() function:
@@ -1040,18 +1040,18 @@ printf("\n");
 /* Declaration of the Eina_Iterator */
 Eina_Iterator *it;
 
-/* Variable to handle the current iteration "data" */
+/* Variable to handle the current iteration "data" */
 void *data;
 
 /* Iterate over the keys (names) */
-printf("List of names in the phone book:\n");
+printf("List of names in the phone book:\n");
 
 it = eina_hash_iterator_key_new(phone_book);
 
 /* Use the generic eina_iterator_next() */
 while (eina_iterator_next(it, &data)) {
-    const char *name = data;
-    printf("%s\n", name);
+    const char *name = data;
+    printf("%s\n", name);
 }
 
 /* Free the iterator */
@@ -1064,16 +1064,16 @@ eina_iterator_free(it);
 /* Declaration of the Eina_Iterator */
 Eina_Iterator *it;
 
-/* Variable to handle the current iteration "data" */
+/* Variable to handle the current iteration "data" */
 void *data;
 
 /* Iterate over hash data */
-printf("List of numbers in the phone book:\n");
+printf("List of numbers in the phone book:\n");
 
 it = eina_hash_iterator_data_new(phone_book);
 while (eina_iterator_next(it, &data)) {
-    const char *number = data;
-    printf("%s\n", number);
+    const char *number = data;
+    printf("%s\n", number);
 }
 
 /* Free the iterator */
@@ -1085,16 +1085,16 @@ eina_iterator_free(it);
 /* Declaration of the Eina_Iterator */
 Eina_Iterator *tit;
 
-/* Variable to handle the current iteration "data" */
+/* Variable to handle the current iteration "data" */
 void *tuple;
 
-printf("List of phones:\n");
+printf("List of phones:\n");
 tit = eina_hash_iterator_tuple_new(phone_book);
 while (eina_iterator_next(tit, &tuple)) {
-    Eina_Hash_Tuple *t = tuple;
-    const char *name = t->key;
-    const char *number = t->data;
-    printf("%s: %s\n", name, number);
+    Eina_Hash_Tuple *t = tuple;
+    const char *name = t->key;
+    const char *number = t->data;
+    printf("%s: %s\n", name, number);
 }
 
 /* Always free the iterator after its use */
@@ -1108,10 +1108,10 @@ eina_iterator_free(tit);
 
 
      Lists
      
 
-
      The Eina_List is a double-linked list that can store data of any type as void pointers. It provides a set of functions to create and manipulate the list to avoid the access to the struct's fields, similar to a self-made double-link list.
      
+
      The Eina_List is a double-linked list that can store data of any type as void pointers. It provides a set of functions to create and manipulate the list to avoid the access to the struct's fields, similar to a self-made double-link list.
      
 
      In addition to the previous and next node and its data, the Eina_List nodes keep a reference to an accounting structure. The accounting structure is used to improve the performance of some functions. The structure is private and must not be modified.
      
 
-
      In an Eina_List, everything is a "list": the list itself is a list where each node is a list as well.
      
+
      In an Eina_List, everything is a "list": the list itself is a list where each node is a list as well.
      
 
 
      Eina provides 2 list types: the classic list (Eina_List) and an inline list (Eina_Inlist).
      
 
@@ -1123,28 +1123,28 @@ eina_iterator_free(tit);
 int
 list()
 {
-    /* Declaration of the Eina_List with NULL as default value */
-    Eina_List *list = NULL;
+    /* Declaration of the Eina_List with NULL as default value */
+    Eina_List *list = NULL;
 
      • 
 
 
    • Call the eina_list_append() function with the list and the data you want to append as parameters.
 
      The list must be a pointer to the first element of the list (or NULL). The function returns a pointer to the list.
      
 
      -    /* Creating the first element of the list */
-    list = eina_list_append(list, "watch");
+    /* Creating the first element of the list */
+    list = eina_list_append(list, "watch");
 
-    /* Adding more elements */
-    list = eina_list_append(list, "phone");
-    list = eina_list_append(list, "ivi");
-    list = eina_list_append(list, "notebook");
+    /* Adding more elements */
+    list = eina_list_append(list, "phone");
+    list = eina_list_append(list, "ivi");
+    list = eina_list_append(list, "notebook");
 
      • 
 
 
    • When you no longer need the list, free it:
 
      -    /* Free the Eina_List */
-    eina_list_free(list);
+    /* Free the Eina_List */
+    eina_list_free(list);
 
-    return 0;
+    return 0;
 }
 
      • 
 
@@ -1160,20 +1160,20 @@ list()
 
        
 
      • To add data at the end of the list, use the eina_list_append() function. To add data at the top of the list, use eina_list_prepend(). The functions work in the same way, only adding the data to different places.
 
        -list = eina_list_prepend(list, "set-top box");
+list = eina_list_prepend(list, "set-top box");
 
        
 
        • 
 
 
      • To insert data into the list after a specified data, use the eina_list_append_relative() function. As the last parameter, define the element after which the data is added.
-
        For example to append data after the "phone" element:
        
+
        For example to append data after the "phone" element:
        
 
        -list = eina_list_append_relative(list, "single-board computer", "phone");
+list = eina_list_append_relative(list, "single-board computer", "phone");
 
        
 
        • 
 
 
      • To add a new entry before a specified data, use the eina_list_prepend_relative() function. It is similar to the eina_list_append_relative() function.
 
        -list = eina_list_prepend_relative(list, "ultrabook", "ivi");
+list = eina_list_prepend_relative(list, "ultrabook", "ivi");
 
        
 
        • 
 
@@ -1182,45 +1182,45 @@ list = eina_list_prepend_relative(list, "ultrabook", "ivi");
 
      
 
 
-
    • To set data in a list member, use the eina_list_data_set() function. Pass the "list" (node) as the first argument and the data to set as the second.
+
    • To set data in a list member, use the eina_list_data_set() function. Pass the "list" (node) as the first argument and the data to set as the second.
 
 
      The following example also shows the usage of the eina_list_last() function, which returns the last element of an Eina_List.
      
 
 
       /* Setting new data for the last element */
-eina_list_data_set(eina_list_last(list), eina_stringshare_add("Boris"));
+eina_list_data_set(eina_list_last(list), eina_stringshare_add("Boris"));
 
      
 
      • 
 
 
    • To remove a node from the list, use the eina_list_remove() function. This function removes the first instance of the specified data from the given list.
 
      -list = eina_list_remove(list, "ultrabook");
+list = eina_list_remove(list, "ultrabook");
 
      
-
      You can also remove a "list" (node) from a list using the eina_list_remove_list() function. Pass the list you want to delete an element from and a 'list' (node) you want to delete.
      
+
      You can also remove a "list" (node) from a list using the eina_list_remove_list() function. Pass the list you want to delete an element from and a 'list' (node) you want to delete.
      
 
       Eina_List *app_list = NULL;
 Eina_List *to_remove = NULL;
 
 /* Adding some elements to the list (using stringshares) */
-app_list = eina_list_append(app_list, eina_stringshare_add("enna"));
-app_list = eina_list_append(app_list, eina_stringshare_add("ebird"));
-app_list = eina_list_append(app_list, eina_stringshare_add("calaos"));
-app_list = eina_list_append(app_list, eina_stringshare_add("rage"));
-app_list = eina_list_append(app_list, eina_stringshare_add("terminology"));
-app_list = eina_list_append(app_list, eina_stringshare_add("enlightenment"));
-app_list = eina_list_append(app_list, eina_stringshare_add("eyelight"));
-app_list = eina_list_append(app_list, eina_stringshare_add("ephoto"));
-
-/* Finding the "list" to remove */
-to_remove = eina_list_data_find_list(list, eina_string_share_add("enlightenment"));
+app_list = eina_list_append(app_list, eina_stringshare_add("enna"));
+app_list = eina_list_append(app_list, eina_stringshare_add("ebird"));
+app_list = eina_list_append(app_list, eina_stringshare_add("calaos"));
+app_list = eina_list_append(app_list, eina_stringshare_add("rage"));
+app_list = eina_list_append(app_list, eina_stringshare_add("terminology"));
+app_list = eina_list_append(app_list, eina_stringshare_add("enlightenment"));
+app_list = eina_list_append(app_list, eina_stringshare_add("eyelight"));
+app_list = eina_list_append(app_list, eina_stringshare_add("ephoto"));
+
+/* Finding the "list" to remove */
+to_remove = eina_list_data_find_list(list, eina_string_share_add("enlightenment"));
 
 list = eina_list_remove_list(list, to_remove);
 
      
 
      • 
 
-
    • To move elements in a list, you can use various function, such as eina_list_promote_list() that promotes an element to the top of the list or eina_list_demote_list() that puts the specified element at the end of the list. Remember that everything is a list so the second parameter represents the "list" (node) you want to move. Use the functions just like the eina_list_remove_list() function.
+
    • To move elements in a list, you can use various function, such as eina_list_promote_list() that promotes an element to the top of the list or eina_list_demote_list() that puts the specified element at the end of the list. Remember that everything is a list so the second parameter represents the "list" (node) you want to move. Use the functions just like the eina_list_remove_list() function.
 
      -list = eina_list_promote_list(list, eina_list_data_find_list(list, "ivi"));
+list = eina_list_promote_list(list, eina_list_data_find_list(list, "ivi"));
 
      
 
      • 
 
    • To reverse all the elements of a list, use the eina_list_reverse() function. To obtain a reversed copy of the list while keeping the initial list unchanged, use the eina_list_reverse_clone() function.
@@ -1236,14 +1236,14 @@ rev_copy = eina_list_reverse_clone(app_list);
 int
 sort_cb(const void *d1, const void *d2)
 {
-    const char *txt = d1;
-    const char *txt2 = d2;
-    if (!txt)
-        return(1);
-    if (!txt2)
-        return(-1);
-
-    return(strcmp(txt, txt2));
+    const char *txt = d1;
+    const char *txt2 = d2;
+    if (!txt)
+        return(1);
+    if (!txt2)
+        return(-1);
+
+    return(strcmp(txt, txt2));
 }
 
 extern Eina_List *list;
@@ -1255,14 +1255,14 @@ list = eina_list_sort(list, 0, sort_cb);
 int
 sort_cb(void *d1, void *d2)
 {
-    const char *txt = NULL;
-    const char *txt2 = NULL;
-    if (!d1)
-        return(1);
-    if (!d2)
-        return(-1);
-
-    return(strcmp((const char*)d1, (const char*)d2));
+    const char *txt = NULL;
+    const char *txt2 = NULL;
+    if (!d1)
+        return(1);
+    if (!d2)
+        return(-1);
+
+    return(strcmp((const char*)d1, (const char*)d2));
 }
 
 Eina_List *sorted1;
@@ -1279,7 +1279,7 @@ newlist = eina_list_sorted_merge(sorted1, sorted2, sort_cb);
 
      • 
 
    • To split a list, use the eina_list_split_list() function:
 
      • The first parameter is the list to split.
        • 
-
      • The second parameter is the "list" (element) after which the list is split.
        • 
+
      • The second parameter is the "list" (element) after which the list is split.
        • 
 
      • The last parameter is the head of the second list.
      
 
       /* Original list (left list) */
@@ -1291,15 +1291,15 @@ Eina_List *other_list = NULL;
 /* Eina_List (element) */
 Eina_List *l;
 
-list = eina_list_append(list, "super tux");
-list = eina_list_append(list, "frozen bubble");
-list = eina_list_append(list, "lincity-ng");
+list = eina_list_append(list, "super tux");
+list = eina_list_append(list, "frozen bubble");
+list = eina_list_append(list, "lincity-ng");
 
 /* Sorting the list (just for fun) */
 list = eina_list_sort(list, 0, cmp_func);
 
-/* Looking for the 'split' element */
-l = eina_list_search_sorted_list(list, cmp_func, "frozen bubble");
+/* Looking for the 'split' element */
+l = eina_list_search_sorted_list(list, cmp_func, "frozen bubble");
 
 /* Splitting the list */
 list = eina_list_split_list(list, l, &other_list);
@@ -1326,26 +1326,26 @@ Eina_List *app_list = NULL;
 const char *res_str;
 
 /* Adding some elements to the list (using stringshares) */
-app_list = eina_list_append(app_list, eina_stringshare_add("enna"));
-app_list = eina_list_append(app_list, eina_stringshare_add("ebird"));
-app_list = eina_list_append(app_list, eina_stringshare_add("calaos"));
-app_list = eina_list_append(app_list, eina_stringshare_add("rage"));
-app_list = eina_list_append(app_list, eina_stringshare_add("terminology"));
-app_list = eina_list_append(app_list, eina_stringshare_add("enlightenment"));
-app_list = eina_list_append(app_list, eina_stringshare_add("eyelight"));
-app_list = eina_list_append(app_list, eina_stringshare_add("ephoto"));
+app_list = eina_list_append(app_list, eina_stringshare_add("enna"));
+app_list = eina_list_append(app_list, eina_stringshare_add("ebird"));
+app_list = eina_list_append(app_list, eina_stringshare_add("calaos"));
+app_list = eina_list_append(app_list, eina_stringshare_add("rage"));
+app_list = eina_list_append(app_list, eina_stringshare_add("terminology"));
+app_list = eina_list_append(app_list, eina_stringshare_add("enlightenment"));
+app_list = eina_list_append(app_list, eina_stringshare_add("eyelight"));
+app_list = eina_list_append(app_list, eina_stringshare_add("ephoto"));
 
 /* Finding the data */
-res_str = eina_list_data_find(list, eina_string_share_add("enlightenment"));
-if (res_str == eina_stringshare_add("enlightenment"))
-    printf("Data is present");
+res_str = eina_list_data_find(list, eina_string_share_add("enlightenment"));
+if (res_str == eina_stringshare_add("enlightenment"))
+    printf("Data is present");
 else
-    printf("Data not present");
+    printf("Data not present");
 
      
 
-
      The above example returns "Data is present".
      
+
      The above example returns "Data is present".
      
 
      The eina_list_data_find_list() function does the same thing as eina_list_data_find(), but returns an Eina_List. For an example, see the eina_list_remove_list() function.
      
-
      You can access the data or a "list" (node) of an Eina_List using the eina_list_nth() and eina_list_nth_list() functions. The first one returns a pointer to the data of the "n" element and the second a pointer to the "list". To access the data of the third element of an Eina_List:
      
+
      You can access the data or a "list" (node) of an Eina_List using the eina_list_nth() and eina_list_nth_list() functions. The first one returns a pointer to the data of the "n" element and the second a pointer to the "list". To access the data of the third element of an Eina_List:
      
 
       const char *res;
 Eina_List *res_lst;
@@ -1354,7 +1354,7 @@ res = eina_list_nth(app_list, 2);
 res_lst = eina_list_nth_list(app_list, 2);
 
      
 
-
      The res variable contains the pointer to the string "calaos". The res_lst variable is the list containing "calaos".
      
+
      The res variable contains the pointer to the string "calaos". The res_lst variable is the list containing "calaos".
      
 
      • 
 
 
    • To search for data in a list, select your function based on whether the list is sorted or unsorted.
@@ -1364,7 +1364,7 @@ res_lst = eina_list_nth_list(app_list, 2);
 
    • The second parameter is a callback function for comparison.
      • 
 
    • The last parameter is the data you are looking for.
    
 
-
    The eina_list_search_unsorted_list() function does the same but returns an "Eina_List".
    
+
    The eina_list_search_unsorted_list() function does the same but returns an "Eina_List".
    
 
 
 
    The following example shows 2 searches using both the eina_list_search_unsorted() and eina_list_search_unsorted_list() functions:
    
@@ -1372,30 +1372,30 @@ res_lst = eina_list_nth_list(app_list, 2);
 int
 search_list()
 {
-    /* Declaring the list */
-    Eina_List *list = NULL;
-    Eina_List *l;
-    /* Little trick to use strcmp as Eina_Compare_Cb */
-    Eina_Compare_Cb cmp_func = (Eina_Compare_Cb)strcmp;
+    /* Declaring the list */
+    Eina_List *list = NULL;
+    Eina_List *l;
+    /* Little trick to use strcmp as Eina_Compare_Cb */
+    Eina_Compare_Cb cmp_func = (Eina_Compare_Cb)strcmp;
 
-    void *data;
-    int cmp_result;
+    void *data;
+    int cmp_result;
 
-    list = eina_list_append(list, "debian");
-    list = eina_list_append(list, "archlinux");
-    list = eina_list_append(list, "centos");
+    list = eina_list_append(list, "debian");
+    list = eina_list_append(list, "archlinux");
+    list = eina_list_append(list, "centos");
 
-    data = eina_list_search_unsorted(list, cmp_func, "archlinux");
-    l = eina_list_search_unsorted_list(list, cmp_func, "archlinux");
-    if (l->data != data) {
-        eina_list_free(list);
+    data = eina_list_search_unsorted(list, cmp_func, "archlinux");
+    l = eina_list_search_unsorted_list(list, cmp_func, "archlinux");
+    if (l->data != data) {
+        eina_list_free(list);
 
-        return 1;
-    }
+        return 1;
+    }
 
-    eina_list_free(list);
+    eina_list_free(list);
 
-    return 0;
+    return 0;
 }
 
 
@@ -1413,31 +1413,31 @@ search_list()
 int
 list_data_set()
 {
-    /* Declaring the list */
-    Eina_List *list = NULL;
-    /* Eina_List in which to place the elements or lists */
-    Eina_List *l;
-
-    void *list_data;
-
-    list = eina_list_append(list, eina_stringshare_add("Bertrand"));
-    list = eina_list_append(list, eina_stringshare_add("Cedric"));
-    list = eina_list_append(list, eina_stringshare_add("Nicolas"));
-    list = eina_list_append(list, eina_stringshare_add("Vincent"));
-    list = eina_list_append(list, eina_stringshare_add("Raoul"));
-    list = eina_list_append(list, eina_stringshare_add("Fabien"));
-    list = eina_list_append(list, eina_stringshare_add("Philippe"));
-    list = eina_list_append(list, eina_stringshare_add("billiob"));
-
-    for (l = list; l; l = eina_list_next(l)) {
-        /* Printing the data returned by eina_list_data_get */
-        printf("%s\n", (char*)eina_list_data_get(l));
-    }
-
-    EINA_LIST_FREE(list, list_data)
-        eina_stringshare_del(list_data);
-
-    return 0;
+    /* Declaring the list */
+    Eina_List *list = NULL;
+    /* Eina_List in which to place the elements or lists */
+    Eina_List *l;
+
+    void *list_data;
+
+    list = eina_list_append(list, eina_stringshare_add("Bertrand"));
+    list = eina_list_append(list, eina_stringshare_add("Cedric"));
+    list = eina_list_append(list, eina_stringshare_add("Nicolas"));
+    list = eina_list_append(list, eina_stringshare_add("Vincent"));
+    list = eina_list_append(list, eina_stringshare_add("Raoul"));
+    list = eina_list_append(list, eina_stringshare_add("Fabien"));
+    list = eina_list_append(list, eina_stringshare_add("Philippe"));
+    list = eina_list_append(list, eina_stringshare_add("billiob"));
+
+    for (l = list; l; l = eina_list_next(l)) {
+        /* Printing the data returned by eina_list_data_get */
+        printf("%s\n", (char*)eina_list_data_get(l));
+    }
+
+    EINA_LIST_FREE(list, list_data)
+        eina_stringshare_del(list_data);
+
+    return 0;
 }
 
 
    • 
@@ -1446,67 +1446,67 @@ list_data_set()
 
    The following example scrolls backwards starting from the end of the list:
    
 
     for (l = eina_list_last(list); l; l = eina_list_prev(l))
-    printf("%s\n", (char*)eina_list_data_get(l));
+    printf("%s\n", (char*)eina_list_data_get(l));
 
    
 
 
 
 
  • To count the list elements, use the eina_list_count() function. The function returns the number of items in a list.
 
    -printf("List size: %d\n", eina_list_count(list));
+printf("List size: %d\n", eina_list_count(list));
 
    
 
    • 
-
  • To iterate through an array, you can use various iterators: 
+
  • To iterate through an array, you can use various iterators:
 
      
 
    • To iterate over a list from the beginning to the end, use the EINA_LIST_FOREACH macro:
 
      • The first parameter is the list to iterate.
        • 
-
      • The second parameter is an Eina_List * to hold the current "List" (node).
        • 
+
      • The second parameter is an Eina_List * to hold the current "List" (node).
        • 
 
      • The last parameter receives the current data during the run.
      
 
-
      The following example prints the data of each "List" (node) of the list:
      
+
      The following example prints the data of each "List" (node) of the list:
      
 
       Eina_List *list = NULL;
 Eina_List *l;
 void *list_data;
 
-list = eina_list_append(list, "ls");
-list = eina_list_append(list, "top");
-list = eina_list_append(list, "rmdir");
-list = eina_list_append(list, "uname");
+list = eina_list_append(list, "ls");
+list = eina_list_append(list, "top");
+list = eina_list_append(list, "rmdir");
+list = eina_list_append(list, "uname");
 
 EINA_LIST_FOREACH(list, l, list_data)
-    printf("%s\n", (char*)list_data);
+    printf("%s\n", (char*)list_data);
 
 eina_list_free(list);
 
      
 
      • 
 
    • To iterate from the last element to the first, use the EINA_LIST_REVERSE_FOREACH macro. It works similarly as EINA_LIST_FOREACH().
 
      • 
-
    • To iterate over a list from the beginning to the end, you can also use the EINA_LIST_FOREACH_SAFE macro. It is called safe, because it stores the next "List" (node), so you can safely remove the current "List" (node) and continue the iteration.
+
    • To iterate over a list from the beginning to the end, you can also use the EINA_LIST_FOREACH_SAFE macro. It is called safe, because it stores the next "List" (node), so you can safely remove the current "List" (node) and continue the iteration.
 
       Eina_List *list;
 Eina_List *l;
 Eina_List *l_next;
 char *data;
 
-list = eina_list_append(list, "tizen");
-list = eina_list_append(list, "tizen");
-list = eina_list_append(list, "tizen");
-list = eina_list_append(list, "tizen");
+list = eina_list_append(list, "tizen");
+list = eina_list_append(list, "tizen");
+list = eina_list_append(list, "tizen");
+list = eina_list_append(list, "tizen");
 
-/* Using EINA_LIST_FOREACH_SAFE to free the elements that match "tizen" */
+/* Using EINA_LIST_FOREACH_SAFE to free the elements that match "tizen" */
 
 EINA_LIST_FOREACH_SAFE(list, l, l_next, data) {
-    if (strcmp(data, "tizen") == 0) {
-        free(data);
-        list = eina_list_remove_list(list, l);
-    }
+    if (strcmp(data, "tizen") == 0) {
+        free(data);
+        list = eina_list_remove_list(list, l);
+    }
 }
 
      
 
      • 
 
 
-
    • To remove each list element while having access to the node's data, use the EINA_LIST_FREE macro. Pass the list and a pointer to hold the current data.
+
    • To remove each list element while having access to the node's data, use the EINA_LIST_FREE macro. Pass the list and a pointer to hold the current data.
 
       Eina_List *list;
 char *data;
@@ -1514,7 +1514,7 @@ char *data;
 /* List is filled */
 
 EINA_LIST_FREE(list, data)
-    free(data);
+    free(data);
 
      
 
      • 
 
    
@@ -1531,9 +1531,9 @@ EINA_LIST_FREE(list, data)
 
  • Define the structure of the data before creating the inline list:
 
     struct my_struct {
-    EINA_INLIST;
-    int a;
-    int b;
+    EINA_INLIST;
+    int a;
+    int b;
 };
 
    
 
@@ -1547,9 +1547,9 @@ struct my_struct {
 
 
  • 
 
    To create the inlist nodes, allocate the memory and use the eina_inlist_append() function:
    
-
    • The first parameter is the existing list head or NULL to create a new list. 
+
      • The first parameter is the existing list head or NULL to create a new list.
 
        The following example passes NULL to create a new list.
        • 
-
      • The second parameter is the new list node, and it must not be NULL. 
+
      • The second parameter is the new list node, and it must not be NULL.
 
        You must use the EINA_INLIST_GET() macro to get the inlist object of the datastruct.
      
 
       struct my_struct *d;
@@ -1584,7 +1584,7 @@ list = eina_inlist_prepend(list, EINA_INLIST_GET(d));
 
      
 
      • 
 
-
    • Add a node before or after a given node with the eina_inlist_prepend_relative() and eina_inlist_append_relative() functions. 
+
    • Add a node before or after a given node with the eina_inlist_prepend_relative() and eina_inlist_append_relative() functions.
 
      In both functions, the first parameter is the target list, the second is the element you want to add, and the last is the reference element to place data after (in this case). Similarly as in a regular Eina_List, everything is a list, so the last parameter is an Eina_Inlist typed variable.
      
 
       d = malloc(sizeof(*d));
@@ -1598,15 +1598,15 @@ list = eina_inlist_append_relative(list, EINA_INLIST_GET(d), list);
 
 
    • When the inline list is no longer needed, destroy it by looping over the list to free each EINA_INLIST structure and the data using allocated memory. Use the eina_inlist_remove() function on each node.
 
-
      In the following example, the EINA_INLIST_CONTAINER_GET() macro returns the container object of an inlist (the EINA_INLIST of my_struct), and the list element is removed and the allocated memory of the container "object" is freed.
      
+
      In the following example, the EINA_INLIST_CONTAINER_GET() macro returns the container object of an inlist (the EINA_INLIST of my_struct), and the list element is removed and the allocated memory of the container "object" is freed.
      
 
 
       while (list) {
-    struct my_struct *aux = EINA_INLIST_CONTAINER_GET(list, struct my_struct);
+    struct my_struct *aux = EINA_INLIST_CONTAINER_GET(list, struct my_struct);
 
-    /* Remove the current list element */
-    list = eina_inlist_remove(list, list);
-    free(aux);
+    /* Remove the current list element */
+    list = eina_inlist_remove(list, list);
+    free(aux);
 }
 
      
 
      • 
@@ -1638,7 +1638,7 @@ while (list) {
 
    • EINA_VALUE_TYPE_ARRAY: array
      • 
 
    • EINA_VALUE_TYPE_LIST: list
      • 
 
    • EINA_VALUE_TYPE_HASH: hash
      • 
-
    • EINA_VALUE_TYPE_TIMEVAL: 'struct timeval'
      • 
+
    • EINA_VALUE_TYPE_TIMEVAL: 'struct timeval'
      • 
 
    • EINA_VALUE_TYPE_BLOB: blob of bytes
      • 
 
    • EINA_VALUE_TYPE_STRUCT: struct
      • 
 
    
@@ -1674,14 +1674,14 @@ eina_value_set(&v, 123);
 
  • To get the value, use the eina_value_get() function. Pass the Eina_Value as the first argument, and a pointer to a variable to store the value (the target variable must have the same type as the Eina_Value).
 
     eina_value_get(&v, &i);
-printf("v=%d\n", i);
+printf("v=%d\n", i);
 
    
-
    The above example prints "v=123".
    
+
    The above example prints "v=123".
    
 
    • 
 
 
  • To store an Eina_List, use the Eina_Value that corresponds to the EINA_VALUE_TYPE_LIST type.
 
    • 
-
  • To create an Eina_Value_List, use the eina_value_list_setup() function. The function initializes a generic value storage of the list type. The first parameter is the "object" value, and the second one is the type (how to manage the stored list members).
+
  • To create an Eina_Value_List, use the eina_value_list_setup() function. The function initializes a generic value storage of the list type. The first parameter is the "object" value, and the second one is the type (how to manage the stored list members).
 
    • 
 
 
@@ -1689,7 +1689,7 @@ printf("v=%d\n", i);
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
 
-   
+
 
 
 
diff --git a/org.tizen.guides/html/native/ui/efl/data_types_tools_n.htm b/org.tizen.guides/html/native/ui/efl/data_types_tools_n.htm
index 559e3bd..a872f60 100644
--- a/org.tizen.guides/html/native/ui/efl/data_types_tools_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/data_types_tools_n.htm
@@ -34,13 +34,13 @@
 
 
 
    
-   
+
    
    Data Types and Tools
    
 
 
    UI toolkits, such as Qt and Gtk, generally support their own data types, structures, functions, and macros in order for you to easily and efficiently make their applications. EFL, as one of Tizen native UI toolkits, provides data types and useful tools as well.
    
 
-
    The Eina library in EFL implements APIs for data types and structures easy to use and optimized in an efficient way. It also provides some useful tools, such as opening shared libraries, error management, type conversion, time accounting, and memory pool to help convenient application development.
      
-   
+
    The Eina library in EFL implements APIs for data types and structures easy to use and optimized in an efficient way. It also provides some useful tools, such as opening shared libraries, error management, type conversion, time accounting, and memory pool to help convenient application development.
    
+
 
    The main features of Eina are:
    
 
      
 
    • Data Types 
      The Eina library is a central part of the EFL. It implements an API for data types, and allows you to create and manipulate several data types.
      • 
@@ -51,7 +51,7 @@
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
 
    
-   
+
 
 
 
    
diff --git a/org.tizen.guides/html/native/ui/efl/ecore_animation_n.htm b/org.tizen.guides/html/native/ui/efl/ecore_animation_n.htm
index e5467a6..048100c 100644
--- a/org.tizen.guides/html/native/ui/efl/ecore_animation_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/ecore_animation_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Ecore Animations 
-  
+  Ecore Animations
+ 
  
- 
+
  
    
 	
    
 		
    Mobile native Wearable native
    
 	
    
-	
+
 	
    
 	
    Dependencies
    
 	
 	
    
-
    	
+
 
 
    
 
-  
    Ecore Animations
     
+  
    Ecore Animations
    
 
 
    Ecore provides an Ecore_Animator facility for animations. Ecore animators use the Ecore main loop for creating animations, running a specific action on each tick of a timer in the main loop. To create an Ecore animation, you have to determine the duration of the animation and define a callback function that performs the animation with that duration.
    
 
@@ -64,13 +64,13 @@ static Ecore_Animator *anim;
 static Eina_Bool
 _do_animation(void *data, double pos)
 {
-    evas_object_move(data, 100 * pos, 100 * pos);
-    /* Do some more animating */
+    evas_object_move(data, 100 * pos, 100 * pos);
+    /* Do some more animating */
 
-    return ECORE_CALLBACK_RENEW;
+    return ECORE_CALLBACK_RENEW;
 }
 anim = ecore_animator_timeline_add(2, _do_animation,
-                                   my_evas_object);
+                                   my_evas_object);
 
 ecore_animator_del(anim);
 
@@ -95,14 +95,14 @@ ecore_animator_del(anim);
 static Eina_Bool
 _my_animation(void *data, double pos)
 {
-    Evas_Object *obj = data; /* Get the target object */
-    /* Target object geometry */
-    int x;
-    int y;
-    int w;
-    int h;
-    evas_object_geometry_get(obj, &x, &y, &w, &h); /* Get the current position and size */
-    evas_object_move(obj, 500 * pos, y); /* Linear move of the Evas object */
+    Evas_Object *obj = data; /* Get the target object */
+    /* Target object geometry */
+    int x;
+    int y;
+    int w;
+    int h;
+    evas_object_geometry_get(obj, &x, &y, &w, &h); /* Get the current position and size */
+    evas_object_move(obj, 500 * pos, y); /* Linear move of the Evas object */
 }
 /* Run the animation in 8 seconds */
 ecore_animator_timeline_add(8, _my_animation, my_evas_object);
@@ -134,25 +134,25 @@ ecore_animator_timeline_add(8, _my_animation, my_evas_object);
 static Eina_Bool
 _slide_back_and_forth(void *data)
 {
-    typedef enum {LEFT, RIGHT} direction_t; /* Direction datatype */
-    static int x = 0; /* Initial position */
-    static direction_t direction = RIGHT; /* Initial direction */
-    if (x >= 250)
-        direction = LEFT; /* Change direction */
-    else if (x <= 0)
-        direction = RIGHT; /* Change direction */
-    if (direction == RIGHT)
-        evas_object_move(data, ++x, 350); /* Slide to right */
-    else if (direction == LEFT)
-        evas_object_move(data, --x, 350); /* Slide to left */
-
-    return EINA_TRUE;
+    typedef enum {LEFT, RIGHT} direction_t; /* Direction datatype */
+    static int x = 0; /* Initial position */
+    static direction_t direction = RIGHT; /* Initial direction */
+    if (x >= 250)
+        direction = LEFT; /* Change direction */
+    else if (x <= 0)
+        direction = RIGHT; /* Change direction */
+    if (direction == RIGHT)
+        evas_object_move(data, ++x, 350); /* Slide to right */
+    else if (direction == LEFT)
+        evas_object_move(data, --x, 350); /* Slide to left */
+
+    return EINA_TRUE;
 }
 
 anim = ecore_animator_add(_slide_back_and_forth, rectangle);
 
 if (anim != NULL)
-    ecore_animator_del(anim);
+    ecore_animator_del(anim);
 
 
 
    
@@ -174,18 +174,18 @@ static int delay = runtime;
 static Eina_Bool
 _start_fold_animation(void *data)
 {
-    ecore_animator_timeline_add(runtime, _fold_animation, data);
+    ecore_animator_timeline_add(runtime, _fold_animation, data);
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 /* Second animation */
 static Eina_Bool
 _start_unfold_animation(void *data)
 {
-    ecore_animator_timeline_add(runtime, _unfold_animation, data);
+    ecore_animator_timeline_add(runtime, _unfold_animation, data);
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 /* Start the first animation */
@@ -212,17 +212,17 @@ ecore_timer_add(delay, _start_unfold_animation, my_evas_object);
 static Eina_Bool
 _freeze_animation(void *data)
 {
-    ecore_animator_freeze(data);
+    ecore_animator_freeze(data);
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 static Eina_Bool
 _thaw_animation(void *data)
 {
-    ecore_animator_thaw(data);
+    ecore_animator_thaw(data);
 
-    return EINA_FALSE;
+    return EINA_FALSE;
 }
 
 /* Start the animation */
@@ -310,7 +310,7 @@ ecore_timer_add(10, _thaw_animation, animator);
 
    
 	ECORE_POS_MAP_ACCELERATE_FACTOR
 	Start slow, then speed upv1: Power factor: 
+	v1: Power factor:
 	
      
 	
    • 0.0 is linear
      • 
 	
    • 1.0 is standard acceleration
      • 
@@ -323,7 +323,7 @@ ecore_timer_add(10, _thaw_animation, animator);
 
    
 	ECORE_POS_MAP_DECELERATE_FACTOR
 	Start fast, then slow downv1: Power factor: 
+	v1: Power factor:
 	
      
 	
    • 0.0 is linear
      • 
 	
    • 1.0 is standard deceleration
      • 
@@ -336,7 +336,7 @@ ecore_timer_add(10, _thaw_animation, animator);
 
    
 	ECORE_POS_MAP_SINUSOIDAL_FACTOR
 	Start slow, speed up, then slow down at the endv1: Power factor: 
+	v1: Power factor:
 	
      
 	
    • 0.0 is linear
      • 
 	
    • 1.0 is a standard sinusoidal
      • 
@@ -363,25 +363,25 @@ ecore_timer_add(10, _thaw_animation, animator);
 static Eina_Bool
 _my_animation_callback(void *data, double pos)
 {
-    Evas_Object *obj = data; /* Get the target object */
-    /* Target object geometry */
-    int x;
-    int y;
-    int w;
-    int h;
-    double frame = pos; /* Actual position variation */
-    /* Get the frame relative position depending on desired effect */
-    /*
-       Use the ECORE_POS_MAP_BOUNCE position mapping type with
-       7 bounces and the bounce decay factor of 1.8
-    */
-    frame = ecore_animator_pos_map(pos, ECORE_POS_MAP_BOUNCE, 1.8, 7);
-    /* Get current object position and size attributes */
-    evas_object_geometry_get(obj, &x, &y, &w, &h);
-    /* Move the Evas object 600 pixels down */
-    evas_object_move(obj, x, 600 * frame);
-
-    return EINA_TRUE;
+    Evas_Object *obj = data; /* Get the target object */
+    /* Target object geometry */
+    int x;
+    int y;
+    int w;
+    int h;
+    double frame = pos; /* Actual position variation */
+    /* Get the frame relative position depending on desired effect */
+    /*
+       Use the ECORE_POS_MAP_BOUNCE position mapping type with
+       7 bounces and the bounce decay factor of 1.8
+    */
+    frame = ecore_animator_pos_map(pos, ECORE_POS_MAP_BOUNCE, 1.8, 7);
+    /* Get current object position and size attributes */
+    evas_object_geometry_get(obj, &x, &y, &w, &h);
+    /* Move the Evas object 600 pixels down */
+    evas_object_move(obj, x, 600 * frame);
+
+    return EINA_TRUE;
 }
 
 /* Run the animation for 5 seconds */
@@ -395,7 +395,7 @@ ecore_animator_timeline_add(5, _my_animation_callback, my_evas_object);
 
      Tizen supports default and custom timer sources:
      
 
        
 
      • 
-
        The default timer, used in most cases, is ECORE_ANIMATOR_SOURCE_TIMER. It ticks every "frametime" seconds and allows you to perform transitions within a predefined timeline. The timer uses the system clock to tick over every nth second, with the default being 1/30th of a second.
        
+
        The default timer, used in most cases, is ECORE_ANIMATOR_SOURCE_TIMER. It ticks every "frametime" seconds and allows you to perform transitions within a predefined timeline. The timer uses the system clock to tick over every nth second, with the default being 1/30th of a second.
        
 
 
        To tweak the performance, change the frametime value using the ecore_animator_frametime_set() function with the new frametime as the parameter.
        
 
@@ -424,20 +424,20 @@ ecore_animator_source_set(ECORE_ANIMATOR_SOURCE_CUSTOM);
 void
 _on_progress_update()
 {
-    /* Called when some progress occurs */
-    ecore_animator_custom_tick(); /* Tick (next frame in progress bar animation) */
+    /* Called when some progress occurs */
+    ecore_animator_custom_tick(); /* Tick (next frame in progress bar animation) */
 }
 
 
 
        To drive the timer based on an input tick source (such as another application using the IPC or a vertical blanking interrupt), you can use the ecore_animator_custom_source_tick_begin_callback_set() and ecore_animator_custom_source_tick_end_callback_set() functions. These functions define callbacks that are called when the tick starts and ends, allowing you to set the functions to start and stop the ticking source.
        
 
        • 
   
      
-  
+
 
      
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
 
      
-  
+
 
 
 
diff --git a/org.tizen.guides/html/native/ui/efl/edje_animation_n.htm b/org.tizen.guides/html/native/ui/efl/edje_animation_n.htm
index f86c510..5073937 100644
--- a/org.tizen.guides/html/native/ui/efl/edje_animation_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/edje_animation_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Edje Animations 
-  
+  Edje Animations
+ 
  
- 
+
  	
+
 
 
      
 
-  
      Edje Animations
       
+  
      Edje Animations
      
 
 
      One of the greatest strengths of EFL and Edje is the ability to create animations. You can use predefined animations through Elm_Transit, or create your own animations with the Edje library.
      
-  
+
 
      The Edje animations are based on a simple principle of moving from one state to another. To animate something with Edje:
      
 
        
 
      1. Define 2 states for a part with description blocks.
        2. 
@@ -70,25 +70,25 @@
 /* Within the rectangle part */
 description
 {
-   state: "color" 0.0;
-   rel1 {relative: 0.3 0.3;}
-   rel2 {relative: 0.7 0.4;}
-   color: 255 0 0 255;
+   state: "color" 0.0;
+   rel1 {relative: 0.3 0.3;}
+   rel2 {relative: 0.7 0.4;}
+   color: 255 0 0 255;
 }
 
 
 
      2. Create a program to start when the rectangle is clicked.
-
        The program changes the state of the rectangle part to "color", and performs the change using a 2-second sinusoidal transition. For more information on transitions, see Using Program Transitions.
        
+
        The program changes the state of the rectangle part to "color", and performs the change using a 2-second sinusoidal transition. For more information on transitions, see Using Program Transitions.
        
 
 
         program
 {
-   name: "animation,color";
-   source: "rectangle";
-   signal: "mouse,clicked,1";
-   action: STATE_SET "color" 0.0;
-   target: "rectangle";
-   transition: SIN 2;
+   name: "animation,color";
+   source: "rectangle";
+   signal: "mouse,clicked,1";
+   action: STATE_SET "color" 0.0;
+   target: "rectangle";
+   transition: SIN 2;
 }
 
        
 
        3. 
@@ -96,23 +96,23 @@ program
 
        To use signals to start animations, you need to both send a signal from your application and create a program that waits for that signal. For example:
        
 
          
 
        • 
-
          Create a program that changes the state of the menu/side target to "default" 1.0. The program waits for the hide,sidemenu signal emitted by a MenuButton source.
          
+
          Create a program that changes the state of the menu/side target to "default" 1.0. The program waits for the hide,sidemenu signal emitted by a MenuButton source.
          
 
           program
 {
-   name: "animation,menu_side,hide";
-   source: "MenuButton";
-   signal: "hide,sidemenu";
-   action: STATE_SET "default" 1.0;
-   target: "menu/side";
-   transition: LINEAR 0.2;
+   name: "animation,menu_side,hide";
+   source: "MenuButton";
+   signal: "hide,sidemenu";
+   action: STATE_SET "default" 1.0;
+   target: "menu/side";
+   transition: LINEAR 0.2;
 }
 
          
 
          • 
 
        • 
 
          Send the signal from the application using the edje_object_signal_emit() function, which emits a signal to an Evas_Object part of the application. The following code sends a hide,sidemenu signal with a MenuButton source to the layout object:
          
 
          -edje_object_signal_emit(layout, "hide,sidemenu", "MenuButton");
+edje_object_signal_emit(layout, "hide,sidemenu", "MenuButton");
 
          
 
 
          If you use the Elementary library in the application, you can use the elm_object_signal_emit() function. It works the same way as the edje_object_signal_emit() function with the same parameters.
          
@@ -127,16 +127,16 @@ edje_object_signal_emit(layout, "hide,sidemenu", "MenuButton"
 
        • 
 
          The STATE_SET action (the usual animation action) changes the state of the part specified by the target property.
          
 
-
          In the following example, the state of the "image" part changes to "default" 0.0:
          
+
          In the following example, the state of the "image" part changes to "default" 0.0:
          
 
 
           program
 {
-   name: "animate";
-   signal: "animate";
-   action: STATE_SET "default" 0.0;
-   transition: LINEAR 3.0;
-   target: "image";
+   name: "animate";
+   signal: "animate";
+   action: STATE_SET "default" 0.0;
+   transition: LINEAR 3.0;
+   target: "image";
 }
 
          
 
          • 
@@ -147,10 +147,10 @@ program
 
           program
 {
-   name: "animate_stop";
-   signal: "animate_stop";
-   action: ACTION_STOP;
-   target: "animate_loop";
+   name: "animate_stop";
+   signal: "animate_stop";
+   action: ACTION_STOP;
+   target: "animate_loop";
 }
 
          
 
@@ -159,15 +159,15 @@ program
 
        • 
 
          The SIGNAL_EMIT action emits a signal that is used to communicate with the application directly from the theme.
          
 
-
          The following example emits a "frame_move" "start" signal when it receives the mouse,down,* signal from the video_mover part. In other words, it sends the "frame_move" "start" signal when the user presses the mouse in the video_mover part.
          
+
          The following example emits a "frame_move" "start" signal when it receives the mouse,down,* signal from the video_mover part. In other words, it sends the "frame_move" "start" signal when the user presses the mouse in the video_mover part.
          
 
 
           program
 {
-   name: "video_move_start";
-   signal: "mouse,down,*";
-   source: "video_mover";
-   action: SIGNAL_EMIT "frame_move" "start";
+   name: "video_move_start";
+   signal: "mouse,down,*";
+   source: "video_mover";
+   action: SIGNAL_EMIT "frame_move" "start";
 }
 
          
 
          • 
@@ -212,7 +212,7 @@ program
 
          Chaining Multiple Programs Together
          
 
 
          To perform multiple animations in a sequence, chain Edje programs together so that they are executed one after another.
          
-
          The following example uses the same rectangle as before. The original program changed to the rectangle state to "color" 0.0. This example adds a new program that returns the state to "default" 0.0 and chains the 2 programs together.
          
+
          The following example uses the same rectangle as before. The original program changed to the rectangle state to "color" 0.0. This example adds a new program that returns the state to "default" 0.0 and chains the 2 programs together.
          
 
          To chain programs:
          
 
            
 
          1. 
@@ -221,13 +221,13 @@ program
 
             program
 {
-   name: "animation,color";
-   source: "rectangle";
-   signal: "mouse,clicked,1";
-   action: STATE_SET "color" 0.0;
-   target: "rectangle";
-   transition: SIN 2;
-   after: "animation,state0";
+   name: "animation,color";
+   source: "rectangle";
+   signal: "mouse,clicked,1";
+   action: STATE_SET "color" 0.0;
+   target: "rectangle";
+   transition: SIN 2;
+   after: "animation,state0";
 }
 
            
 
            2. 
@@ -237,12 +237,12 @@ program
 
             program
 {
-   name: "animation,state0";
-   source: "";
-   signal: "";
-   action: STATE_SET "default" 0.0;
-   target: "rectangle";
-   transition: BOUNCE 5 1.8 6;
+   name: "animation,state0";
+   source: "";
+   signal: "";
+   action: STATE_SET "default" 0.0;
+   target: "rectangle";
+   transition: BOUNCE 5 1.8 6;
 }
 
            
 
@@ -252,7 +252,7 @@ program
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
 
      
-  
+
 
 
 
      
diff --git a/org.tizen.guides/html/native/ui/efl/efl_n.htm b/org.tizen.guides/html/native/ui/efl/efl_n.htm
index 69a4947..76a1a45 100644
--- a/org.tizen.guides/html/native/ui/efl/efl_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/efl_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Enlightenment Foundation Libraries (EFL)  
+	Enlightenment Foundation Libraries (EFL)
 
 
 
@@ -32,7 +32,7 @@
 			
    • EFL API References for Wearable Native
      • 
 		
    
 	
-	
+
 
 
    
 
    Enlightenment Foundation Libraries (EFL)
    
@@ -54,15 +54,15 @@
 	
  • Scaling
 	
    Enables you to manage various screen and object sizes.
    • 
 	
  • Fonts
-	
    Enables you get and set font information.
    • 	
+	
    Enables you get and set font information.
    
 	
  • Layouting with EDC
 	
    Enables you to create application layouts using EDC scripting.
    • 
 	
  • Primitive Graphical Objects
-	
    Enables you to manage and render Evas objects.
    • 	
+	
    Enables you to manage and render Evas objects.
    
 	
  • Evas Rendering Concept and Method
 	
    Enables you to understand how Evas rendering works.
    • 
 	
  • Transformation with Evas Map
-	
    Enables you to apply transformations to all object types through UV mapping.
    • 	
+	
    Enables you to apply transformations to all object types through UV mapping.
    
 	
  • Animations and Effects
 	
    Enables you to create physics-related animations and effects.
    • 
 	
  • Core Loop and OS Interfacing
@@ -76,7 +76,7 @@
 	
  • Accessibility
 	
    Enables you to build accessible applications for low-vision and visually-impaired users.
    • 
 
-    
+
 
 
 
    
diff --git a/org.tizen.guides/html/native/ui/efl/elementary_animation_n.htm b/org.tizen.guides/html/native/ui/efl/elementary_animation_n.htm
index 9fe4893..0178fc5 100644
--- a/org.tizen.guides/html/native/ui/efl/elementary_animation_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/elementary_animation_n.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Elementary Animations 
-  
+  Elementary Animations
+ 
  
- 
+
  	
+
 
 
    
 
-  
    Elementary Animations
     
+  
    Elementary Animations
    
 
 
    Elementary animations allow you to apply various transition effects, such as translation and rotation, to Evas objects. Elementary animations are mostly based on Ecore animators, but provide some transition methods at a higher abstraction level. Elementary animations provide a simpler way of animating objects than Ecore animators or Edje animations.
    
 
@@ -123,9 +123,9 @@ elm_transit_del(transit);
 char buf[PATH_MAX];
 Eina_List *images = NULL;
 Elm_Transit *transit = elm_transit_add();
-snprintf(buf, sizeof(buf), "%s/images/btn_default.png", PACKAGE_DATA_DIR);
+snprintf(buf, sizeof(buf), "%s/images/btn_default.png", PACKAGE_DATA_DIR);
 images = eina_list_append(images, eina_stringshare_add(buf));
-snprintf(buf, sizeof(buf), "%s/images/btn_hover.png", PACKAGE_DATA_DIR);
+snprintf(buf, sizeof(buf), "%s/images/btn_hover.png", PACKAGE_DATA_DIR);
 images = eina_list_append(images, eina_stringshare_add(buf));
 elm_transit_effect_image_animation_add(transit, images);
 
@@ -186,7 +186,7 @@ elm_transit_progress_value_get(transit);
 
 
    Acceleration
    
 
-
    You can control the acceleration (tween) mode of the animation. The Elm_Transit object supports a number of built-in interpolation methods, which provide different acceleration modes. By default, all interpolations are linear.
     
+
    You can control the acceleration (tween) mode of the animation. The Elm_Transit object supports a number of built-in interpolation methods, which provide different acceleration modes. By default, all interpolations are linear.
    
 
    To manage the tween mode:
    
 
      
 
    • To change the tween mode, use the elm_transit_tween_mode_set() function. The first parameter is the Elm_Transit instance and the second is the tween mode of the transition, which is defined by the Elm_Transit_Tween_Mode enumeration (in mobile and wearable applications).
@@ -299,8 +299,8 @@ elm_transit_go(transit);
 Elm_Transit *transit = elm_transit_add();
 elm_transit_object_add(transit, rectangle);
 elm_transit_effect_color_add(transit, /* Target object */
-                             255, 0, 0, 255, /* From color, with alpha channel 255 */
-                             0, 0, 255, 255); /* To color, with alpha channel 255 */
+                             255, 0, 0, 255, /* From color, with alpha channel 255 */
+                             0, 0, 255, 255); /* To color, with alpha channel 255 */
 elm_transit_duration_set(transit, 3);
 elm_transit_go(transit);
 
@@ -319,13 +319,13 @@ elm_box_homogeneous_set(parent, EINA_TRUE);
 
 /* Button 1 */
 Evas_Object *btn1 = elm_button_add(parent);
-elm_object_text_set(btn1, "Btn1");
+elm_object_text_set(btn1, "Btn1");
 elm_box_pack_start(parent, btn1);
 evas_object_show(btn1);
 
 /* Button 2 */
 Evas_Object *btn2 = elm_button_add(parent);
-elm_object_text_set(btn2, "Btn2");
+elm_object_text_set(btn2, "Btn2");
 elm_box_pack_end(parent, btn2);
 evas_object_show(btn2);
 
@@ -346,8 +346,8 @@ elm_transit_go(transit);
 Elm_Transit *transit = elm_transit_add();
 elm_transit_object_add(transit, my_evas_object);
 elm_transit_effect_wipe_add(transit,
-                            ELM_TRANSIT_EFFECT_TYPE_HIDE,
-                            ELM_TRANSIT_EFFECT_WIPE_DIR_RIGHT);
+                            ELM_TRANSIT_EFFECT_TYPE_HIDE,
+                            ELM_TRANSIT_EFFECT_WIPE_DIR_RIGHT);
 elm_transit_duration_set(transit, 2.0);
 elm_transit_go(transit);
 
@@ -386,8 +386,8 @@ evas_object_geometry_get(my_evas_object, NULL, NULL, &w, &h);
 Elm_Transit *transit = elm_transit_add();
 elm_transit_object_add(transit, my_evas_object);
 elm_transit_effect_resize_add(transit, /* Transition object */
-                              w, h, /* Original size */
-                              h, w); /* Target size */
+                              w, h, /* Original size */
+                              h, w); /* Target size */
 elm_transit_duration_set(transit, 2.0);
 elm_transit_go(transit);
 
@@ -403,14 +403,14 @@ elm_transit_go(transit);
 
       /* Coin head image */
 Evas_Object *coin_heads = elm_image_add(ad->win);
-if (!elm_image_file_set(coin_heads, IMG_DIR"/coin_heads.png", NULL))
-    printf("error: could not load image");
+if (!elm_image_file_set(coin_heads, IMG_DIR"/coin_heads.png", NULL))
+    printf("error: could not load image");
 elm_win_resize_object_add(ad->win, coin_heads);
 
 /* Coin tail image */
 Evas_Object *coin_tails = elm_image_add(ad->win);
-if (!elm_image_file_set(coin_tails, IMG_DIR"/coin_tails.png", NULL))
-    printf("error: could not load image");
+if (!elm_image_file_set(coin_tails, IMG_DIR"/coin_tails.png", NULL))
+    printf("error: could not load image");
 elm_win_resize_object_add(ad->win, coin_tails);
 
 /* Transition definition */
@@ -481,8 +481,8 @@ elm_transit_go(transit);
 
 
       Evas_Object *coin_heads = elm_image_add(ad->win);
-if (!elm_image_file_set(coin_heads, IMG_DIR"/coin_heads.png", NULL))
-    printf("error: could not load image");
+if (!elm_image_file_set(coin_heads, IMG_DIR"/coin_heads.png", NULL))
+    printf("error: could not load image");
 evas_object_resize(coin_heads, 100, 100);
 evas_object_show(coin_heads);
 
@@ -582,10 +582,10 @@ elm_transit_chain_transit_del(transit1, transit2);
 
 
       struct _Custom_Effect {
-    struct _size {
-        Evas_Coord w, h;
-    }
-    from, to;
+    struct _size {
+        Evas_Coord w, h;
+    }
+    from, to;
 };
 typedef struct _Custom_Effect Custom_Effect;
 
      
@@ -603,24 +603,24 @@ typedef struct _Custom_Effect Custom_Effect;
 static void
 _custom_op(void *data, Elm_Transit *transit, double progress)
 {
-    if (!data)
-        return;
-    Evas_Coord w, h;
-    Evas_Object *obj;
-    const Eina_List *elist;
-    Custom_Effect *custom_effect = data;
-    const Eina_List *objs = elm_transit_objects_get(transit);
-    /* During the first half, modify the height */
-    if (progress < 0.5) {
-        h = custom_effect->from.h + (custom_effect->to.h * progress * 2);
-        w = custom_effect->from.w;
-    } else {
-        /* During the second half, modify the width */
-        h = custom_effect->from.h + custom_effect->to.h;
-        w = custom_effect->from.w + (custom_effect->to.w * (progress - 0.5) * 2);
-    }
-    EINA_LIST_FOREACH(objs, elist, obj)
-        evas_object_resize(obj, w, h);
+    if (!data)
+        return;
+    Evas_Coord w, h;
+    Evas_Object *obj;
+    const Eina_List *elist;
+    Custom_Effect *custom_effect = data;
+    const Eina_List *objs = elm_transit_objects_get(transit);
+    /* During the first half, modify the height */
+    if (progress < 0.5) {
+        h = custom_effect->from.h + (custom_effect->to.h * progress * 2);
+        w = custom_effect->from.w;
+    } else {
+        /* During the second half, modify the width */
+        h = custom_effect->from.h + custom_effect->to.h;
+        w = custom_effect->from.w + (custom_effect->to.w * (progress - 0.5) * 2);
+    }
+    EINA_LIST_FOREACH(objs, elist, obj)
+        evas_object_resize(obj, w, h);
 }
 
      
 
@@ -631,20 +631,20 @@ _custom_op(void *data, Elm_Transit *transit, double progress)
 
       static void*
 _custom_context_new(Evas_Coord from_w, Evas_Coord from_h, Evas_Coord to_w,
-                    Evas_Coord to_h)
+                    Evas_Coord to_h)
 {
-    Custom_Effect *custom_effect;
+    Custom_Effect *custom_effect;
 
-    custom_effect = calloc(1, sizeof(Custom_Effect));
-    if (!custom_effect)
-        return NULL;
+    custom_effect = calloc(1, sizeof(Custom_Effect));
+    if (!custom_effect)
+        return NULL;
 
-    custom_effect->from.w = from_w;
-    custom_effect->from.h = from_h;
-    custom_effect->to.w = to_w - from_w;
-    custom_effect->to.h = to_h - from_h;
+    custom_effect->from.w = from_w;
+    custom_effect->from.h = from_h;
+    custom_effect->to.w = to_w - from_w;
+    custom_effect->to.h = to_h - from_h;
 
-    return custom_effect;
+    return custom_effect;
 }
 
      
 
      • 
@@ -655,7 +655,7 @@ _custom_context_new(Evas_Coord from_w, Evas_Coord from_h, Evas_Coord to_w,
 static void
 _custom_context_free(void *data, Elm_Transit *transit __UNUSED__)
 {
-    free(data);
+    free(data);
 }
 
 
@@ -672,18 +672,18 @@ _custom_context_free(void *data, Elm_Transit *transit __UNUSED__)
 
       Elm_Transit *transit = elm_transit_add();
 elm_transit_effect_add(transit,
-                       _custom_op,
-                       _custom_context_new(),
-                       _custom_context_free);
+                       _custom_op,
+                       _custom_context_new(),
+                       _custom_context_free);
 
      
 
 
-  
+
 
      
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
 
      
-  
+
 
 
 
    
diff --git a/org.tizen.guides/html/native/ui/efl/evas_basic_objects_n.htm b/org.tizen.guides/html/native/ui/efl/evas_basic_objects_n.htm
index 8c552cc..a0fbe30 100644
--- a/org.tizen.guides/html/native/ui/efl/evas_basic_objects_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/evas_basic_objects_n.htm
@@ -5,17 +5,17 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Manipulating Graphical Objects  
+	Manipulating Graphical Objects
 
 
 
-	
+
 
-	
+
 
 
    
 
    Manipulating Graphical Objects
    
 
 
    This topic introduces the basic manipulations available for the Evas_Object object. Most Evas objects can be manipulated using generic functions.
    
 
-
    The list of available basic actions does not depend on the object's type. Evas implements functionality that allows you to perform basic manipulation, such as showing, hiding, setting and getting geometry, bringing a layer up or down, managing color, clipping, and reference counting.
    
+
    The list of available basic actions does not depend on the object's type. Evas implements functionality that allows you to perform basic manipulation, such as showing, hiding, setting and getting geometry, bringing a layer up or down, managing color, clipping, and reference counting.
    
 
 
 
    Creating Evas Objects
    
@@ -61,7 +61,7 @@
 
     /* Create Evas instance */
 ad->win = elm_win_util_standard_add(PACKAGE,
-                                    PACKAGE);
+                                    PACKAGE);
 elm_win_autodel_set(ad->win, EINA_TRUE);
 
 /* Get the canvas */
@@ -80,7 +80,7 @@ evas_object_move(ad->bg, 0, 0);
 evas_object_show(ad->bg);
 
    
 
-
    Figure: White background object
     
+
    Figure: White background object
    
 
    White background object
    
 
 
@@ -94,14 +94,14 @@ evas_object_show(ad->bg);
 
     /* Create the image object */
 ad->img = evas_object_image_filled_add(evas);
-_app_get_resource("images/enlightenment.png", image_path, PATH_MAX);
+_app_get_resource("images/enlightenment.png", image_path, PATH_MAX);
 evas_object_image_file_set(ad->img, image_path, NULL);
 if (evas_object_image_load_error_get(ad->img) != EVAS_LOAD_ERROR_NONE)
-    return;
+    return;
 
 /* Set the image object properties */
 evas_object_geometry_get(ad->spacer, NULL, NULL, &w, &h);
-evas_object_name_set(ad->img, "background");
+evas_object_name_set(ad->img, "background");
 evas_object_resize(ad->img, WIDTH, HEIGHT);
 evas_object_move(ad->img, w, h);
 evas_object_show(ad->img);
@@ -117,7 +117,7 @@ evas_object_clip_set(ad->img, ad->clipper);
 evas_object_show(ad->clipper);
 
    
 
-
    Figure: Clipping an image
     
+
    Figure: Clipping an image
    
 
    Clipping an image
    
 
 
@@ -127,24 +127,24 @@ evas_object_show(ad->clipper);
 static void
 _clipper_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
-
-    const char *object_name = evas_object_name_get(ad->img);
-    if (strcmp(object_name, "background") != 0)
-        return;
-
-    /* If the clipper object currently clips the image object */
-    if (evas_object_clip_get(ad->img) == ad->clipper) {
-        /* Disable the clipping */
-        evas_object_clip_unset(ad->img);
-    } else {
-        /* Otherwise, clip the image object */
-        evas_object_clip_set(ad->img, ad->clipper);
-    }
+    App_Data *ad = (App_Data *)data;
+
+    const char *object_name = evas_object_name_get(ad->img);
+    if (strcmp(object_name, "background") != 0)
+        return;
+
+    /* If the clipper object currently clips the image object */
+    if (evas_object_clip_get(ad->img) == ad->clipper) {
+        /* Disable the clipping */
+        evas_object_clip_unset(ad->img);
+    } else {
+        /* Otherwise, clip the image object */
+        evas_object_clip_set(ad->img, ad->clipper);
+    }
 }
 
 
-
    Figure: Disabling the clipping
     
+
    Figure: Disabling the clipping
    
 
    Disabling the clipping
    
 
 
    Changing Colors and Visibility
    
@@ -159,30 +159,30 @@ _clipper_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 static void
 _color_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
-
-    int alpha;
-    int r;
-    int g;
-    int b;
-
-    /* Retrieve the current clipper color */
-    evas_object_color_get(ad->clipper, &r, &g, &b, &alpha);
-
-    /* Define the new color attributes */
-    evas_color_argb_unpremul(alpha, &r, &g, &b);
-    if (g > 0)
-        g = b = 0;
-    else
-        g = b = 255;
-    evas_color_argb_premul(alpha, &r, &g, &b);
-
-    /* Set the new color */
-    evas_object_color_set(ad->clipper, r, g, b, alpha);
+    App_Data *ad = (App_Data *)data;
+
+    int alpha;
+    int r;
+    int g;
+    int b;
+
+    /* Retrieve the current clipper color */
+    evas_object_color_get(ad->clipper, &r, &g, &b, &alpha);
+
+    /* Define the new color attributes */
+    evas_color_argb_unpremul(alpha, &r, &g, &b);
+    if (g > 0)
+        g = b = 0;
+    else
+        g = b = 255;
+    evas_color_argb_premul(alpha, &r, &g, &b);
+
+    /* Set the new color */
+    evas_object_color_set(ad->clipper, r, g, b, alpha);
 }
 
 
-
    Figure: Applying a color
     
+
    Figure: Applying a color
    
 
    Applying a color
    
 
 
  • 
@@ -192,29 +192,29 @@ _color_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 static void
 _opacity_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
+    App_Data *ad = (App_Data *)data;
 
-    int alpha;
-    int r;
-    int g;
-    int b;
+    int alpha;
+    int r;
+    int g;
+    int b;
 
-    /* Retrieve the current clipper color and opacity */
-    evas_object_color_get(ad->clipper, &r, &g, &b, &alpha);
+    /* Retrieve the current clipper color and opacity */
+    evas_object_color_get(ad->clipper, &r, &g, &b, &alpha);
 
-    /* Define the new color attributes and alpha value for opacity */
-    evas_color_argb_unpremul(alpha, &r, &g, &b);
-    alpha -= 20;
-    if (alpha < 0)
-        alpha = 255;
-    evas_color_argb_premul(alpha, &r, &g, &b);
+    /* Define the new color attributes and alpha value for opacity */
+    evas_color_argb_unpremul(alpha, &r, &g, &b);
+    alpha -= 20;
+    if (alpha < 0)
+        alpha = 255;
+    evas_color_argb_premul(alpha, &r, &g, &b);
 
-    /* Set the new color and opacity */
-    evas_object_color_set(ad->clipper, r, g, b, alpha);
+    /* Set the new color and opacity */
+    evas_object_color_set(ad->clipper, r, g, b, alpha);
 }
 
 
-
    Figure: Changing the opacity
     
+
    Figure: Changing the opacity
    
 
    Changing the opacity
    
 
    • 
 
  • 
@@ -224,20 +224,20 @@ _opacity_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 static void
 _visibility_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
-
-    /* If the clipper is visible */
-    if (evas_object_visible_get(ad->clipper)) {
-        /* Hide it */
-        evas_object_hide(ad->clipper);
-    } else {
-        /* Otherwise, show it */
-        evas_object_show(ad->clipper);
-    }
+    App_Data *ad = (App_Data *)data;
+
+    /* If the clipper is visible */
+    if (evas_object_visible_get(ad->clipper)) {
+        /* Hide it */
+        evas_object_hide(ad->clipper);
+    } else {
+        /* Otherwise, show it */
+        evas_object_show(ad->clipper);
+    }
 }
 
 
-
    Figure: Changing visibility
     
+
    Figure: Changing visibility
    
 
     Changing visibility
    
 
    • 
 
@@ -260,39 +260,39 @@ evas_object_ref(ad->spacer);
 static void
 _unref_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
+    App_Data *ad = (App_Data *)data;
 
-    if (!ad->spacer)
-        return;
+    if (!ad->spacer)
+        return;
 
-    if (evas_object_ref_get(ad->spacer) != 0) {
-        /* Decrease the reference count */
-        evas_object_unref(ad->spacer);
+    if (evas_object_ref_get(ad->spacer) != 0) {
+        /* Decrease the reference count */
+        evas_object_unref(ad->spacer);
 
-        return;
-    }
+        return;
+    }
 
-    int x;
-    int y;
-    int w;
-    int h;
+    int x;
+    int y;
+    int w;
+    int h;
 
-    /* Modify the image and clipper object positions */
-    evas_object_geometry_get(ad->spacer, &x, &y, NULL, NULL);
-    evas_object_move(ad->img, x, y);
-    evas_object_geometry_get(ad->img, &x, &y, &w, &h);
-    evas_object_move(ad->clipper, x + (w / 4), y + (h / 4));
-    evas_object_move(ad->clipper_border, x + (w / 4) - 3, y + (h / 4) - 3);
+    /* Modify the image and clipper object positions */
+    evas_object_geometry_get(ad->spacer, &x, &y, NULL, NULL);
+    evas_object_move(ad->img, x, y);
+    evas_object_geometry_get(ad->img, &x, &y, &w, &h);
+    evas_object_move(ad->clipper, x + (w / 4), y + (h / 4));
+    evas_object_move(ad->clipper_border, x + (w / 4) - 3, y + (h / 4) - 3);
 
-    /* Delete the green rectangle, if the reference count is 0 */
-    evas_object_del(ad->spacer);
-    ad->spacer = NULL;
+    /* Delete the green rectangle, if the reference count is 0 */
+    evas_object_del(ad->spacer);
+    ad->spacer = NULL;
 }
 
 
 
    In the above example, a green rectangle is used as padding and the clipper object calculates its X, Y coordinates based on the rectangle position. When the rectangle is created, its reference count is increased to 1 by calling the evas_object_ref() function. When the _unref_cb() callback is triggered, the reference count value is higher than 0 and the  evas_object_unref() function is called to decrease it. At the end of the callback, the reference count is 0 and the evas_object_del(ad->spacer) function marks the rectangle object for deletion.
    
 
-
    Figure: Removing padding
     
+
    Figure: Removing padding
    
 
    Removing padding
    
 
 
    Changing the Object Order on the Canvas
    
@@ -304,7 +304,7 @@ _unref_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 
     /* Create a red rectangle */
 ad->order_rect1 = evas_object_rectangle_add(evas);
-evas_object_name_set(ad->order_rect1, "red");
+evas_object_name_set(ad->order_rect1, "red");
 evas_object_color_set(ad->order_rect1, 255, 0, 0, 255);
 evas_object_move(ad->order_rect1, 120, 310);
 evas_object_resize(ad->order_rect1, 200, 200);
@@ -313,7 +313,7 @@ evas_object_show(ad->order_rect1);
 
 /* Create a blue rectangle */
 ad->order_rect2 = evas_object_rectangle_add(evas);
-evas_object_name_set(ad->order_rect2, "blue");
+evas_object_name_set(ad->order_rect2, "blue");
 evas_object_color_set(ad->order_rect2, 0, 0, 255, 255);
 evas_object_move(ad->order_rect2, 180, 350);
 evas_object_resize(ad->order_rect2, 200, 200);
@@ -321,7 +321,7 @@ evas_object_resize(ad->order_rect2, 200, 200);
 evas_object_show(ad->order_rect2);
 
    
 
-
    Figure: Default object order on the canvas
     
+
    Figure: Default object order on the canvas
    
 
    Default object order on the canvas
    
 
 
@@ -331,26 +331,26 @@ evas_object_show(ad->order_rect2);
 static void
 _object_order_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
-
-    /* Get the object below the blue rectangle (the red one) */
-    Evas_Object *rect = evas_object_below_get(ad->order_rect2);
-    if (!rect)
-        return;
-
-    const char *name = evas_object_name_get(rect);
-    if (name) {
-        /* If the object is the red rectangle */
-        if (strcmp(name, "red") == 0) {
-            /* Move the blue rectangle below the red one */
-            evas_object_stack_below(ad->order_rect2, rect);
-
-            return;
-        }
-    }
+    App_Data *ad = (App_Data *)data;
+
+    /* Get the object below the blue rectangle (the red one) */
+    Evas_Object *rect = evas_object_below_get(ad->order_rect2);
+    if (!rect)
+        return;
+
+    const char *name = evas_object_name_get(rect);
+    if (name) {
+        /* If the object is the red rectangle */
+        if (strcmp(name, "red") == 0) {
+            /* Move the blue rectangle below the red one */
+            evas_object_stack_below(ad->order_rect2, rect);
+
+            return;
+        }
+    }
 }
 
-
    Figure: Changed object order
     
+
    Figure: Changed object order
    
 
    Changed object order
    
 
 
  • To place an object to the top or bottom of its layer in the canvas object stack, use the evas_object_raise() or evas_object_lower() function.
@@ -360,24 +360,24 @@ _object_order_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 static void
 _lower_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
+    App_Data *ad = (App_Data *)data;
 
-    /* Move the background to the bottom */
-    evas_object_lower(ad->bg);
+    /* Move the background to the bottom */
+    evas_object_lower(ad->bg);
 }
 
 static void
 _raise_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    App_Data *ad = (App_Data *)data;
+    App_Data *ad = (App_Data *)data;
 
-    /* Move the background to the top */
-    evas_object_raise(ad->bg);
-    ad->isBgOnTop = EINA_TRUE;
+    /* Move the background to the top */
+    evas_object_raise(ad->bg);
+    ad->isBgOnTop = EINA_TRUE;
 }
 
 
-
    Figure: Canvas background at the bottom (left) and on the top (right)
     
+
    Figure: Canvas background at the bottom (left) and on the top (right)
    
 
    Canvas background at the bottom (left) and on the top (right)
    
 
    • 
 
@@ -390,7 +390,7 @@ _raise_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 
 	
+
    
 
 	
+	
 	
 	
 	
 	
-  Transformation with Evas Map 
-  
+  Transformation with Evas Map
+ 
  
- 
+
  
    
 	
    
 		
    Mobile native Wearable native
    
 	
    
-	
+
 	
-
    	
+
    
 
 
    
 
-  
    Transformation with Evas Map
     
+  
    Transformation with Evas Map
    
 
 
    Evas map effects allow you to apply transformations to all object types through UV mapping.
    
 
@@ -234,7 +234,7 @@ evas_map_free(m);
 
    Figure: 3D rotation
    
 
    3D rotation
    
 
-
  • A simple overlay over the image shows the original geometry of each object and the axis around which they are being rotated. The Z axis is not shown, since it is orthogonal to the screen. 
+
  • A simple overlay over the image shows the original geometry of each object and the axis around which they are being rotated. The Z axis is not shown, since it is orthogonal to the screen.
 
    To show the Z axis, that is, to add 3D perspective to the transformation, use the evas_map_util_3d_perspective() function on the map after its position has been set.
    
 
 
    The result makes the vanishing point the center of each object.
    
@@ -246,7 +246,7 @@ evas_map_free(m);
 
 
    Defining Color and Lighting
    
 
-
    Each point in a map can be set to a color, which is multiplied with the object's own color and linearly interpolated between adjacent points:
    
+
    Each point in a map can be set to a color, which is multiplied with the object's own color and linearly interpolated between adjacent points:
    
 
      
 
    • To set the color separately for each point, use the evas_map_point_color_set() function.
      • 
 
    • To set the same color for every point, use the evas_map_util_points_color_set() function.
      • 
@@ -266,17 +266,17 @@ evas_map_free(m);
 
 
       evas_map_util_3d_lighting(m, /* Evas_Map object */
-                          250/2, 150/2, -100, /* Spot light coordinates */
-                          255, 255, 255, /* Spot light color */
-                          200, 200, 200); /* Ambient light color */
+                          250/2, 150/2, -100, /* Spot light coordinates */
+                          255, 255, 255, /* Spot light color */
+                          200, 200, 200); /* Ambient light color */
 
      
 
 
      Mapping Images
      
 
 
      Images need special handling when mapped. While Evas can easily handle objects, it is completely oblivious to the content of an image object. This means that if you only map the Evas object, and not the image within the object, only the Evas object is modified according to the mapping. To ensure that the image within the Evas object is also modified as expected, you must map the image UV points separately in addition to the basic map points.
      
 
-
      To map image UV points to avoid unexpected problems:
       
- 
+
      To map image UV points to avoid unexpected problems:
      
+
 
        
 
      1. At first, create 3 Evas image objects.
 
        In this example, there are 3 Tux images, each sized at 200 x 200 pixels:
        
@@ -385,7 +385,7 @@ evas_map_smooth_set(m, EINA_FALSE);
 	Note
 	Except as noted, this content is licensed under LGPLv2.1+.
 
    • 
-  
+
 
 
 
    
diff --git a/org.tizen.guides/html/native/ui/efl/evas_map_effects_n.htm b/org.tizen.guides/html/native/ui/efl/evas_map_effects_n.htm
index 1d7dbe4..78c3d50 100644
--- a/org.tizen.guides/html/native/ui/efl/evas_map_effects_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/evas_map_effects_n.htm
@@ -44,7 +44,7 @@
 
 
    Creating Evas Map Effects
    
 
-
    The following examples demonstrate how you can use UV mapping and Evas map functions. UV mapping allows you to map points in the 2D Evas source object to 3D space positions in the target object ("U" and "V" denote the axes of the 2D texture). You can then modify the map point U and V texture source points with Evas map mapping APIs to create various effects.
    
+
    The following examples demonstrate how you can use UV mapping and Evas map functions. UV mapping allows you to map points in the 2D Evas source object to 3D space positions in the target object ("U" and "V" denote the axes of the 2D texture). You can then modify the map point U and V texture source points with Evas map mapping APIs to create various effects.
    
 
 
    Creating the Example Application UI
    
 
@@ -66,9 +66,9 @@
 
    Create an Evas object for an Elementary window and 2 buttons:
    
 
     struct appdata {
-    Evas_Object *win;
-    Evas_Object *button;
-    Evas_Object *default_btn;
+    Evas_Object *win;
+    Evas_Object *button;
+    Evas_Object *default_btn;
 };
 typedef struct appdata appdata_s;
 
    
@@ -85,29 +85,29 @@ typedef struct appdata appdata_s;
 static void
 create_base_gui(appdata_s *ad)
 {
-    Evas_Object *evas_text = NULL;
-    Evas *evas = NULL;
+    Evas_Object *evas_text = NULL;
+    Evas *evas = NULL;
 
-    /* Window */
-    ad->win = elm_win_util_standard_add("Extra object function",
-                                        "Extra object function");
-    elm_win_autodel_set(ad->win, EINA_TRUE);
+    /* Window */
+    ad->win = elm_win_util_standard_add("Extra object function",
+                                        "Extra object function");
+    elm_win_autodel_set(ad->win, EINA_TRUE);
 
-    /* Window callbacks */
-    evas_object_smart_callback_add(ad->win, "delete,request",
-                                   win_delete_request_cb, NULL);
-    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad);
+    /* Window callbacks */
+    evas_object_smart_callback_add(ad->win, "delete,request",
+                                   win_delete_request_cb, NULL);
+    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad);
 
-    evas = evas_object_evas_get(ad->win);
+    evas = evas_object_evas_get(ad->win);
 
-    evas_text = evas_object_text_add(evas);
-    evas_object_text_text_set(evas_text, "Evas Map Mapping");
-    evas_object_text_font_set(evas_text, "Sans", 18);
-    evas_object_color_set(evas_text, 50, 100, 200, 255);
-    evas_object_move(evas_text, 15, 40);
-    evas_object_show(evas_text);
+    evas_text = evas_object_text_add(evas);
+    evas_object_text_text_set(evas_text, "Evas Map Mapping");
+    evas_object_text_font_set(evas_text, "Sans", 18);
+    evas_object_color_set(evas_text, 50, 100, 200, 255);
+    evas_object_move(evas_text, 15, 40);
+    evas_object_show(evas_text);
 
-    evas_object_show(ad->win);
+    evas_object_show(ad->win);
 }
 
 
@@ -118,14 +118,14 @@ create_base_gui(appdata_s *ad)
 
     /* Create a button for mapping */
 ad->button = elm_button_add(ad->win);
-elm_object_text_set(ad->button, "Evas Map Mapping ");
+elm_object_text_set(ad->button, "Evas Map Mapping ");
 evas_object_move(ad->button, 15, 100);
 evas_object_resize(ad->button, 350, 150);
 evas_object_show(ad->button);
 
 /* Create a default button */
 ad->default_btn = elm_button_add(ad->win);
-elm_object_text_set(ad->default_btn, "Default Button ");
+elm_object_text_set(ad->default_btn, "Default Button ");
 evas_object_move(ad->default_btn, 15, 600);
 evas_object_resize(ad->default_btn, 450, 100);
 evas_object_show(ad->default_btn);
@@ -179,14 +179,14 @@ evas_map_point_image_uv_set(map, 3, 0, 100);
 
    
 
 
-
  • To apply the map on the button, use the evas_object_map_set() function. 
+
  • To apply the map on the button, use the evas_object_map_set() function.
 
 
     /* Apply the map to the button Evas object */
 evas_object_map_set(ad->button, map);
 
    
 
    • 
-
  • To enable the map, use the evas_object_map_enable_set() function. 
+
  • To enable the map, use the evas_object_map_enable_set() function.
 
    When enabled, the original object geometry is saved, and the new map geometry is used to change the object position and size.
    
 
 
    diff --git a/org.tizen.guides/html/native/ui/efl/evas_objects_n.htm b/org.tizen.guides/html/native/ui/efl/evas_objects_n.htm
index c4ab3f3..2074e1b 100644
--- a/org.tizen.guides/html/native/ui/efl/evas_objects_n.htm
+++ b/org.tizen.guides/html/native/ui/efl/evas_objects_n.htm
@@ -48,7 +48,7 @@
 
    
 
  
    Evas Objects
    
-  
+
 
    An Evas object is the most basic visual entity used in Evas. Everything, be it a single line or a complex list of UI components, is an Evas object.
    
 
 
    Primitive Renderable Objects
    
@@ -68,7 +68,7 @@
 Evas_Object *bg = evas_object_rectangle_add(evas_canvas);
 
 /*
-   Set the rectangle's
+   Set the rectangle's
    red, green, blue and opacity levels
 */
 /* Opaque white background */
@@ -79,7 +79,7 @@ evas_object_show(bg);
 
    
 
 
    Debugging
    
-
    When debugging visual issues with Evas programs, the rectangle is a useful tool. The rectangle's simplicity means that it is easier to pinpoint issues with it than with more complex objects. A common technique to use when writing an Evas program and not getting the desired visual result is to replace an object with a solid color rectangle and seeing how it interacts with the other elements. This often allows us to notice clipping, parenting, or positioning issues. Once the issues are identified and corrected, the rectangle can be replaced with the original object, and in all likelihood any remaining issues are specific to that object's type.
    
+
    When debugging visual issues with Evas programs, the rectangle is a useful tool. The rectangle's simplicity means that it is easier to pinpoint issues with it than with more complex objects. A common technique to use when writing an Evas program and not getting the desired visual result is to replace an object with a solid color rectangle and seeing how it interacts with the other elements. This often allows us to notice clipping, parenting, or positioning issues. Once the issues are identified and corrected, the rectangle can be replaced with the original object, and in all likelihood any remaining issues are specific to that object's type.
    
 
 
    Clipping
    
 
    Clipping serves 2 main functions:
    
@@ -93,7 +93,7 @@ evas_object_show(bg);
 
    An Evas text object shows a basic single-line single-style text.
    
 
     Evas_Object *text = evas_object_text_add(evas_canvas);
-evas_object_text_text_set(text, "some text");
+evas_object_text_text_set(text, "some text");
 evas_object_color_set(text, 127, 0, 0, 127);
 evas_object_show(text);
 
    
@@ -108,7 +108,7 @@ evas_object_show(text);
 
  • text: The text object
    • 
 
  • font: The font name you want to use
    • 
 
  • size: The font size you want to use.
    • 
- 
+
 
    To query the current font, use the evas_object_text_font_get() function.
    
 
 
  • 
@@ -141,7 +141,7 @@ evas_object_show(text);
 
 
 
    Primitive Smart Objects
    
-
    A smart object is a special Evas object that provides custom functions to handle automatically clipping, hiding, moving, resizing color setting and more on child elements, for the smart object's user. They can be, for example, a group of objects that move together, or implementations of whole complex UI components, providing some intelligence and extension to simple Evas objects.
    
+
    A smart object is a special Evas object that provides custom functions to handle automatically clipping, hiding, moving, resizing color setting and more on child elements, for the smart object's user. They can be, for example, a group of objects that move together, or implementations of whole complex UI components, providing some intelligence and extension to simple Evas objects.
    
 
 
    Primitive Container Objects
    
 
    A container is a smart object that holds children Evas objects in a specific fashion.
    
@@ -195,7 +195,7 @@ evas_object_table_pack(table, rect, 2, 3, 1, 1);
 
  • EVAS_OBJECT_TABLE_HOMOGENEOUS_TABLE: The table size is divided equally among children, filling the whole table area. If the children have a minimum size that is larger than this (including padding), the table overflows and is aligned respecting the alignment hint, possibly overlapping sibling cells.
    • 
 
  • EVAS_OBJECT_TABLE_HOMOGENEOUS_ITEM: The greatest minimum cell size is used: if no element is set to expand, the contents of the table are the minimum size and the bounding box of all the children is aligned relatively to the table object using the evas_object_table_align_get() function. If the table area is too small to hold this minimum bounding box, the objects keep their size and the bounding box overflows the box area, still respecting the alignment. To get the current mode, use the evas_object_table_homogeneous_get() function.
    • 
 
-
    The table's content alignment is set using the evas_object_table_align_set() function, where the second and third parameters (horizontal and vertical) are floating values. To see the current values, use the evas_object_table_align_get() function.
    
+
    The table's content alignment is set using the evas_object_table_align_set() function, where the second and third parameters (horizontal and vertical) are floating values. To see the current values, use the evas_object_table_align_get() function.
    
 
    To set the padding, use the evas_object_table_padding_set() function. To see the current value, use the evas_object_table_padding_get() function.
    
 
    To see the current column and row count, use the evas_object_table_col_row_size_get() function.
    
 
@@ -203,7 +203,7 @@ evas_object_table_pack(table, rect, 2, 3, 1, 1);
 
    Grid
    
 
    A grid is a smart object that packs its children as with a regular grid layout.
    
 
    Grids are added to the canvas with the evas_object_grid_add() function.
    
-
    To change a grid's virtual resolution, use the evas_object_grid_size_set() function, and to get the current value, use the evas_object_grid_size_get() function.
    
+
    To change a grid's virtual resolution, use the evas_object_grid_size_set() function, and to get the current value, use the evas_object_grid_size_get() function.
    
 
    To add an object, use the evas_object_grid_pack() function, where the third, fourth, fifth, and sixth parameters are the following:
    
 
      
 
    • x: Virtual x coordinate of the child
      • 
@@ -239,14 +239,14 @@ evas_object_table_pack(table, rect, 2, 3, 1, 1);
 
    • evas_object_box_layout_stack()
      • 
 
    
 
-
    Image Objects
     
+
    Image Objects
    
 
 
 
    Using Evas, you can create and manipulate image objects. Evas supports image loaders of various formats as plug-in modules.
    
 
    The image formats that Evas supports include bmp, edj, gif, ico, jpeg, pmaps, png, psd, svg, tga, tiff, wbmp, webp, and xpm.
    
 
-	
    Figure: Evas image loader
     
-	
    Evas image loader
      
+	
    Figure: Evas image loader
    
+	
    Evas image loader
    
 
 
    Evas Object Image Functions
    
 
@@ -264,7 +264,7 @@ void *evas_object_image_data_get(const Evas_Object *obj, Eina_Bool for_writing);
 void evas_object_image_size_set(Evas_Object *obj, int w, int h);
 void evas_object_image_data_update_add(Evas_Object *obj, int x, int y, int w, int h);
 Eina_Bool evas_object_image_save(const Evas_Object *obj, const char *file,
-                                 const char *key, const char *flags);
+                                 const char *key, const char *flags);
 
 
 
    Creating an Image Object and Setting the Image Data Source
    
@@ -278,39 +278,39 @@ Eina_Bool evas_object_image_save(const Evas_Object *obj, const char *file,
 int
 main(int argc, char **argv)
 {
-    elm_init(argc, argv);
+    elm_init(argc, argv);
 
-    /* Create a window object */
-    Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC);
-    evas_object_resize(win, 400, 400);
-    evas_object_show(win);
+    /* Create a window object */
+    Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC);
+    evas_object_resize(win, 400, 400);
+    evas_object_show(win);
 
-    /* Return Evas handle from window */
-    Evas *e = evas_object_evas_get(win);
+    /* Return Evas handle from window */
+    Evas *e = evas_object_evas_get(win);
 
-    /* Create an image object */
-    Evas_Object *img = evas_object_image_add(e);
+    /* Create an image object */
+    Evas_Object *img = evas_object_image_add(e);
 
-    /* Set a source file to fetch pixel data */
-    evas_object_image_file_set(img, "./logo.png", NULL);
+    /* Set a source file to fetch pixel data */
+    evas_object_image_file_set(img, "./logo.png", NULL);
 
-    /* Set the size and position of the image on the image object area */
-    evas_object_image_fill_set(img, 0, 0, 300, 300);
+    /* Set the size and position of the image on the image object area */
+    evas_object_image_fill_set(img, 0, 0, 300, 300);
 
-    evas_object_move(img, 50, 50);
-    evas_object_resize(img, 300, 300);
-    evas_object_show(img);
+    evas_object_move(img, 50, 50);
+    evas_object_resize(img, 300, 300);
+    evas_object_show(img);
 
-    elm_run();
+    elm_run();
 
-    elm_shutdown();
+    elm_shutdown();
 
-    return 0;
+    return 0;
 }
 
-	
    Figure: Image object display
     
-	
    Image object display
      
-  
+	
    Figure: Image object display
    
+	
    Image object display
    
+
 
    Managing Images
    
 
 
    To manage image objects in Evas:
    
@@ -323,7 +323,7 @@ main(int argc, char **argv)
 
 
     img = evas_object_image_add(canvas);
-evas_object_image_file_set(img, "path/to/img", NULL);
+evas_object_image_file_set(img, "path/to/img", NULL);
 evas_object_image_fill_set(img, 0, 0, w, h);
 
    
 
@@ -342,8 +342,8 @@ evas_object_image_filled_set(img, EINA_TRUE);
 
 
    You can decide how to fill the image object area with the given image pixel data by setting the position, width, and height of the image using the evas_object_image_fill_set() function. Without setting this information, the image is not displayed. If the size of the image is bigger than the image object area, only a sub-region of the original image is displayed. If the image is smaller than the area, images are tiled repeatedly to fill the object area.
    
 
-	
    Figure: Image scaling
     
-	
    Image scaling
      
+	
    Figure: Image scaling
    
+	
    Image scaling
    
 
 	
@@ -358,13 +358,13 @@ evas_object_image_filled_set(img, EINA_TRUE);
 	 
-	
    
 	
    evas_object_image_fill_set(obj, 0, 0, 100, 127)
 	
    
 	
      
- 	
+	
    
+
 
    The evas_object_image_filled_set() function scales the image to fit the object area. Resizing the image object automatically triggers an internal call to the evas_object_image_fill_set() function.
    
 
 
    The evas_object_image_filled_add() function creates a new image object that automatically scales its bound image to the object area. This is a helper function around the evas_object_image_add() and evas_object_image_filled_set() functions.
    
 
-
    Scaled images' quality can differ according to scaling algorithms. Smooth scaling improves the image quality in the process of size reducing or enlarging. Evas runs its own smooth scaling algorithm by default and provides an API for you to disable the function.
    
+
    Scaled images' quality can differ according to scaling algorithms. Smooth scaling improves the image quality in the process of size reducing or enlarging. Evas runs its own smooth scaling algorithm by default and provides an API for you to disable the function.
    
 
 
    The algorithm is implemented using the SIMD (Single Instruction Multiple Data) vectorization in case of software rendering. It is optimized on Intel and ARM CPU through MMX and NEON command respectively.
    
 
@@ -378,38 +378,38 @@ evas_object_image_filled_set(img, EINA_TRUE);
 int
 main(int argc, char **argv)
 {
-    elm_init(argc, argv);
+    elm_init(argc, argv);
 
-    /* Create a window object */
-    Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC);
-    evas_object_resize(win, 400, 200);
-    evas_object_show(win);
+    /* Create a window object */
+    Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC);
+    evas_object_resize(win, 400, 200);
+    evas_object_show(win);
 
-    /* Return Evas handle from window */
-    Evas *e = evas_object_evas_get(win);
+    /* Return Evas handle from window */
+    Evas *e = evas_object_evas_get(win);
 
-    /* Create an image object */
-    Evas_Object *img = evas_object_image_filled_add(e);
-    evas_object_image_file_set(img, "./logo.png", NULL);
-    evas_object_move(img, 0, 0);
-    evas_object_resize(img, 200, 200);
-    evas_object_show(img);
+    /* Create an image object */
+    Evas_Object *img = evas_object_image_filled_add(e);
+    evas_object_image_file_set(img, "./logo.png", NULL);
+    evas_object_move(img, 0, 0);
+    evas_object_resize(img, 200, 200);
+    evas_object_show(img);
 
-    /* Create another image object */
-    Evas_Object *img2 = evas_object_image_filled_add(e);
-    evas_object_image_file_set(img2, "./logo.png", NULL);
+    /* Create another image object */
+    Evas_Object *img2 = evas_object_image_filled_add(e);
+    evas_object_image_file_set(img2, "./logo.png", NULL);
 
-    /* Disable smooth scaling */
-    evas_object_image_smooth_scale_set(img2, EINA_FALSE);
-    evas_object_move(img2, 200, 0);
-    evas_object_resize(img2, 200, 200);
-    evas_object_show(img2);
+    /* Disable smooth scaling */
+    evas_object_image_smooth_scale_set(img2, EINA_FALSE);
+    evas_object_move(img2, 200, 0);
+    evas_object_resize(img2, 200, 200);
+    evas_object_show(img2);
 
-    elm_run();
+    elm_run();
 
-    elm_shutdown();
+    elm_shutdown();
 
-    return 0;
+    return 0;
 }
    @@ -436,36 +436,36 @@ main(int argc, char **argv) int main(int argc, char **argv) { -    elm_init(argc, argv); + elm_init(argc, argv); + + /* Create a window object */ + Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC); + evas_object_resize(win, 400, 200); + evas_object_show(win); -    /* Create a window object */ -    Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC); -    evas_object_resize(win, 400, 200); -    evas_object_show(win); + /* Return Evas handle from window */ + Evas *e = evas_object_evas_get(win); -    /* Return Evas handle from window */ -    Evas *e = evas_object_evas_get(win); + /* Create an image object */ + Evas_Object *img = evas_object_image_filled_add(e); -    /* Create an image object */ -    Evas_Object *img = evas_object_image_filled_add(e); + /* + Load the image scaled into the object size + before evas_object_image_file_set() is called + */ + evas_object_image_load_size_set(img, 300, 300); -    /* -     Load the image scaled into the object size -     before evas_object_image_file_set() is called -    */ -    evas_object_image_load_size_set(img, 300, 300); + evas_object_image_file_set(img, "./logo.png", NULL); -    evas_object_image_file_set(img, "./logo.png", NULL); -     -    evas_object_move(img, 50, 50); -    evas_object_resize(img, 300, 300); -    evas_object_show(img); + evas_object_move(img, 50, 50); + evas_object_resize(img, 300, 300); + evas_object_show(img); -    elm_run(); + elm_run(); -    elm_shutdown(); + elm_shutdown(); -    return 0; + return 0; } @@ -486,9 +486,9 @@ evas_object_image_data_update_add(image, 100, 100, 50, 50); evas_object_image_data_update_add(image, 180, 100, 50, 50); evas_object_image_data_update_add(image, 85, 200, 160, 80); - -

    Figure: Partial image update

    -

    Partial image update

    + +

    Figure: Partial image update

    +

    Partial image update

    The following code creates an image object and sets a source file on it. Then it implements the blur effect to the pixel data and saves them using the evas_object_image_save() function.

    @@ -498,73 +498,73 @@ evas_object_image_data_update_add(image, 85, 200, 160, 80); void image_blur(Evas_Object *img) { -    unsigned char *img_src = evas_object_image_data_get(img, EINA_TRUE); - -    int w; -    int h; -    evas_object_image_size_get(img, &w, &h); -    int blur_size = 4; -    int x; -    int y; -    int xx; -    int yy; - -    for (y = 0; y < h; y++) { -        for (x = 0; x < w; x++) { -            int avg_color[3] = {0, 0, 0}; -            int blur_pixel_cnt = 0; - -            for (xx = x; (xx < x + blur_size) && (xx < w); xx++) { -                for (yy = y; (yy < y + blur_size) && (yy < h); yy++) { -                    int idx = (yy * w * 4) + (xx * 4); -                    avg_color[0] += img_src[idx + 0]; -                    avg_color[1] += img_src[idx + 1]; -                    avg_color[2] += img_src[idx + 2]; -                    ++blur_pixel_cnt; -                } -            } -            avg_color[0] /= blur_pixel_cnt; -            avg_color[1] /= blur_pixel_cnt; -            avg_color[2] /= blur_pixel_cnt; - -            for (xx = x; (xx < x + blur_size) && (xx < w); xx++) { -                for (yy = y; (yy < y + blur_size) && (yy < h); yy++) { -                    int idx = (yy * w * 4) + (xx * 4); -                    img_src[idx + 0] = avg_color[0]; -                    img_src[idx + 1] = avg_color[1]; -                    img_src[idx + 2] = avg_color[2]; -                } -            } -        } -    } -    evas_object_image_data_update_add(img, 0, 0, w, h); + unsigned char *img_src = evas_object_image_data_get(img, EINA_TRUE); + + int w; + int h; + evas_object_image_size_get(img, &w, &h); + int blur_size = 4; + int x; + int y; + int xx; + int yy; + + for (y = 0; y < h; y++) { + for (x = 0; x < w; x++) { + int avg_color[3] = {0, 0, 0}; + int blur_pixel_cnt = 0; + + for (xx = x; (xx < x + blur_size) && (xx < w); xx++) { + for (yy = y; (yy < y + blur_size) && (yy < h); yy++) { + int idx = (yy * w * 4) + (xx * 4); + avg_color[0] += img_src[idx + 0]; + avg_color[1] += img_src[idx + 1]; + avg_color[2] += img_src[idx + 2]; + ++blur_pixel_cnt; + } + } + avg_color[0] /= blur_pixel_cnt; + avg_color[1] /= blur_pixel_cnt; + avg_color[2] /= blur_pixel_cnt; + + for (xx = x; (xx < x + blur_size) && (xx < w); xx++) { + for (yy = y; (yy < y + blur_size) && (yy < h); yy++) { + int idx = (yy * w * 4) + (xx * 4); + img_src[idx + 0] = avg_color[0]; + img_src[idx + 1] = avg_color[1]; + img_src[idx + 2] = avg_color[2]; + } + } + } + } + evas_object_image_data_update_add(img, 0, 0, w, h); } int main(int argc, char **argv) { -    elm_init(argc, argv); + elm_init(argc, argv); -    Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC); -    evas_object_resize(win, 200, 200); -    evas_object_show(win); + Evas_Object *win = elm_win_add(NULL, "main", ELM_WIN_BASIC); + evas_object_resize(win, 200, 200); + evas_object_show(win); -    Evas *e = evas_object_evas_get(win); + Evas *e = evas_object_evas_get(win); -    Evas_Object *img = evas_object_image_filled_add(e); -    evas_object_image_file_set(img, "./logo.png", NULL); -    evas_object_resize(img, 200, 200); -    evas_object_show(img); + Evas_Object *img = evas_object_image_filled_add(e); + evas_object_image_file_set(img, "./logo.png", NULL); + evas_object_resize(img, 200, 200); + evas_object_show(img); -    image_blur(img); + image_blur(img); -    evas_object_image_save(img, "logo2.png", NULL, "quality=100 compress=8"); + evas_object_image_save(img, "logo2.png", NULL, "quality=100 compress=8"); -    elm_run(); + elm_run(); -    elm_shutdown(); + elm_shutdown(); -    return 0; + return 0; } @@ -579,7 +579,7 @@ main(int argc, char **argv)     		Before After
    +

    Giving Performance Hints

    In image viewer applications, you can display an image in full size. The navigation to the adjacent images on your album must be fluid and fast. Thus, while displaying a given image, the program can load the next and previous image in the background to be able to immediately repaint the screen with a new image.

    @@ -588,10 +588,10 @@ main(int argc, char **argv) 
     prev = evas_object_image_filled_add(canvas);
-evas_object_image_file_set(prev, "/path/to/prev", NULL);
+evas_object_image_file_set(prev, "/path/to/prev", NULL);
 evas_object_image_preload(prev, EINA_FALSE);
 next = evas_object_image_filled_add(canvas);
-evas_object_image_file_set(next, "/path/to/next", NULL);
+evas_object_image_file_set(next, "/path/to/next", NULL);
 evas_object_image_preload(next, EINA_FALSE);
    @@ -601,7 +601,7 @@ evas_object_image_preload(next, EINA_FALSE); 
     img = evas_object_image_filled_add(canvas);
-evas_object_image_file_set(img, "/path/to/next", NULL);
+evas_object_image_file_set(img, "/path/to/next", NULL);
 evas_object_image_load_scale_down_set(img, 2); /* Loading image size is img/2 */
    @@ -613,18 +613,18 @@ evas_object_image_load_region_set(img, x, y, w, h);

    Specifying Borders

    With Evas, you can specify image margins to be treated as borders. The margins then maintain their aspects when the image is resized. This makes setting frames around other UI objects easier. The following figure illustrates the border behavior, when the image is resized.

    -

    Figure: Borders in Evas

    -

    Borders in Evas

    - +

    Figure: Borders in Evas

    +

    Borders in Evas

    +

    Textblock Objects

    Unlike basic text objects, a textblock handles complex text, managing multiple styles and multiline text based on HTML-like tags. However, these extra features are heavier on memory and processing cost.

    The textblock objects is an object that shows big chunks of text. Textblock supports many features, including text formatting, automatic and manual text alignment, embedding items (icons, for example). Textblock has 3 important parts: the text paragraphs, the format nodes and the cursors.

    -

    To set markup to format text, use for example <font_size=50>Big!</font_size>. Set more than one style directive in one tag with <font_size=50 color=#F00>Big and Red!</font_size>. Note that </font_size> is used although the format also included color. This is because the first format determines the matching closing tag's name. You can use anonymous tags, such as <font_size=30>Big</>, which pop any type of format, but it is advisable to use the named alternatives instead.

    +

    To set markup to format text, use for example <font_size=50>Big!</font_size>. Set more than one style directive in one tag with <font_size=50 color=#F00>Big and Red!</font_size>. Note that </font_size> is used although the format also included color. This is because the first format determines the matching closing tag's name. You can use anonymous tags, such as <font_size=30>Big</>, which pop any type of format, but it is advisable to use the named alternatives instead.

    Textblock supports the following formats:

      -
    • font: Font description in fontconfig such as format, for example "Sans:style=Italic:lang=hi" or "Serif:style=Bold".
      • +
    • font: Font description in fontconfig such as format, for example "Sans:style=Italic:lang=hi" or "Serif:style=Bold".
    • font_weight: Overrides the weight defined in font. For example, font_weight=Bold is the same as font=:style=Bold. The supported weights are normal, thin, ultralight, light, book, medium, semibold, bold, ultrabold, black, and extrablack.
    • font_style: Overrides the style defined in font. For example, font_style=Italic is the same as font=:style=Italic. The supported styles are normal, oblique, and italic.
    • font_width: Overrides the width defined in font. For example, font_width=Condensed is the same as font=:style=Condensed. The supported widths are normal, ultracondensed, extracondensed, condensed, semicondensed, semiexpanded, expanded, extraexpanded, and ultraexpanded.
      • @@ -655,7 +655,7 @@ evas_object_image_load_region_set(img, x, y, w, h);
    • linerelsize: Either a floating point value or a percentage indicating the wanted size of the line relative to the calculated size.
    • linegap: To force a line gap in pixels.
    • linerelgap: Either a floating point value or a percentage indicating the wanted size of the line relative to the calculated size.
      • -
    • item: Creates an empty space that is filled by an upper layer. Use size, abssize, or relsize to define the item's size, and an optional vsize = full/ascent to define the item's position in the line.
      • +
    • item: Creates an empty space that is filled by an upper layer. Use size, abssize, or relsize to define the item's size, and an optional vsize = full/ascent to define the item's position in the line.
    • linefill: Either a float value or percentage indicating how much to fill the line.
    • ellipsis: A value between 0.0 and 1.0 to indicate the type of ellipsis, or -1.0 to indicate that an ellipsis is not wanted.
    • password: Either on or off, this is used to specifically turn replacing chars with the password mode (that is, replacement char) on and off.
      • @@ -677,7 +677,7 @@ evas_object_show(clipper);

      Layer of Color

      -

      A solid white clipper does not produce a change in the color of the clipped object, only hides what is outside the clipper's area. Changing the color of an object is accomplished by using a colored clipper. Clippers with color function by multiplying the colors of the clipped object. The following code shows how to remove all the red from an object.

      +

      A solid white clipper does not produce a change in the color of the clipped object, only hides what is outside the clipper's area. Changing the color of an object is accomplished by using a colored clipper. Clippers with color function by multiplying the colors of the clipped object. The following code shows how to remove all the red from an object.

       Evas_Object *clipper = evas_object_rectangle_add(evas);
 evas_object_move(clipper, my_evas_object_x, my_evas_object_y);
@@ -685,7 +685,7 @@ evas_object_resize(clipper, my_evas_object_width, my_evas_object_height);
 evas_object_color_set(clipper, 0, 255, 255, 255);
 evas_object_clip_set(obj, clipper);
 evas_object_show(clipper);
-
      +

      Mapping Objects

      @@ -797,12 +797,12 @@ evas_map_free(m);

      Rotating in the 3D space does not look natural. A more natural look becomes by adding perspective to the transformation, which is done with the evas_map_util_3d_perspective() function on the map after its position has been set. Use the following parameters:

        -
      • px and py specify the "infinite distance" point in the 3D conversion, where all lines converge to.
        • +
      • px and py specify the "infinite distance" point in the 3D conversion, where all lines converge to.
      • z0 specifies the Z value at which there is a 1:1 mapping between spatial coordinates and screen coordinates: any points on this Z value do not have their X and Y coordinates modified in the transform, while those further away (Z value higher) shrink into the distance, and those less than this value expand.
        • -
      • focal determines the "focal length" of the camera: this is the distance in reality between the camera lens plane (the rendering results are undefined at or closer than this) and the z0 value; this function allows for some "depth" control.
        • +
      • focal determines the "focal length" of the camera: this is the distance in reality between the camera lens plane (the rendering results are undefined at or closer than this) and the z0 value; this function allows for some "depth" control.

      Color and Lighting

      -

      Each point in a map can be set to a color, which is multiplied with the object's own color and linearly interpolated in between adjacent points. To do this, use evas_map_point_color_set(map, index, r, g, b, a) for each point of the map, or evas_map_util_points_color_set() to set every point into the same color.

      +

      Each point in a map can be set to a color, which is multiplied with the object's own color and linearly interpolated in between adjacent points. To do this, use evas_map_point_color_set(map, index, r, g, b, a) for each point of the map, or evas_map_util_points_color_set() to set every point into the same color.

      To add lighting for the objects, which is useful with 3D transforms, use the evas_map_util_3d_lighting() function with the following parameters:

    @@ -44,10 +44,10 @@

    Evas Rendering Concept and Method

    - -

    Evas is a canvas display library where the canvas is structural and acts as a state engine. It differs from most display and windowing systems, which are immediate mode display targets. Evas handles the logic of the structural display using its state engine, and controls the target windowing system to produce rendered results of the current canvas's state on the display.

    -

    UI Rendering Modes

    +

    Evas is a canvas display library where the canvas is structural and acts as a state engine. It differs from most display and windowing systems, which are immediate mode display targets. Evas handles the logic of the structural display using its state engine, and controls the target windowing system to produce rendered results of the current canvas's state on the display.

    + +

    UI Rendering Modes

    Evas removes the need to know about the characteristics of your display system or what graphics calls are used to draw them and how. It deals on an object level where all you do is create and manipulate objects in a canvas, set their properties, and the rest is done for you. This rendering method is called the retained mode, as opposed to the immediate mode used in most display and windowing systems:

    @@ -56,8 +56,8 @@

    The immediate mode is most commonly used in graphic toolkit libraries, such as GTK+, GDI, and GDI+. The application is responsible for repainting the invalid portion of the client area.

    -

    Figure: Immediate mode

    -

    Immediate mode

    +

    Figure: Immediate mode

    +

    Immediate mode

    Immediate mode display systems retain very little or no state. A program executes a series of commands, as in the following pseudo code:

    @@ -71,55 +71,55 @@ draw image bitmap_handle at position (10, 30);

    The series of commands is executed by the windowing system and the results are typically displayed on the screen. Once the commands are executed, the display system does not know how to reproduce this image again, and has to be instructed by the application on how to redraw sections of the screen, if needed. Each successive command is executed as instructed by the application and either emulated by the software or sent to the graphics hardware on the device to be performed.

    The advantage of an immediate mode system is that it is simple and gives a program tight control over how something looks and is drawn. Given the increasing complexity of displays and demands for better looking interfaces, more work needs to be done at this level by the internals of UI component sets, custom display components, and other programs. This means that more logic and display rendering code needs to be written again each time the application needs to figure out how to minimize redraws for the display to be fast and interactive, and keep track of the redraw logic.

    -

    In the following pseudo code scene example, if the windowing system requires the application to redraw the area from 0, 0 to 50, 50 (also referred to as the "expose event"), you must manually calculate the updates and repaint the area:

    +

    In the following pseudo code scene example, if the windowing system requires the application to redraw the area from 0, 0 to 50, 50 (also referred to as the "expose event"), you must manually calculate the updates and repaint the area:

     Redraw from position (0, 0) to position (50, 50):
 
 /* What was in area (0, 0, 50, 50)? */
 
-    /* 1. intersection part of line (0, 0) to (100, 200)? */
-    draw line from position (0, 0) to position (25, 50);
+    /* 1. intersection part of line (0, 0) to (100, 200)? */
+    draw line from position (0, 0) to position (25, 50);
 
-    /* 2. intersection part of rectangle (10, 30) to (50, 500)? */
-    draw rectangle from position (10, 30) to position (50, 50);
+    /* 2. intersection part of rectangle (10, 30) to (50, 500)? */
+    draw rectangle from position (10, 30) to position (50, 50);
 
-    /* 3. intersection part of image at (10, 30), size 100 x 100? */
-    bitmap_subimage = subregion from position (0, 0) to position (40, 20);
-    draw image bitmap_subimage at position (10, 30);
+    /* 3. intersection part of image at (10, 30), size 100 x 100? */
+    bitmap_subimage = subregion from position (0, 0) to position (40, 20);
+    draw image bitmap_subimage at position (10, 30);

    In the immediate mode, the application commands any drawing issues as it needs, and the display system draws some UI components. After the drawing is done, it appears in the destination. This mode allows you to have exact control over the render cycles. However, if the draw commands are misused, unnecessary drawing can be performed or drawing never happens at all. For example, if all elements in the scene are opaque, the system is doing useless paints: part of the line is behind the rectangle, and part of the rectangle is behind the image. These useless paints tend to be very costly.

    -

    The following code example shows the common usage of the immediate mode:

    +

    The following code example shows the common usage of the immediate mode:

     void
 update()
 {
-    Image *img = load_image(NEW_IMG);
+    Image *img = load_image(NEW_IMG);
 
-    /* Switch button image to new one */
-    update_button_image(img);
+    /* Switch button image to new one */
+    update_button_image(img);
 
-    /* Issue the invalid area (button area) to be redrawn on the screen */
-    invalidate_area(button_x, button_y, button_w, button_h);
+    /* Issue the invalid area (button area) to be redrawn on the screen */
+    invalidate_area(button_x, button_y, button_w, button_h);
 
-    /* Move rectangle from (200, 200) to (300, 300) */
-    int rect_prev_x = rect_x;
-    int rect_prev_y = rect_y;
-    rectangle_x = 300;
-    rectangle_y = 300;
-    set_rect_position(rect_x, rect_y);
+    /* Move rectangle from (200, 200) to (300, 300) */
+    int rect_prev_x = rect_x;
+    int rect_prev_y = rect_y;
+    rectangle_x = 300;
+    rectangle_y = 300;
+    set_rect_position(rect_x, rect_y);
 
-    /* Issue the invalid area (changed area) to be redrawn on the screen */
-    int diff_x = rect_x – rect_prev_x;
-    int diff_y = rect_y – rect_prev_y;
-    invalidate_area(rect_prev_x, rect_prev_y, (rect_w + diff_x), (rect_h + diff_y));
+    /* Issue the invalid area (changed area) to be redrawn on the screen */
+    int diff_x = rect_x – rect_prev_x;
+    int diff_y = rect_y – rect_prev_y;
+    invalidate_area(rect_prev_x, rect_prev_y, (rect_w + diff_x), (rect_h + diff_y));
 
-    /* After setting the invalid area, request rendering to update the screen */
-    render();
+    /* After setting the invalid area, request rendering to update the screen */
+    render();
 
-    /* Now you can see how the button image and rectangle position are changed */
+    /* Now you can see how the button image and rectangle position are changed */
 }
    @@ -128,8 +128,8 @@ update()

    A graphics system adopting the retained mode is basically responsible for responding to all repaint requests for rendering the application objects. Clients do not directly cause actual rendering, but objects are redrawn when parts of them are updated.

    -

    Figure: Retained mode

    -

    Retained mode

    +

    Figure: Retained mode

    +

    Retained mode

    Evas is a structural system in which you create and manage display objects and their properties, and as a result of this higher level state management, the canvas is able to redraw the set of objects when needed to represent the current state of the canvas.

    A program creates the display objects and their properties as a series of commands, as in the following pseudo code:

    @@ -161,39 +161,39 @@ render scene; void create_image() { -    /* Initialize an image object to be displayed on the screen */ -    Evas_Object *img = evas_object_image_add(e); + /* Initialize an image object to be displayed on the screen */ + Evas_Object *img = evas_object_image_add(e); -    /* Set image resource */ -    evas_object_image_file_set(img, IMG, NULL); + /* Set image resource */ + evas_object_image_file_set(img, IMG, NULL); -    /* Set image position */ -    evas_object_move(img, 100, 100); + /* Set image position */ + evas_object_move(img, 100, 100); -    /* Set image size */ -    evas_object_resize(img, 200, 200); + /* Set image size */ + evas_object_resize(img, 200, 200); -    /* Set image visibility (show or hide) */ -    evas_object_show(img); + /* Set image visibility (show or hide) */ + evas_object_show(img); } void create_rectangle() { -    /* Initialize an rectangle object to be displayed on the screen */ -    Evas_Object *rect = evas_object_rectangle_add(e); + /* Initialize an rectangle object to be displayed on the screen */ + Evas_Object *rect = evas_object_rectangle_add(e); -    /* Set rectangle color */ -    evas_object_color_set(rect, 255, 0, 0, 255); + /* Set rectangle color */ + evas_object_color_set(rect, 255, 0, 0, 255); -    /* Set rectangle position */ -    evas_object_move(rect, 200, 200); + /* Set rectangle position */ + evas_object_move(rect, 200, 200); -    /* Set rectangle size */ -    evas_object_resize(rect, 200, 200); + /* Set rectangle size */ + evas_object_resize(rect, 200, 200); -    /* Set rectangle visibility (show or hide) */ -    evas_object_show(rect); + /* Set rectangle visibility (show or hide) */ + evas_object_show(rect); } @@ -203,11 +203,11 @@ create_rectangle() void update() { -    /* Set new image resource */ -    elm_image_file_set(img, NEW_IMG, NULL); + /* Set new image resource */ + elm_image_file_set(img, NEW_IMG, NULL); -    /* Set new rectangle position */ -    evas_object_move(rect, 300, 300); + /* Set new rectangle position */ + evas_object_move(rect, 300, 300); } @@ -217,14 +217,14 @@ update()

    Tizen native applications run on the Ecore main loop, which performs a few steps for every frame. At the end of the loop, when it goes to the idle enterer step, Evas redraws any changes in the objects by calculating the changed portions of all display objects and redrawing them. If there are no changes, Evas rendering is skipped.

    -

    Figure: Evas rendering in the main loop

    -

    Evas rendering in the main loop

    +

    Figure: Evas rendering in the main loop

    +

    Evas rendering in the main loop

    To minimize the required rendering, Evas tracks the states of all display objects, such as their position, size, visibility, and color. If a state is changed while the object is hidden by other obscured objects, the object is not redrawn. In other words, Evas draws only the necessary changes in the screen.

    The following figures illustrate how Evas redraws a changed area:

    -

    1. Originally, the screen contains a blue background object (a sky-blue color rectangle) and a partially hidden cloud image object. Above them, there are a red and green rectangle, and the "Hello out there" text printed on the green rectangle.

      +

      1. Originally, the screen contains a blue background object (a sky-blue color rectangle) and a partially hidden cloud image object. Above them, there are a red and green rectangle, and the "Hello out there" text printed on the green rectangle.

        Evas redrawing example 1

        2. @@ -238,9 +238,9 @@ update()

      2. Evas determines the invalid areas that require cleaning, and redraws them.

        -

        Evas redrawing example 4

        3. +

        Evas redrawing example 4

        -

      3. At the end, the updated screen shows the original screen with the updated areas visible.

        +

      4. At the end, the updated screen shows the original screen with the updated areas visible.

        Evas redrawing example 5

      @@ -253,12 +253,12 @@ update()

      Evas can work with and provides multiple engines, such as:

      • buffer: All the rendering takes place in a buffer.
        • -
      • fb: Rendering takes place in the system's framebuffer.
        • +
      • fb: Rendering takes place in the system's framebuffer.
      • software_x11: Renders to an X11 window; this is the most used engine.
      • gl_x11: Renders to an X11 window, except that it uses OpenGL.

      The engines implement the rendering of all the basic objects by themselves, because they can often be accelerated by the hardware or backend software libraries to provide fast rendering.

      -

      If a particular engine does not have the provision for a certain primitive object, it reverts back to using a default software version.

      +

      If a particular engine does not have the provision for a certain primitive object, it reverts back to using a default software version.

      Note @@ -273,7 +273,7 @@ update() +
      + - Event Handling - + Event Handling + - + +
    -

    Event Handling

    - +

    Event Handling

    +

    EFL relies on events and callbacks. In case of an event, such as a key press, mouse click, or a battery running low, the main loop calls the callback functions that are associated with that specific event. After the callbacks have finished, the main loop takes over and waits for new events, upon which to trigger new callbacks.

    It is important to do light work in the callbacks and to return to the main loop relatively quickly. If there is heavy work to do, use an asynchronous mechanism, such as Ecore_con for network I/O, or threads for CPU-intensive tasks. Failing to return quickly to the main loop blocks the application UI and makes it appear frozen.

    @@ -56,12 +56,12 @@
  • Ecore events are the lowest-level events and come directly from the system. Except for application-wide shortcuts, it is not advisable to use them.
  • Evas events are events on the graphical canvas as a whole. They are fairly low-level and mostly useful when drawing directly on the canvas.
  • Evas object events concern the objects that are on the canvas. You can also implement multi-point touch events for Evas objects.
    • -
  • Evas smart events are the most often used and take place on collections of Evas objects. They are called "smart", because they have an internal logic and can define their own events, while the other event types are fixed.
    • +
  • Evas smart events are the most often used and take place on collections of Evas objects. They are called "smart", because they have an internal logic and can define their own events, while the other event types are fixed.
    • -

    Figure: Event types in the EFLs

    +

    Figure: Event types in the EFLs

    Event types in the EFLs

    - +
    Note There are also Edje signals, which come from program blocks in the theme EDC files. They can be used from the high level Elementary APIs or the low level Edje APIs. @@ -76,17 +76,17 @@

  • The callback for the clicked event starts the download in Ecore_con, displays the first progress bar, and adds a callback to monitor the download progress. When the download progress changes, the callback updates the progress bar.

  • After the download is finished, the second progress bar is displayed and the file processing is offloaded to another thread through the Ecore_thread. The processing function regularly updates the progress bar, which wrapped in the ecore_main_loop_thread_safe_call_async() function because GUI operations are not thread-safe.

    • -

    Events enable operations taking more than a few milliseconds' time to be executed outside of the main loop, therefore not blocking UI redraws.

    +

    Events enable operations taking more than a few milliseconds' time to be executed outside of the main loop, therefore not blocking UI redraws.

    The following figure illustrates the event flow that follows a click on the screen.

    -

    Figure: Event flow for a user click

    +

    Figure: Event flow for a user click

    Event flow for a user click

    - +
    Note Except as noted, this content is licensed under LGPLv2.1+.
    - +
    diff --git a/org.tizen.guides/html/native/ui/efl/event_types_n.htm b/org.tizen.guides/html/native/ui/efl/event_types_n.htm index 7e8267d..2ac7424 100644 --- a/org.tizen.guides/html/native/ui/efl/event_types_n.htm +++ b/org.tizen.guides/html/native/ui/efl/event_types_n.htm @@ -5,20 +5,20 @@ - + - Event Types - + Event Types + - + +
    -

    Event Types

    - -

    EFL provides various event types that you can use to monitor and react to user interactions and system events in the UI.

    - +

    Event Types

    + +

    EFL provides various event types that you can use to monitor and react to user interactions and system events in the UI.

    +

    Ecore Events

    Ecore events are used for low-level handling of events, such as key presses, network connections, and communication with sub-processes. In case of shortcuts, the low-level handling of key presses is particularly useful: instead of adding a signal handler to a specific graphical element, you can add one globally to guarantee that no matter which UI component is currently receiving events, the shortcut is caught correctly.

    @@ -66,151 +66,151 @@

    The following Ecore events are available for shortcuts. The event callbacks receive additional data through a void* object, whose type depends on the received event.

      -
    • ECORE_EVENT_KEY_DOWN and ECORE_EVENT_KEY_UP: +
    • ECORE_EVENT_KEY_DOWN and ECORE_EVENT_KEY_UP: 
       typedef struct _Ecore_Event_Key Ecore_Event_Key;
 
 struct _Ecore_Event_Key {
-    const char *keyname;
-    const char *key;
-    const char *string;
-    const char *compose;
-    Ecore_Window window;
-    Ecore_Window root_window;
-    Ecore_Window event_window;
-
-    unsigned int timestamp;
-    unsigned int modifiers;
-
-    int same_screen;
+    const char *keyname;
+    const char *key;
+    const char *string;
+    const char *compose;
+    Ecore_Window window;
+    Ecore_Window root_window;
+    Ecore_Window event_window;
+
+    unsigned int timestamp;
+    unsigned int modifiers;
+
+    int same_screen;
 };
      • -
    • ECORE_EVENT_MOUSE_BUTTON_DOWN and ECORE_EVENT_MOUSE_BUTTON_UP: +
    • ECORE_EVENT_MOUSE_BUTTON_DOWN and ECORE_EVENT_MOUSE_BUTTON_UP: 
       typedef struct _Ecore_Event_Mouse_Button Ecore_Event_Mouse_Button;
 
 struct _Ecore_Event_Mouse_Button {
-    Ecore_Window window;
-    Ecore_Window root_window;
-    Ecore_Window event_window;
-
-    unsigned int timestamp;
-    unsigned int modifiers;
-    unsigned int buttons;
-    unsigned int double_click;
-    unsigned int triple_click;
-    int same_screen;
-
-    int x;
-    int y;
-    struct {
-        int x;
-        int y;
-    } root;
-
-    struct {
-        /*
-           0 if normal mouse, 1+ for other mouse-devices
-           (such as multi-touch - other fingers)
-        */
-        int device;
-        /*
-           Radius of press point - radius_x and radius_y
-           if it is an ellipse (radius is the average of the 2)
-        */
-        double radius;
-        double radius_x;
-        double radius_y;
-        /* Pressure - 1.0 == normal, > 1.0 == more, 0.0 == none */
-        double pressure;
-        /* Angle relative to perpendicular (0.0 == perpendicular), in degrees */
-        double angle;
-        /* Same as x, y, root.x, root.y, but with sub-pixel precision, if available */
-        double x;
-        double y;
-        struct {
-            double x;
-            double y;
-        } root;
-    } multi;
+    Ecore_Window window;
+    Ecore_Window root_window;
+    Ecore_Window event_window;
+
+    unsigned int timestamp;
+    unsigned int modifiers;
+    unsigned int buttons;
+    unsigned int double_click;
+    unsigned int triple_click;
+    int same_screen;
+
+    int x;
+    int y;
+    struct {
+        int x;
+        int y;
+    } root;
+
+    struct {
+        /*
+           0 if normal mouse, 1+ for other mouse-devices
+           (such as multi-touch - other fingers)
+        */
+        int device;
+        /*
+           Radius of press point - radius_x and radius_y
+           if it is an ellipse (radius is the average of the 2)
+        */
+        double radius;
+        double radius_x;
+        double radius_y;
+        /* Pressure - 1.0 == normal, > 1.0 == more, 0.0 == none */
+        double pressure;
+        /* Angle relative to perpendicular (0.0 == perpendicular), in degrees */
+        double angle;
+        /* Same as x, y, root.x, root.y, but with sub-pixel precision, if available */
+        double x;
+        double y;
+        struct {
+            double x;
+            double y;
+        } root;
+    } multi;
 };
      - +
      • -
    • ECORE_EVENT_MOUSE_MOVE and ECORE_EVENT_MOUSE_WHEEL: +
    • ECORE_EVENT_MOUSE_MOVE and ECORE_EVENT_MOUSE_WHEEL: 
       typedef struct _Ecore_Event_Mouse_Wheel Ecore_Event_Mouse_Wheel;
 
 struct _Ecore_Event_Mouse_Wheel {
-    Ecore_Window window;
-    Ecore_Window root_window;
-    Ecore_Window event_window;
-
-    unsigned int timestamp;
-    unsigned int modifiers;
-
-    int same_screen;
-    int direction;
-    int z;
-
-    int x;
-    int y;
-    struct {
-        int x;
-        int y;
-    } root;
+    Ecore_Window window;
+    Ecore_Window root_window;
+    Ecore_Window event_window;
+
+    unsigned int timestamp;
+    unsigned int modifiers;
+
+    int same_screen;
+    int direction;
+    int z;
+
+    int x;
+    int y;
+    struct {
+        int x;
+        int y;
+    } root;
 };
      • -
    • ECORE_EVENT_MOUSE_IN and ECORE_EVENT_MOUSE_OUT: +
    • ECORE_EVENT_MOUSE_IN and ECORE_EVENT_MOUSE_OUT: 
       typedef struct _Ecore_Event_Mouse_Move Ecore_Event_Mouse_Move;
 
 struct _Ecore_Event_Mouse_Move {
-    Ecore_Window window;
-    Ecore_Window root_window;
-    Ecore_Window event_window;
-
-    unsigned int timestamp;
-    unsigned int modifiers;
-
-    int same_screen;
-
-    int x;
-    int y;
-    struct {
-        int x;
-        int y;
-    } root;
-
-    struct {
-        /*
-           0 if normal mouse, 1+ for other mouse-devices
-           (such as multi-touch - other fingers)
-        */
-        int device;
-        /*
-           Radius of press point - radius_x and radius_y
-           if it is an ellipse (radius is the average of the 2)
-        */
-        double radius;
-        double radius_x;
-        double radius_y;
-        /* Pressure - 1.0 == normal, > 1.0 == more, 0.0 == none */
-        double pressure;
-        /* Angle relative to perpendicular (0.0 == perpendicular), in degrees */
-        double angle;
-        /* Same as x, y, root.x, root.y, but with sub-pixel precision, if available */
-        double x;
-        double y;
-        struct {
-            double x;
-            double y;
-        } root;
-    } multi;
+    Ecore_Window window;
+    Ecore_Window root_window;
+    Ecore_Window event_window;
+
+    unsigned int timestamp;
+    unsigned int modifiers;
+
+    int same_screen;
+
+    int x;
+    int y;
+    struct {
+        int x;
+        int y;
+    } root;
+
+    struct {
+        /*
+           0 if normal mouse, 1+ for other mouse-devices
+           (such as multi-touch - other fingers)
+        */
+        int device;
+        /*
+           Radius of press point - radius_x and radius_y
+           if it is an ellipse (radius is the average of the 2)
+        */
+        double radius;
+        double radius_x;
+        double radius_y;
+        /* Pressure - 1.0 == normal, > 1.0 == more, 0.0 == none */
+        double pressure;
+        /* Angle relative to perpendicular (0.0 == perpendicular), in degrees */
+        double angle;
+        /* Same as x, y, root.x, root.y, but with sub-pixel precision, if available */
+        double x;
+        double y;
+        struct {
+            double x;
+            double y;
+        } root;
+    } multi;
 };
      @@ -220,7 +220,7 @@ struct _Ecore_Event_Mouse_Move {

      To manage Ecore event handlers:

      -
      1. To add an Ecore event handler, register a callback for a specific event with the ecore_event_handler_add() function. +
        1. To add an Ecore event handler, register a callback for a specific event with the ecore_event_handler_add() function.

          The function takes as parameters the event type (such as ECORE_EVENT_KEY_DOWN for key presses), callback function, and additional data delivered to the callback. The function returns an event handler pointer, which you can use to remove the handler later.

        2. Define the Ecore_Event_Handler_Cb() callback function. @@ -235,21 +235,21 @@ Eina_Bool ctrl_pressed = EINA_FALSE; static Eina_Bool _key_down_cb(void *data __UNUSED__, int type __UNUSED__, void *ev) { -    /* -     Callback is used with the ECORE_EVENT_KEY_DOWN signal: the -     parameter "void *ev" is therefore of the actual type Ecore_Event_Key -     Following renders its fields accessible -    */ -    Ecore_Event_Key *event = ev; - -    /* Test whether the key that is pressed is Ctrl */ -    if (!strcmp("Control_L", event->key)) { -        /* If it is, store that piece of information */ -        ctrl_pressed = EINA_TRUE; -    } - -    /* Let the event continue to other callbacks which have not been called yet */ -    return ECORE_CALLBACK_PASS_ON; + /* + Callback is used with the ECORE_EVENT_KEY_DOWN signal: the + parameter "void *ev" is therefore of the actual type Ecore_Event_Key + Following renders its fields accessible + */ + Ecore_Event_Key *event = ev; + + /* Test whether the key that is pressed is Ctrl */ + if (!strcmp("Control_L", event->key)) { + /* If it is, store that piece of information */ + ctrl_pressed = EINA_TRUE; + } + + /* Let the event continue to other callbacks which have not been called yet */ + return ECORE_CALLBACK_PASS_ON; } ecore_event_handler_add(ECORE_EVENT_KEY_DOWN, _key_down_cb, NULL); @@ -260,26 +260,26 @@ ecore_event_handler_add(ECORE_EVENT_KEY_DOWN, _key_down_cb, NULL);

          You can send Ecore events to the main loop yourself to handle actions of various origins through the same codepath. This is a thread-safe operation.

          To send an event, use the ecore_event_add() function. The function takes as parameters the event type (such as ECORE_EVENT_KEY_DOWN for key presses), additional data delivered to the callback, the Ecore_End_Cb() function used to free the additional data after it is delivered to the callback function, and the pointer to additional data delivered to the free function. The free function and the pointer to its additional data are optional; use NULL if you do not need them.

          - +

          Edje Events

          Edje themes have program blocks in the EDC file, which are triggered upon the reception of a signal that can execute actions, such as changing the state of an Edje part and running another program.

          Managing a Single Signal Emitter

          -

          The following example shows a program block of an Edje file. The program is called "change_color", and it is triggered on mouse clicks on the current part. It emits a "got.a.click" signal where the source is set to "color_changer".

          +

          The following example shows a program block of an Edje file. The program is called "change_color", and it is triggered on mouse clicks on the current part. It emits a "got.a.click" signal where the source is set to "color_changer".

           program
 {
-   name: "change_color";
-   signal: "mouse,clicked,*";
-   source: "*";
-   action: SIGNAL_EMIT "got.a.click" "color_changer";
+   name: "change_color";
+   signal: "mouse,clicked,*";
+   source: "*";
+   action: SIGNAL_EMIT "got.a.click" "color_changer";
 }

          To catch the emitted signal in the application code, use either the edje_object_signal_callback_add() or elm_object_signal_callback_add() function. Their only difference is that the previous one operates on an Edje object and the latter one on an Elementary object. Unless you do not use the Elementary library at all, use the Elementary variant.

          -

          Both the functions take as parameters the object emitting the signal, the signal name, the signal source, the Edje_Signal_Cb() callback function called when the signal name and source match, and additional data delivered to the callback. For the signal name and source, "*" acts as a wildcard. The additional data is optional; use NULL if you do not need it.

          +

          Both the functions take as parameters the object emitting the signal, the signal name, the signal source, the Edje_Signal_Cb() callback function called when the signal name and source match, and additional data delivered to the callback. For the signal name and source, "*" acts as a wildcard. The additional data is optional; use NULL if you do not need it.

          The callback function takes as parameters the additional data defined in the edje_object_signal_callback_add() or elm_object_signal_callback_add() function parameters, the object emitting the signal, the signal name, and the signal source.

          @@ -291,11 +291,11 @@ program

          The elm_layout_signal_callback_add() function works similarly as the elm_object_signal_callback_add() and edje_object_signal_callback_add() functions. The only difference is the type of the object in the first parameter. For elm_layout_signal_callback_add(), it is a pointer to an Evas_Object, which is obtained through the elm_layout_add() function. For more information, see Layout.

          - +

          Evas Events

          Evas events happen on a canvas as a whole. These events are too low-level for writing applications, and are mostly used when writing the graphical toolkit itself.

          - +

          Managing Evas Event Handlers

          Register and remove callback functions with the evas_event_callback_add() and evas_event_callback_add() functions. The evas_event_callback_add() function takes as parameters the Evas canvas on which the event happens (to obtain the canvas, use the Evas_Object through the evas_object_evas_get() function), the event type, the Evas_Event_Cb callback function, and the pointer to the additional data delivered to the callback. The additional data is optional; use NULL if you do not need it.

          @@ -305,25 +305,25 @@ program 
           void
 evas_event_callback_add(Evas *e, Evas_Callback_Type type,
-                        Evas_Event_Cb func, const void *data);
+                        Evas_Event_Cb func, const void *data);
 
 void
 (* Evas_Event_Cb)(void *data, Evas *e, void *event_info);
          - +

          Evas Event Types

          The following table lists the available Evas event types.

          -

          Table: Evas event types

          +

          Table: Evas event types

          - + - + - - + + @@ -359,7 +359,7 @@ void - +
          Event typeDescriptionEvent typeDescription
          EVAS_CALLBACK_RENDER_FLUSH_PREEVAS_CALLBACK_RENDER_POST Rendering on the canvas finishes.
          @@ -367,7 +367,7 @@ void

          Each Evas object on a specific Evas canvas can be manipulated independently. Each object can send events, which you can handle by registering callback functions for them. The events all relate to single objects, not the whole canvas.

          Managing Evas Object Event Handlers

          - +

          Register and remove callback functions with the evas_object_event_callback_add() and evas_object_event_callback_del() functions. The evas_object_event_callback_add() function takes as parameters the Evas_Object_Event_Cb callback function and the pointer to the additional data delivered to the callback.

          The callback function takes as parameters the additional data defined in the evas_event_callback_add() function parameters, the canvas where the event happened, the object to which the event happened, and the event info data, which depends on the object type and the event at play.

          @@ -375,7 +375,7 @@ void 
           void
 evas_object_event_callback_add(Evas_Object *obj, Evas_Callback_Type type,
-                               Evas_Object_Event_Cb func, const void *data);
+                               Evas_Object_Event_Cb func, const void *data);
 
 void
 (* Evas_Object_Event_Cb)(void *data, Evas *e, Evas_Object *obj, void *event_info);
@@ -384,16 +384,16 @@ void
 
 
          The following table lists the available Evas object event types.
          
 
-   
          Table: Evas object event types
           
+   
          Table: Evas object event types
          
 
-   +   -    
+   
-          
-          
-          
+         
+         
+         
@@ -510,21 +510,21 @@ void
          
-    
+   
           

       

    
       
          Event typeDescriptionevent_infoEvent typeDescriptionevent_info
       
          
       
          
          EVAS_CALLBACK_MOUSE_INImage data is unloaded.
          NULL
       
          
 
          
 
 
          Evas Smart Object Events
          
 
-
          Evas smart object events are the most widely-used type of events in graphical applications, since they are used for signals, such as "clicked", "clicked,double" (double-click), and "pressed". They are identified by strings, and each smart object is able to define its own events (although the names follow conventions).
          
+
          Evas smart object events are the most widely-used type of events in graphical applications, since they are used for signals, such as "clicked", "clicked,double" (double-click), and "pressed". They are identified by strings, and each smart object is able to define its own events (although the names follow conventions).
          
 
 
          Managing Evas Smart Object Event Handlers
          
 
-
          1. To add an Evas smart object event handler, register a callback for a specific event to an object with the evas_object_smart_callback_add() function. 
+
            1. To add an Evas smart object event handler, register a callback for a specific event to an object with the evas_object_smart_callback_add() function.
 
              The function takes as parameters the object to which the callback is added, the event name, the callback function, and additional data delivered to the callback. The additional data is optional; use NULL if you do not need it.
              2. 
 
 
            2. Define the Evas_Smart_Cb() callback function.
 
              The function takes as parameters the additional data defined in the evas_object_smart_callback_add() function parameters, the object to which the event happened, and the event info data, which depends on the object type and the event at play.
              
-
              If some of the parameters are not used by the callback function, the compiler can raise the "unused parameter" warning. To avoid it, annotate the parameter with the __UNUSED__ macro, which is a compiler-independent way to let the compiler know that the parameter is unused willingly, rather than by a mistake:
              
+
              If some of the parameters are not used by the callback function, the compiler can raise the "unused parameter" warning. To avoid it, annotate the parameter with the __UNUSED__ macro, which is a compiler-independent way to let the compiler know that the parameter is unused willingly, rather than by a mistake:
              
 
               void cb(void *data __UNUSED__, Evas_Object *obj, void *event_info __UNUSED__);
 
              
@@ -541,21 +541,21 @@ void cb(void *data __UNUSED__, Evas_Object *obj, void *event_info __UNUSED__);
 static void
 _button_clicked(void *data __UNUSED__, Evas_Object *obj, void *event_info __UNUSED__)
 {
-    fprintf(stdout, "Button clicked.\n");
-    fflush(stdout);
-    evas_object_smart_callback_del(obj, "clicked", _button_clicked);
+    fprintf(stdout, "Button clicked.\n");
+    fflush(stdout);
+    evas_object_smart_callback_del(obj, "clicked", _button_clicked);
 }
 
 static void
 _add_button(Evas_Object *window)
 {
-    Evas_Object *button;
+    Evas_Object *button;
 
-    button = elm_button_add(window);
-    elm_object_text_set(button, "Click Me!");
-    evas_object_smart_callback_add(button, "clicked", _button_clicked, NULL);
+    button = elm_button_add(window);
+    elm_object_text_set(button, "Click Me!");
+    evas_object_smart_callback_add(button, "clicked", _button_clicked, NULL);
 
-    evas_object_show(button);
+    evas_object_show(button);
 }
          @@ -563,7 +563,7 @@ _add_button(Evas_Object *window) Note Except as noted, this content is licensed under LGPLv2.1+.
    - +
    diff --git a/org.tizen.guides/html/native/ui/efl/font_setting_n.htm b/org.tizen.guides/html/native/ui/efl/font_setting_n.htm index 04a018c..7de0790 100644 --- a/org.tizen.guides/html/native/ui/efl/font_setting_n.htm +++ b/org.tizen.guides/html/native/ui/efl/font_setting_n.htm @@ -5,20 +5,20 @@ - + - Fonts - + Fonts + - + +
    -

    Fonts

    - +

    Fonts

    +

    Tizen provides various methods for setting the fonts of the application text. Basically, all UI components have a default font, which can be changed according to the system settings.

    The font handling methods include:

    -
      -
    • Setting the font for a UI component using the Elementary Fonts API (in mobile and wearable applications)
      • +
        +
      • Setting the font for a UI component using the Elementary Fonts API (in mobile and wearable applications)
      • Setting the font using the EDC file
        • -
      • Changing the font and text size using the Edje Class: Text API (in mobile and wearable applications) - +
      • Changing the font and text size using the Edje Class: Text API (in mobile and wearable applications) +

        In the application, you can create text classes to apply the same font and font size to various text (textblock) parts.

        The following words in the text_class definition are reserved for the system. If you use these text classes in a text or text block, a system font is applied to their texts. When the system font changes, the new font and size are applied to the texts too (except for the tizen text class, which only applies the new font, not the size).

        @@ -81,9 +81,9 @@

        Using the System Font

        -

        Tizen provides a special "Tizen" font name, which does not match with any specific font; it is just an alias for a system-defined font (system font). If you create a text object (with EDC or in the C code) with the "Tizen" font name, the system font is loaded into the user application when the object is created.

        +

        Tizen provides a special "Tizen" font name, which does not match with any specific font; it is just an alias for a system-defined font (system font). If you create a text object (with EDC or in the C code) with the "Tizen" font name, the system font is loaded into the user application when the object is created.

        -

        You can use the "Tizen" font name when you create a text or textblock part in the application's EDC file, when you use the text class, or when you set the UI component text font in the C code.

        +

        You can use the "Tizen" font name when you create a text or textblock part in the application's EDC file, when you use the text class, or when you set the UI component text font in the C code.

        For example:

          @@ -93,12 +93,12 @@ 
           description
 {
-   text
-   {
-      font: "Tizen:style=Regular";
-      font_size: 36;
-      text_class: "label";
-   }
+   text
+   {
+      font: "Tizen:style=Regular";
+      font_size: 36;
+      text_class: "label";
+   }
 }
        • Use the system font when creating a text part with the tizen text class. @@ -107,12 +107,12 @@ description 
           description
 {
-   text
-   {
-      font: "Tizen:style=Regular";
-      font_size: 36;
-      text_class: "tizen";
-   }
+   text
+   {
+      font: "Tizen:style=Regular";
+      font_size: 36;
+      text_class: "tizen";
+   }
 }
          • @@ -121,16 +121,16 @@ description 
           description
 {
-   text
-   {
-      font: "Tizen:style=Regular";
-      font_size: 50;
-   }
+   text
+   {
+      font: "Tizen:style=Regular";
+      font_size: 50;
+   }
 }
 
          -char *buf = "<font=Tizen:style=Regular font_size=50>Hello</font/>Font";
-elm_object_part_text_set(layout, "textblock1", buf);
+char *buf = "<font=Tizen:style=Regular font_size=50>Hello</font/>Font";
+elm_object_part_text_set(layout, "textblock1", buf);
        @@ -219,12 +219,12 @@ elm_object_part_text_set(layout, "textblock1", buf); - +

        The style attributes are not case-sensitive (however, the font feature names are).

        If you set the weight or width attribute to style=, it is processed to the right attribute.

         font=TizenSans:style=Bold /* Textblock */
-"TizenSans:style=Bold"; /* Text font */
+"TizenSans:style=Bold"; /* Text font */
 <font=TizenSans:style=Bold> /* Markup tag */
        @@ -249,8 +249,8 @@ font=TizenSans font_style=Regular font_weight=Bold /* Textblock */ 
    -char *buf = "<font=Sans:style=Regular font_size=50>Hello</font/>Font";
-elm_object_part_text_set(layout, "textblock1", buf);
+char *buf = "<font=Sans:style=Regular font_size=50>Hello</font/>Font";
+elm_object_part_text_set(layout, "textblock1", buf);
  • Set the font for an entry component (in mobile and wearable applications) using the elm_entry_text_style_user_push() function. It overrides the default style of the entry component for each attribute. @@ -262,11 +262,11 @@ elm_object_part_text_set(layout, "textblock1", buf); 
     /* Main text font */
-char *user_style = "DEFAULT='font=Sans:style=Regular font_size=40'";
+char *user_style = "DEFAULT='font=Sans:style=Regular font_size=40'";
 elm_entry_text_style_user_push(entry, user_style);
 /* Guide text font */
-elm_object_part_text_set(entry, "elm.guide",
-                         "<font=Sans:style=Regular font_size=40>Guide Text</font>");
+elm_object_part_text_set(entry, "elm.guide",
+                         "<font=Sans:style=Regular font_size=40>Guide Text</font>");
    • @@ -279,44 +279,44 @@ elm_object_part_text_set(entry, "elm.guide", 
     part
 {
-   name: "text";
-   type: TEXT;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      rel1.relative: 0.0 0.5;
-      rel2.relative: 0.5 1.0;
-      color: 0 136 170 255;
-      color2: 0 136 170 50;
-      color3: 0 136 170 25;
-      text
-      {
-         size: 25;
-         font: "Sans:style=Bold";
-         text: "Enventor";
-         align: 0.5 0.5;
-      }
-   }
+   name: "text";
+   type: TEXT;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      rel1.relative: 0.0 0.5;
+      rel2.relative: 0.5 1.0;
+      color: 0 136 170 255;
+      color2: 0 136 170 50;
+      color3: 0 136 170 25;
+      text
+      {
+         size: 25;
+         font: "Sans:style=Bold";
+         text: "Enventor";
+         align: 0.5 0.5;
+      }
+   }
 }
 
 part
 {
-   name: "textblock";
-   type: TEXTBLOCK;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      align: 0.5 0.5;
-      fixed: 0 0;
-      min: 0 0;
-      visible: 1;
-      text.text: "TEXTBLOCK";
-      text.font: "Sans:style=Bold";
-      rel1.relative: 0.16 0.18;
-      rel2.relative: 0.88 0.38;
-   }
+   name: "textblock";
+   type: TEXTBLOCK;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      align: 0.5 0.5;
+      fixed: 0 0;
+      min: 0 0;
+      visible: 1;
+      text.text: "TEXTBLOCK";
+      text.font: "Sans:style=Bold";
+      rel1.relative: 0.16 0.18;
+      rel2.relative: 0.88 0.38;
+   }
 }
    @@ -325,30 +325,30 @@ part 
     styles
 {
-   style
-   {
-      name: "textblock_style1";
-      base: "font=Sans:style=Regular font_size=30";
-   }
+   style
+   {
+      name: "textblock_style1";
+      base: "font=Sans:style=Regular font_size=30";
+   }
 }
 
 part
 {
-   name: "textblock";
-   type: TEXTBLOCK;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      align: 0.5 0.5;
-      fixed: 0 0;
-      min: 0 0;
-      visible: 1;
-      text.text: "TEXTBLOCK";
-      text.style: "textblock_style1";
-      rel1.relative: 0.16 0.18;
-      rel2.relative: 0.88 0.38;
-   }
+   name: "textblock";
+   type: TEXTBLOCK;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      align: 0.5 0.5;
+      fixed: 0 0;
+      min: 0 0;
+      visible: 1;
+      text.text: "TEXTBLOCK";
+      text.style: "textblock_style1";
+      rel1.relative: 0.16 0.18;
+      rel2.relative: 0.88 0.38;
+   }
 }
    @@ -371,26 +371,26 @@ part 
     part
 {
-   name: "text";
-   type: TEXT;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      rel1.relative: 0.0 0.5;
-      rel2.relative: 0.5 1.0;
-      color: 0 136 170 255;
-      color2: 0 136 170 50;
-      color3: 0 136 170 25;
-      text
-      {
-         size: 25;
-         font: "Sans:style=Bold";
-         text: "Enventor";
-         align: 0.5 0.5;
-         text_class: "my_class";
-      }
-   }
+   name: "text";
+   type: TEXT;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      rel1.relative: 0.0 0.5;
+      rel2.relative: 0.5 1.0;
+      color: 0 136 170 255;
+      color2: 0 136 170 50;
+      color3: 0 136 170 25;
+      text
+      {
+         size: 25;
+         font: "Sans:style=Bold";
+         text: "Enventor";
+         align: 0.5 0.5;
+         text_class: "my_class";
+      }
+   }
 }
    @@ -398,30 +398,30 @@ part 
     styles
 {
-   style
-   {
-      name: "textblock_style1";
-      base: "font=Sans:style=Regular font_size=30 ... text_class=my_class";
-   }
+   style
+   {
+      name: "textblock_style1";
+      base: "font=Sans:style=Regular font_size=30 ... text_class=my_class";
+   }
 }
 
 part
 {
-   name: "textblock";
-   type: TEXTBLOCK;
-   scale: 1;
-   description
-   {
-      state: "default" 0.0;
-      align: 0.5 0.5;
-      fixed: 0 0;
-      min: 0 0;
-      visible: 1;
-      text.text: "TEXTBLOCK";
-      text.style: "textblock_style1";
-      rel1.relative: 0.16 0.18;
-      rel2.relative: 0.88 0.38;
-   }
+   name: "textblock";
+   type: TEXTBLOCK;
+   scale: 1;
+   description
+   {
+      state: "default" 0.0;
+      align: 0.5 0.5;
+      fixed: 0 0;
+      min: 0 0;
+      visible: 1;
+      text.text: "TEXTBLOCK";
+      text.style: "textblock_style1";
+      rel1.relative: 0.16 0.18;
+      rel2.relative: 0.88 0.38;
+   }
 }
    @@ -429,14 +429,14 @@ part

    Set the font, style, and size of a text class that you have created in the EDC file:

    -elm_config_font_overlay_set("my_class", "TizenSans:style=Bold", 30);
+elm_config_font_overlay_set("my_class", "TizenSans:style=Bold", 30);
 elm_config_font_overlay_apply();

  • Set a specific ratio to a given font size for each object through the text class. If you give a negative value as font size, it is used as the percentage of the originally given font size. The following example code sets the font size as 150% of the given font size.

    -elm_config_font_overlay_set("my_class", "TizenSans:style=Bold", -150);
+elm_config_font_overlay_set("my_class", "TizenSans:style=Bold", -150);
 elm_config_font_overlay_apply();
    • diff --git a/org.tizen.guides/html/native/ui/efl/getting_started_n.htm b/org.tizen.guides/html/native/ui/efl/getting_started_n.htm index 2447897..2b3d58d 100644 --- a/org.tizen.guides/html/native/ui/efl/getting_started_n.htm +++ b/org.tizen.guides/html/native/ui/efl/getting_started_n.htm @@ -5,13 +5,13 @@ - + - Getting Started with EFL UI Programming + Getting Started with EFL UI Programming @@ -39,7 +39,7 @@
  • EFL API References for Wearable Native
    • - +
    @@ -61,17 +61,17 @@ static bool app_create(void *data) { -    /* Here comes your application code */ + /* Here comes your application code */ } int main(int argc, char *argv[]) { -    event_callback.create = app_create; -    ret = ui_app_main(argc, argv, &event_callback, -                      &ad); + event_callback.create = app_create; + ret = ui_app_main(argc, argv, &event_callback, + &ad); -    return ret; + return ret; } @@ -85,12 +85,12 @@ main(int argc, char *argv[]) int main(int argc, char *argv[]) { -    elm_init(argc, argv); -    /* Here comes your application code */ -    elm_run(); -    elm_shutdown(); + elm_init(argc, argv); + /* Here comes your application code */ + elm_run(); + elm_shutdown(); -    return 0; + return 0; } @@ -110,7 +110,7 @@ main(int argc, char *argv[])

    Figure: Empty window

    Empty window

    - +

    Windows are provided by the Elementary library. Since Elementary is a high-level wrapper on the top-most layer in the EFL hierarchy, you can start EFL UI programming with the Elementary library and expand the scope to lower-level libraries, as needed.

    The following code snippet shows how to add a window:

    @@ -131,11 +131,11 @@ evas_object_show(win);

    Figure: Window filled with content

    Window filled with content

    - +

    A conformant is a UI container, which adjusts its size when a virtual keypad becomes visible. The following code snippet shows how to fill a window with a conformant container:

    -win = elm_win_util_standard_add("test", "Test");
+win = elm_win_util_standard_add("test", "Test");
 conform = elm_conformant_add(win);
 elm_win_resize_object_add(win, conform);
    @@ -162,12 +162,12 @@ elm_object_content_set(conform, nf);
  • Elementary UI components define their own behavior internally, which includes visual effects or the response to user input. For example, lists are scrolled up and down according to touch events. Some of them provide animation options by API. For instance, labels have a slide function. Besides these, each UI component defines its own callback signal, so you can define the action triggered by the event. The following code snippet shows how to register a callback for the clicked signal of a button: 
    -evas_object_smart_callback_add(button, "clicked", _button_clicked, NULL);
+evas_object_smart_callback_add(button, "clicked", _button_clicked, NULL);
 
 static void
 _button_clicked(void *data, Evas_Object *obj, void *event_info)
 {
-    evas_object_smart_callback_del(obj, "clicked", _button_clicked);
+    evas_object_smart_callback_del(obj, "clicked", _button_clicked);
 }
    @@ -184,7 +184,7 @@ evas_object_event_callback_add(rect, EVAS_CALLBACK_MOUSE_DOWN, _mouse_down_cb, N
  • Ecore is in charge of running the application main loop and related tasks, such as event handling, timer, and animator. For more information, see Core loop and OS Interfacing, Ecore Events, and Hardware Input Handling.
    • - +
    diff --git a/org.tizen.guides/html/native/ui/efl/graphical_objects_n.htm b/org.tizen.guides/html/native/ui/efl/graphical_objects_n.htm index 84d3188..35f0ae2 100644 --- a/org.tizen.guides/html/native/ui/efl/graphical_objects_n.htm +++ b/org.tizen.guides/html/native/ui/efl/graphical_objects_n.htm @@ -38,7 +38,7 @@

    Graphical Objects

    - +

    Evas is a clean display canvas API for several target display systems that can draw, for example, anti-aliased text, smooth super- and sub-sampled scaled images, and alpha-blend objects. Evas optimizes the rendering pipeline to minimize the effort of redrawing changes made to the canvas, and so takes this work out of your hand, saving a lot of time and energy.

    Evas abstracts any need to know much about what the characteristics of your display system are, what graphics calls are used to draw them, and how. It deals on an object level where all you do is create and manipulate objects in a canvas and set their properties.

    @@ -49,9 +49,9 @@
  • Evas objects

    The Evas object is the most basic visual entity.

    -

    Figure: Evas objects

    -

    Evas objects

    - +

    Figure: Evas objects

    +

    Evas objects

    +

    Evas objects consists of primitive and smart objects:

    • Primitive objects implement basic objects, such as lines, rectangles, polygons, images, texts, and textblocks. They are used to build a complex user interface.
    • Smart objects implement container objects (such as box, table, and grid) that can hold Evas and Edje objects and whole complex UI components as children. They are used to provide intelligence and extension to simple Evas objects.
    diff --git a/org.tizen.guides/html/native/ui/efl/hw_input_n.htm b/org.tizen.guides/html/native/ui/efl/hw_input_n.htm index 71e9da9..b87cba9 100644 --- a/org.tizen.guides/html/native/ui/efl/hw_input_n.htm +++ b/org.tizen.guides/html/native/ui/efl/hw_input_n.htm @@ -5,20 +5,20 @@ - + - Hardware Input Handling - + Hardware Input Handling + - + +
    • -

    Hardware Input Handling

    - -

    EFL does not depend on any specific hardware input methods, such as hardware keys, to generate back and home events, or rotary component parts to generate rotary events. Instead, these hardware input events are tightly related to the Tizen UX. As a result, EFL has created the EFL Extension library to support these common UX behaviors between the applications and hardware events.

    +

    Hardware Input Handling

    + +

    EFL does not depend on any specific hardware input methods, such as hardware keys, to generate back and home events, or rotary component parts to generate rotary events. Instead, these hardware input events are tightly related to the Tizen UX. As a result, EFL has created the EFL Extension library to support these common UX behaviors between the applications and hardware events.

    EFL provides the following hardware event management features:

      @@ -52,9 +52,9 @@

      Normally, the hardware keys do only what they are designed to do, such as increase the volume or return to the previous screen. In some applications, you can assign special actions to hardware keys. For example, the volume key can be used to increase and decrease the size of the text. This is called key grabbing.

    - - - + + +
    diff --git a/org.tizen.guides/html/native/ui/efl/introduction_n.htm b/org.tizen.guides/html/native/ui/efl/introduction_n.htm index 8978ad2..a6b44b7 100644 --- a/org.tizen.guides/html/native/ui/efl/introduction_n.htm +++ b/org.tizen.guides/html/native/ui/efl/introduction_n.htm @@ -5,13 +5,13 @@ - + - Introduction + Introduction @@ -39,7 +39,7 @@
  • EFL API References for Wearable Native
    • - +
    @@ -47,11 +47,11 @@

    This topic provides some background information on what EFL is and how it works. To start programming right away, see Getting Started with EFL UI Programming.

    -

    EFL is a collection of libraries that are independent or can build on top of each-other. They provide useful features that complement an OS's existing environment, rather than wrap and abstract it, trying to be their own environment and OS in its entirety. This means that EFL expects you to use other system libraries and APIs in conjunction with EFL libraries to provide a whole working application or library - simply using EFL as a set of convenient pre-made libraries to accomplish a whole host of complex or painful tasks for you.

    +

    EFL is a collection of libraries that are independent or can build on top of each-other. They provide useful features that complement an OS's existing environment, rather than wrap and abstract it, trying to be their own environment and OS in its entirety. This means that EFL expects you to use other system libraries and APIs in conjunction with EFL libraries to provide a whole working application or library - simply using EFL as a set of convenient pre-made libraries to accomplish a whole host of complex or painful tasks for you.

    An important aspect of EFL is efficiency, both in speed and size:

      -
    • The core EFL libraries, even with Elementary, are about half the size of the equivalent "small stack" of GTK+ (used, for example, by GNOME), and about one quarter the size of Qt. Of course, with these kinds of numbers, you can always argue over what exactly constitutes an equivalent measurement.
      • +
    • The core EFL libraries, even with Elementary, are about half the size of the equivalent "small stack" of GTK+ (used, for example, by GNOME), and about one quarter the size of Qt. Of course, with these kinds of numbers, you can always argue over what exactly constitutes an equivalent measurement.
    • EFL is low on actual memory usage at runtime, with memory footprints a fraction the size of those in the GTK+ and Qt environments.
    • EFL is fast, considering what it does. Some libraries claim to be very fast - but then, it is easy to be fast when you only handle simple and straightforward tasks. EFL is fast, while also tackling the more complex rendering problems involving, for example, alpha blending, interpolated scaling, and transforms with dithering.
    @@ -68,7 +68,7 @@
  • Fast performance

    The main reason Tizen adopted EFL as its native toolkit is its speed. EFL is highly optimized by using a scene graph and retained-mode rendering. EFL is fast even in software rendering.

  • Small memory footprint -

    Despite its fast performance, EFL's memory footprint is smaller than that of other toolkits with similar features. A small memory footprint is useful in the embedded world, since embedded devices do not normally have much memory.

    • +

    Despite its fast performance, EFL's memory footprint is smaller than that of other toolkits with similar features. A small memory footprint is useful in the embedded world, since embedded devices do not normally have much memory.

  • Backend engine support

    EFL supports several backend engines, such as X11 (OpenGL, Xlib, Xcb), Wayland (OpenGL, SHM), Direct Framebuffer, DRM, memory buffers, PS3 native, Windows®, and Mac OS®. Applications do not need to deal with each backend engine separately.

  • GUI and logic separation @@ -91,39 +91,39 @@

    EFL layers

    Table: Libraries in EFL

    - - +
    + - + - - + + - + - + - + - - + - + - -
    NameDescriptionNameDescription
    ElementaryElementary Elementary (UI Components) is the top-most library with which you create your EFL application. It provides all the functions you need to create a window, create simple and complex layouts, manage the life-cycle of a view, and add UI components. The full list of UI components that can be used in Tizen can be found in Mobile UI Components and Wearable UI Components.
    EdjeEdje Edje is the library used by Elementary to provide a powerful theme. You can also use Edje to create your own objects and use them in your application, or even extend the default theme. For more information about Edje and the EDC format, see Layouting with EDC and Customizing UI Components.
    EcoreEcore Ecore (Core loop and OS Interfacing) is the library that manages the main loop of your application. The main loop is one of the most important concepts you need to know about to develop an application. The main loop is where events are handled, and where you interact with the user through the callback mechanism. The main loop mechanisms are explained in Handling the Main Loop.
    EvasEvas (Primitive Graphical Objects) is the canvas engine. Evas is responsible for managing the drawing of your content. All graphical objects that you create are Evas objects. -

    Evas handles the entire state of the window by filling the canvas with objects and manipulating their states. In contrast to other canvas libraries, such as Cairo, OpenGL, and XRender, Evas is not a drawing library but a scene graph library that retains the state of all objects. The Evas concept is explained in Evas Rendering Concept and Method.

    +     		EvasEvas (Primitive Graphical Objects) is the canvas engine. Evas is responsible for managing the drawing of your content. All graphical objects that you create are Evas objects. +

    Evas handles the entire state of the window by filling the canvas with objects and manipulating their states. In contrast to other canvas libraries, such as Cairo, OpenGL, and XRender, Evas is not a drawing library but a scene graph library that retains the state of all objects. The Evas concept is explained in Evas Rendering Concept and Method.

    Evas objects are created and then manipulated until they are no longer needed, at which point they are deleted. This allows you to work in the same terms that a designer thinks in: it is a direct mapping, as opposed to having to convert the concepts into drawing commands in the right order, and calculate minimum drawing calls needed to get the job done.
    EinaEina Eina is the basis of all the EFL libraries. Eina is a toolbox that implements an API for data types in an efficient way. It contains all the functions needed to create lists and hashes, manage shared strings, open shared libraries, and manage errors and memory pools. Eina concepts are explained in Data Types and Tools.
    + +

    In addition to the most important libraries explained above, the EFL includes other libraries, such as Eet, Embryo, and Emotion. Support for those libraries is planned in the future Tizen releases.

    @@ -139,29 +139,29 @@

    For those familiar with traditional game programming, this is familiar, except that you have also implemented the main loop with an infinite while or for loop that fetches input events, updates the game world, renders the updated scene, and then loops and repeats as quickly as it can.

    -

    In case of EFL, the main loop is not "dumb" and does not consume CPU resources unless there is work to do. It sleeps and consumes no CPU time until an event happens (except in rare circumstances, for example, when you use Idlers that are called in a loop during what normally would be idle time waiting for something to happen). From EFL's point of view, all of this is handled in Ecore, and it supports many constructs for manipulating the main loop in a logical and flexible way. EFL handles animation through animators, where the main loop handles timing out and scheduling these at regularly spaced intervals in time (on a best-effort basis), as with timers, pollers, idle enterers, idle exiters, idlers, jobs, fd handlers (file descriptor handlers) and event handlers.

    +

    In case of EFL, the main loop is not "dumb" and does not consume CPU resources unless there is work to do. It sleeps and consumes no CPU time until an event happens (except in rare circumstances, for example, when you use Idlers that are called in a loop during what normally would be idle time waiting for something to happen). From EFL's point of view, all of this is handled in Ecore, and it supports many constructs for manipulating the main loop in a logical and flexible way. EFL handles animation through animators, where the main loop handles timing out and scheduling these at regularly spaced intervals in time (on a best-effort basis), as with timers, pollers, idle enterers, idle exiters, idlers, jobs, fd handlers (file descriptor handlers) and event handlers.

    + +

    In the EFL view, the application, when executing any callbacks other than idlers, is "active". It goes in and out of this active state by calling the idle enterer and exiter callbacks (edge-triggered callbacks), which are triggered whenever going in and out of the idle state. Idlers themselves do not transition the main loop as such from being in an idle state, so any Idler that needs to "wake up" the loop conceptually to become active needs to queue something that ordinarily wakes up the main loop, such as a job or timer. This is the only exception due to the conceptual model and the need for efficiency (not entering and exiting idle per idler call).

    -

    In the EFL view, the application, when executing any callbacks other than idlers, is "active". It goes in and out of this active state by calling the idle enterer and exiter callbacks (edge-triggered callbacks), which are triggered whenever going in and out of the idle state. Idlers themselves do not transition the main loop as such from being in an idle state, so any Idler that needs to "wake up" the loop conceptually to become active needs to queue something that ordinarily wakes up the main loop, such as a job or timer. This is the only exception due to the conceptual model and the need for efficiency (not entering and exiting idle per idler call).

    +

    Besides the above exception, the loop model basically starts by calling the idle enterers, and then sleeps until something happens. What happens depends on the system, but wake-up events can be time-based (timers and animators) and these are scheduled by Ecore on a "best effort" basis. That means they use the system sleep mechanism (such as select() function with a timeout or epoll() function) to send the CPU to sleep and wait until an event on an input (a file descriptor) wakes up, or until the timeout happens.

    -

    Besides the above exception, the loop model basically starts by calling the idle enterers, and then sleeps until something happens. What happens depends on the system, but wake-up events can be time-based (timers and animators) and these are scheduled by Ecore on a "best effort" basis. That means they use the system sleep mechanism (such as select() function with a timeout or epoll() function) to send the CPU to sleep and wait until an event on an input (a file descriptor) wakes up, or until the timeout happens.

    +

    The system can impose granularity limits on a sleep, so beware that this is not a guaranteed action, but in general good enough. Once Ecore wakes up, it finds out why it woke up and handles the situation appropriately. It calls timers or animators that expired, or calls fd handlers to read data (or write data) on "ready" fds and queue events as a result of this. Ecore also does some things that other main loops do not, such as serializing UNIX system handlers into the main loop event queue, so that things like SIGCHLD from child processes is handled for you with an event for the child exit placed in your event queue.

    -

    The system can impose granularity limits on a sleep, so beware that this is not a guaranteed action, but in general good enough. Once Ecore wakes up, it finds out why it woke up and handles the situation appropriately. It calls timers or animators that expired, or calls fd handlers to read data (or write data) on "ready" fds and queue events as a result of this. Ecore also does some things that other main loops do not, such as serializing UNIX system handlers into the main loop event queue, so that things like SIGCHLD from child processes is handled for you with an event for the child exit placed in your event queue.

    -

    Rendering and Canvas

    -

    Evas and Edje live within the main loop model described above. Evas is the canvas engine that handles the entire "state" of a "window" (canvas) by filling that canvas with objects and manipulating their state. You can, for example, show, hide, move, and resize the objects, set the file sources for images, colors for rectangles, and fonts and text content for text.

    +

    Evas and Edje live within the main loop model described above. Evas is the canvas engine that handles the entire "state" of a "window" (canvas) by filling that canvas with objects and manipulating their state. You can, for example, show, hide, move, and resize the objects, set the file sources for images, colors for rectangles, and fonts and text content for text.

    When Evas renders, it evaluates the state of all objects and whether they have changed since the last rendering, and works out what to render and how to reflect the updated state of the canvas in the output. Evas attempts to minimize this update work, since it knows the prior and current state of every object, as well as knowing the entire canvas content:

      -
    • Evas can discard work well in advance as it knows that "later I cover up this rendering anyway", and thus Evas can skip it.
      • -
    • Evas defers as much work until the render time as it can, as at this point it considers the canvas state as "stable" and needing an update. This means that Evas can load fonts and images from the disk at the time it renders, to avoid repeated "create object, set image file, delete the object, create new one" cycles that can happen often during setup or major state changes. By deferring work as late as possible, Evas can avoid lots of "busy work" in doing useless tasks.
      • +
    • Evas can discard work well in advance as it knows that "later I cover up this rendering anyway", and thus Evas can skip it.
      • +
    • Evas defers as much work until the render time as it can, as at this point it considers the canvas state as "stable" and needing an update. This means that Evas can load fonts and images from the disk at the time it renders, to avoid repeated "create object, set image file, delete the object, create new one" cycles that can happen often during setup or major state changes. By deferring work as late as possible, Evas can avoid lots of "busy work" in doing useless tasks.
    -

    The work minimization allows the application using Evas to worry less about such optimizing and more about its logic flow, as the above "skip the work" optimizations are often done for you.

    +

    The work minimization allows the application using Evas to worry less about such optimizing and more about its logic flow, as the above "skip the work" optimizations are often done for you.

    -

    A major change caused by having such a canvas and state model for the GUI is that you no longer actually render anything yourself. You must change the mindset from a "I draw" to "I create and manipulate" model. This is very different from almost all lower and even mid-level APIs that developers are used to - everything from Xlib, Cairo, and GDI to OpenGL and more. They all work on the "draw and forget" model, while Evas is a retained-mode scene graph that you manipulate.

    +

    A major change caused by having such a canvas and state model for the GUI is that you no longer actually render anything yourself. You must change the mindset from a "I draw" to "I create and manipulate" model. This is very different from almost all lower and even mid-level APIs that developers are used to - everything from Xlib, Cairo, and GDI to OpenGL and more. They all work on the "draw and forget" model, while Evas is a retained-mode scene graph that you manipulate.

    -

    Evas makes the cost of most operations (such as evas_object_move(), evas_object_resize(), and evas_object_show()) be "zero cost" (or as close to zero as possible). All most of these calls do is to update coordinates within an object and set a changed flag. That is it. They do not draw anything. For example, even setting the file on an image object through the evas_object_image_file_set() function only loads the image header, so the object can have the original image dimensions and alpha channel flag set. It does not decode the image data, avoiding a lot of file IO and decode overhead, and pushes this off until later (render time, if the image is visible and the data needed). If you are sure that you need the data though, Evas has the ability to begin an asynchronous preload of the image data in a background thread and inform you when it is ready.

    +

    Evas makes the cost of most operations (such as evas_object_move(), evas_object_resize(), and evas_object_show()) be "zero cost" (or as close to zero as possible). All most of these calls do is to update coordinates within an object and set a changed flag. That is it. They do not draw anything. For example, even setting the file on an image object through the evas_object_image_file_set() function only loads the image header, so the object can have the original image dimensions and alpha channel flag set. It does not decode the image data, avoiding a lot of file IO and decode overhead, and pushes this off until later (render time, if the image is visible and the data needed). If you are sure that you need the data though, Evas has the ability to begin an asynchronous preload of the image data in a background thread and inform you when it is ready.

    If you mold your programming paradigm around this scene graph and state engine, you find yourself spending less time fighting EFL, and in fact end up with very lean, compact, and concise code that is almost entirely program and UI logic, which is what your application should be anyway, with all the nasty footwork being done for you. If you want to work with a more traditional model, where you have to take care of rendering yourself and you literally drive the timeline by hand, you find yourself fighting EFL and spending a lot of code and time working against optimizations and streamlining. Work with the model and your applications begin to be clean and seamless expressions of high-level logic, with the low-level handled for you by EFL in a clean and efficient way.

    diff --git a/org.tizen.guides/html/native/ui/efl/key_events_mn.htm b/org.tizen.guides/html/native/ui/efl/key_events_mn.htm index 9afcb46..46d16f3 100644 --- a/org.tizen.guides/html/native/ui/efl/key_events_mn.htm +++ b/org.tizen.guides/html/native/ui/efl/key_events_mn.htm @@ -5,20 +5,20 @@ - + - Managing Menu and Back Key Events - + Managing Menu and Back Key Events + - +

    Mobile native

    - +

    Dependencies

      @@ -26,10 +26,10 @@

    Related Info

    -
    +

    • Managing Menu and Back Key Events

    @@ -40,15 +40,15 @@

    Normally, the key events are only delivered to the object in focus. However, with the EFL Extension functions, you can let visible objects without focus get events from the Menu and Back keys.

    -

    Figure: Menu and Back keys

    -

    Menu and Back keys

    +

    Figure: Menu and Back keys

    +

    Menu and Back keys

    The EFL Extension library maintains its own object stack to determine which object receives the event. Only visible objects are added to the stack.

    The stack is based on Evas layers, which means that if 2 objects are registered for the same EFL Extension event, the object on the higher Evas layer gets the event. The following figure shows an example of objects on different layers. Objects 1, 2, and 3 are registered with EFL Extension callbacks for the same event, such as a Back key event. When the event occurs, object 3, which is on the highest layer (layer 3), gets the event callback.

    -

    Figure: Objects on different layers

    -

    Objects on different layers

    +

    Figure: Objects on different layers

    +

    Objects on different layers

    If the objects with callbacks for the same event are on the same layer, the object which is registered the callback first gets the event.

    @@ -85,36 +85,36 @@ static void create_base_gui(appdata_s *ad) { -    Evas_Object *win = NULL; - -    /* Create the window */ -    win = elm_win_util_standard_add(NULL, "extension sample"); -    evas_object_smart_callback_add(win, "delete,request", _win_del, NULL); - -    /* Create the naviframe */ -    Evas_Object *nf = NULL; -    nf = elm_naviframe_add(win); -    evas_object_size_hint_weight_set(win, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(win, nf); -    evas_object_show(nf); - -    /* Create a label */ -    Evas_Object *label = NULL; -    label = elm_label_add(nf); -    elm_object_text_set(label, "Press menu key to show popup,<br/>back key to exit."); -    elm_naviframe_item_push(nf, "Efl Extension usage", NULL, NULL, label, NULL); - -    /* Show the window */ -    evas_object_show(win); + Evas_Object *win = NULL; + + /* Create the window */ + win = elm_win_util_standard_add(NULL, "extension sample"); + evas_object_smart_callback_add(win, "delete,request", _win_del, NULL); + + /* Create the naviframe */ + Evas_Object *nf = NULL; + nf = elm_naviframe_add(win); + evas_object_size_hint_weight_set(win, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(win, nf); + evas_object_show(nf); + + /* Create a label */ + Evas_Object *label = NULL; + label = elm_label_add(nf); + elm_object_text_set(label, "Press menu key to show popup,<br/>back key to exit."); + elm_naviframe_item_push(nf, "Efl Extension usage", NULL, NULL, label, NULL); + + /* Show the window */ + evas_object_show(win);
  • Register EFL Extension callbacks for the naviframe: 
    -    /* Register the Menu key event callback */
-    eext_object_event_callback_add(nf, EEXT_CALLBACK_MORE, _create_popup, NULL);
-    /* Register the Back key event callback */
-    eext_object_event_callback_add(nf, EEXT_CALLBACK_BACK, _nf_back_cb, win);
+    /* Register the Menu key event callback */
+    eext_object_event_callback_add(nf, EEXT_CALLBACK_MORE, _create_popup, NULL);
+    /* Register the Back key event callback */
+    eext_object_event_callback_add(nf, EEXT_CALLBACK_BACK, _nf_back_cb, win);
 }
    • @@ -124,23 +124,23 @@ create_base_gui(appdata_s *ad) static void _create_popup(void *data, Evas_Object *obj, void *event_info) { -    Evas_Object *parent = obj; - -    /* Create the popup */ -    Evas_Object *popup = NULL, *content = NULL; -    popup = elm_popup_add(parent); -    elm_object_part_text_set(popup, "title,text", "Title"); -    elm_popup_orient_set(popup, ELM_POPUP_ORIENT_CENTER); - -    /* Add a label to the popup */ -    content = elm_label_add(parent); -    elm_object_text_set(content, "Press back key to remove popup."); -    elm_object_content_set(popup, content); - -    /* Register the Back key event callback */ -    eext_object_event_callback_add(popup, EEXT_CALLBACK_BACK, eext_popup_back_cb, NULL); -    /* Show the popup */ -    evas_object_show(popup); + Evas_Object *parent = obj; + + /* Create the popup */ + Evas_Object *popup = NULL, *content = NULL; + popup = elm_popup_add(parent); + elm_object_part_text_set(popup, "title,text", "Title"); + elm_popup_orient_set(popup, ELM_POPUP_ORIENT_CENTER); + + /* Add a label to the popup */ + content = elm_label_add(parent); + elm_object_text_set(content, "Press back key to remove popup."); + elm_object_content_set(popup, content); + + /* Register the Back key event callback */ + eext_object_event_callback_add(popup, EEXT_CALLBACK_BACK, eext_popup_back_cb, NULL); + /* Show the popup */ + evas_object_show(popup); } @@ -152,9 +152,9 @@ _create_popup(void *data, Evas_Object *obj, void *event_info) 
     static void
 eext_ctxpopup_back_cb(void *data EINA_UNUSED, Evas_Object *obj,
-                      void *event_info EINA_UNUSED)
+                      void *event_info EINA_UNUSED)
 {
-    elm_ctxpopup_dismiss(obj);
+    elm_ctxpopup_dismiss(obj);
 }
    @@ -163,16 +163,16 @@ eext_ctxpopup_back_cb(void *data EINA_UNUSED, Evas_Object *obj, static void _nf_back_cb(void *data, Evas_Object *obj, void *event_info) { -    Evas_Object *win = data; + Evas_Object *win = data; -    /* Hide the window */ -    elm_win_lower(win); + /* Hide the window */ + elm_win_lower(win); } - +
    diff --git a/org.tizen.guides/html/native/ui/efl/key_grab_n.htm b/org.tizen.guides/html/native/ui/efl/key_grab_n.htm index b32eeec..12173e6 100644 --- a/org.tizen.guides/html/native/ui/efl/key_grab_n.htm +++ b/org.tizen.guides/html/native/ui/efl/key_grab_n.htm @@ -5,20 +5,20 @@ - + - Grabbing Hardware Key Events - + Grabbing Hardware Key Events + - + +
    -

    Grabbing Hardware Key Events

    +

    Grabbing Hardware Key Events

    The applications do not normally grab hardware key events, because each key event is delivered to the focused window by default. Some applications, however, have more advanced functionalities and behavior. For example, in most applications, a volume key press opens a volume control popup. But, in a memo application, you can use the volume key to resize the text.

    -

    To receive special hardware key events in the application, use the eext_win_keygrab_set() and eext_win_keygrab_unset() functions.

    +

    To receive special hardware key events in the application, use the eext_win_keygrab_set() and eext_win_keygrab_unset() functions.

    To grab hardware key events:

      -
    1. To use the functions and data types of the EFL Extension API (in mobile and wearable applications), include the <efl_extension.h> header file in your application: +
    2. To use the functions and data types of the EFL Extension API (in mobile and wearable applications), include the <efl_extension.h> header file in your application: 
       #include <efl_extension.h>
      @@ -55,21 +55,21 @@ static void create_base_gui(appdata_s *ad) { -    Evas_Object *win = NULL; + Evas_Object *win = NULL; -    /* Create the window */ -    win = elm_win_util_standard_add(NULL, "extension sample"); -    evas_object_smart_callback_add(win, "delete,request", _win_del, NULL); + /* Create the window */ + win = elm_win_util_standard_add(NULL, "extension sample"); + evas_object_smart_callback_add(win, "delete,request", _win_del, NULL); -    /* Create UI containers and components */ + /* Create UI containers and components */ -    /* Show the window */ -    evas_object_show(win); + /* Show the window */ + evas_object_show(win); }
      3. -
    3. Register and define key event callbacks for the window using the Ecore events: +
    4. Register and define key event callbacks for the window using the Ecore events: 
       Eina_Bool ctrl_pressed = EINA_FALSE;
 
@@ -77,17 +77,17 @@ Eina_Bool ctrl_pressed = EINA_FALSE;
 static Eina_Bool
 _key_down_cb(void *data __UNUSED__, int type __UNUSED__, void *ev)
 {
-    /* Access the fields of the event key type ("*ev") */
-    Ecore_Event_Key *event = ev;
+    /* Access the fields of the event key type ("*ev") */
+    Ecore_Event_Key *event = ev;
 
-    /* Test whether the pressed key is Ctrl */
-    if (!strcmp("Control_L", event->key)) {
-        /* If it is, store that information */
-        ctrl_pressed = EINA_TRUE;
-    }
+    /* Test whether the pressed key is Ctrl */
+    if (!strcmp("Control_L", event->key)) {
+        /* If it is, store that information */
+        ctrl_pressed = EINA_TRUE;
+    }
 
-    /* Let the event continue to other callbacks */
-    return ECORE_CALLBACK_PASS_ON;
+    /* Let the event continue to other callbacks */
+    return ECORE_CALLBACK_PASS_ON;
 }
 
 /* Register the callback */
@@ -95,17 +95,17 @@ ecore_event_handler_add(ECORE_EVENT_KEY_DOWN, _key_down_cb, NULL);
      5. -
    5. Grab key events using the eext_win_keygrab_set() function with the application window object and the key string as parameters. +
    6. Grab key events using the eext_win_keygrab_set() function with the application window object and the key string as parameters. 
      -eext_win_keygrab_set(win, "XF86AudioRaiseVolume");
+eext_win_keygrab_set(win, "XF86AudioRaiseVolume");
    7. When the application no longer needs to grab key events, call the eext_win_keygrab_unset() function: 
      -eext_win_keygrab_unset(win, "XF86AudioRaiseVolume");
+eext_win_keygrab_unset(win, "XF86AudioRaiseVolume");
      -
      8. +

    The following table lists the hardware keys from which you can grab events in different profiles.

    @@ -121,553 +121,553 @@ eext_win_keygrab_unset(win, "XF86AudioRaiseVolume"); TV - "XF86AudioRaiseVolume" + "XF86AudioRaiseVolume" Key to raise the volume Yes Yes Yes - "XF86AudioLowerVolume" + "XF86AudioLowerVolume" Key to lower the volume Yes Yes Yes - "XF86PowerOff" + "XF86PowerOff" Power key to switch the device on and off Yes Yes Yes - "XF86Menu" + "XF86Menu" Application-specific menu key Yes Yes Yes - "XF86Home" + "XF86Home" Key to go to the home screen Yes Yes Yes - "XF86Back" + "XF86Back" Key to go back to the previous status or page Yes Yes Yes - "XF86Camera" + "XF86Camera" Half shutter key to do something before taking a picture on the camera Yes - - - "XF86Camera_Full" + "XF86Camera_Full" Key to take a picture on the camera Yes Yes Yes - "XF86Search" + "XF86Search" Key to go to the search application Yes Yes Yes - "XF86AudioPlay" + "XF86AudioPlay" Key to play media Yes Yes Yes - "XF86AudioPause" + "XF86AudioPause" Key to pause the media being played Yes Yes Yes - "XF86AudioStop" + "XF86AudioStop" Key to stop the media being played Yes Yes Yes - "XF86AudioNext" + "XF86AudioNext" Key to go to the next media item Yes Yes Yes - "XF86AudioPrev" + "XF86AudioPrev" Key to go to the previous media item Yes Yes Yes - "XF86AudioRewind" + "XF86AudioRewind" Key to rewind the playing position of the media Yes Yes Yes - "XF86AudioForward" + "XF86AudioForward" Key to forward the playing position of the media Yes Yes Yes - "XF86AudioMedia" + "XF86AudioMedia" Key to go to the media player Yes Yes Yes - "XF86AudioPlayPause" + "XF86AudioPlayPause" Key to toggle between play and pause Yes Yes Yes - "XF86AudioMute" + "XF86AudioMute" Key to mute the media Yes Yes Yes - "XF86AudioRecord" + "XF86AudioRecord" Key to start recording media Yes Yes Yes - "Cancel" + "Cancel" Key to cancel the action triggered by the previous keys Yes Yes Yes - "XF86SoftKBD" + "XF86SoftKBD" Key to show and hide the soft keyboard Yes Yes Yes - "XF86QuickPanel" + "XF86QuickPanel" Key to toggle the quick panel Yes - Yes - "XF86TaskPane" + "XF86TaskPane" Key to toggle the task switcher Yes Yes Yes - "XF86HomePage" + "XF86HomePage" Key to go to the homepage of the user-defined Web browser Yes - Yes - "XF86WWW" + "XF86WWW" Key to launch the user-defined Web browser Yes - Yes - "XF86Mail" + "XF86Mail" Key to go to the user-defined email application Yes - Yes - "XF86ScreenSaver" + "XF86ScreenSaver" Key to activate the screen lock (such as a pattern lock or a PIN lock) Yes Yes Yes - "XF86MonBrightnessDown" + "XF86MonBrightnessDown" Key to lower the screen brightness Yes Yes Yes - "XF86MonBrightnessUp" + "XF86MonBrightnessUp" Key to raise the screen brightness Yes Yes Yes - "XF86Voice" + "XF86Voice" Key to activate a voice-related application Yes Yes Yes - "Hangul" + "Hangul" Key to toggle the current language Yes - Yes - "XF86Apps" + "XF86Apps" Key to call the application holder application Yes Yes Yes - "XF86Call" + "XF86Call" Key to launch the call application Yes Yes Yes - "XF86Game" + "XF86Game" Key to go to the game application Yes - Yes - "XF86VoiceWakeUp_LPSD" + "XF86VoiceWakeUp_LPSD" Key to wake up from voice input (LPSD) Yes Yes Yes - "XF86VoiceWakeUp" + "XF86VoiceWakeUp" Key to wake up from voice input Yes Yes Yes - "XF86TV" + "XF86TV" Key to display the TV screen directly - - Yes - "XF86Display" + "XF86Display" Key to toggle the video source - - Yes - "XF86RCConfig" - Key to set the remote control's specific configuration + "XF86RCConfig" + Key to set the remote control's specific configuration - - Yes - "XF86RCMode" + "XF86RCMode" Key to show and hide the virtual remote control on the screen - - Yes - "1" + "1" Numeric key 1 on the remote control - - Yes - "2" + "2" Numeric key 2 on the remote control - - Yes - "3" + "3" Numeric key 3 on the remote control - - Yes - "4" + "4" Numeric key 4 on the remote control - - Yes - "5" + "5" Numeric key 5 on the remote control - - Yes - "6" + "6" Numeric key 6 on the remote control - - Yes - "7" + "7" Numeric key 7 on the remote control - - Yes - "8" + "8" Numeric key 8 on the remote control - - Yes - "9" + "9" Numeric key 9 on the remote control - - Yes - "0" + "0" Numeric key 0 on the remote control - - Yes - "-" + "-" Minus key on the remote control - - Yes - "XF86LowerChannel" + "XF86LowerChannel" Key to lower the channel number - - Yes - "XF86RaiseChannel" + "XF86RaiseChannel" Key to raise the channel number - - Yes - "XF86ChannelList" + "XF86ChannelList" Key to display the channel list - - Yes - "XF86PreviousChannel" + "XF86PreviousChannel" Key to display the previous channel - - Yes - "XF86SysMenu" + "XF86SysMenu" Key to launch the system menu - - Yes - "XF86SimpleMenu" + "XF86SimpleMenu" Key to launch the simple menu - - Yes - "XF86History" + "XF86History" Key to launch the history functionality - - Yes - "XF86Favorites" + "XF86Favorites" Key to launch the favorite channels functionality - - Yes - "Up" + "Up" Arrow key UP on the remote control - - Yes - "Down" + "Down" Arrow key DOWN on the remote control - - Yes - "Left" + "Left" Arrow key LEFT on the remote control - - Yes - "Right" + "Right" Arrow key RIGHT on the remote control - - Yes - "Return" + "Return" OK key on the remote control to confirm or select an item - - Yes - "XF86Close" + "XF86Close" Exit key on the remote control to terminate the current menu or application - - Yes - "XF86Info" + "XF86Info" Key to display the basic and auxiliary information on the screen - - Yes - "XF86Red" + "XF86Red" Key to execute the functionality registered to the RED key - - Yes - "XF86Green" + "XF86Green" Key to execute the functionality registered to the GREEN key - - Yes - "XF86Yellow" + "XF86Yellow" Key to execute the functionality registered to the YELLOW key - - Yes - "XF86Blue" + "XF86Blue" Key to execute the functionality registered to the BLUE key - - Yes - "XF86ProgInfo" + "XF86ProgInfo" Key to display the program information - - Yes - "XF86PictureMode" + "XF86PictureMode" Key to change the screen mode - - Yes - "XF86PictureSize" + "XF86PictureSize" Key to change the screen size and aspect ratio - - Yes - "XF86PIP" + "XF86PIP" Key to set the PIP (Picture-In-Picture) mode to display one screen on the other - - Yes - "XF86Guide" + "XF86Guide" Key to display the user guide - - Yes - "XF86AudioMode" + "XF86AudioMode" Key to set or change the audio mode - - Yes - "XF86Subtitle" + "XF86Subtitle" Key to display or hide the subtitles - - Yes - "XF863D" + "XF863D" Key to set or change the 3D mode - - @@ -675,11 +675,11 @@ eext_win_keygrab_unset(win, "XF86AudioRaiseVolume"); - - - - - + + + + +
    diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_collections_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_collections_n.htm index d55cd90..066f3a3 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_collections_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_collections_n.htm @@ -51,26 +51,26 @@ 
     collections {
-   base_scale: 1.8;
-   sounds {
-      tone: "tone-1" 2300;
-      tone: "tone-2" 440;
-      sample {
-         name: "sound_file1" RAW;
-         source: "sound_file1.wav";
-      }
-   }
-   group { 
-      name: "groupname";
-      alias: "anothername;"
-      min: width height;
-      max: width height;
-      parts {}
-      scripts {}
-      limits {}
-      data {}
-      programs {}
-   }
+   base_scale: 1.8;
+   sounds {
+      tone: "tone-1" 2300;
+      tone: "tone-2" 440;
+      sample {
+         name: "sound_file1" RAW;
+         source: "sound_file1.wav";
+      }
+   }
+   group {
+      name: "groupname";
+      alias: "anothername;"
+      min: width height;
+      max: width height;
+      parts {}
+      scripts {}
+      limits {}
+      data {}
+      programs {}
+   }
 }
    @@ -96,7 +96,7 @@ collections {
    • name [sample name] [compression type] (quality) -

      Used to include each sound file. The full path to the directory holding the sounds can be defined later with the edje_cc tool's -sd option. The valid compression types are:

      +

      Used to include each sound file. The full path to the directory holding the sounds can be defined later with the edje_cc tool's -sd option. The valid compression types are:

      • RAW: Uncompressed
      • COMP: Lossless compression
        • diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_color_classes_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_color_classes_n.htm index 2f93e14..4d4e65b 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_color_classes_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_color_classes_n.htm @@ -51,12 +51,12 @@ 
         color_classes {
-   color_class {
-      name: "colorclassname";
-      color: [0-255] [0-255] [0-255] [0-255];
-      color2: [0-255] [0-255] [0-255] [0-255];
-      color3color3: [0-255] [0-255] [0-255] [0-255];
-   }
+   color_class {
+      name: "colorclassname";
+      color: [0-255] [0-255] [0-255] [0-255];
+      color2: [0-255] [0-255] [0-255] [0-255];
+      color3color3: [0-255] [0-255] [0-255] [0-255];
+   }
 }
        diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_data_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_data_n.htm index 3986978..d0a4383 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_data_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_data_n.htm @@ -50,8 +50,8 @@ 
         data {
-   item: "key" "value";
-   file: "otherkey" "filename.ext";
+   item: "key" "value";
+   file: "otherkey" "filename.ext";
 }
        diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_fonts_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_fonts_n.htm index 4fd853a..8ab419a 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_fonts_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_fonts_n.htm @@ -50,14 +50,14 @@ 
         fonts {
-   font: "filename1.ext" "fontname";
-   font: "filename2.ext" "otherfontname";
+   font: "filename1.ext" "fontname";
+   font: "filename2.ext" "otherfontname";
 }
        • font [font filename] [font alias] -

          This property is included for each font, and it defines the font file and alias. The full path to the directory containing the font files can be defined later with the edje_cc tool's -fd option. +

          This property is included for each font, and it defines the font file and alias. The full path to the directory containing the font files can be defined later with the edje_cc tool's -fd option.

        diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_group_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_group_n.htm index e7ca681..467730b 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_group_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_group_n.htm @@ -48,26 +48,26 @@

        Group block

        -group { 
-   name: "nameusedbytheapplication";
-   alias: "anothername";
-   min: width height;
-   max: width height;
-   parts {
-      <definitions of parts>
-   }
-   script {
-      <embryo script>
-   }
-   limits {
-      vertical: "limit_name" height_barrier;
-      horizontal: "limit_name" width_barrier;
-   }
-   data {
-      items: "key" "value";
-      file: "key" "file";
-   }
-   programs {}
+group {
+   name: "nameusedbytheapplication";
+   alias: "anothername";
+   min: width height;
+   max: width height;
+   parts {
+      <definitions of parts>
+   }
+   script {
+      <embryo script>
+   }
+   limits {
+      vertical: "limit_name" height_barrier;
+      horizontal: "limit_name" width_barrier;
+   }
+   data {
+      items: "key" "value";
+      file: "key" "file";
+   }
+   programs {}
 }
        @@ -128,9 +128,9 @@ group { 
         parts {
-   part {}
-   part {}
-   part {}
+   part {}
+   part {}
+   part {}
 }
        @@ -140,14 +140,14 @@ parts { 
         group {
-   script {
-      <embryo script>
-   }
-   program {
-      script {
-         <embryo script>
-      }
-   }
+   script {
+      <embryo script>
+   }
+   program {
+      script {
+         <embryo script>
+      }
+   }
 }
        @@ -158,18 +158,18 @@ group { 
         limits {
-   vertical: "limit_name" height_barrier;
-   horizontal: "limit_name" width_barrier;
+   vertical: "limit_name" height_barrier;
+   horizontal: "limit_name" width_barrier;
 }

        The limits block is used to trigger signals when the Edje object is resized.

        • vertical [name] [height barrier] -

          Sends a limit,name,over signal when the object is resized and passes the limit by growing over it. When the object's size is reduced below the limit, the limit,name,below signal is sent. This limit is applied on the Y axis and is given in pixels.

          +

          Sends a limit,name,over signal when the object is resized and passes the limit by growing over it. When the object's size is reduced below the limit, the limit,name,below signal is sent. This limit is applied on the Y axis and is given in pixels.

        • horizontal [name] [width barrier] -

          Sends a limit,name,over signal when the object is resized and passes the limit by growing over it. When the object's size is reduced below the limit, the limit,name,below signal is sent. This limit is applied on the X axis and is given in pixels.

          +

          Sends a limit,name,over signal when the object is resized and passes the limit by growing over it. When the object's size is reduced below the limit, the limit,name,below signal is sent. This limit is applied on the X axis and is given in pixels.

        @@ -178,18 +178,18 @@ limits { 
         data {
-   item: "key" "value";
-   file: "key2" "somefile";
+   item: "key" "value";
+   file: "key2" "somefile";
 }

        The data block is used to pass arbitrary parameters from the theme to the application. Unlike the images and fonts blocks, additional data blocks can only be included inside the group block.

          -
        • items: "key" "value"; +
        • items: "key" "value";

          Sets a new parameter, the value is the string specified next to it.

          • -
        • file: "key" "file"; +
        • file: "key" "file";

          Sets a new parameter, the value is the content of the specified file formatted as a single string of text. This property only works with plain text files.

        @@ -204,9 +204,9 @@ data { 
         programs {
-   program {}
-   program {}
-   program {}
+   program {}
+   program {}
+   program {}
 }
        diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_images_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_images_n.htm index ca4d6d2..070fed6 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_images_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_images_n.htm @@ -50,10 +50,10 @@ 
         images {
-   image: "filename1.ext" COMP;
-   image: "filename2.ext" LOSSY 99;
-   set {}
-   set {}
+   image: "filename1.ext" COMP;
+   image: "filename2.ext" LOSSY 99;
+   set {}
+   set {}
 }
        @@ -61,7 +61,7 @@ images {
        • image [image file] [compression method] (compression level) -

          This property is included for each image file. The full path to the directory holding the image can be defined later with the edje_cc tool's -id option. The available compression methods are:

          +

          This property is included for each image file. The full path to the directory holding the image can be defined later with the edje_cc tool's -id option. The available compression methods are:

          • RAW: Uncompressed
          • COMP: Lossless compression
            • @@ -73,10 +73,10 @@ images {
          • images.set block 
            -set { 
-   name: "image_name_used";
-   image {}
-   image {}
+set {
+   name: "image_name_used";
+   image {}
+   image {}
 }
            @@ -91,10 +91,10 @@ set { 
             image {
-   image: "filename4.ext" COMP;
-   size: 51 51 200 200;
-   border: 0 0 0 0;
-   border_scale_by: 0.0;
+   image: "filename4.ext" COMP;
+   size: 51 51 200 200;
+   border: 0 0 0 0;
+   border_scale_by: 0.0;
 }
            @@ -102,7 +102,7 @@ image {
            • image [image file] [compression method] (compression level) -

              This property is included for each image file. The full path to the directory holding the image can be defined later with the edje_cc tool's -id option.

              +

              This property is included for each image file. The full path to the directory holding the image can be defined later with the edje_cc tool's -id option.

            • size [minw] [minh] [maxw] [maxh]

              Sets the minimum and maximum size that selects a specific image.

              diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_intro_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_intro_n.htm index 0ef5c20..9b712cb 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_intro_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_intro_n.htm @@ -61,11 +61,11 @@ color_classes {} styles {} collections { -   group { -      name: "my_group"; -      parts {} -      programs {} -   } + group { + name: "my_group"; + parts {} + programs {} + } } @@ -121,43 +121,43 @@ collections { 
               collections {
-   group {
-      name: "example";
-      parts {
-         /* Create the part */
-         part {
-            name: "rectangle";
-            /* Set the type to RECT (rectangle) */
-            type: RECT;
-            /* Default state (blue color) */
-            description {
-               state: "default" 0.0;
-               align: 0.0 0.0;
-               /* Blue color */
-               color: 0 0 255 255;
-            }
-            /* Second state (red color) */
-            description {
-               state: "red" 0.0;
-               align: 0.0 0.0;
-               /* Red color */
-               color: 255 0 0 255;
-            }
-         }
-      }
-      programs {
-         /* Create a program */
-         program {
-            name: "change_color";
-            /* Program is triggered on a mouse click */
-            signal: "mouse,clicked,*";
-            source: "*";
-            /* Set the red state of the "rectangle" part */
-            action: STATE_SET "red" 0.0;
-            target: "rectangle";
-         }
-      }
-   }
+   group {
+      name: "example";
+      parts {
+         /* Create the part */
+         part {
+            name: "rectangle";
+            /* Set the type to RECT (rectangle) */
+            type: RECT;
+            /* Default state (blue color) */
+            description {
+               state: "default" 0.0;
+               align: 0.0 0.0;
+               /* Blue color */
+               color: 0 0 255 255;
+            }
+            /* Second state (red color) */
+            description {
+               state: "red" 0.0;
+               align: 0.0 0.0;
+               /* Red color */
+               color: 255 0 0 255;
+            }
+         }
+      }
+      programs {
+         /* Create a program */
+         program {
+            name: "change_color";
+            /* Program is triggered on a mouse click */
+            signal: "mouse,clicked,*";
+            source: "*";
+            /* Set the red state of the "rectangle" part */
+            action: STATE_SET "red" 0.0;
+            target: "rectangle";
+         }
+      }
+   }
 }
              diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_part_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_part_n.htm index a7555e5..3e3fac1 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_part_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_part_n.htm @@ -51,307 +51,307 @@

              Part block

              -part { 
-   /* Name the part */
-   name: "partname";
-   /* Inherit all the fields of another part */
-   inherit: "partname";
-   /* Set the part type */
-   type: IMAGE;
-   /* Enable mouse events on the part */
-   mouse_events: 0/1;
-   /* Repeat the mouse events to the parts below the current one */
-   repeat_events: 0/1;
-   ignore_flags: NONE;
-   /* Set whether the part sizes scale with the edje scaling factor */
-   scale: 0/1;
-   /* Set whether fully-transparent pixels are considered in collision detection */
-   precise_is_inside: 0/1;
-   /* Only render the area of the part that coincides with the given part */
-   clip_to: "anotherpart";
-   /* For group/textblock: swallow the given group (for textblock: goes below text) */
-   source: "groupname";
-   /* Same as the source but goes on top of text */
-   source2: "groupname";
-   /*
-      For textblock: swallow the given group below the mouse cursor
-      when it hovers over the part
-   */
-   source3: "groupname";
-   /* Same as source3 but goes on top of the cursor */
-   source4: "groupname";
-   /* For textblock: swallow the given group below text anchors (<a>...</a>) */
-   source5: "groupname";
-   /* Same as source5 but goes on to top of the anchor */
-   source6: "groupname";
-   /* Add a shadow effect to the part */
-   effect: SOFT_SHADOW (BOTTOM_RIGHT);
-   /* For textblock: makes the text editable, possibly with a specific behavior */
-   entry_mode: PASSWORD;
-   /* For textblock: change how the text selection is triggered */
-   select_mode: EXPLICIT;
-   /* For editable textblock: where to draw the (blinking) cursor */
-   cursor_mode: UNDER;
-   /* For editable textblock: allow multiple lines */
-   multiline: 0/1;
-   /* For textblock: accessibility features are used */
-   access: 0/1;
-   /* No-one uses that */
-   pointer_mode: AUTOGRAB;
-   use_alternate_font_metrics: 0/1;
-   /* Remove the given program; useful when it was inherited */
-   program_remove: "programname";
-   /* Remove the given part; useful when it was inherited */
-   part_remove: "partname";
-   /* Insert the current part below the given part, as if it were declared before */
-   insert_before: "partname";
-   /* Insert the current part above the given part, as if it were declared after */
-   insert_after: "partname";
-   /* Define a new part inside this one */
-   part {
-      <part definition>
-   }
-   draggable {
-      /* Confine the current part to the given part */
-      confine: "another part";
-      /* Only start drag when it has moved enough to be outside the given part */
-      threshold: "another part";
-      /* Forward the drag events to the given part instead of handling them */
-      events: "another draggable part";
-      /* Enable the horizontal drag with step_size steps or with steps_count steps */
-      x: 0/1 <step_size> <steps_count>;
-      /* Same as x but vertical */
-      y: 1 0 100;
-   }
-   /* For box or table */
-   box/table {
-      /* List of items */
-      items {
-            /* Name the item */
-            item { name: "name";
-            /* Define the item type, can only be GROUP */
-            type: GROUP;
-            /* Set the source for this item, or its content */
-            source: "groupname";
-            /* Set the minimum horizontal and vertical item sizes (-1 for expand) */
-            min: -1 -1;
-            /* Set the maximum horizontal and vertical item sizes (-1 for ignore) */
-            max: 100 100;
-            /* Set the item padding in pixels */
-            padding: 2 2 2 2;
-            spread: 1 1;
-            /* Set the item alignment */
-            align: 0.5 0.5;
-            /* Set a weight hint in the box for the given object */
-            weight: 1 1;
-            /* Set the aspect ratio hint */
-            aspect: 1 1;
-            aspect_mode: BOTH;
-            /* Set the number of columns and rows the item takes */
-            span: 1 1;
-         }
-      }
-   }
-   description {
-      /* Inherit another description */
-      inherit: "default" 1.0;
-      /* Name the current description */
-      state: "default" 1.0;
-      /*
-         Use another part as content of the current proxy part
-         This description only works in the proxy part and
-         the current part mirrors the rendering content of the source part
-      */
-      source: "partname";
-      /* Make the part (in)visible (invisible parts emit no signals) */
-      visible: 0/1;
-      /* Emit a signal when the given dimension becomes zero or stops being zero */
-      limit: WIDTH;
-      /* Set the horizontal and vertical alignment of the part inside its parent */
-      align: 0.5 0.5;
-      /* Set that the part does not change size */
-      fixed: 0/1 0/1;
-      /* Set the minimum size for the part */
-      min: 200 200;
-      /* Forcibly multiply the minimum sizes by the given factors */
-      minmul: 1.2 1.2;
-      /* Set the maximum size for the part */
-      max: 400 400;
-      /* Make vertical and horizontal resizes happen in steps */
-      step: 0 0;
-      /* Force the aspect ratio to be kept between min and max between resizes */
-      aspect: 0.8 1.2;
-      /* Set the dimension to which the aspect ratio applies */
-      aspect_preference: BOTH;
-      /* Use the given color class which can be used to factor font colors */
-      color_class: "colorclassname";
-      /* Set the text color */
-      color: 255 0 0 255;
-      /* Set the color of the text shadow */
-      color2: 0 255 0 255;
-      /* Set the color of the text outline */
-      color3: 0 0 255 255;
-      /* Define the positions of the top-left (rel1) and bottom-right (rel2) corners */
-      rel1/rel2 {
-         /* Make relative and offset use the given part for their positioning */
-         to: "partname";
-         /*
-            Position the corner relative to the part given through to
-            (0.0 being axis beginning, 1.0 being its end)
-         */
-         relative: 0.1 0.1;
-         /* Add an absolute offset (in pixels) along each axis */
-         offset: 10 10;
-         /* Same as to but only for the X axis */
-         to_x: "partname";
-         /* Same as to but only for the Y axis */
-         to_y: "partname";
-      }
-      /* Settings specific to parts of the image type */
-      image {
-         /* Set the name (not path) of the regular image */
-         normal: "imagename";
-         /*
-            Set the image to use while transitioning to the normal image;
-            use several times to create animations
-         */
-         tween: "imagename2";
-         /*
-            Set the number of pixels that make up each border of the image,
-            and are not resized with the image
-         */
-         border: 4 4 4 4;
-         /*
-            Hide, strip from its alpha, or show (default)
-            the non-border part of the image
-         */
-         middle: DEFAULT;
-         border_scale_by: 1.0;
-         /* Set whether to scale the border */
-         border_scale: 0/1;
-         scale_hint: STATIC;
-         /* Set how the image is going to fill its part */
-         fill {
-            /* Set whether to smooth the image when scaling it */
-            smooth: 0/1;
-            spread: ??;
-            /* Set whether to scale or tile to fit when resizing the image is needed */
-            type: SCALE/TILE;
-            /* Only display the image area below and to the right of the given point */
-            origin {
-               /* Specify top-left point as relative coordinates */
-               relative: 0.1 0.1;
-               /* Specify top-left point as a pixel offset */
-               offset: 10 10;
-            }
-            /* Specify bottom-right point as relative coordinates */
-            size {
-               /* Specify bottom-right point as relative coordinates */
-               relative: 0.1 0.1;
-               /* Specify bottom-right point as a pixel offset */
-               offset: 10 10;
-            }
-         }
-      }
-      /* Settings specific to parts of the text and textblock type */
-      text {
-         /* Set the part text */
-         text: "some text";
-         /* Set the text font */
-         font: "Tizen Sans";
-         /* Set the text size */
-         size: 14;
-         /* Set the text class which can be used to factor font and font-size settings */
-         text_class: "classname";
-         /* Set the styles defined in stylename */
-         style: "stylename";
-         /*
-            For textblocks in the password mode,
-            replace characters to hide with this string
-         */
-         repch: "*";
-         /*
-            Set the min and max font sizes allowed when
-            resizing (default is 0 0, or unrestricted)
-         */
-         size_range: 6 18;
-         /*
-            Increase the font size as much as possible
-            while still remaining in the container for both axes
-         */
-         fit: 0/1 0/1;
-         /*
-            Make the min size of the container equal to
-            the min size of the current text (0 0 by default)
-         */
-         min: 0/1 0/1;
-         /*
-            Make the max size of the container equal to
-            the max size of the current text (0 0 by default)
-         */
-         max: 0/1 0/1;
-         /* Set the vertical and horizontal alignments of the text */
-         align: 0.5 0.5;
-         /* Reuse the text of another part */
-         text_source: "partname";
-         /*
-            When the text is too long to fit, set the relative position
-            at which to cut the text and put an ellipsis ("...")
-         */
-         ellipsis: 0.9;
-      }
-      /* Settings specific to parts of the box type */
-      box {
-         /* Set how children are arranged in the box */
-         layout: horizontal_homogeneous;
-         /* Set the vertical and horizontal alignments of the box */
-         align: 0.5 0.5;
-         /* Set the padding between items of the box */
-         padding: 1 1;
-         /*
-            Make the box's min size the min size of its elements
-            (make it shrinkable as much as its items)
-         */
-         min: 0 1;
-      }
-      table {
-         /* Make items homogeneous */
-         homogeneous: NONE;
-         /* Set the vertical and horizontal alignments of the table */
-         align: 0.5 0.5;
-         /* Set the padding between items of the table */
-         padding: 1 1;
-         /*
-            Make the table's min size the min size of its elements
-            (make it shrinkable as much as its items)
-         */
-         min: 0 1;
-      }
-      map {
-         perspective: "partname";
-         light: "partname";
-         on: 0/1;
-         smooth: 0/1;
-         alpha: 0/1;
-         backface_cull: 0/1;
-         perspective_on: 0/1;
-         color: 0/1;
-         rotation {
-            center: "partname";
-            x: 45;
-            y: 120;
-            z: 90;
-         }
-         perspective {
-            zplane: 0/1;
-            focal: 20;
-         }
-         /* Simpler syntax to create transitions to the current part */
-         link {
-            base: "edje,signal" "edje";
-         }
-      }
-   }
+part {
+   /* Name the part */
+   name: "partname";
+   /* Inherit all the fields of another part */
+   inherit: "partname";
+   /* Set the part type */
+   type: IMAGE;
+   /* Enable mouse events on the part */
+   mouse_events: 0/1;
+   /* Repeat the mouse events to the parts below the current one */
+   repeat_events: 0/1;
+   ignore_flags: NONE;
+   /* Set whether the part sizes scale with the edje scaling factor */
+   scale: 0/1;
+   /* Set whether fully-transparent pixels are considered in collision detection */
+   precise_is_inside: 0/1;
+   /* Only render the area of the part that coincides with the given part */
+   clip_to: "anotherpart";
+   /* For group/textblock: swallow the given group (for textblock: goes below text) */
+   source: "groupname";
+   /* Same as the source but goes on top of text */
+   source2: "groupname";
+   /*
+      For textblock: swallow the given group below the mouse cursor
+      when it hovers over the part
+   */
+   source3: "groupname";
+   /* Same as source3 but goes on top of the cursor */
+   source4: "groupname";
+   /* For textblock: swallow the given group below text anchors (<a>...</a>) */
+   source5: "groupname";
+   /* Same as source5 but goes on to top of the anchor */
+   source6: "groupname";
+   /* Add a shadow effect to the part */
+   effect: SOFT_SHADOW (BOTTOM_RIGHT);
+   /* For textblock: makes the text editable, possibly with a specific behavior */
+   entry_mode: PASSWORD;
+   /* For textblock: change how the text selection is triggered */
+   select_mode: EXPLICIT;
+   /* For editable textblock: where to draw the (blinking) cursor */
+   cursor_mode: UNDER;
+   /* For editable textblock: allow multiple lines */
+   multiline: 0/1;
+   /* For textblock: accessibility features are used */
+   access: 0/1;
+   /* No-one uses that */
+   pointer_mode: AUTOGRAB;
+   use_alternate_font_metrics: 0/1;
+   /* Remove the given program; useful when it was inherited */
+   program_remove: "programname";
+   /* Remove the given part; useful when it was inherited */
+   part_remove: "partname";
+   /* Insert the current part below the given part, as if it were declared before */
+   insert_before: "partname";
+   /* Insert the current part above the given part, as if it were declared after */
+   insert_after: "partname";
+   /* Define a new part inside this one */
+   part {
+      <part definition>
+   }
+   draggable {
+      /* Confine the current part to the given part */
+      confine: "another part";
+      /* Only start drag when it has moved enough to be outside the given part */
+      threshold: "another part";
+      /* Forward the drag events to the given part instead of handling them */
+      events: "another draggable part";
+      /* Enable the horizontal drag with step_size steps or with steps_count steps */
+      x: 0/1 <step_size> <steps_count>;
+      /* Same as x but vertical */
+      y: 1 0 100;
+   }
+   /* For box or table */
+   box/table {
+      /* List of items */
+      items {
+            /* Name the item */
+            item { name: "name";
+            /* Define the item type, can only be GROUP */
+            type: GROUP;
+            /* Set the source for this item, or its content */
+            source: "groupname";
+            /* Set the minimum horizontal and vertical item sizes (-1 for expand) */
+            min: -1 -1;
+            /* Set the maximum horizontal and vertical item sizes (-1 for ignore) */
+            max: 100 100;
+            /* Set the item padding in pixels */
+            padding: 2 2 2 2;
+            spread: 1 1;
+            /* Set the item alignment */
+            align: 0.5 0.5;
+            /* Set a weight hint in the box for the given object */
+            weight: 1 1;
+            /* Set the aspect ratio hint */
+            aspect: 1 1;
+            aspect_mode: BOTH;
+            /* Set the number of columns and rows the item takes */
+            span: 1 1;
+         }
+      }
+   }
+   description {
+      /* Inherit another description */
+      inherit: "default" 1.0;
+      /* Name the current description */
+      state: "default" 1.0;
+      /*
+         Use another part as content of the current proxy part
+         This description only works in the proxy part and
+         the current part mirrors the rendering content of the source part
+      */
+      source: "partname";
+      /* Make the part (in)visible (invisible parts emit no signals) */
+      visible: 0/1;
+      /* Emit a signal when the given dimension becomes zero or stops being zero */
+      limit: WIDTH;
+      /* Set the horizontal and vertical alignment of the part inside its parent */
+      align: 0.5 0.5;
+      /* Set that the part does not change size */
+      fixed: 0/1 0/1;
+      /* Set the minimum size for the part */
+      min: 200 200;
+      /* Forcibly multiply the minimum sizes by the given factors */
+      minmul: 1.2 1.2;
+      /* Set the maximum size for the part */
+      max: 400 400;
+      /* Make vertical and horizontal resizes happen in steps */
+      step: 0 0;
+      /* Force the aspect ratio to be kept between min and max between resizes */
+      aspect: 0.8 1.2;
+      /* Set the dimension to which the aspect ratio applies */
+      aspect_preference: BOTH;
+      /* Use the given color class which can be used to factor font colors */
+      color_class: "colorclassname";
+      /* Set the text color */
+      color: 255 0 0 255;
+      /* Set the color of the text shadow */
+      color2: 0 255 0 255;
+      /* Set the color of the text outline */
+      color3: 0 0 255 255;
+      /* Define the positions of the top-left (rel1) and bottom-right (rel2) corners */
+      rel1/rel2 {
+         /* Make relative and offset use the given part for their positioning */
+         to: "partname";
+         /*
+            Position the corner relative to the part given through to
+            (0.0 being axis beginning, 1.0 being its end)
+         */
+         relative: 0.1 0.1;
+         /* Add an absolute offset (in pixels) along each axis */
+         offset: 10 10;
+         /* Same as to but only for the X axis */
+         to_x: "partname";
+         /* Same as to but only for the Y axis */
+         to_y: "partname";
+      }
+      /* Settings specific to parts of the image type */
+      image {
+         /* Set the name (not path) of the regular image */
+         normal: "imagename";
+         /*
+            Set the image to use while transitioning to the normal image;
+            use several times to create animations
+         */
+         tween: "imagename2";
+         /*
+            Set the number of pixels that make up each border of the image,
+            and are not resized with the image
+         */
+         border: 4 4 4 4;
+         /*
+            Hide, strip from its alpha, or show (default)
+            the non-border part of the image
+         */
+         middle: DEFAULT;
+         border_scale_by: 1.0;
+         /* Set whether to scale the border */
+         border_scale: 0/1;
+         scale_hint: STATIC;
+         /* Set how the image is going to fill its part */
+         fill {
+            /* Set whether to smooth the image when scaling it */
+            smooth: 0/1;
+            spread: ??;
+            /* Set whether to scale or tile to fit when resizing the image is needed */
+            type: SCALE/TILE;
+            /* Only display the image area below and to the right of the given point */
+            origin {
+               /* Specify top-left point as relative coordinates */
+               relative: 0.1 0.1;
+               /* Specify top-left point as a pixel offset */
+               offset: 10 10;
+            }
+            /* Specify bottom-right point as relative coordinates */
+            size {
+               /* Specify bottom-right point as relative coordinates */
+               relative: 0.1 0.1;
+               /* Specify bottom-right point as a pixel offset */
+               offset: 10 10;
+            }
+         }
+      }
+      /* Settings specific to parts of the text and textblock type */
+      text {
+         /* Set the part text */
+         text: "some text";
+         /* Set the text font */
+         font: "Tizen Sans";
+         /* Set the text size */
+         size: 14;
+         /* Set the text class which can be used to factor font and font-size settings */
+         text_class: "classname";
+         /* Set the styles defined in stylename */
+         style: "stylename";
+         /*
+            For textblocks in the password mode,
+            replace characters to hide with this string
+         */
+         repch: "*";
+         /*
+            Set the min and max font sizes allowed when
+            resizing (default is 0 0, or unrestricted)
+         */
+         size_range: 6 18;
+         /*
+            Increase the font size as much as possible
+            while still remaining in the container for both axes
+         */
+         fit: 0/1 0/1;
+         /*
+            Make the min size of the container equal to
+            the min size of the current text (0 0 by default)
+         */
+         min: 0/1 0/1;
+         /*
+            Make the max size of the container equal to
+            the max size of the current text (0 0 by default)
+         */
+         max: 0/1 0/1;
+         /* Set the vertical and horizontal alignments of the text */
+         align: 0.5 0.5;
+         /* Reuse the text of another part */
+         text_source: "partname";
+         /*
+            When the text is too long to fit, set the relative position
+            at which to cut the text and put an ellipsis ("...")
+         */
+         ellipsis: 0.9;
+      }
+      /* Settings specific to parts of the box type */
+      box {
+         /* Set how children are arranged in the box */
+         layout: horizontal_homogeneous;
+         /* Set the vertical and horizontal alignments of the box */
+         align: 0.5 0.5;
+         /* Set the padding between items of the box */
+         padding: 1 1;
+         /*
+            Make the box's min size the min size of its elements
+            (make it shrinkable as much as its items)
+         */
+         min: 0 1;
+      }
+      table {
+         /* Make items homogeneous */
+         homogeneous: NONE;
+         /* Set the vertical and horizontal alignments of the table */
+         align: 0.5 0.5;
+         /* Set the padding between items of the table */
+         padding: 1 1;
+         /*
+            Make the table's min size the min size of its elements
+            (make it shrinkable as much as its items)
+         */
+         min: 0 1;
+      }
+      map {
+         perspective: "partname";
+         light: "partname";
+         on: 0/1;
+         smooth: 0/1;
+         alpha: 0/1;
+         backface_cull: 0/1;
+         perspective_on: 0/1;
+         color: 0/1;
+         rotation {
+            center: "partname";
+            x: 45;
+            y: 120;
+            z: 90;
+         }
+         perspective {
+            zplane: 0/1;
+            focal: 20;
+         }
+         /* Simpler syntax to create transitions to the current part */
+         link {
+            base: "edje,signal" "edje";
+         }
+      }
+   }
 }
              @@ -379,7 +379,7 @@ part {
            • name [part name] -

              Sets the part name is used as a reference in the theme's relative positioning system, by programs and in some cases by the application. The part name must be unique within the group.

              +

              Sets the part name is used as a reference in the theme's relative positioning system, by programs and in some cases by the application. The part name must be unique within the group.

            • type [TYPE] @@ -403,24 +403,24 @@ part {
            • part [part declaration]

              Sets a nested part that adds hierarchy to Edje. A nested part inherits its location relative to the parent part. To declare a nested part, create a new part within the current part declaration. Define the parent part name before adding nested parts.

              -part { 
-   name: "parent_rect";
-   type: RECT;
-   description {}
-   part { name: "nested_rect";
-      type: RECT;
-      description {}
-   }
+part {
+   name: "parent_rect";
+   type: RECT;
+   description {}
+   part { name: "nested_rect";
+      type: RECT;
+      description {}
+   }
 }
              • -
            • insert_before [another part's name] -

              Sets the part's name which this part is inserted before. One part cannot have both insert_before and insert_after. One part cannot refer to more than one part name by insert_before.

              +
            • insert_before [another part's name] +

              Sets the part's name which this part is inserted before. One part cannot have both insert_before and insert_after. One part cannot refer to more than one part name by insert_before.

              • -
            • insert_after [another part's name] -

              Sets the part's name which this part is inserted after. One part cannot have both insert_before and insert_after. One part cannot refer to more than one part name by insert_after.

              +
            • insert_after [another part's name] +

              Sets the part's name which this part is inserted after. One part cannot have both insert_before and insert_after. One part cannot refer to more than one part name by insert_after.

            • mouse_events [1 or 0] @@ -448,7 +448,7 @@ part {

              Sets the mouse pointer behavior for a given part. The default value is AUTOGRAB. The available modes are:

              • AUTOGRAB: When the part is clicked and the button remains pressed, the part is the source of all future mouse signals emitted, even outside the object, until the button is released
                • -
              • NOGRAB: Effect is limited to the part's container
                • +
              • NOGRAB: Effect is limited to the part's container
              • @@ -460,36 +460,36 @@ part {

              Determines whether Edje uses different size measurement functions. This setting only affects text and textblock parts, and is disabled by default.

              -
            • clip_to [another part's name] -

              Renders only the area of the part that coincides with another part's container. Overflowing content is not displayed. Note that the part being clipped to can only be a rectangle part.

              +
            • clip_to [another part's name] +

              Renders only the area of the part that coincides with another part's container. Overflowing content is not displayed. Note that the part being clipped to can only be a rectangle part.

              • -
            • source [another group's name] -

              Swallows the specified group into the part's container if the source is a group. If the source is a textblock, it is used for the group to be loaded and used for selection display under the selected text. source2 is used on top of the selected text, if source2 is specified.

              +
            • source [another group's name] +

              Swallows the specified group into the part's container if the source is a group. If the source is a textblock, it is used for the group to be loaded and used for selection display under the selected text. source2 is used on top of the selected text, if source2 is specified.

              Only available to group or textblock parts.

              • -
            • source2 [another group's name] +
            • source2 [another group's name]

              Used for the group to be loaded and used for selection display over the selected text. source is used under the selected text, if source is specified.

              Only available to textblock parts.

              • -
            • source3 [another group's name] +
            • source3 [another group's name]

              Used for the group to be loaded and used for cursor display under the cursor position. source4 is used over the cursor text, if source4 is specified.

              Only available to textblock parts.

              • -
            • source4 [another group's name] +
            • source4 [another group's name]

              Used for the group to be loaded and used for cursor display over the cursor position. source3 is used under the cursor text, if source3 is specified.

              Only available to textblock parts.

              • -
            • source5 [another group's name] +
            • source5 [another group's name]

              Used for the group to be loaded and used for anchors display under the anchor position. source6 is used over the anchor text, if source6 is specified.

              Only available to textblock parts.

              • -
            • source6 [another group's name] +
            • source6 [another group's name]

              Used for the group to be loaded and used for anchor display over the anchor position. source5 is used under the anchor text, if source5 is specified.

              Only available to textblock parts.

              • @@ -596,11 +596,11 @@ part { 
               draggable {
-   confine: "another part";
-   threshold: "another part";
-   events:  "another draggable part";
-   x: 0 0 0;
-   y: 0 0 0;
+   confine: "another part";
+   threshold: "another part";
+   events:  "another draggable part";
+   x: 0 0 0;
+   y: 0 0 0;
 }
              @@ -616,15 +616,15 @@ draggable {

              Sets up dragging events for the Y axis. The first parameter is used to enable (1 or -1) and disable (0) dragging along the axis. When enabled, 1 sets the starting point at 0.0 and -1 at 1.0. The second parameter takes any integer and limits the movement to values divisible by it, causing the part to jump from position to position. If the step is set to 0, it is calculated as the height of the confine part divided by count.

              -
            • confine [another part's name] -

              Limits the movement of the dragged part to another part's container. Set a min size for the part, or the dragged object does not show up.

              +
            • confine [another part's name] +

              Limits the movement of the dragged part to another part's container. Set a min size for the part, or the dragged object does not show up.

              • -
            • threshold [another part's name] +
            • threshold [another part's name]

              Allows (when set) the movement of the dragged part start only when it gets moved outside the threshold part.

              • -
            • events [another draggable part's name] +
            • events [another draggable part's name]

              Causes the part to forward the drag events to another part, thus ignoring the drag events for itself.

              • @@ -636,21 +636,21 @@ draggable { 
               box/table {
-   items {
-      item {
-         type: GROUP;
-         source: "some source";
-         min: -1 -1;
-         max: 100 100;
-         padding: 1 1 2 2;
-      }
-      item {
-         name: "some name";
-         type: GROUP;
-         source: "some other source";
-         align: 1.0 0.5;
-      }
-   }
+   items {
+      item {
+         type: GROUP;
+         source: "some source";
+         min: -1 -1;
+         max: 100 100;
+         padding: 1 1 2 2;
+      }
+      item {
+         name: "some name";
+         type: GROUP;
+         source: "some other source";
+         align: 1.0 0.5;
+      }
+   }
 }
              @@ -671,7 +671,7 @@ box/table {

              Sets the name of the object using the evas_object_name_set() function.

              -
            • source [another group's name] +
            • source [another group's name]

              Sets the group this object is made of.

              • @@ -744,23 +744,23 @@ box/table { 
               description {
-   inherit: "another_description" INDEX;
-   state: "description_name" INDEX;
-   visible: 1;
-   min: 0 0;
-   max: -1 -1;
-   align: 0.5 0.5;
-   fixed: 0 0;
-   step: 0 0;
-   aspect: 1 1;
-
-   rel1 {
-      ...
-   }
-
-   rel2 {
-      ...
-   }
+   inherit: "another_description" INDEX;
+   state: "description_name" INDEX;
+   visible: 1;
+   min: 0 0;
+   max: -1 -1;
+   align: 0.5 0.5;
+   fixed: 0 0;
+   step: 0 0;
+   aspect: 1 1;
+
+   rel1 {
+      ...
+   }
+
+   rel2 {
+      ...
+   }
 }
              @@ -768,12 +768,12 @@ description {
                -
              • inherit [another description's name] [another description's index] +
              • inherit [another description's name] [another description's index]

                Sets the description from which all the properties are inherited. The properties defined in this part override the inherited properties, reducing the amount of necessary code for simple state changes. Note that inheritance in Edje is single level only.

                • -
              • source [another part's name] -

                Causes the part to use another part's content as the content of this part. This works only with a proxy part.

                +
              • source [another part's name] +

                Causes the part to use another part's content as the content of this part. This works only with a proxy part.

              • state [name for the description] [index] @@ -795,7 +795,7 @@ description {
              • align [X axis] [Y axis] -

                When the displayed object's size is smaller or bigger than its container, this property moves it relatively along both axes inside its container. 0.0 means left/top edges of the object touching container's respective ones, and 1.0 stands for right/bottom edges of the object (on horizontal/vertical axis, respectively). The default value is 0.5 0.5. For a more detailed explanation, see Size Hints.

                +

                When the displayed object's size is smaller or bigger than its container, this property moves it relatively along both axes inside its container. 0.0 means left/top edges of the object touching container's respective ones, and 1.0 stands for right/bottom edges of the object (on horizontal/vertical axis, respectively). The default value is 0.5 0.5. For a more detailed explanation, see Size Hints.

              • fixed [width, 0 or 1] [height, 0 or 1] @@ -858,18 +858,18 @@ description {
              • description.rel1 or description.rel2 block 
                 description {
-   rel1 {
-      relative: 0.0 0.0;
-      offset:     0   0;
-   }
-   rel2 {
-      relative: 1.0 1.0;
-      offset:    -1  -1;
-   }
+   rel1 {
+      relative: 0.0 0.0;
+      offset:     0   0;
+   }
+   rel2 {
+      relative: 1.0 1.0;
+      offset:    -1  -1;
+   }
 }
                -

                The rel1 and rel2 blocks are used to define the position of each corner of the part's container. rel1 refers to the left-top corner and rel2 to the right-down corner.

                +

                The rel1 and rel2 blocks are used to define the position of each corner of the part's container. rel1 refers to the left-top corner and rel2 to the right-down corner.

                  @@ -881,16 +881,16 @@ description {

                  Affects the corner position a fixed number of pixels along each axis.

                  -
                • to [another part's name] -

                  Positions the corner relative to another part's container. Setting to "" resets this value for inherited parts.

                  +
                • to [another part's name] +

                  Positions the corner relative to another part's container. Setting to "" resets this value for inherited parts.

                  • -
                • to_x [another part's name] -

                  Positions the corner relative to the X axis of another part's container. This affects the first parameter of the relative property. Setting to "" resets this value for inherited parts.

                  +
                • to_x [another part's name] +

                  Positions the corner relative to the X axis of another part's container. This affects the first parameter of the relative property. Setting to "" resets this value for inherited parts.

                  • -
                • to_y [another part's name] -

                  Positions the corner relative to the Y axis of another part's container. This affects the second parameter of the relative property. Setting to "" resets this value for inherited parts.

                  +
                • to_y [another part's name] +

                  Positions the corner relative to the Y axis of another part's container. This affects the second parameter of the relative property. Setting to "" resets this value for inherited parts.

                @@ -899,24 +899,24 @@ description { 
                 description {
-   image {
-      normal: "filename.ext";
-      tween:  "filename2.ext";
-      tween:  "filenameN.ext";
-      border:  left right top bottom;
-      middle:  0/1/NONE/DEFAULT/SOLID;
-      fill {}
-   }
+   image {
+      normal: "filename.ext";
+      tween:  "filename2.ext";
+      tween:  "filenameN.ext";
+      border:  left right top bottom;
+      middle:  0/1/NONE/DEFAULT/SOLID;
+      fill {}
+   }
 }

                The image block defines the settings for an image used in a visual element.

                  -
                • normal [image's filename] +
                • normal [image's filename]

                  Sets the name of the image to be used as previously declared in the images block. In an animation, this is the first and last image displayed. The file name is required in all image parts.

                  • -
                • tween [image's filename] +
                • tween [image's filename]

                  Sets the name of an image to be used in an animation loop. An image block can have none, one, or multiple tween declarations. Images are displayed in the order they are listed, during the transition to the state they are declared in; the normal image is the final state.

                  • @@ -954,12 +954,12 @@ description { 
                   image {
-   fill {
-      type: SCALE;
-      smooth: 0-1;
-      origin {}
-      size {}
-   }
+   fill {
+      type: SCALE;
+      smooth: 0-1;
+      origin {}
+      size {}
+   }
 }
                  @@ -986,21 +986,21 @@ image { 
                   image {
-   fill {
-      origin {
-         relative: 0.0 0.0;
-         offset: 0 0;
-      }
-   }
+   fill {
+      origin {
+         relative: 0.0 0.0;
+         offset: 0 0;
+      }
+   }
 }
                  -

                  The origin block is used to place the starting point inside the displayed element that is used to render the tile. By default, the origin is set at the element's left-top corner.

                  +

                  The origin block is used to place the starting point inside the displayed element that is used to render the tile. By default, the origin is set at the element's left-top corner.

                  • relative [X axis] [Y axis] -

                    Sets the starting point relative to the displayed element's content.

                    +

                    Sets the starting point relative to the displayed element's content.

                  • offset [X axis] [Y axis]

                    Affects the starting point a fixed number of pixels along each axis.

                    @@ -1013,12 +1013,12 @@ image { 
                     image {
-   fill {
-      size {
-         relative: 1.0 1.0;
-         offset: -1 -1;
-      }
-   }
+   fill {
+      size {
+         relative: 1.0 1.0;
+         offset: -1 -1;
+      }
+   }
 }
                    @@ -1043,17 +1043,17 @@ image { 
                     text {
-   text: "some string of text to display";
-   font: "font_name";
-   size: SIZE;
-   text_class: "class_name";
-   fit: horizontal vertical;
-   min: horizontal vertical;
-   max: horizontal vertical;
-   align: X-axis Y-axis;
-   source: "part_name";
-   text_source: "text_part_name";
-   style: "stylename";
+   text: "some string of text to display";
+   font: "font_name";
+   size: SIZE;
+   text_class: "class_name";
+   fit: horizontal vertical;
+   min: horizontal vertical;
+   max: horizontal vertical;
+   align: X-axis Y-axis;
+   source: "part_name";
+   text_source: "text_part_name";
+   style: "stylename";
 }
                    @@ -1105,11 +1105,11 @@ text {

                    Changes the position of the point of balance inside the container. The default value is 0.5 0.5.

                    • -
                  • source [another TEXT part's name] +
                  • source [another TEXT part's name]

                    Causes the part to use the text properties (like font and size) of another part and update them as they change.

                    • -
                  • text_source [another TEXT part's name] +
                  • text_source [another TEXT part's name]

                    Causes the part to display the text content of another part and update them as they change.

                    • @@ -1124,10 +1124,10 @@ text { 
                     box {
-   layout: "vertical";
-   padding: 0 2;
-   align: 0.5 0.5;
-   min: 0 0;
+   layout: "vertical";
+   padding: 0 2;
+   align: 0.5 0.5;
+   min: 0 0;
 }
                    @@ -1172,10 +1172,10 @@ box { 
                     table {
-   homogeneous: TABLE;
-   padding: 0 2;
-   align: 0.5 0.5;
-   min: 0 0;
+   homogeneous: TABLE;
+   padding: 0 2;
+   align: 0.5 0.5;
+   min: 0 0;
 }
                    @@ -1210,28 +1210,28 @@ table { 
                     map {
-   perspective: "name";
-   light: "name";
-   on: 1;
-   smooth: 1;
-   perspective_on: 1;
-   backface_cull: 1;
-   alpha: 1;
-
-   rotation {
-      ...
-   }
+   perspective: "name";
+   light: "name";
+   on: 1;
+   smooth: 1;
+   perspective_on: 1;
+   backface_cull: 1;
+   alpha: 1;
+
+   rotation {
+      ...
+   }
 }
                      -
                    • perspective [another part's name] +
                    • perspective [another part's name]

                      Sets the part that is used as the perspective point for giving a part a 3D look. The perspective point must have a perspective section that provides zplane and focal properties. The center of this part is used as the focal point, thus size, color, and visibility are not relevant, just the center point, zplane, and focal are used. This also implicitly enables perspective transforms.

                      • -
                    • light [another part's name] -

                      Sets the part that is used as the light for calculating the brightness (based on how directly the part's surface is facing the light source point). Like the perspective point part, the center point is used and zplane is used for the z position (0 being the zero-plane where all 2D objects normally live) and positive values being further away into the distance. The light part color property is used as the light color (alpha not used for light color). The color2 property is used for the ambient lighting when calculating brightness (alpha also not used).

                      +
                    • light [another part's name] +

                      Sets the part that is used as the light for calculating the brightness (based on how directly the part's surface is facing the light source point). Like the perspective point part, the center point is used and zplane is used for the z position (0 being the zero-plane where all 2D objects normally live) and positive values being further away into the distance. The light part color property is used as the light color (alpha not used for light color). The color2 property is used for the ambient lighting when calculating brightness (alpha also not used).

                    • on [1 or 0] @@ -1267,10 +1267,10 @@ map { 
                       rotation {
-   center: "name";
-   x: 45.0;
-   y: 45.0;
-   z: 45.0;
+   center: "name";
+   x: 45.0;
+   y: 45.0;
+   z: 45.0;
 }
                      @@ -1278,8 +1278,8 @@ rotation {
                        -
                      • center [another part's name] -

                        Sets the part that is used as the center of rotation when rotating the part with this description. The part's center point is used as the rotation center when applying rotation around the X, Y and Z axes. If no center is given, the part's original center itself is used for the rotation center.

                        +
                      • center [another part's name] +

                        Sets the part that is used as the center of rotation when rotating the part with this description. The part's center point is used as the rotation center when applying rotation around the X, Y and Z axes. If no center is given, the part's original center itself is used for the rotation center.

                      • x [X degrees] @@ -1300,8 +1300,8 @@ rotation { 
                         perspective {
-   zplane: 0;
-   focal: 1000;
+   zplane: 0;
+   focal: 1000;
 }
                        @@ -1323,10 +1323,10 @@ perspective { 
                         link {
-   base: "edje,signal" "edje";
-   transition: LINEAR 0.2;
-   in: 0.5 0.1;
-   after: "some_program";
+   base: "edje,signal" "edje";
+   transition: LINEAR 0.2;
+   in: 0.5 0.1;
+   after: "some_program";
 }
                        @@ -1334,15 +1334,15 @@ link { 
                        -action: STATE_SET "default";
-signal: "edje,signal";
-source: "edje";
+action: STATE_SET "default";
+signal: "edje,signal";
+source: "edje";
                        • diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_positioning_parts_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_positioning_parts_n.htm index 6451cec..d4d53f3 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_positioning_parts_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_positioning_parts_n.htm @@ -48,53 +48,53 @@ 
                         part
 {
-   name: "rectangle";
-   type: RECT;
-   description
-   {
-      state: "blue" 0.0;
-      align: 0.0 0.0;
-      /* Set the size to 200x200 */
-      min: 200 200;
-      max: 200 200;
-      /* Blue color */
-      color: 0 0 255 255;
-   }
+   name: "rectangle";
+   type: RECT;
+   description
+   {
+      state: "blue" 0.0;
+      align: 0.0 0.0;
+      /* Set the size to 200x200 */
+      min: 200 200;
+      max: 200 200;
+      /* Blue color */
+      color: 0 0 255 255;
+   }
 }
                      • Define the position of the part in the rel1 and rel2 blocks, which determine the upper-left corner and the lower-right corner of the part. -

                        The position can be defined in relation to another part (with the relative property), or as an offset (with the offset property). When using relative positioning, the to, to_x and to_y properties are used to define in relation to which part the positioning is done. If nothing else is specified, the positioning is in relation to the parent's part.

                        +

                        The position can be defined in relation to another part (with the relative property), or as an offset (with the offset property). When using relative positioning, the to, to_x and to_y properties are used to define in relation to which part the positioning is done. If nothing else is specified, the positioning is in relation to the parent's part.

                        To demonstrate relative positioning, the following example creates another rectangle part and positions it under the first part created above. The upper-left corner of the new part starts at the lower-left corner of the previous one.

                         part
 {
-   name: "rectangle2";
-   type: RECT;
-   description
-   {
-      state: "green" 0.0;
-      align: 0.0 0.0;
-      /* Set the size to 200 x 200 */
-      min: 200 200;
-      max: 200 200;
-      /* Green color */
-      color: 0 255 0 255;
-      /* Set the position */
-      /* rel1 is relative to "rectangle" */
-      rel1
-      {
-         relative: 0.0 1.0;
-         to: "rectangle";
-      }
-      /* rel2 is relative to the parent */
-      rel2
-      {
-         relative: 1.0 1.0;
-      }
-   }
+   name: "rectangle2";
+   type: RECT;
+   description
+   {
+      state: "green" 0.0;
+      align: 0.0 0.0;
+      /* Set the size to 200 x 200 */
+      min: 200 200;
+      max: 200 200;
+      /* Green color */
+      color: 0 255 0 255;
+      /* Set the position */
+      /* rel1 is relative to "rectangle" */
+      rel1
+      {
+         relative: 0.0 1.0;
+         to: "rectangle";
+      }
+      /* rel2 is relative to the parent */
+      rel2
+      {
+         relative: 1.0 1.0;
+      }
+   }
 }
                        @@ -112,8 +112,8 @@ part

                        The following figure shows the pixel positions for a 4 x 4 rectangle. The indexes start in the top-left corner at (0, 0), and increase to the right and to the bottom. Since the indexes have started at 0, the fourth pixel has an index of 3. To create a 2 x 2 blue rectangle centered inside the green rectangle, the top-left corner must be (1, 1) and the bottom-right one (2, 2).

                        -

                        Figure: Offset indexes

                        -

                        Offset indexes

                        +

                        Figure: Offset indexes

                        +

                        Offset indexes

                        To determine the relative position of the blue rectangle, Edje needs the following definitions:

                          @@ -125,13 +125,13 @@ part

                          The following code example shows the definitions:

                          -name: "blue rectangle";
+name: "blue rectangle";
 
-rel1.to: "green rectangle";
+rel1.to: "green rectangle";
 rel1.relative: 0 0;
 rel1.offset: 1 1;
 
-rel2.to: "green rectangle";
+rel2.to: "green rectangle";
 rel2.relative: 0 0;
 rel2.offset: 2 2;
                          @@ -141,19 +141,19 @@ rel2.offset: 2 2;

                          The following example is similar to the previous one but it uses relative positioning instead of offsets to achieve the same result for the 4 x 4 rectangle (though it can scale to larger sizes as well). The blue rectangle starts at 25% of the green rectangle (both vertically and horizontally) and ends at 75% of it (both vertically and horizontally). Like in the previous example, the blue rectangle is named and Edje is told what the object of reference is:

                          -name: "blue rectangle";
+name: "blue rectangle";
 
-rel1.to: "green rectangle";
+rel1.to: "green rectangle";
 rel1.relative: 0.25 0.25;
 
-rel2.to: "green rectangle";
+rel2.to: "green rectangle";
 rel2.relative: 0.75 0.75;

                          The following figure shows how to refer to pixels using relative positioning when the offsets are (0, 0).

                          -

                          Figure: Relative positioning

                          -

                          Relative positioning

                          +

                          Figure: Relative positioning

                          +

                          Relative positioning

                          Note that in addressing the pixels, (0, 0) is addressed through relative: 0 0; offset 0 0; and each additional 0.25 in the relative field gives a 1-pixel move. With this, the pixel addressed through relative: 0.75 0.75; offset: 0 0; is at (3, 3) and not (2, 2).

                          diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_program_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_program_n.htm index ac95fd1..4eecfa2 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_program_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_program_n.htm @@ -53,28 +53,28 @@ 
                           program {
-   /* Set the name of the program */
-   name: "programname";
-   /* Set the signals which trigger the program */
-   signal: "signalname";
-   /* Filter incoming signals depending on the sender name */
-   source: "partname";
-   /* Filter incoming signals depending on the part's state */
-   filter: "partname" "statename";
-   /* Delay the program by X seconds plus a random time between 0 and Y */
-   in: 0.3 0.0;
-   /* Set the action to perform */
-   action: STATE_SET "statename" state_value;
-   /*
-      If the action is STATE_SET,
-      define a transition from the current to the target state
-   */
-   transition: LINEAR 0.5;
-   /* If the action is SIGNAL_EMIT, set the name of the part which receives the signal */
-   target: "partname";
-   /* Run another program after the current one is done */
-   after: "programname";
-   after: "anotherprogram";
+   /* Set the name of the program */
+   name: "programname";
+   /* Set the signals which trigger the program */
+   signal: "signalname";
+   /* Filter incoming signals depending on the sender name */
+   source: "partname";
+   /* Filter incoming signals depending on the part's state */
+   filter: "partname" "statename";
+   /* Delay the program by X seconds plus a random time between 0 and Y */
+   in: 0.3 0.0;
+   /* Set the action to perform */
+   action: STATE_SET "statename" state_value;
+   /*
+      If the action is STATE_SET,
+      define a transition from the current to the target state
+   */
+   transition: LINEAR 0.5;
+   /* If the action is SIGNAL_EMIT, set the name of the part which receives the signal */
+   target: "partname";
+   /* Run another program after the current one is done */
+   after: "programname";
+   after: "anotherprogram";
 }
                          @@ -126,9 +126,9 @@ program {
                        • DRAG_VAL_STEP: Set a step for the draggable part (x, y values)
                        • DRAG_VAL_PAGE: Set a page for the draggable part (x, y values)
                        • FOCUS_SET: Set the focus to the target group
                          • -
                        • PLAY_SAMPLE "sample name" speed (channel): Play a music sample clip +
                        • PLAY_SAMPLE "sample name" speed (channel): Play a music sample clip -

                          PLAY_SAMPLE's (optional) channel can be one of:

                          +

                          PLAY_SAMPLE's (optional) channel can be one of:

                          • EFFECT/FX
                          • BACKGROUND/BG
                            • @@ -140,8 +140,8 @@ program {
                          • -
                        • PLAY_TONE "tone name" duration_in_seconds (Range 0.1 to 10.0): Play a predefined tone of a specific duration
                          • -
                        • PLAY_VIBRATION "sample name" repeat (repeat count)
                          • +
                        • PLAY_TONE "tone name" duration_in_seconds (Range 0.1 to 10.0): Play a predefined tone of a specific duration
                          • +
                        • PLAY_VIBRATION "sample name" repeat (repeat count)
                        • diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_signal_handling_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_signal_handling_n.htm index faa1301..a208b61 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_signal_handling_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_signal_handling_n.htm @@ -40,48 +40,48 @@ 
                         collections {
-   group { name: "main";
-      parts {
-         part { name: "rect1";
-            type: RECT;
-            description {
-               state: "default" 0.0;
-               min: 100 100;
-               max: 100 100;
-               color: 255 0 0 255;
-            }
-            description {
-               state: "default" 1.0;
-               min: 100 100;
-               max: 100 100;
-               color: 0 0 255 255;
-            }
-         }
-         part { name: "swallow.check";
-            type: SWALLOW;
-            description {
-               state: "default" 0.0;
-               align: 0.0 0.0;
-               rel1.relative: 0.0 0.0;
-               rel2.relative: 0.0 0.0;
-            }
-         }
-      }
-      programs {
-         program { name: "to_default_0";
-            signal: "to,state,default,0";
-            action: STATE_SET "default" 0.00;
-            transition: ACCELERATE 0.5 CURRENT;
-            target: "rect1";
-         }
-         program { name: "to_default_1";
-            signal: "to,state,default,1";
-            action: STATE_SET "default" 1.00;
-            transition: ACCELERATE 0.5 CURRENT;
-            target: "rect1";
-         }
-      }
-   }
+   group { name: "main";
+      parts {
+         part { name: "rect1";
+            type: RECT;
+            description {
+               state: "default" 0.0;
+               min: 100 100;
+               max: 100 100;
+               color: 255 0 0 255;
+            }
+            description {
+               state: "default" 1.0;
+               min: 100 100;
+               max: 100 100;
+               color: 0 0 255 255;
+            }
+         }
+         part { name: "swallow.check";
+            type: SWALLOW;
+            description {
+               state: "default" 0.0;
+               align: 0.0 0.0;
+               rel1.relative: 0.0 0.0;
+               rel2.relative: 0.0 0.0;
+            }
+         }
+      }
+      programs {
+         program { name: "to_default_0";
+            signal: "to,state,default,0";
+            action: STATE_SET "default" 0.00;
+            transition: ACCELERATE 0.5 CURRENT;
+            target: "rect1";
+         }
+         program { name: "to_default_1";
+            signal: "to,state,default,1";
+            action: STATE_SET "default" 1.00;
+            transition: ACCELERATE 0.5 CURRENT;
+            target: "rect1";
+         }
+      }
+   }
 }
                        @@ -94,45 +94,45 @@ collections { static void create_base_gui(appdata_s *ad) { -   char edj_path[PATH_MAX] = {0,}; -    -   /* Create a window */ -   ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -   elm_win_conformant_set(ad->win, EINA_TRUE); -   elm_win_autodel_set(ad->win, EINA_TRUE); - -   if (elm_win_wm_rotation_supported_get(ad->win)) { -      int rots[4] = {0, 90, 180, 270}; -      elm_win_wm_rotation_available_rotations_set(ad->win, -                                                  (const int *)(&rots), 4); -   } - -   evas_object_smart_callback_add(ad->win, "delete,request", -                                  win_delete_request_cb, NULL); -   eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); - -   /* Create a conformant */ -   ad->conform = elm_conformant_add(ad->win); -   elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); -   elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE); -   evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, -                                    EVAS_HINT_EXPAND); -   elm_win_resize_object_add(ad->win, ad->conform); -   evas_object_show(ad->conform); - -   /* Set a base layout */ -   app_get_resource(EDJ_FILE, edj_path, (int)PATH_MAX); -   ad->layout = elm_layout_add(ad->win); -   elm_layout_file_set(ad->layout, edj_path, GRP_MAIN); -   evas_object_size_hint_weight_set(ad->layout, EVAS_HINT_EXPAND, -                                    EVAS_HINT_EXPAND); -    -   ad->check = elm_check_add(ad->win); -   elm_object_part_content_set(ad->layout, "swallow.check", ad->check); -   evas_object_smart_callback_add(ad->check, "changed", _check_toggled, ad); - -   /* Show the window */ -   evas_object_show(ad->win); + char edj_path[PATH_MAX] = {0,}; + + /* Create a window */ + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_conformant_set(ad->win, EINA_TRUE); + elm_win_autodel_set(ad->win, EINA_TRUE); + + if (elm_win_wm_rotation_supported_get(ad->win)) { + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, + (const int *)(&rots), 4); + } + + evas_object_smart_callback_add(ad->win, "delete,request", + win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + + /* Create a conformant */ + ad->conform = elm_conformant_add(ad->win); + elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); + elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE); + evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, + EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, ad->conform); + evas_object_show(ad->conform); + + /* Set a base layout */ + app_get_resource(EDJ_FILE, edj_path, (int)PATH_MAX); + ad->layout = elm_layout_add(ad->win); + elm_layout_file_set(ad->layout, edj_path, GRP_MAIN); + evas_object_size_hint_weight_set(ad->layout, EVAS_HINT_EXPAND, + EVAS_HINT_EXPAND); + + ad->check = elm_check_add(ad->win); + elm_object_part_content_set(ad->layout, "swallow.check", ad->check); + evas_object_smart_callback_add(ad->check, "changed", _check_toggled, ad); + + /* Show the window */ + evas_object_show(ad->win); } @@ -147,12 +147,12 @@ create_base_gui(appdata_s *ad) static void _check_toggled(void *data, Evas_Object *obj, void *event_info) { -   appdata_s *ad = data; + appdata_s *ad = data; -   if (elm_check_state_get(obj)) -      elm_object_signal_emit(ad->layout, "to,state,default,1", ""); -   else -      elm_object_signal_emit(ad->layout, "to,state,default,0", ""); + if (elm_check_state_get(obj)) + elm_object_signal_emit(ad->layout, "to,state,default,1", ""); + else + elm_object_signal_emit(ad->layout, "to,state,default,0", ""); }

                        The following figure displays the result.

                        diff --git a/org.tizen.guides/html/native/ui/efl/learn_edc_styles_n.htm b/org.tizen.guides/html/native/ui/efl/learn_edc_styles_n.htm index 2828cc3..80207c0 100644 --- a/org.tizen.guides/html/native/ui/efl/learn_edc_styles_n.htm +++ b/org.tizen.guides/html/native/ui/efl/learn_edc_styles_n.htm @@ -50,11 +50,11 @@ 
                         styles {
-   style {
-      name: "stylename";
-      base: "..default style properties..";
-      tag: "tagname" "..style properties..";
-   }
+   style {
+      name: "stylename";
+      base: "..default style properties..";
+      tag: "tagname" "..style properties..";
+   }
 }
                        @@ -88,7 +88,7 @@ styles {
                      • tag [tag name] [style properties string] -

                        Sets the style to be applied only to text between style <tags>..</tags>. When creating paired tags, like <bold></bold>, a '+' sign must be added at the start of the style properties of the first part (<bold>). If the second part (</bold>) is also defined, a '-' sign must be added to its style properties. This applies only to paired tags; single tags, like <tab>, must not have a starting '+'.

                        +

                        Sets the style to be applied only to text between style <tags>..</tags>. When creating paired tags, like <bold></bold>, a '+' sign must be added at the start of the style properties of the first part (<bold>). If the second part (</bold>) is also defined, a '-' sign must be added to its style properties. This applies only to paired tags; single tags, like <tab>, must not have a starting '+'.

                        • br
                        • tab
                          • @@ -102,12 +102,12 @@ styles {

                          The following code is the style sample for the text style:

                          -style { name: "list_text_main";
-   base: "font=Tizen:style=Regular font_size=30 color=#ffffff ellipsis=1.0";
-   tag: "br" "\n";\
-   tag: "ps" "ps";\
-   tag: "tab" "\t";\
-   tag: "b" "+ font_weight=Bold";
+style { name: "list_text_main";
+   base: "font=Tizen:style=Regular font_size=30 color=#ffffff ellipsis=1.0";
+   tag: "br" "\n";\
+   tag: "ps" "ps";\
+   tag: "tab" "\t";\
+   tag: "b" "+ font_weight=Bold";
 }
                          diff --git a/org.tizen.guides/html/native/ui/efl/main_loop_n.htm b/org.tizen.guides/html/native/ui/efl/main_loop_n.htm index 240ea06..fd825f4 100644 --- a/org.tizen.guides/html/native/ui/efl/main_loop_n.htm +++ b/org.tizen.guides/html/native/ui/efl/main_loop_n.htm @@ -5,20 +5,20 @@ - + - Handling the Main Loop - + Handling the Main Loop + - +

                          Mobile native Wearable native

                          - +

                          Dependencies

                          - +

                          Related Info

                          -
                          +
    -

    Handling the Main Loop

    - +

    Handling the Main Loop

    +

    The EFL is event-driven. This means that the application polls for data, and listens for events to interact with it.

    The Ecore library provides the main loop abstraction. It gets data when data is available and sends the events so that costly polling threads are not needed. Ecore manages polling, timers, events, and file descriptors. When there is no ongoing event, the main loop automatically enters an idle mode, minimizing the power consumption. The loop wakes up when needed.

    - +

    Starting the Main Loop

    To start the Ecore main loop and move your application into the running state, call the ui_app_main() function. The Ecore main loop handles all general events, such as touch, mouse, key, and network events.

    @@ -61,18 +61,18 @@ int main(int argc, char *argv[]) { -    ret = ui_app_main(argc, argv, &event_callback, -                      &ad); + ret = ui_app_main(argc, argv, &event_callback, + &ad); -    return ret; + return ret; } -

    When your application is running:

    +

    When your application is running:

    1. Create a window and organize the UI components inside the window.
    2. Create the application logic code to be called when callbacks or timed events occurs (for example, animators for animations and timers for timeouts).
    - +

    Timers

    Ecore provides timers, which schedule events that are executed later at a specific time. The event can occur once or several times at specific intervals.

    @@ -93,13 +93,13 @@ main(int argc, char *argv[]) Eina_Bool my_timed_cb(void *data) { -    static int count = 0; -    count++; + static int count = 0; + count++; -    if (count < 5) -        return ECORE_CALLBACK_RENEW; + if (count < 5) + return ECORE_CALLBACK_RENEW; -    return ECORE_CALLBACK_CANCEL; + return ECORE_CALLBACK_CANCEL; } ecore_timer_add(2.0, my_timed_cb, my_data); @@ -110,11 +110,11 @@ ecore_timer_add(2.0, my_timed_cb, my_data);

    To manage a timer:

      -
    • To change the timer's interval, use the ecore_timer_interval_set() function. The interval is specified in seconds. If set during a timer call, this affects the next interval. Use the ecore_timer_interval_get() function to get the timer's current interval.
      • +
    • To change the timer's interval, use the ecore_timer_interval_set() function. The interval is specified in seconds. If set during a timer call, this affects the next interval. Use the ecore_timer_interval_get() function to get the timer's current interval.
      • -
    • To get the timer's pending time, use the ecore_timer_pending_get() function.
      • +
    • To get the timer's pending time, use the ecore_timer_pending_get() function.
      • -
    • To delay the timer's next occurrence, use the ecore_timer_delay() function. The function adds the specified time to the current interval. It does not change the future occurrences' interval. You can also reset the current interval to its full value by using the ecore_timer_reset() function.
      • +
    • To delay the timer's next occurrence, use the ecore_timer_delay() function. The function adds the specified time to the current interval. It does not change the future occurrences' interval. You can also reset the current interval to its full value by using the ecore_timer_reset() function.
    • To pause the currently running timer, use the ecore_timer_freeze() function. The remaining time is saved and used again when the timer is resumed with the ecore_timer_thaw() function.
      • @@ -141,12 +141,12 @@ ecore_timer_add(2.0, my_timed_cb, my_data); Eina_Bool my_anim_cb(void *data) { -    static int count = 0; -    count++; -    if (count < 5) -        return ECORE_CALLBACK_RENEW; + static int count = 0; + count++; + if (count < 5) + return ECORE_CALLBACK_RENEW; -    return ECORE_CALLBACK_CANCEL; + return ECORE_CALLBACK_CANCEL; } ecore_animator_add(my_anim_cb, my_data); @@ -166,10 +166,10 @@ ecore_animator_add(my_anim_cb, my_data); Eina_Bool my_anim_cb(void *data, double position) { -    if (position < .5) -        return ECORE_CALLBACK_RENEW; + if (position < .5) + return ECORE_CALLBACK_RENEW; -    return ECORE_CALLBACK_CANCEL; + return ECORE_CALLBACK_CANCEL; } ecore_animator_timeline_add(5., my_anim_cb, my_data); @@ -191,8 +191,8 @@ ecore_animator_timeline_add(5., my_anim_cb, my_data);
    • ECORE_POS_MAP_SPRING: start at 0.0, then wobble like a spring to the rest position 1.0, and wobble v2 times, with a decay factor of v1.
    -

    Figure: Position maps

    -

    Position maps

    +

    Figure: Position maps

    +

    Position maps

  • To destroy the animator, use the ecore_animator_del() function. The animator to destroy must be running, that is, it has not returned a false value. If the animator is not running, the function cannot be called.
    • @@ -223,11 +223,11 @@ ecore_animator_timeline_add(5., my_anim_cb, my_data); Eina_Bool my_fd_cb(void *data, Ecore_Fd_Handler *handler) { -    int fd; -    fd = ecore_main_fd_handler_fd_get(handler); -    count = read(fd, buf, sizeof(buf)); /* This is guaranteed not to block */ + int fd; + fd = ecore_main_fd_handler_fd_get(handler); + count = read(fd, buf, sizeof(buf)); /* This is guaranteed not to block */ -    return ECORE_CALLBACK_RENEW; + return ECORE_CALLBACK_RENEW; } ecore_main_fd_handler_add(my_fd, ECORE_FD_READ, my_fd_cb, my_data, NULL, NULL); @@ -235,7 +235,7 @@ ecore_main_fd_handler_add(my_fd, ECORE_FD_READ, my_fd_cb, my_data, NULL, NULL);
  • To delete a file descriptor handler, use the ecore_main_fd_handler_del() function. This does not close the file descriptor. Always delete the handlers before closing the actual file descriptors.
    • -
  • To get the handler's file descriptor, use the ecore_main_fd_handler_fd_get() function.
    • +
  • To get the handler's file descriptor, use the ecore_main_fd_handler_fd_get() function.
  • To select whether a flag is active on a handler, use the ecore_main_fd_handler_active_get() function. For example, the handler is set to monitor both ECORE_FD_READ and ECORE_FD_ERROR. The following example finds out whether the function was called because of an error: @@ -243,19 +243,19 @@ ecore_main_fd_handler_add(my_fd, ECORE_FD_READ, my_fd_cb, my_data, NULL, NULL); Eina_Bool my_fd_cb(void *data, Ecore_Fd_Handler *handler) { -    int fd; -    fd = ecore_main_fd_handler_fd_get(handler); -    if (ecore_main_fd_handler_active_get(handler, ECORE_FD_ERROR) == EINA_TRUE) { -        /* We have an error! */ + int fd; + fd = ecore_main_fd_handler_fd_get(handler); + if (ecore_main_fd_handler_active_get(handler, ECORE_FD_ERROR) == EINA_TRUE) { + /* We have an error! */ -        return ECORE_CALLBACK_CANCEL; -    } -    count = read(fd, buf, sizeof(buf)); /* This is guaranteed not to block */ + return ECORE_CALLBACK_CANCEL; + } + count = read(fd, buf, sizeof(buf)); /* This is guaranteed not to block */ -    return ECORE_CALLBACK_RENEW; + return ECORE_CALLBACK_RENEW; } ecore_main_fd_handler_add(my_fd, ECORE_FD_READ | ECORE_FD_ERROR, my_fd_cb, -                          my_data, NULL, NULL); + my_data, NULL, NULL);
    • @@ -280,53 +280,53 @@ ecore_main_fd_handler_add(my_fd, ECORE_FD_READ | ECORE_FD_ERROR, my_fd_cb, 
     struct feedback_msg {
-    int pos;
+    int pos;
 };
 
 void
 my_short_job(void *data, Ecore_Thread *thread)
 {
-    usleep(200000);
+    usleep(200000);
 }
 
 void
 my_feedback_job(void *data, Ecore_Thread *thread)
 {
-    int i;
-    for (i = 0; i < 100; i++) {
-        usleep(50000); /* You can have some real computation done */
-        struct feedback_msg *message = malloc(sizeof(struct feedback_msg));
-        if (message) {
-            message->pos = i;
-            ecore_thread_feedback(thread, message);
-        }
-        if (ecore_thread_check(thread))
-            return;
-    }
+    int i;
+    for (i = 0; i < 100; i++) {
+        usleep(50000); /* You can have some real computation done */
+        struct feedback_msg *message = malloc(sizeof(struct feedback_msg));
+        if (message) {
+            message->pos = i;
+            ecore_thread_feedback(thread, message);
+        }
+        if (ecore_thread_check(thread))
+            return;
+    }
 }
 
 void
 my_feedback_job_notify(void *data, Ecore_Thread *thread, void *msg)
 {
-    struct feedback_msg *message = msg;
-    free(message);
+    struct feedback_msg *message = msg;
+    free(message);
 }
 
 void
 my_job_end(void *data, Ecore_Thread *thread)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Thread has normally ended.\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Thread has normally ended.\n");
 }
 
 void
 my_job_cancel(void *data, Ecore_Thread *thread)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Thread has been cancelled.\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Thread has been cancelled.\n");
 }
 
 ecore_thread_run(my_short_job, my_job_end, my_job_cancel, my_data);
-ecore_thread_feedback_run(my_feedback_job, my_feedback_job_notify, my_job_end, 
-                          my_job_cancel, my_data, EINA_FALSE);
+ecore_thread_feedback_run(my_feedback_job, my_feedback_job_notify, my_job_end,
+                          my_job_cancel, my_data, EINA_FALSE);

    To manage threads:

    @@ -350,8 +350,8 @@ ecore_thread_feedback_run(my_feedback_job, my_feedback_job_notify, my_job_end,

    When the rendering is done and all work is finished, the main loop enters its idle state until the next loop. You can get the functions of your application called back before the main loop enters or exits the idle state, or when it is in the idle state. They are respectively called Ecore_Idle_Enterer, Ecore_Idle_Exiter, and Ecore_Idler.

    -

    Figure: Idle loop

    -

    Idle loop

    +

    Figure: Idle loop

    +

    Idle loop

    The idle enterers, exiters, and idlers all have the same prototype, my_idler(), which receives data and returns ECORE_CALLBACK_RENEW or ECORE_CALLBACK_CANCEL to tell Ecore whether it wants to be called again or is finished.

    @@ -369,19 +369,19 @@ ecore_thread_feedback_run(my_feedback_job, my_feedback_job_notify, my_job_end, Eina_Bool my_idle_enterer_cb(void *data) { -    return ECORE_CALLBACK_RENEW; + return ECORE_CALLBACK_RENEW; } Eina_Bool my_idle_exiter_cb(void *data) { -    return ECORE_CALLBACK_CANCEL; + return ECORE_CALLBACK_CANCEL; } Eina_Bool my_idler(void *data) { -    return ECORE_CALLBACK_RENEW; + return ECORE_CALLBACK_RENEW; } ecore_idle_enterer_add(my_idle_enterer_cb, my_data); diff --git a/org.tizen.guides/html/native/ui/efl/multiple_screens_n.htm b/org.tizen.guides/html/native/ui/efl/multiple_screens_n.htm index 83ca406..7715761 100644 --- a/org.tizen.guides/html/native/ui/efl/multiple_screens_n.htm +++ b/org.tizen.guides/html/native/ui/efl/multiple_screens_n.htm @@ -5,20 +5,20 @@ - + - Multiple Screen Support - + Multiple Screen Support + - + +
    -

    Multiple Screen Support

    +

    Multiple Screen Support

    + +

    Tizen is available in various devices, which support different screen sizes and resolutions. When developing Tizen applications, you must take this into account if you want your application to function well in various device models.

    +

    Before implementing multiple screen support, make sure you are familiar with the key concepts of multiple screen support.

    -

    Tizen is available in various devices, which support different screen sizes and resolutions. When developing Tizen applications, you must take this into account if you want your application to function well in various device models.

    -

    Before implementing multiple screen support, make sure you are familiar with the key concepts of multiple screen support.

    - -

    Key Concepts

    -

    Before building a native application for multiple resolutions using Tizen native UI framework, make sure you are familiar with the following concepts:

    +

    Key Concepts

    +

    Before building a native application for multiple resolutions using Tizen native UI framework, make sure you are familiar with the following concepts:

    -

    Multi-scale in the Tizen Native UI Framework

    -

    Tizen native UI framework supports multiple scaling. If the application is implemented to be scalable, it can be scaled to different device environments by simply changing the elm_scale value in the target environment without modifying the application code.

    - +

    Multi-scale in the Tizen Native UI Framework

    +

    Tizen native UI framework supports multiple scaling. If the application is implemented to be scalable, it can be scaled to different device environments by simply changing the elm_scale value in the target environment without modifying the application code.

    +

    Scale 1.0 in the Tizen native UI framework means that the application is displayed in a set size and is not scaled. Scale 1.0 is used in a display environment, such as a desktop. In the desktop environment, the monitor has a resolution between 1280 x 800 and 1920 x 1080, with a size between 20 and 27 inch, and the DPI between 80 and 100.

    - -

    If an application is scaled up or down after implementing it in a desktop environment, it can be used in another device without modifying the code. Each device has a proper scale value for adjusting the application size. Edje, which handles layout and themes in the Tizen native UI framework, gets the size of an object by multiplying the application-specified size with the device-specific scale value.

    - + +

    If an application is scaled up or down after implementing it in a desktop environment, it can be used in another device without modifying the code. Each device has a proper scale value for adjusting the application size. Edje, which handles layout and themes in the Tizen native UI framework, gets the size of an object by multiplying the application-specified size with the device-specific scale value.

    +

    The following figure illustrates a 50 px wide object in a 1280 px wide monitor. If the same object is displayed without scaling in a mobile environment, it looks very small. To show the object in the mobile environment with a similar size as in the monitor, a device-specific scale value of 2.0 is used, resulting in the object size of 100 px instead of 50 px.

    - -

    Figure: Scaling from desktop to mobile

    -

    Scaling from desktop to mobile

    - -

    Base Scale

    + +

    Figure: Scaling from desktop to mobile

    +

    Scaling from desktop to mobile

    + +

    Base Scale

    The object is multiplied by the scale specified in the system to show the application in a proper size in other devices. The scaling must be based on the scale 1.0, or the scale that the application is based on, which must then be defined in the EDC and C files. This predefined scale is called the base scale.

    - +

    The size of the scalable object is multiplied with the device scale value, as illustrated in the following figure. If the scalable object has a size of 10 in the base scale 1.0, it is created with that same size 10 in a device with the scale 1.0. In a device with the scale 2.0, the object size is 20; and in a device with the scale 4.0, the object size is 40.

    - -

    Figure: Base scale

    -

    Base scale

    - + +

    Figure: Base scale

    +

    Base scale

    +

    The middle object in the above figure has a base scale 2.0. To calculate the size of the scalable object in a device when the base scale is something other than 1.0, use the following formula:

    - + 
     scale = device_scale (information in the target device) / base_scale (information in the application)
    - +

    For example, to calculate the size of the scalable object in a device with the scale 4.0 when the base scale in the application is 2.0:

    4.0 / 2.0 = 2.0

    -

    Basically, if the object size is 20 with the base scale 2.0, the object size in a device with the scale 4.0 must be 20 * 2.0 = 40.

    - -

    Applying the Base Scale

    -

    To create an application that supports multiple screen sizes, you must learn how to set the base scale in:

    - - +

    Basically, if the object size is 20 with the base scale 2.0, the object size in a device with the scale 4.0 must be 20 * 2.0 = 40.

    + +

    Applying the Base Scale

    +

    To create an application that supports multiple screen sizes, you must learn how to set the base scale in:

    + +

    Calculating the Base Scale

    To get the base scale value of your own display, you must know the DPI of the display. Based on the display DPI, you can calculate the base scale, since it is proportional to the display DPI with the following formula:

    @@ -122,7 +122,7 @@ base_scale = (DPI / 90) * profile_factor Mobile - normal screen (4.5 inch and upwards) 0.8 - + Desktop @@ -137,25 +137,25 @@ base_scale = (DPI / 90) * profile_factor

    If the application is made in the environment using DPI of 233 and mobile profile, its base scale must be set to 1.8. For a desktop, the DPI is 90, resulting in a base scale of 1.0.

    - -

    Setting the Base Scale in the EDC File

    + +

    Setting the Base Scale in the EDC File

    The application must specify its base scale.

    -

    The EDJE objects are scaled properly, if the base scale is set in the collections block of the EDC file and the object is set as scalable with the scale property:

    - +

    The EDJE objects are scaled properly, if the base scale is set in the collections block of the EDC file and the object is set as scalable with the scale property:

    + 
     collections
 {
-   base_scale: 1.8; /* For WVGA applications */
-   parts
-   {
-      part
-      {
-         name: "box";
-         type: RECT;
-         min: 100 100;
-         scale: 1;
-      }
-   }
+   base_scale: 1.8; /* For WVGA applications */
+   parts
+   {
+      part
+      {
+         name: "box";
+         type: RECT;
+         min: 100 100;
+         scale: 1;
+      }
+   }
 }
    @@ -164,40 +164,40 @@ collections The base scale for the WVGA resolution is 1.8 and for the HD resolution 2.4.
    -

    Setting the Base Scale in the C Code

    +

    Setting the Base Scale in the C Code

    The object size must be specified in the EDC file. However, sometimes it is better to set the object size in a C file.

    -

    If the size is defined in the C file with no scaling, the object is displayed in the same size even if the scale changes. To avoid this, use the ELM_SCALE_SIZE macro:

    +

    If the size is defined in the C file with no scaling, the object is displayed in the same size even if the scale changes. To avoid this, use the ELM_SCALE_SIZE macro:

     #define ELM_SCALE_SIZE(x) x / elm_app_base_scale_get() * elm_config_scale_get()

    In the above definition, the size (x) is first changed to a size based on 1.0 (x/elm_app_base_scale_get()) and then multiplied with the scale of the current target (elm_config_scale_get()).

    - -

    To use the ELM_SCALE_SIZE macro in your application:

    + +

    To use the ELM_SCALE_SIZE macro in your application:

    1. Set the application base scale using the elm_app_base_scale_set() function: - + 
       int
 app_create(void *data)
 {
-    elm_app_base_scale_set(1.8); /* This value is for WVGA application */
+    elm_app_base_scale_set(1.8); /* This value is for WVGA application */
 }
-
      +
      2. -
    2. Define the object size in the application using the ELM_SCALE_SIZE macro: +
    3. Define the object size in the application using the ELM_SCALE_SIZE macro: 
       evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100));
 evas_object_resize(object, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50));
      -

      You can use the ELM_SCALE_SIZE macro in all functions related to setting objects sizes in Tizen native applications.

      +

      You can use the ELM_SCALE_SIZE macro in all functions related to setting objects sizes in Tizen native applications.

      4. -
    - -

    Scaling without the Base Scale

    + + +

    Scaling without the Base Scale

    In Tizen, each device has a scale value in proportion to the display. If scaling is enabled, the objects are drawn on the display by multiplying the user-defined object size with the device scale. If the base scale is set, the objects are drawn by dividing the user-defined object size by the base scale and multiplying it with the device scale.

    @@ -226,29 +226,29 @@ real_physical_pixel = (a_pixel_before_scaling) x (DPI / 90) x 0.7 DPI 129 233 - 294 + 294 A pixel before scaling 100 100 - 100 + 100 Real physical pixel 100 180 - 260 + 260 Actual base scale 1.0 1.8 - 2.6 - + 2.6 + - +
    diff --git a/org.tizen.guides/html/native/ui/efl/multipoint_touch_n.htm b/org.tizen.guides/html/native/ui/efl/multipoint_touch_n.htm index 4a2cf52..3873dd5 100644 --- a/org.tizen.guides/html/native/ui/efl/multipoint_touch_n.htm +++ b/org.tizen.guides/html/native/ui/efl/multipoint_touch_n.htm @@ -5,17 +5,17 @@ - + - Tracking Multi-point Touch Events + Tracking Multi-point Touch Events - + -
    +

    Tracking Multi-point Touch Events

    - +

    This topic demonstrates how you can use Evas objects to paint on a canvas and track touch events.

    In the following example, you create a fully functional application that is able to track multiple simultaneous clicks. For every click, a black rectangle is drawn on the screen. This way it is easy to test the multi-point touch operation with the application.

    @@ -59,19 +59,19 @@

    In the multitouch.c file, define the appdata structure that includes the Evas_Object pointers for various UI components, a list, and a Boolean flag:

     struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *nf;
-    Evas_Object *button;
-    Evas_Object *box;
-    Evas_Object *rect;
-    Evas_Object *label;
-
-    /* List of mouse spots */
-    Eina_List *spots;
-
-    /* Flag for checking the mouse down event */
-    Eina_Bool down;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *nf;
+    Evas_Object *button;
+    Evas_Object *box;
+    Evas_Object *rect;
+    Evas_Object *label;
+
+    /* List of mouse spots */
+    Eina_List *spots;
+
+    /* Flag for checking the mouse down event */
+    Eina_Bool down;
 };
 typedef struct appdata appdata_s;
    @@ -82,43 +82,43 @@ typedef struct appdata appdata_s; int main(int argc, char *argv[]) { -    appdata_s *ad = {0,}; -    int ret = 0; - -    ui_app_lifecycle_callback_s event_callback = {0,}; -    app_event_handler_h handlers[5] = {NULL,}; - -    event_callback.create = app_create; -    event_callback.terminate = app_terminate; -    event_callback.pause = app_pause; -    event_callback.resume = app_resume; -    event_callback.app_control = app_control; - -    ui_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY, -                             ui_app_low_battery, &ad); -    ui_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY, -                             ui_app_low_memory, &ad); -    ui_app_add_event_handler(&handlers[APP_EVENT_DEVICE_ORIENTATION_CHANGED], -                             APP_EVENT_DEVICE_ORIENTATION_CHANGED, -                             ui_app_orient_changed, &ad); -    ui_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], -                             APP_EVENT_LANGUAGE_CHANGED, -                             ui_app_lang_changed, &ad); -    ui_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], -                             APP_EVENT_REGION_FORMAT_CHANGED, -                             ui_app_region_changed, &ad); -    ui_app_remove_event_handler(handlers[APP_EVENT_LOW_MEMORY]); - -    ret = ui_app_main(argc, argv, &event_callback, &ad); - -    return ret; + appdata_s *ad = {0,}; + int ret = 0; + + ui_app_lifecycle_callback_s event_callback = {0,}; + app_event_handler_h handlers[5] = {NULL,}; + + event_callback.create = app_create; + event_callback.terminate = app_terminate; + event_callback.pause = app_pause; + event_callback.resume = app_resume; + event_callback.app_control = app_control; + + ui_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY, + ui_app_low_battery, &ad); + ui_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY, + ui_app_low_memory, &ad); + ui_app_add_event_handler(&handlers[APP_EVENT_DEVICE_ORIENTATION_CHANGED], + APP_EVENT_DEVICE_ORIENTATION_CHANGED, + ui_app_orient_changed, &ad); + ui_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], + APP_EVENT_LANGUAGE_CHANGED, + ui_app_lang_changed, &ad); + ui_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], + APP_EVENT_REGION_FORMAT_CHANGED, + ui_app_region_changed, &ad); + ui_app_remove_event_handler(handlers[APP_EVENT_LOW_MEMORY]); + + ret = ui_app_main(argc, argv, &event_callback, &ad); + + return ret; }

    The following figure illustrates the example application screen.

    -

    Figure: Multi-point touch screen

    -

    Multi-point touch screen

    +

    Figure: Multi-point touch screen

    +

    Multi-point touch screen

    @@ -127,30 +127,30 @@ main(int argc, char *argv[])

    To handle the canvas:

    1. -

      In the create_base_gui() function, create the base UI elements, including the naviframe and button. The naviframe includes each view screen as an item, and the item in turn includes a title, a button which clears the spots when clicked, and the actual content (in this case, a box component).

      +

      In the create_base_gui() function, create the base UI elements, including the naviframe and button. The naviframe includes each view screen as an item, and the item in turn includes a title, a button which clears the spots when clicked, and the actual content (in this case, a box component).

       static void
 create_base_gui(appdata_s *ad)
 {
-    Elm_Object_Item *nf_it;
-
-    /* Naviframe */
-    ad->nf = elm_naviframe_add(ad->conform);
-    elm_object_content_set(ad->conform, ad->nf);
-    evas_object_show(ad->nf);
-
-    /* Button */
-    ad->button = elm_button_add(ad->nf);
-    elm_object_text_set(ad->button, "Clear");
-    evas_object_smart_callback_add(ad->button, "clicked", button_clicked_cb, ad);
-
-    /* Create main view */
-    ad->box = create_main_view(ad);
-    nf_it = elm_naviframe_item_push(ad->nf, "Multi-point Touch",
-                                    NULL, NULL, ad->box, NULL);
-    elm_object_item_part_content_set(nf_it, "title_right_btn", ad->button);
-} 
+    Elm_Object_Item *nf_it;
+
+    /* Naviframe */
+    ad->nf = elm_naviframe_add(ad->conform);
+    elm_object_content_set(ad->conform, ad->nf);
+    evas_object_show(ad->nf);
+
+    /* Button */
+    ad->button = elm_button_add(ad->nf);
+    elm_object_text_set(ad->button, "Clear");
+    evas_object_smart_callback_add(ad->button, "clicked", button_clicked_cb, ad);
+
+    /* Create main view */
+    ad->box = create_main_view(ad);
+    nf_it = elm_naviframe_item_push(ad->nf, "Multi-point Touch",
+                                    NULL, NULL, ad->box, NULL);
+    elm_object_item_part_content_set(nf_it, "title_right_btn", ad->button);
+}
    2. @@ -162,32 +162,32 @@ create_base_gui(appdata_s *ad) static Evas_Object* create_main_view(appdata_s *ad) { -    Evas_Object *box; - -    /* Box */ -    box = elm_box_add(ad->nf); -    evas_object_size_hint_weight_set(box, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_show(box); - -    /* Label */ -    ad->label = elm_label_add(box); -    elm_object_text_set(ad->label, "None"); -    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, 0); -    evas_object_size_hint_align_set(ad->label, EVAS_HINT_FILL, EVAS_HINT_FILL); -    evas_object_repeat_events_set(ad->label, EINA_TRUE); -    elm_box_pack_end(box, ad->label); -    evas_object_show(ad->label); - -    /* Event Rect */ -    ad->rect = evas_object_rectangle_add(evas_object_evas_get(box)); -    evas_object_size_hint_weight_set(ad->rect, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_size_hint_align_set(ad->rect, EVAS_HINT_FILL, EVAS_HINT_FILL); -    evas_object_color_set(ad->rect, 204, 204, 204, 255); -    evas_object_repeat_events_set(ad->rect, EINA_TRUE); -    elm_box_pack_end(box, ad->rect); -    evas_object_show(ad->rect); - -    return box; + Evas_Object *box; + + /* Box */ + box = elm_box_add(ad->nf); + evas_object_size_hint_weight_set(box, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_show(box); + + /* Label */ + ad->label = elm_label_add(box); + elm_object_text_set(ad->label, "None"); + evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, 0); + evas_object_size_hint_align_set(ad->label, EVAS_HINT_FILL, EVAS_HINT_FILL); + evas_object_repeat_events_set(ad->label, EINA_TRUE); + elm_box_pack_end(box, ad->label); + evas_object_show(ad->label); + + /* Event Rect */ + ad->rect = evas_object_rectangle_add(evas_object_evas_get(box)); + evas_object_size_hint_weight_set(ad->rect, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_size_hint_align_set(ad->rect, EVAS_HINT_FILL, EVAS_HINT_FILL); + evas_object_color_set(ad->rect, 204, 204, 204, 255); + evas_object_repeat_events_set(ad->rect, EINA_TRUE); + elm_box_pack_end(box, ad->rect); + evas_object_show(ad->rect); + + return box; }
      3. @@ -198,14 +198,14 @@ create_main_view(appdata_s *ad) Evas_Object* create_spot(Evas_Object *parent, Evas_Coord x, Evas_Coord y, int size) { -    Evas_Object *spot; -    spot = evas_object_rectangle_add(evas_object_evas_get(parent)); -    evas_object_resize(spot, size, size); -    /* Adjust X and Y positions to be the object center */ -    evas_object_move(spot, x - (size/2), y - (size/2)); -    evas_object_show(spot); - -    return spot; + Evas_Object *spot; + spot = evas_object_rectangle_add(evas_object_evas_get(parent)); + evas_object_resize(spot, size, size); + /* Adjust X and Y positions to be the object center */ + evas_object_move(spot, x - (size/2), y - (size/2)); + evas_object_show(spot); + + return spot; } @@ -217,16 +217,16 @@ create_spot(Evas_Object *parent, Evas_Coord x, Evas_Coord y, int size) static void button_clicked_cb(void *data, Evas *evas, Evas_Object *object, void *event_info) { -    appdata_s *ad = data; -    Evas_Object *spot; - -    /* Remove the objects from the list */ -    EINA_LIST_FREE(ad->spots, spot) { -        evas_object_del(spot); -        spot = NULL; -    } -    /* Update the label text */ -    elm_object_text_set(ad->label, "Clear"); + appdata_s *ad = data; + Evas_Object *spot; + + /* Remove the objects from the list */ + EINA_LIST_FREE(ad->spots, spot) { + evas_object_del(spot); + spot = NULL; + } + /* Update the label text */ + elm_object_text_set(ad->label, "Clear"); } @@ -244,47 +244,47 @@ button_clicked_cb(void *data, Evas *evas, Evas_Object *object, void *event_info) static void mousemove_cb(void *data, Evas *evas, Evas_Object *obj, void *event_info) { -    appdata_s *ad = data; -    Evas_Object *spot; -    char buf[1024]; -    Evas_Event_Mouse_Move *ev = event_info; -    /* Retrieve the coordinates */ -    Evas_Coord x = ev->cur.canvas.x; -    Evas_Coord y = ev->cur.canvas.y; -    int size = (int) 5 * elm_config_scale_get(); - -    if (!ad->down) -        return; - -    /* Update the label text */ -    snprintf(buf, sizeof(buf), "Mouse Move, %d, %d", x, y); -    elm_object_text_set(ad->label, buf); - -    /* Draw the spot rectangle */ -    spot = create_spot(ad->rect, x, y, size); -    evas_object_color_set(spot, 0, 0, 0, 255); -    /* Store the rectangle to the list */ -    ad->spots= eina_list_append(ad->spots, spot); + appdata_s *ad = data; + Evas_Object *spot; + char buf[1024]; + Evas_Event_Mouse_Move *ev = event_info; + /* Retrieve the coordinates */ + Evas_Coord x = ev->cur.canvas.x; + Evas_Coord y = ev->cur.canvas.y; + int size = (int) 5 * elm_config_scale_get(); + + if (!ad->down) + return; + + /* Update the label text */ + snprintf(buf, sizeof(buf), "Mouse Move, %d, %d", x, y); + elm_object_text_set(ad->label, buf); + + /* Draw the spot rectangle */ + spot = create_spot(ad->rect, x, y, size); + evas_object_color_set(spot, 0, 0, 0, 255); + /* Store the rectangle to the list */ + ad->spots= eina_list_append(ad->spots, spot); } static void create_main_view(appdata_s *ad) { -    Evas_Object *box; + Evas_Object *box; -    /* Create the box */ -    box = elm_box_add(ad->nf); -    evas_object_size_hint_weight_set(box, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_show(box); + /* Create the box */ + box = elm_box_add(ad->nf); + evas_object_size_hint_weight_set(box, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_show(box); -    /* Add the callback */ -    evas_object_event_callback_add(box, EVAS_CALLBACK_MOUSE_MOVE, mousemove_cb, ad); + /* Add the callback */ + evas_object_event_callback_add(box, EVAS_CALLBACK_MOUSE_MOVE, mousemove_cb, ad); }
      Note - The event types for a touch event contain the "MOUSE" keyword due to backward compatibility with Tizen 2.3. Before the multi-point touch concept was introduced, there was no difference between a single touch event and a mouse event. As a result, the single touch event used the EVAS_CALLBACK_MOUSE_DOWN/UP/MOVE event types. + The event types for a touch event contain the "MOUSE" keyword due to backward compatibility with Tizen 2.3. Before the multi-point touch concept was introduced, there was no difference between a single touch event and a mouse event. As a result, the single touch event used the EVAS_CALLBACK_MOUSE_DOWN/UP/MOVE event types.

      The following touch event types are supported:

      @@ -306,7 +306,7 @@ create_main_view(appdata_s *ad) +
    + - Programming Principles of EFL + Programming Principles of EFL @@ -38,7 +38,7 @@
  • EFL API References for Wearable Native
    • - +
    @@ -58,7 +58,7 @@ Evas_Object* btn; Evas_Object* rect; Evas_Object* img; -win = elm_win_util_standard_add("test", "test"); +win = elm_win_util_standard_add("test", "test"); btn = elm_button_add(parent); rect = evas_object_rectangle_add(evas); img = evas_object_image_add(evas); @@ -94,19 +94,19 @@ evas_object_show(check);
    • Evas treats its objects equally, so it offers a function set that applies to any Evas object, whichever type that may have. These functions manipulate generic Evas objects:
        -
      • evas_object_show()
        • -
      • evas_object_hide()
        • +
      • evas_object_show()
        • +
      • evas_object_hide()
      • evas_object_del()
      • evas_object_geometry_get()
      - +

      For more information, see the Generic Object Functions API (in mobile and wearable applications).

    • Some function usage is limited to a certain object type. The following functions can only be used for the objects generated by the evas_object_image_add() function:
        -
      • evas_object_image_file_set()
        • +
      • evas_object_image_file_set()
      • evas_object_image_size_get()
      • evas_object_image_preload()
      @@ -116,9 +116,9 @@ evas_object_show(check);

      The Elementary UI components inherit a lot of their code from the container UI components and the layout component (a container component that takes a standard Edje design file and wraps it very thinly). You can use the container and layout functions on the Elementary UI components, as well as the Elementary object functions, such as:

        -
      • elm_object_part_content_set()
        • -
      • elm_object_part_content_get()
        • -
      • elm_object_part_content_unset()
        • +
      • elm_object_part_content_set()
        • +
      • elm_object_part_content_get()
        • +
      • elm_object_part_content_unset()

      For more information, see the General API (in mobile and wearable applications).

      @@ -127,7 +127,7 @@ evas_object_show(check);
    • A single UI component has its individual API as well. The following functions can only be used for the objects generated by elm_entry_add() function:
        -
      • elm_entry_file_set()
        • +
      • elm_entry_file_set()
      • elm_entry_bounce_set()
      • elm_entry_utf8_to_markup()
      @@ -138,7 +138,7 @@ evas_object_show(check);
    • In case of the elm_scroller, it is a UI component and an implementation of a scrollable interface at the same time. The following functions can be used for all UI components, which implement a scrollable interface, such as elm_entry and elm_genlist:
        -
      • elm_scroller_region_show()
        • +
      • elm_scroller_region_show()
      • elm_scroller_region_bring_in()
      • elm_scroller_gravity_set()
      @@ -146,7 +146,7 @@ evas_object_show(check);

      For more information, see the Scroller API (in mobile and wearable applications).

    - +
    diff --git a/org.tizen.guides/html/native/ui/efl/resource_fallback_n.htm b/org.tizen.guides/html/native/ui/efl/resource_fallback_n.htm index db40dec..f14fcfd 100644 --- a/org.tizen.guides/html/native/ui/efl/resource_fallback_n.htm +++ b/org.tizen.guides/html/native/ui/efl/resource_fallback_n.htm @@ -5,20 +5,20 @@ - + - Resource Fallback Support - + Resource Fallback Support + - +

    Mobile native Wearable native

    - +

    Dependencies

    -
    +
    -

    Resource Fallback Support

    - +

    Resource Fallback Support

    +

    Tizen native applications can run on different types of devices, such as wearable, phone, tablet, and TV. Tizen also supports various resolutions (WVGA ~ XQXGA) and resources. To take advantage of these features, you can handle resources in the Resource Manager view in the Tizen Studio.

    In addition to the possibilities provided by the Resource Manager view, you can use Edje to provide sets of alternative images in your application.

    -

    The image set elements are used to display a specific image on the screen based on the container size. The image set is used to control the resource quality when the image part is scaled to multiple devices. According to the size of the part's container, an appropriate image is loaded.

    +

    The image set elements are used to display a specific image on the screen based on the container size. The image set is used to control the resource quality when the image part is scaled to multiple devices. According to the size of the part's container, an appropriate image is loaded.

    The image sets can have the following properties:

    • image: image-name @@ -63,93 +63,93 @@ 
       collections
 {
-   group
-   {
-      name: "property_test";
-
-      images
-      {
-         set
-         {
-            name: "alternative_animal";
-            image
-            {
-               image: "pig.png" COMP;
-               size: 640 800 1200 1500;
-            }
-            image
-            {
-               image: "monkey.png" COMP;
-               size: 400 500 639 799;
-            }
-            image
-            {
-               image: "cat.png" COMP;
-               size: 240 300 399 499;
-            }
-            image
-            {
-               image: "mouse.png" COMP;
-               size: 80 100 239 299;
-            }
-            image
-            {
-               image: "snail.png" COMP;
-               size: 0 0 79 99;
-            }
-         }
-      }
-
-      parts
-      {
-         part
-         {
-            name: "image1";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.0;}
-               rel2 {relative: 1.0 0.45;}
-               image.normal: "alternative_animal";
-               aspect: 4/5 4/5;
-               aspect_preference: BOTH;
-            }
-         }
-         part
-         {
-            name: "image2";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.5;}
-               rel2 {relative: 1.0 0.75;}
-               image.normal: "alternative_animal";
-               aspect: 4/5 4/5;
-               aspect_preference: BOTH;
-            }
-         }
-         part
-         {
-            name: "image3";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.8;}
-               rel2 {relative: 1.0 1.0;}
-               image.normal: "alternative_animal";
-               aspect: 4/5 4/5;
-               aspect_preference: BOTH;
-            }
-         }
-      }
-   }
-}	 
+   group
+   {
+      name: "property_test";
+
+      images
+      {
+         set
+         {
+            name: "alternative_animal";
+            image
+            {
+               image: "pig.png" COMP;
+               size: 640 800 1200 1500;
+            }
+            image
+            {
+               image: "monkey.png" COMP;
+               size: 400 500 639 799;
+            }
+            image
+            {
+               image: "cat.png" COMP;
+               size: 240 300 399 499;
+            }
+            image
+            {
+               image: "mouse.png" COMP;
+               size: 80 100 239 299;
+            }
+            image
+            {
+               image: "snail.png" COMP;
+               size: 0 0 79 99;
+            }
+         }
+      }
+
+      parts
+      {
+         part
+         {
+            name: "image1";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.0;}
+               rel2 {relative: 1.0 0.45;}
+               image.normal: "alternative_animal";
+               aspect: 4/5 4/5;
+               aspect_preference: BOTH;
+            }
+         }
+         part
+         {
+            name: "image2";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.5;}
+               rel2 {relative: 1.0 0.75;}
+               image.normal: "alternative_animal";
+               aspect: 4/5 4/5;
+               aspect_preference: BOTH;
+            }
+         }
+         part
+         {
+            name: "image3";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.8;}
+               rel2 {relative: 1.0 1.0;}
+               image.normal: "alternative_animal";
+               aspect: 4/5 4/5;
+               aspect_preference: BOTH;
+            }
+         }
+      }
+   }
+}

      Image set

      - +
    diff --git a/org.tizen.guides/html/native/ui/efl/rotary_events_wn.htm b/org.tizen.guides/html/native/ui/efl/rotary_events_wn.htm index 37f1f99..9314f38 100644 --- a/org.tizen.guides/html/native/ui/efl/rotary_events_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/rotary_events_wn.htm @@ -5,20 +5,20 @@ - + - Managing Rotary Events - + Managing Rotary Events + - +

    Wearable native

    - +

    Dependencies

      @@ -32,10 +32,10 @@

    Related Info

    -
    +

    Managing Rotary Events

    @@ -50,20 +50,20 @@
  • Rotary event handler
  • Rotary object event callback
    • - +

    Rotary Event Handler

    Use the rotary event handler when you do not want to take care of an Evas object, or when the application is not implemented using an Evas object.

    The handler is implemented like the Ecore event in EFL:

    1. Register the handler with the eext_rotary_event_handler_add() function and define the handler function.
    2. When no longer needed, remove the handler with the eext_rotary_event_handler_del() function.
    -

    The rotary event handlers are treated "first come first served". This means that the first registered handler is called first when a rotary event occurs. If that handler returns EINA_TRUE, the next handler is called. The loop continues until a handler returns EINA_FALSE or all handlers have been called.

    +

    The rotary event handlers are treated "first come first served". This means that the first registered handler is called first when a rotary event occurs. If that handler returns EINA_TRUE, the next handler is called. The loop continues until a handler returns EINA_FALSE or all handlers have been called.

    Rotary Object Event Callback

    -

    Use the rotary object event callback when you want the EFL Extension API to handle the event delivery between objects. This means that EFL Extension manages callback and object lists, and decides which object's callback must be called when a rotary event occurs.

    +

    Use the rotary object event callback when you want the EFL Extension API to handle the event delivery between objects. This means that EFL Extension manages callback and object lists, and decides which object's callback must be called when a rotary event occurs.

    The callback is implemented as follows:

    @@ -94,36 +94,36 @@ static void create_base_gui(appdata_s *ad) { -    Evas_Object *win = NULL; + Evas_Object *win = NULL; -    /* Create the window */ -    win = elm_win_util_standard_add(NULL, "extension circle sample"); -    elm_win_autodel_set(win, EINA_TRUE); -    evas_object_smart_callback_add(win, "delete,request", -                                   win_delete_request_cb, NULL); + /* Create the window */ + win = elm_win_util_standard_add(NULL, "extension circle sample"); + elm_win_autodel_set(win, EINA_TRUE); + evas_object_smart_callback_add(win, "delete,request", + win_delete_request_cb, NULL); -    /* Register the handler */ -    eext_rotary_event_handler_add(_rotary_handler_cb, NULL); + /* Register the handler */ + eext_rotary_event_handler_add(_rotary_handler_cb, NULL); -    /* Show the window after the base GUI is set up */ -    evas_object_show(win); + /* Show the window after the base GUI is set up */ + evas_object_show(win); }
  • Define the handler function: 
    -Eina_Bool 
+Eina_Bool
 _rotary_handler_cb(void *data, Eext_Rotary_Event_Info *ev)
 {
-    if (ev->direction == EEXT_ROTARY_DIRECTION_CLOCKWISE) {
-        dlog_print(DLOG_DEBUG, LOG_TAG,
-                   "Rotary device rotated in clockwise direction");
-    } else {
-        dlog_print(DLOG_DEBUG, LOG_TAG,
-                   "Rotary device rotated in counter-clockwise direction");
-    }
-
-    return EINA_FALSE;
+    if (ev->direction == EEXT_ROTARY_DIRECTION_CLOCKWISE) {
+        dlog_print(DLOG_DEBUG, LOG_TAG,
+                   "Rotary device rotated in clockwise direction");
+    } else {
+        dlog_print(DLOG_DEBUG, LOG_TAG,
+                   "Rotary device rotated in counter-clockwise direction");
+    }
+
+    return EINA_FALSE;
 }
    • @@ -133,16 +133,16 @@ _rotary_handler_cb(void *data, Eext_Rotary_Event_Info *ev) static void app_terminate(void *data) { -    /* Release all resources */ + /* Release all resources */ -    /* Remove the handler */ -    eext_rotary_event_handler_del(_rotary_handler_cb); + /* Remove the handler */ + eext_rotary_event_handler_del(_rotary_handler_cb); } -
  • Implement a rotary event callback for a normal Evas object. +
  • Implement a rotary event callback for a normal Evas object.

    In the following example, a rotary event causes the slider value to be adjusted accordingly.

    1. Create the application window and add a slider component to the window: @@ -150,32 +150,32 @@ app_terminate(void *data) static void create_base_gui(appdata_s *ad) { -    Evas_Object *win = NULL, *slider = NULL; - -    /* Window */ -    win = elm_win_util_standard_add(NULL, "extension sample"); -    elm_win_autodel_set(win, EINA_TRUE); -    evas_object_smart_callback_add(win, "delete,request", -                                   win_delete_request_cb, NULL); - -    /* Slider */ -    slider = elm_slider_add(win); -    evas_object_size_hint_weight_set(slider, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_slider_min_max_set(slider, 0, 50); -    elm_slider_step_set(slider, 1.0); -    evas_object_show(slider); -    elm_win_resize_object_add(win, slider); + Evas_Object *win = NULL, *slider = NULL; + + /* Window */ + win = elm_win_util_standard_add(NULL, "extension sample"); + elm_win_autodel_set(win, EINA_TRUE); + evas_object_smart_callback_add(win, "delete,request", + win_delete_request_cb, NULL); + + /* Slider */ + slider = elm_slider_add(win); + evas_object_size_hint_weight_set(slider, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_slider_min_max_set(slider, 0, 50); + elm_slider_step_set(slider, 1.0); + evas_object_show(slider); + elm_win_resize_object_add(win, slider);
    2. Register a rotary event callback and set the slider as the activated object: 
      -    /* Register the callback */
-    ext_rotary_object_event_callback_add(slider, _rotary_event_cb, NULL);
-    /* Set the slider as activated */
-    eext_rotary_object_event_activated_set(slider, EINA_TRUE);
+    /* Register the callback */
+    ext_rotary_object_event_callback_add(slider, _rotary_event_cb, NULL);
+    /* Set the slider as activated */
+    eext_rotary_object_event_activated_set(slider, EINA_TRUE);
 
-    /* Show the window after the base GUI is set up */
-    evas_object_show(win);
+    /* Show the window after the base GUI is set up */
+    evas_object_show(win);
 }
      3. @@ -185,25 +185,25 @@ create_base_gui(appdata_s *ad) Eina_Bool _rotary_event_cb(void *data, Evas_Object *obj, Eext_Rotary_Event_Info *ev) { -    Evas_Object *slider = obj; -    /* Retrieve the current slider value */ -    int val = elm_slider_value_get(slider); - -    /* Increase the slider value based on a clockwise rotary event */ -    if (ev->direction == EEXT_ROTARY_DIRECTION_CLOCKWISE) { -        elm_slider_value_set(slider, val + 1); -    } else { -        /* Decrease the slider value based on a counter-clockwise rotary event */ -        elm_slider_value_set(slider, val - 1); -    } - -    return EINA_FALSE; + Evas_Object *slider = obj; + /* Retrieve the current slider value */ + int val = elm_slider_value_get(slider); + + /* Increase the slider value based on a clockwise rotary event */ + if (ev->direction == EEXT_ROTARY_DIRECTION_CLOCKWISE) { + elm_slider_value_set(slider, val + 1); + } else { + /* Decrease the slider value based on a counter-clockwise rotary event */ + elm_slider_value_set(slider, val - 1); + } + + return EINA_FALSE; }
    • -
  • Implement a rotary event callback for an EFL Extension object. +
  • Implement a rotary event callback for an EFL Extension object.

    In the following example, a rotary event causes the slider value to be adjusted accordingly.

    1. Create the application window, add a conformant to the window, and add a circle surface and slider to the conformant: @@ -211,35 +211,35 @@ _rotary_event_cb(void *data, Evas_Object *obj, Eext_Rotary_Event_Info *ev) static void create_base_gui(appdata_s *ad) { -    Evas_Object *win = NULL; -    Evas_Object *conform = NULL; -    Eext_Circle_Surface *sur = NULL; - -    /* Window */ -    win = elm_win_util_standard_add(NULL, "extension circle sample"); -    elm_win_autodel_set(win, EINA_TRUE); -    evas_object_smart_callback_add(win, "delete,request", -                                   win_delete_request_cb, NULL); - -    /* Conformant */ -    conform = elm_conformant_add(win); -    elm_win_indicator_mode_set(win, ELM_WIN_INDICATOR_SHOW); -    elm_win_indicator_opacity_set(win, ELM_WIN_INDICATOR_OPAQUE); -    evas_object_size_hint_weight_set(conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(win, conform); -    evas_object_show(conform); - -    /* Surface */ -    sur = eext_circle_surface_conformant_add(conform); - -    /* Slider */ -    slider = eext_circle_object_slider_add(conform, sur); -    eext_circle_object_value_min_max_set(slider, 0.0, 30.0); -    eext_circle_object_value_set(slider, 0.0); + Evas_Object *win = NULL; + Evas_Object *conform = NULL; + Eext_Circle_Surface *sur = NULL; + + /* Window */ + win = elm_win_util_standard_add(NULL, "extension circle sample"); + elm_win_autodel_set(win, EINA_TRUE); + evas_object_smart_callback_add(win, "delete,request", + win_delete_request_cb, NULL); + + /* Conformant */ + conform = elm_conformant_add(win); + elm_win_indicator_mode_set(win, ELM_WIN_INDICATOR_SHOW); + elm_win_indicator_opacity_set(win, ELM_WIN_INDICATOR_OPAQUE); + evas_object_size_hint_weight_set(conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(win, conform); + evas_object_show(conform); + + /* Surface */ + sur = eext_circle_surface_conformant_add(conform); + + /* Slider */ + slider = eext_circle_object_slider_add(conform, sur); + eext_circle_object_value_min_max_set(slider, 0.0, 30.0); + eext_circle_object_value_set(slider, 0.0);
    2. Set the slider as the activated object, and define the slider step. -

      The slider step defines how much a rotary event increases or decreases the slider value.

      +

      The slider step defines how much a rotary event increases or decreases the slider value.

      Note @@ -247,22 +247,22 @@ create_base_gui(appdata_s *ad) 
      -    /* Set the slider as activated */
-    /* Its value increases or decreases based on rotary events */
-    eext_rotary_object_event_activated_set(slider, EINA_TRUE);
-    /* Each rotary event increases or decreases the slider value by 1 */
-    eext_circle_object_slider_step_set(slider, 1.0);
-
-    /* Show the window after the base GUI is set up */
-    evas_object_show(win);
+    /* Set the slider as activated */
+    /* Its value increases or decreases based on rotary events */
+    eext_rotary_object_event_activated_set(slider, EINA_TRUE);
+    /* Each rotary event increases or decreases the slider value by 1 */
+    eext_circle_object_slider_step_set(slider, 1.0);
+
+    /* Show the window after the base GUI is set up */
+    evas_object_show(win);
 }
    • - - - + + +
    diff --git a/org.tizen.guides/html/native/ui/efl/scalability_n.htm b/org.tizen.guides/html/native/ui/efl/scalability_n.htm index ea8cc5c..e41c3ad 100644 --- a/org.tizen.guides/html/native/ui/efl/scalability_n.htm +++ b/org.tizen.guides/html/native/ui/efl/scalability_n.htm @@ -5,20 +5,20 @@ - + - Scalability Support - + Scalability Support + - +

    Mobile native Wearable native

    - +

    Dependencies

      @@ -26,8 +26,8 @@
    • Tizen 2.3.1 and Higher for Wearable

    Content

    -
    -
    +
    -

    Scalability Support

    +

    Scalability Support

    To ensure that your application works well in diverse devices, you must consider scalability when designing the application layout:

    -

    Key Concepts

    +

    Key Concepts

    When designing the application layout to be scalable, you must pay attention to the following key concepts:

    @@ -60,31 +60,31 @@

    In the relative position, the size is determined in proportion to the size of the referred object. For example, if an orange rectangle occupies 30% of the green rectangle, and the green rectangle is expanded, the orange rectangle is expanded accordingly. However, if the scaling value is changed and the green rectangle is not scaled, the orange rectangle remains unchanged too.

    -

    Figure: Relative position

    -

    Relative position

    - +

    Figure: Relative position

    +

    Relative position

    +

    In the fixed position, the size is determined by a value set for the object. For example, the orange rectangle set to the size of 10. If the green rectangle is expanded, the orange rectangle does not change. However, if the scaling value is, for example, doubled, the size of the orange rectangle grows to 20.

    - -

    Figure: Fixed position

    + +

    Figure: Fixed position

    Fixed position

  • Use the relative position

    If you set the object size as a percentage, the ratio remains fixed regardless of the changes in the screen size or resolution. If you want the object size changed in proportion of the window size, use the relative position.

    -

    Figure: Scaling relative position

    -

    Scaling relative position

    • +

    Figure: Scaling relative position

    +

    Scaling relative position

  • If you use the fixed size, make the object scalable

    If you use the EDC file to set up the layout, you can set the object scalable in the part block:

     parts
 {
-   part
-   {
-      name: "box";
-      type: RECT;
-      scale: 1;
-   }
+   part
+   {
+      name: "box";
+      type: RECT;
+      scale: 1;
+   }
 }
    @@ -97,13 +97,13 @@ evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100));
  • Do not fill the width or height out with a fixed size only

    If you fill the entire height out with a fixed size only and it is scaled, the end result can be larger than the screen size.

    - -

    Figure: Height filled with a fixed size

    -

    Height filled with a fixed size

    -

    If you set a partial width or height with a fixed size and leave the remaining area flexible, the layout does not expand outside the screen.

    - -

    Figure: Height with a flexible area

    +

    Figure: Height filled with a fixed size

    +

    Height filled with a fixed size

    + +

    If you set a partial width or height with a fixed size and leave the remaining area flexible, the layout does not expand outside the screen.

    + +

    Figure: Height with a flexible area

    Height with a flexible area

    • @@ -126,22 +126,22 @@ evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100));
    • Box -

      The box container makes a layout where child UI components are stacked in either horizontal or vertical direction. The box size is the sum of its child UI components' size:

      -
      • A vertical box calculates its height as the sum of its children's height and its width as the width of the widest child.
        • -
      • A horizontal box calculates its width as the sum of its children's width and its height as the height of the tallest child.
      +

      The box container makes a layout where child UI components are stacked in either horizontal or vertical direction. The box size is the sum of its child UI components' size:

      +
      • A vertical box calculates its height as the sum of its children's height and its width as the width of the widest child.
        • +
      • A horizontal box calculates its width as the sum of its children's width and its height as the height of the tallest child.
      + +

      Figure: Box layout

      +

      Box layout

      -

      Figure: Box layout

      -

      Box layout

      -

      The box-based linear layout is the best solution to ensure a minimum size for the child UI components in any device or any orientation.

    • Grid

      The grid container makes a layout where child UI components set their position and size relative to the container position and size. You can define the virtual width and height of the grid (by default: 100 x 100). You then pack the child UI components into the grid while setting their position and size based on the virtual size of the grid.

      -

      Figure: Grid layout

      -

      Grid layout

      - +

      Figure: Grid layout

      +

      Grid layout

      +

      The grid-based relative layout can always fill the full screen in any device or any orientation. However, the size of the child UI components is changed based on the screen size.

    @@ -163,11 +163,11 @@ evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100));

    The following figures shows how the different weight hints (horizontal, vertical) of a UI component affect the size allocated to it in a container.

    -

    Figure: Weight hint with 1 child UI component

    -

    Weight hint

    - -

    Figure: Weight hint across multiple child UI components

    -

    Weight hint across multiple child UI components

    +

    Figure: Weight hint with 1 child UI component

    +

    Weight hint

    + +

    Figure: Weight hint across multiple child UI components

    +

    Weight hint across multiple child UI components

    Align

    @@ -184,13 +184,13 @@ evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100));

    -1.0 (EVAS_HINT_FILL) means that the UI component fills all of the allocated area.

    -

    Figure: Alignment hint

    -

    Alignment hint

    +

    Figure: Alignment hint

    +

    Alignment hint

    Scalability Using the EDC File

    The Tizen platform provides a complex graphical design and layout library called Edje, which provides an abstraction layer between the application code and the interface. You can use Edje in your Tizen applications to create visual elements and control the application layout, look, and feel.

    -

    Internally, Edje holds a geometry state machine and a state graph that defines, for example, what is visible, where, at what size, and with what colors. These details are described to Edje using an EDC file. The file can be manually produced with the Edje_cc tool by taking a text file (.edc file) and "compiling" an output .edj file that contains the state graph information, images, and any other needed data. The Tizen Studio complies the EDJ file from the EDC file automatically when you build the application.

    +

    Internally, Edje holds a geometry state machine and a state graph that defines, for example, what is visible, where, at what size, and with what colors. These details are described to Edje using an EDC file. The file can be manually produced with the Edje_cc tool by taking a text file (.edc file) and "compiling" an output .edj file that contains the state graph information, images, and any other needed data. The Tizen Studio complies the EDJ file from the EDC file automatically when you build the application.

    While creating the EDC file, you set specific element properties to control the scalable behavior of the UI. Before creating a scalable UI using Edje, you must be familiar with various scalability properties and part types described in the following sections.

    @@ -220,12 +220,12 @@ evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100));

    The default value is 0.5 0.5.

  • rel1/rel2 -

    Specifies the position of the left-top and bottom-right corners of the part's container.

    +

    Specifies the position of the left-top and bottom-right corners of the part's container.

    • relative: X-axis Y-axis -

      Specifies the relative position of the part's container.

      +

      Specifies the relative position of the part's container.

      The default value is 0.0 0.0 for rel1.relative and 1.0 1.0 for rel2.relative.

    • to/to_x/to_y -

      Specifies that a corner must be positioned relatively to another part's container.

      +

      Specifies that a corner must be positioned relatively to another part's container.

      By default, the corners of a part are placed to cover whole interface.

    Table: Example of the EDC file part block and its properties

    @@ -240,70 +240,70 @@ evas_object_size_hint_min_set(object, ELM_SCALE_SIZE(100), ELM_SCALE_SIZE(100)); 
     collections
 {
-   group
-   {
-      name: "property_test";
-      images
-      {
-         image: "panorama.png" COMP;
-      } 
-      parts
-      {
-         /* Blue rectangle in the middle of the screen */
-         part
-         {
-            name: "rect1";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.3 0.4;}
-               rel2 {relative: 0.7 0.6;}
-               color: 0 127 255 255;
-            }
-         }
-         /* Orange rectangle at the bottom of the screen */
-         part
-         {
-            name: "rect2";
-            type: RECT;
-            /* Affected by scaling factor */
-            scale: 1;
-            description
-            {
-               state: "default" 0.0;
-               fixed: 0 1;
-               /* Height: 100 pixels (when the scaling factor is 1.0) */
-               min: 0 100;
-               rel1 {relative: 0.0 1.0;}
-               rel2 {relative: 1.0 1.0;}
-               /* Bottom-aligned */
-               align: 0.5 1.0;
-               color: 255 127 0 255;
-            }
-         }
-         /* Image above the orange rectangle */
-         part
-         {
-            name: "image";
-            /* Affected by scaling factor */
-            scale: 1;
-            description
-            {
-               state: "default" 0.0;
-               fixed: 1 1;
-               /* Image size: 720 x 180 pixels (when the scaling factor is 1.0) */
-               min: 720 180;
-               /* Y-axis is positioned relative to "rect2" part */
-               rel1 {relative: 0.5 0.0; to_y: "rect2";}
-               rel2 {relative: 0.5 0.0; to_y: "rect2";}
-               /* Bottom-aligned */
-               align: 0.5 1.0;
-               image.normal: "panorama.png";
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "property_test";
+      images
+      {
+         image: "panorama.png" COMP;
+      }
+      parts
+      {
+         /* Blue rectangle in the middle of the screen */
+         part
+         {
+            name: "rect1";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.3 0.4;}
+               rel2 {relative: 0.7 0.6;}
+               color: 0 127 255 255;
+            }
+         }
+         /* Orange rectangle at the bottom of the screen */
+         part
+         {
+            name: "rect2";
+            type: RECT;
+            /* Affected by scaling factor */
+            scale: 1;
+            description
+            {
+               state: "default" 0.0;
+               fixed: 0 1;
+               /* Height: 100 pixels (when the scaling factor is 1.0) */
+               min: 0 100;
+               rel1 {relative: 0.0 1.0;}
+               rel2 {relative: 1.0 1.0;}
+               /* Bottom-aligned */
+               align: 0.5 1.0;
+               color: 255 127 0 255;
+            }
+         }
+         /* Image above the orange rectangle */
+         part
+         {
+            name: "image";
+            /* Affected by scaling factor */
+            scale: 1;
+            description
+            {
+               state: "default" 0.0;
+               fixed: 1 1;
+               /* Image size: 720 x 180 pixels (when the scaling factor is 1.0) */
+               min: 720 180;
+               /* Y-axis is positioned relative to "rect2" part */
+               rel1 {relative: 0.5 0.0; to_y: "rect2";}
+               rel2 {relative: 0.5 0.0; to_y: "rect2";}
+               /* Bottom-aligned */
+               align: 0.5 1.0;
+               image.normal: "panorama.png";
+            }
+         }
+      }
+   }
 }
    @@ -332,32 +332,32 @@ collections 
     collections
 {
-   group
-   {
-      name: "property_test";
-
-      images
-      {
-         image: "island.png" COMP;
-      }
-      parts
-      {
-         part
-         {
-            name: "image";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.0;}
-               rel2 {relative: 1.0 1.0;}
-               image.normal: "island.png";
-               aspect: 8/5 8/5;
-               /* Keep the aspect ratio based on the part width */
-               aspect_preference: HORIZONTAL;
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "property_test";
+
+      images
+      {
+         image: "island.png" COMP;
+      }
+      parts
+      {
+         part
+         {
+            name: "image";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.0;}
+               rel2 {relative: 1.0 1.0;}
+               image.normal: "island.png";
+               aspect: 8/5 8/5;
+               /* Keep the aspect ratio based on the part width */
+               aspect_preference: HORIZONTAL;
+            }
+         }
+      }
+   }
 }
    @@ -372,7 +372,7 @@ collections
    • size: font-size

      Specifies the font size for the text. When the scale property of the part is set to 1 (on), the size is multiplied by the scaling factor.

      • - +
    • min: horizontal vertical

      Specifies a pair of boolean values that define whether the container can be reduced further than the text size. The property is used to prevent the container from chopping the text.

      When min is set horizontally or vertically, the minimum height or width of the part is decided by the text size.

      @@ -395,37 +395,37 @@ collections 
       collections
 {
-   group
-   {
-      name: "property_test";
-
-      parts
-      {
-         part
-         {
-            name: "text";
-            type: TEXT;
-            scale: 1;
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.0;}
-               rel2 {relative: 1.0 0.0;}
-               align: 0.5 0.0;
-               color: 108 108 108 255;
-               text
-               {
-                  font: "TIZEN";
-                  /* Affected by scaling factor */
-                  size: 80;
-                  /* Minimum height of the part container is decided by the text size */
-                  min: 0 1;
-                  text: "Test properties!!";
-               }
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "property_test";
+
+      parts
+      {
+         part
+         {
+            name: "text";
+            type: TEXT;
+            scale: 1;
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.0;}
+               rel2 {relative: 1.0 0.0;}
+               align: 0.5 0.0;
+               color: 108 108 108 255;
+               text
+               {
+                  font: "TIZEN";
+                  /* Affected by scaling factor */
+                  size: 80;
+                  /* Minimum height of the part container is decided by the text size */
+                  min: 0 1;
+                  text: "Test properties!!";
+               }
+            }
+         }
+      }
+   }
 }
      @@ -450,32 +450,32 @@ collections 
       collections
 {
-   group
-   {
-      name: "property_test";
-      parts
-      {
-         part
-         {
-            name: "text";
-            type: TEXT;
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.0;}
-               rel2 {relative: 1.0 0.1;}
-               color: 108 108 108 255;
-               text
-               {
-                  font: "TIZEN";
-                  /* Resize text to fill the container height */
-                  fit: 0 1;
-                  text: "Test properties!!";
-               }
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "property_test";
+      parts
+      {
+         part
+         {
+            name: "text";
+            type: TEXT;
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.0;}
+               rel2 {relative: 1.0 0.1;}
+               color: 108 108 108 255;
+               text
+               {
+                  font: "TIZEN";
+                  /* Resize text to fill the container height */
+                  fit: 0 1;
+                  text: "Test properties!!";
+               }
+            }
+         }
+      }
+   }
 }
      @@ -483,7 +483,7 @@ collections
    - +

    Image

    The image elements are used to display images on the screen.

    The image blocks in the EDC file can have the following properties related to scalability:

    @@ -507,47 +507,47 @@ collections 
     collections
 {
-   group
-   {
-      name: "property_test";
-
-      images
-      {
-         image: "00_button_01_normal.png" COMP;
-      }
-
-      parts
-      {
-         part
-         {
-            name: "image";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.6;}
-               rel2 {relative: 1.0 0.7;}
-               image.normal: "00_button_01_normal.png";
-            }
-         }
-         part
-         {
-            name: "ninepatch_image";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.8;}
-               rel2 {relative: 1.0 0.9;}
-               image
-               {
-                  normal: "00_button_01_normal.png";
-                  border: 4 4 0 0;
-                  /* Affected by scaling factor */
-                  border_scale: 1;
-               }
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "property_test";
+
+      images
+      {
+         image: "00_button_01_normal.png" COMP;
+      }
+
+      parts
+      {
+         part
+         {
+            name: "image";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.6;}
+               rel2 {relative: 1.0 0.7;}
+               image.normal: "00_button_01_normal.png";
+            }
+         }
+         part
+         {
+            name: "ninepatch_image";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.8;}
+               rel2 {relative: 1.0 0.9;}
+               image
+               {
+                  normal: "00_button_01_normal.png";
+                  border: 4 4 0 0;
+                  /* Affected by scaling factor */
+                  border_scale: 1;
+               }
+            }
+         }
+      }
+   }
 }
    @@ -557,12 +557,12 @@ collections

    • Image Set

    -

    The image set elements are used to display a specific image on the screen based on the container size. The image set is used to control resource quality when the image part is scaled to multiple devices. According to the size of the part's container, an appropriate image is loaded.

    +

    The image set elements are used to display a specific image on the screen based on the container size. The image set is used to control resource quality when the image part is scaled to multiple devices. According to the size of the part's container, an appropriate image is loaded.

    The images.set blocks in the EDC file can have the following properties related to scalability:

    • image: image-name

      Specifies the name of the image file.

      • - +
    • size: minw minh maxw maxh

      Specifies the minimum and maximum size that causes a specified image to be selected and shown.

      @@ -579,92 +579,92 @@ collections 
       collections
 {
-   group
-   {
-      name: "property_test";
-
-      images
-      {
-         set
-         {
-            name: "alternative_animal";
-            image
-            {
-               image: "pig.png" COMP;
-               size: 640 800 1200 1500;
-            }
-            image
-            {
-               image: "monkey.png" COMP;
-               size: 400 500 639 799;
-            }
-            image
-            {
-               image: "cat.png" COMP;
-               size: 240 300 399 499;
-            }
-            image
-            {
-               image: "mouse.png" COMP;
-               size: 80 100 239 299;
-            }
-            image
-            {
-               image: "snail.png" COMP;
-               size: 0 0 79 99;
-            }
-         }
-      }
-
-      parts
-      {
-         part
-         {
-            name: "image1";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.0;}
-               rel2 {relative: 1.0 0.45;}
-               image.normal: "alternative_animal";
-               aspect: 4/5 4/5;
-               aspect_preference: BOTH;
-            }
-         }
-         part
-         {
-            name: "image2";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.5;}
-               rel2 {relative: 1.0 0.75;}
-               image.normal: "alternative_animal";
-               aspect: 4/5 4/5;
-               aspect_preference: BOTH;
-            }
-         }
-         part
-         {
-            name: "image3";
-            description
-            {
-               state: "default" 0.0;
-               rel1 {relative: 0.0 0.8;}
-               rel2 {relative: 1.0 1.0;}
-               image.normal: "alternative_animal";
-               aspect: 4/5 4/5;
-               aspect_preference: BOTH;
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "property_test";
+
+      images
+      {
+         set
+         {
+            name: "alternative_animal";
+            image
+            {
+               image: "pig.png" COMP;
+               size: 640 800 1200 1500;
+            }
+            image
+            {
+               image: "monkey.png" COMP;
+               size: 400 500 639 799;
+            }
+            image
+            {
+               image: "cat.png" COMP;
+               size: 240 300 399 499;
+            }
+            image
+            {
+               image: "mouse.png" COMP;
+               size: 80 100 239 299;
+            }
+            image
+            {
+               image: "snail.png" COMP;
+               size: 0 0 79 99;
+            }
+         }
+      }
+
+      parts
+      {
+         part
+         {
+            name: "image1";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.0;}
+               rel2 {relative: 1.0 0.45;}
+               image.normal: "alternative_animal";
+               aspect: 4/5 4/5;
+               aspect_preference: BOTH;
+            }
+         }
+         part
+         {
+            name: "image2";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.5;}
+               rel2 {relative: 1.0 0.75;}
+               image.normal: "alternative_animal";
+               aspect: 4/5 4/5;
+               aspect_preference: BOTH;
+            }
+         }
+         part
+         {
+            name: "image3";
+            description
+            {
+               state: "default" 0.0;
+               rel1 {relative: 0.0 0.8;}
+               rel2 {relative: 1.0 1.0;}
+               image.normal: "alternative_animal";
+               aspect: 4/5 4/5;
+               aspect_preference: BOTH;
+            }
+         }
+      }
+   }
 }

      Image set example

      - +

    Part Types

    @@ -676,11 +676,11 @@ collections
  • When the part scale property is set to 1 (on), the scaling factor has an effect on the minimum size.
  • Fixed parts are used when the parts must keep a fixed size in any device or any orientation.
  • Flexible parts -
    • Flexible parts resize according to the container size and other fixed parts' size.
      • +
      • Flexible parts resize according to the container size and other fixed parts' size.
      • Flexible parts are used when the parts can be resized in any device or any orientation.
    -

    Figure: Fixed and flexible parts

    -

    Fixed and flexible parts

    +

    Figure: Fixed and flexible parts

    +

    Fixed and flexible parts

    Aspect Ratio

    @@ -689,15 +689,15 @@ collections

    As images are scaled in different devices, they are resized based on the container size. The images have specific properties that define the area to be shown when resized.

    For example, the following table illustrates what happens to the parts marked with yellow rectangles in the following figure, when scaling properties are applied. in the table, the red dashed rectangle illustrates the container size.

    - -

    Figure: Original image [1920x1280 (8:5)]

    -

    Original image [1920x1280 (8:5)]

    + +

    Figure: Original image [1920x1280 (8:5)]

    +

    Original image [1920x1280 (8:5)]

    Note To set the required aspect ratio, use the evas_object_size_hint_aspect_set() function or the aspect_preference property in the EDC file.
    - +

    Table: Image resizing effects with a specific aspect ratio

    @@ -719,7 +719,7 @@ collections @@ -733,11 +733,11 @@ collections - +
    VERTICAL -

    Resizing based on the container height while keeping the image aspect ratio.

    +

    Resizing based on the container height while keeping the image aspect ratio.

    Extra width goes outside the image area and is clipped.

    Scaling effect

    Scaling effect

    NONE -

    Resizing to fill the available area while keeping the image aspect ratio.

    +

    Resizing to fill the available area while keeping the image aspect ratio.

    Extra width or height goes outside the image area and is clipped.

    Scaling effect

    Scaling effect

    Setting the Image Aspect Ratio

    diff --git a/org.tizen.guides/html/native/ui/efl/threads_n.htm b/org.tizen.guides/html/native/ui/efl/threads_n.htm index 67c3971..01d9f07 100644 --- a/org.tizen.guides/html/native/ui/efl/threads_n.htm +++ b/org.tizen.guides/html/native/ui/efl/threads_n.htm @@ -5,20 +5,20 @@ - + - Using Threads - + Using Threads + - + +
    • -

    Using Threads

    +

    Using Threads

    Threads are concurrent execution environments that are lighter than full-blown processes because they share some operating system resources. Threads make it possible to do several things at the same time while using less resources and offering simpler synchronization and data exchange compared to processes.

    @@ -94,18 +94,18 @@

    The following figures illustrate the thread pool. The first figure shows the occupancy of a hypothetical thread pool. There are several tasks, of which 4 are running. The thread_max parameter of the pool is 4, and the other tasks are waiting. There is no thread with its func_end() callback currently called.

    -

    Figure: Thread pool, step 1

    -

    Thread pool, step 1

    +

    Figure: Thread pool, step 1

    +

    Thread pool, step 1

    When a task, applying the sepia filter on image1, finishes, the corresponding func_end() function is invoked from the main loop.

    -

    Figure: Thread pool, step 2

    -

    Thread pool, step 2

    +

    Figure: Thread pool, step 2

    +

    Thread pool, step 2

    With the task done, one of the threads from the pool becomes available, and another thread, adding the reverberation effect on audio3, can run in it.

    -

    Figure: Thread pool, step 3

    -

    Thread pool, step 3

    +

    Figure: Thread pool, step 3

    +

    Thread pool, step 3

    As long as there are tasks to be done, the thread pool continues the same way, running tasks in its threads whenever a thread is available.

    @@ -160,200 +160,200 @@

    Table: Locks (mutual exclusions)

    ---- ++++ - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + +
    pthreads functionEina equivalent
    pthread_mutex_new()eina_lock_new()
    pthread_mutex_destroy()eina_lock_free()
    pthread_mutex_lock()eina_lock_take()
    pthread_mutex_trylock()eina_lock_take_try()
    pthread_mutex_unlock()eina_lock_release()
    none (prints debug information on the lock)eina_lock_debug()
    pthreads functionEina equivalent
    pthread_mutex_new()eina_lock_new()
    pthread_mutex_destroy()eina_lock_free()
    pthread_mutex_lock()eina_lock_take()
    pthread_mutex_trylock()eina_lock_take_try()
    pthread_mutex_unlock()eina_lock_release()
    none (prints debug information on the lock)eina_lock_debug()

    Table: Conditions (notifications when condition objects change)

    ---- ++++ - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + +
    pthreads functionEina equivalent
    pthread_cond_init()eina_condition_new()
    pthread_cond_destroy()eina_condition_free()
    pthread_cond_wait()eina_condition_wait()
    pthread_cond_timedwait()eina_condition_timedwait()
    pthread_cond_broadcast()eina_condition_broadcast()
    pthread_cond_signal()eina_condition_signal()
    pthreads functionEina equivalent
    pthread_cond_init()eina_condition_new()
    pthread_cond_destroy()eina_condition_free()
    pthread_cond_wait()eina_condition_wait()
    pthread_cond_timedwait()eina_condition_timedwait()
    pthread_cond_broadcast()eina_condition_broadcast()
    pthread_cond_signal()eina_condition_signal()

    Table: RWLocks (Read-write locks, for multiple-readers/single-writer scenarios)

    ---- ++++ - - - - - - + + + + + + +eina_rwlock_new() - - - + + + - - + + +eina_rwlock_take_read() - - + + +eina_rwlock_take_write() - - + + +eina_rwlock_release()
    pthreads functionEina equivalent
    pthread_rwlock_init()
    pthreads functionEina equivalent
    pthread_rwlock_init() -eina_rwlock_new()
    pthread_rwlock_destroy()eina_rwlock_free()
    pthread_rwlock_destroy()eina_rwlock_free()
    pthread_rwlock_rwlock_rdlock()
    pthread_rwlock_rwlock_rdlock() -eina_rwlock_take_read()
    pthread_rwlock_rwlock_wrlock()
    pthread_rwlock_rwlock_wrlock() -eina_rwlock_take_write()
    pthread_rwlock_unlock()
    pthread_rwlock_unlock() -eina_rwlock_release()

    Table: TLS (Thread-Local Storage)

    ---- ++++ - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + +
    pthreads functionEina equivalent
    pthread_key_create()eina_tls_new()
    pthread_key_delete()eina_tls_free()
    pthread_getspecific()eina_tls_get()
    pthread_setspecificeina_tls_set()
    pthreads functionEina equivalent
    pthread_key_create()eina_tls_new()
    pthread_key_delete()eina_tls_free()
    pthread_getspecific()eina_tls_get()
    pthread_setspecificeina_tls_set()

    Table: Semaphores (access restrictions for a set of resources)

    ---- ++++ - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + +
    pthreads functionEina equivalent
    sem_init()eina_semaphore_new()
    sem_destroy()eina_semaphore_free()
    sem_wait()eina_semaphore_lock()
    sem_post()eina_semaphore_release()
    pthreads functionEina equivalent
    sem_init()eina_semaphore_new()
    sem_destroy()eina_semaphore_free()
    sem_wait()eina_semaphore_lock()
    sem_post()eina_semaphore_release()

    Table: Barriers

    ---- ++++ - - - - - - - - - - - - - - - + + + + + + + + + + + + + + +
    pthreads functionEina equivalent
    pthread_barrier_init()eina_barrier_new()
    pthread_barrier_destroy()eina_barrier_free()
    pthread_barrier_wait()eina_barrier_wait()
    pthreads functionEina equivalent
    pthread_barrier_init()eina_barrier_new()
    pthread_barrier_destroy()eina_barrier_free()
    pthread_barrier_wait()eina_barrier_wait()
    @@ -372,10 +372,10 @@ eina_rwlock_release()     static void _set_label_text(void *data, Ecore_Thread *thread __UNUSED__, void *msgdata) { -    char buf[64]; -    appdata_s *ad = data; -    snprintf(buf, sizeof(buf), "Tick %d", (int)(uintptr_t)msgdata); -    elm_object_text_set(ad->label, buf); + char buf[64]; + appdata_s *ad = data; + snprintf(buf, sizeof(buf), "Tick %d", (int)(uintptr_t)msgdata); + elm_object_text_set(ad->label, buf); } @@ -385,21 +385,21 @@ _set_label_text(void *data, Ecore_Thread *thread __UNUSED__, void *msgdata) static void _long_function(void *data __UNUSED__, Ecore_Thread *thread) { -    int iteration; -    /* -     Change the text roughly every 1 second. This is only an example; if you -     want regular animations, use Ecore animators! -    */ -    for (iteration = 0; ; iteration++) { -        /* -         Since you are running from another thread, you need to take special -         care and instead send data to the main thread and have it run the -         feedback function given when creating the thread -        */ -        ecore_thread_feedback(thread, (void*)(uintptr_t)iteration); -        /* Sleep for roughly one second */ -        sleep(1); -    } + int iteration; + /* + Change the text roughly every 1 second. This is only an example; if you + want regular animations, use Ecore animators! + */ + for (iteration = 0; ; iteration++) { + /* + Since you are running from another thread, you need to take special + care and instead send data to the main thread and have it run the + feedback function given when creating the thread + */ + ecore_thread_feedback(thread, (void*)(uintptr_t)iteration); + /* Sleep for roughly one second */ + sleep(1); + } } @@ -410,8 +410,8 @@ _long_function(void *data __UNUSED__, Ecore_Thread *thread) static void _end_func(void *data, Ecore_Thread *thread __UNUSED__) { -    appdata_s *ad = data; -    elm_object_text_set(ad->label, "Ticks over"); + appdata_s *ad = data; + elm_object_text_set(ad->label, "Ticks over"); } @@ -420,7 +420,7 @@ _end_func(void *data, Ecore_Thread *thread __UNUSED__) 
     ecore_thread_feedback_run(_long_function, _set_label_text, _end_func,
-                          NULL, ad, EINA_FALSE);
+                          NULL, ad, EINA_FALSE);
    @@ -428,24 +428,24 @@ ecore_thread_feedback_run(_long_function, _set_label_text, _end_func,

    To use the ecore_main_loop_thread_safe_call_sync() function:

      -
    1. Implement the GUI function that sets the text of a label and can be called from the main thread. The function receives data as a structure and alternatively displays "Tick d" or "Tock d". +
    2. Implement the GUI function that sets the text of a label and can be called from the main thread. The function receives data as a structure and alternatively displays "Tick d" or "Tock d". 
       struct thd {
-    appdata_s *ad;
-    Eina_Bool tick_not_tock;
-    int iteration;
+    appdata_s *ad;
+    Eina_Bool tick_not_tock;
+    int iteration;
 };
 static void*
 _set_label_text_tick_tock(void *data)
 {
-    char buf[64];
-    struct thd *thd = data;
-    snprintf(buf, sizeof(buf), "%s %d", (thd->tick_not_tock ? "Tick" : "Tock"),
-             thd->iteration);
-    elm_object_text_set(thd->ad->label, buf);
+    char buf[64];
+    struct thd *thd = data;
+    snprintf(buf, sizeof(buf), "%s %d", (thd->tick_not_tock ? "Tick" : "Tock"),
+             thd->iteration);
+    elm_object_text_set(thd->ad->label, buf);
 
-    return NULL;
+    return NULL;
 }
      3. @@ -456,17 +456,17 @@ _set_label_text_tick_tock(void *data) static void _long_function_tick_tock(void *data, Ecore_Thread *thread __UNUSED__) { -    struct thd *thd = malloc(sizeof(struct thd)); -    thd->ad = data; -    for (thd->iteration = 0; ; (thd->iteration)++) { -        thd->tick_not_tock = EINA_TRUE; -        ecore_main_loop_thread_safe_call_sync(_set_label_text_tick_tock, thd); -        sleep(1); -        thd->tick_not_tock = EINA_FALSE; -        ecore_main_loop_thread_safe_call_sync(_set_label_text_tick_tock, thd); -        sleep(1); -    } -    free(thd); + struct thd *thd = malloc(sizeof(struct thd)); + thd->ad = data; + for (thd->iteration = 0; ; (thd->iteration)++) { + thd->tick_not_tock = EINA_TRUE; + ecore_main_loop_thread_safe_call_sync(_set_label_text_tick_tock, thd); + sleep(1); + thd->tick_not_tock = EINA_FALSE; + ecore_main_loop_thread_safe_call_sync(_set_label_text_tick_tock, thd); + sleep(1); + } + free(thd); } @@ -492,7 +492,7 @@ ecore_thread_run(_long_function_tick_tock, _end_func, NULL, ad); +
    diff --git a/org.tizen.guides/html/native/ui/efl/touch_gesture_n.htm b/org.tizen.guides/html/native/ui/efl/touch_gesture_n.htm index d26ef57..ddb97e6 100644 --- a/org.tizen.guides/html/native/ui/efl/touch_gesture_n.htm +++ b/org.tizen.guides/html/native/ui/efl/touch_gesture_n.htm @@ -5,18 +5,18 @@ - + Handling Touch Gestures - + - + -
    +

    Handling Touch Gestures

    - +

    You can implement your application to recognize and react to different types of gestures provided by the EFL library.

    The elementary library provides a gesture layer for a wide range of touch gestures, such as tap, double tap, triple tap, long tap, momentum monitoring, line, flick, zoom, and rotate, which can be used by the application to build a dynamic user interface interaction which is simple and intuitive to use.

    @@ -68,8 +68,8 @@ Evas_Object *r; /* Gesture layer object */ Evas_Object *g; -win = elm_win_util_standard_add("gesture_layer", -                                "Gesture Layer"); +win = elm_win_util_standard_add("gesture_layer", + "Gesture Layer"); elm_win_autodel_set(win, EINA_TRUE); /* Gesture layer transparent object */ @@ -101,12 +101,12 @@ evas_object_show(r); 
     /* Get or set the gesture layer long tap start timeout of an object */
 void elm_gesture_layer_long_tap_start_timeout_set(Evas_Object *obj,
-                                                  double long_tap_start_timeout);
+                                                  double long_tap_start_timeout);
 double elm_gesture_layer_long_tap_start_timeout_get(const Evas_Object *obj);
 
 /* Get or set the gesture layer double tap timeout of an object */
 void elm_gesture_layer_double_tap_timeout_set(Evas_Object *obj,
-                                              double double_tap_timeout);
+                                              double double_tap_timeout);
 double elm_gesture_layer_double_tap_timeout_get(const Evas_Object *obj);
    @@ -140,11 +140,11 @@ ELM_GESTURE_STATE_ABORT /* Ongoing gesture aborted */

  • Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TAPS, ELM_GESTURE_STATE_START,
-                         n_finger_tap_start, NULL);
+                         n_finger_tap_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TAPS, ELM_GESTURE_STATE_END,
-                         n_finger_tap_end, NULL);
+                         n_finger_tap_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TAPS, ELM_GESTURE_STATE_ABORT,
-                         n_finger_tap_abort, NULL);
+                         n_finger_tap_abort, NULL);
  • @@ -154,21 +154,21 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TAPS, ELM_GESTURE_STATE_ABORT, static Evas_Event_Flags n_finger_tap_start(void *data, void *event_info) { -    Elm_Gesture_Taps_Info *p = (Elm_Gesture_Taps_Info *)event_info; -    printf("N tap started <%p> x,y=<%d,%d> count=<%d> timestamp=<%d> \n", -           event_info, p->x, p->y, p->n, p->timestamp); + Elm_Gesture_Taps_Info *p = (Elm_Gesture_Taps_Info *)event_info; + printf("N tap started <%p> x,y=<%d,%d> count=<%d> timestamp=<%d> \n", + event_info, p->x, p->y, p->n, p->timestamp); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; }

    The function returns EVAS_EVENT_FLAG_ON_HOLD, if the component acted upon the event.

    - +

    The event_info attribute contains the tap information in the _Elm_Gesture_Taps_Info data structure. If the number of fingers is bigger than 2, the x and y values get the average value of each x and y geometry values.

     struct _Elm_Gesture_Taps_Info {
-    Evas_Coord x, y; /* Center point between fingers */
-    unsigned int n; /* Number of fingers tapped */
-    unsigned int timestamp; /* Event timestamp */
+    Evas_Coord x, y; /* Center point between fingers */
+    unsigned int n; /* Number of fingers tapped */
+    unsigned int timestamp; /* Event timestamp */
 };
    • @@ -178,12 +178,12 @@ struct _Elm_Gesture_Taps_Info { static Evas_Event_Flags n_finger_tap_end(void *data, void *event_info) { -    Elm_Gesture_Taps_Info *p = (Elm_Gesture_Taps_Info *)event_info; + Elm_Gesture_Taps_Info *p = (Elm_Gesture_Taps_Info *)event_info; -    printf("N tap started <%p> x,y=<%d,%d> count=<%d> timestamp=<%d> \n", -           event_info, p->x, p->y, p->n, p->timestamp); + printf("N tap started <%p> x,y=<%d,%d> count=<%d> timestamp=<%d> \n", + event_info, p->x, p->y, p->n, p->timestamp); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -194,10 +194,10 @@ n_finger_tap_end(void *data, void *event_info) static Evas_Event_Flags n_finger_tap_abort(void *data, void *event_info) { -    Elm_Gesture_Taps_Info *p = (Elm_Gesture_Taps_Info *)event_info; -    printf("N tap abort\n"); + Elm_Gesture_Taps_Info *p = (Elm_Gesture_Taps_Info *)event_info; + printf("N tap abort\n"); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -210,13 +210,13 @@ n_finger_tap_abort(void *data, void *event_info)

    Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_N_DOUBLE_TAPS, ELM_GESTURE_STATE_START,
-                         dbl_click_start, NULL);
+                         dbl_click_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_DOUBLE_TAPS, ELM_GESTURE_STATE_MOVE,
-                         dbl_click_move, NULL);
+                         dbl_click_move, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_DOUBLE_TAPS, ELM_GESTURE_STATE_END,
-                         dbl_click_end, NULL);
+                         dbl_click_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_DOUBLE_TAPS, ELM_GESTURE_STATE_ABORT,
-                         dbl_click_abort, NULL);
+                         dbl_click_abort, NULL);

  • A double tap gesture is started by calling the dbl_click_start() callback function when a mouse down event occurs.

    @@ -238,13 +238,13 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_N_DOUBLE_TAPS, ELM_GESTURE_STATE_ABORT,

    Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TRIPLE_TAPS, ELM_GESTURE_STATE_START,
-                         triple_click_start, NULL);
+                         triple_click_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TRIPLE_TAPS, ELM_GESTURE_STATE_MOVE,
-                         triple_click_move, NULL);
+                         triple_click_move, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TRIPLE_TAPS, ELM_GESTURE_STATE_END,
-                         triple_click_end, NULL);
+                         triple_click_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TRIPLE_TAPS, ELM_GESTURE_STATE_ABORT,
-                         triple_click_abort, NULL);
+                         triple_click_abort, NULL);
  • @@ -266,13 +266,13 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_N_TRIPLE_TAPS, ELM_GESTURE_STATE_ABORT,

    Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LONG_TAPS, ELM_GESTURE_STATE_START,
-                         n_long_tap_start, NULL);
+                         n_long_tap_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LONG_TAPS, ELM_GESTURE_STATE_MOVE,
-                         n_long_tap_move, NULL);
+                         n_long_tap_move, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LONG_TAPS, ELM_GESTURE_STATE_END,
-                         n_long_tap_end, NULL);
+                         n_long_tap_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LONG_TAPS, ELM_GESTURE_STATE_ABORT,
-                         n_long_tap_abort, NULL);
+                         n_long_tap_abort, NULL);
  • @@ -301,13 +301,13 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LONG_TAPS, ELM_GESTURE_STATE_ABORT,

    Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_MOMENTUM, ELM_GESTURE_STATE_START,
-                         momentum_start, NULL);
+                         momentum_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_MOMENTUM, ELM_GESTURE_STATE_END,
-                         momentum_end, NULL);
+                         momentum_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_MOMENTUM, ELM_GESTURE_STATE_ABORT,
-                         momentum_abort, NULL);
+                         momentum_abort, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_MOMENTUM, ELM_GESTURE_STATE_MOVE,
-                         momentum_move, NULL);
+                         momentum_move, NULL);
  • @@ -316,11 +316,11 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_MOMENTUM, ELM_GESTURE_STATE_MOVE, static Evas_Event_Flags momentum_start(void *data, void *event_info) { -    Elm_Gesture_Momentum_Info *p = (Elm_Gesture_Momentum_Info *)event_info; -    printf("momentum started x1,y1=<%d,%d> tx,ty=<%u,%u> n=<%u>\n", -           p->x1, p->y1, p->tx, p->ty, p->n); + Elm_Gesture_Momentum_Info *p = (Elm_Gesture_Momentum_Info *)event_info; + printf("momentum started x1,y1=<%d,%d> tx,ty=<%u,%u> n=<%u>\n", + p->x1, p->y1, p->tx, p->ty, p->n); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -328,18 +328,18 @@ momentum_start(void *data, void *event_info) 
     /* Report line ends, timestamps, and momentum computed */
 struct _Elm_Gesture_Momentum_Info {
-    Evas_Coord x1; /* Final-swipe direction with starting point on X */
-    Evas_Coord y1; /* Final-swipe direction with starting point on Y */
-    Evas_Coord x2; /* Final-swipe direction with ending point on X */
-    Evas_Coord y2; /* Final-swipe direction with ending point on Y */
+    Evas_Coord x1; /* Final-swipe direction with starting point on X */
+    Evas_Coord y1; /* Final-swipe direction with starting point on Y */
+    Evas_Coord x2; /* Final-swipe direction with ending point on X */
+    Evas_Coord y2; /* Final-swipe direction with ending point on Y */
 
-    unsigned int tx; /* Timestamp of the start of the final X swipe */
-    unsigned int ty; /* Timestamp of the start of the final Y swipe */
+    unsigned int tx; /* Timestamp of the start of the final X swipe */
+    unsigned int ty; /* Timestamp of the start of the final Y swipe */
 
-    Evas_Coord mx; /* Momentum on X */
-    Evas_Coord my; /* Momentum on Y */
+    Evas_Coord mx; /* Momentum on X */
+    Evas_Coord my; /* Momentum on Y */
 
-    unsigned int n; /* Number of fingers */
+    unsigned int n; /* Number of fingers */
 };
    @@ -352,12 +352,12 @@ struct _Elm_Gesture_Momentum_Info { static Evas_Event_Flags momentum_move(void *data, void *event_info) { -    Elm_Gesture_Momentum_Info *p = (Elm_Gesture_Momentum_Info *)event_info; -    printf("momentum move x1,y1=<%d,%d> x2,y2=<%d,%d> -            tx,ty=<%u,%u> mx=<%d> my=<%d> n=<%u>\n", -           p->x1, p->y1, p->x2, p->y2, p->tx, p->ty, p->mx, p->my, p->n); + Elm_Gesture_Momentum_Info *p = (Elm_Gesture_Momentum_Info *)event_info; + printf("momentum move x1,y1=<%d,%d> x2,y2=<%d,%d> + tx,ty=<%u,%u> mx=<%d> my=<%d> n=<%u>\n", + p->x1, p->y1, p->x2, p->y2, p->tx, p->ty, p->mx, p->my, p->n); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; }
    • @@ -367,20 +367,20 @@ momentum_move(void *data, void *event_info) static Evas_Event_Flags momentum_end(void *data, void *event_info) { -    Elm_Gesture_Momentum_Info *p = (Elm_Gesture_Momentum_Info *)event_info; -    printf("momentum ended x1,y1=<%d,%d> x2,y2=<%d,%d> -            tx,ty=<%u,%u> mx=<%d> my=<%d> n=>%u>\n", -           p->x1, p->y1, p->x2, p->y2, p->tx, p->ty, p->mx, p->my, p->n); + Elm_Gesture_Momentum_Info *p = (Elm_Gesture_Momentum_Info *)event_info; + printf("momentum ended x1,y1=<%d,%d> x2,y2=<%d,%d> + tx,ty=<%u,%u> mx=<%d> my=<%d> n=>%u>\n", + p->x1, p->y1, p->x2, p->y2, p->tx, p->ty, p->mx, p->my, p->n); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } static Evas_Event_Flags momentum_abort(void *data, void *event_info) { -    printf("momentum abort\n"); + printf("momentum abort\n"); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -401,7 +401,7 @@ int elm_gesture_layer_line_min_length_get(const Evas_Object *obj); /* Get or set the gesture layer line distance tolerance of an object */ void elm_gesture_layer_line_distance_tolerance_set(Evas_Object *obj, -                                                   Evas_Coord line_distance_tolerance); + Evas_Coord line_distance_tolerance); Evas_Coord elm_gesture_layer_line_distance_tolerance_get(const Evas_Object *obj); @@ -411,7 +411,7 @@ Evas_Coord elm_gesture_layer_line_distance_tolerance_get(const Evas_Object *obj) 
     /* Get or set the gesture layer continue mode of an object */
 void elm_gesture_layer_continues_enable_set(Evas_Object *obj,
-                                            Eina_Bool continues_enable);
+                                            Eina_Bool continues_enable);
 Eina_Bool elm_gesture_layer_continues_enable_get(const Evas_Object *obj);
    @@ -424,13 +424,13 @@ Eina_Bool elm_gesture_layer_continues_enable_get(const Evas_Object *obj);

    Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LINES, ELM_GESTURE_STATE_START,
-                         line_start, NULL);
+                         line_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LINES, ELM_GESTURE_STATE_MOVE,
-                         line_move, NULL);
+                         line_move, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LINES, ELM_GESTURE_STATE_END,
-                         line_end, NULL);
+                         line_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LINES, ELM_GESTURE_STATE_ABORT,
-                         line_abort, NULL);
+                         line_abort, NULL);
  • @@ -439,19 +439,19 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_N_LINES, ELM_GESTURE_STATE_ABORT, static Evas_Event_Flags line_start(void *data, void *event_info) { -    Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; -    printf("line started angle=<%lf> x1,y1=<%d,%d> x2,y2=<%d,%d> tx,ty=<%u,%u> n=<%u>\n", -           p->angle, p->momentum.x1, p->momentum.y1, p->momentum.x2, p->momentum.y2, -           p->momentum.tx, p->momentum.ty, p->momentum.n); + Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; + printf("line started angle=<%lf> x1,y1=<%d,%d> x2,y2=<%d,%d> tx,ty=<%u,%u> n=<%u>\n", + p->angle, p->momentum.x1, p->momentum.y1, p->momentum.x2, p->momentum.y2, + p->momentum.tx, p->momentum.ty, p->momentum.n); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; }

    The event_info attribute contains the line information in the Elm_Gesture_Line_Info data structure:

     struct _Elm_Gesture_Line_Info {
-    Elm_Gesture_Momentum_Info momentum; /* Line momentum info */
-    double angle; /* Angle (direction) of the lines */
+    Elm_Gesture_Momentum_Info momentum; /* Line momentum info */
+    double angle; /* Angle (direction) of the lines */
 };
    • @@ -462,12 +462,12 @@ struct _Elm_Gesture_Line_Info { static Evas_Event_Flags line_move(void *data, void *event_info) { -    Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; -    printf("line move angle=<%lf> x1,y1=<%d,%d> x2,y2=<%d,%d> tx,ty=<%u,%u> n=<%u>\n", -           p->angle, p->momentum.x1, p->momentum.y1, p->momentum.x2, p->momentum.y2, -           p->momentum.tx, p->momentum.ty, p->momentum.n); + Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; + printf("line move angle=<%lf> x1,y1=<%d,%d> x2,y2=<%d,%d> tx,ty=<%u,%u> n=<%u>\n", + p->angle, p->momentum.x1, p->momentum.y1, p->momentum.x2, p->momentum.y2, + p->momentum.tx, p->momentum.ty, p->momentum.n); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -477,12 +477,12 @@ line_move(void *data, void *event_info) static Evas_Event_Flags line_end(void *data, void *event_info) { -    Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; -    printf("line end angle=<%lf> x1,y1=<%d,%d> x2,y2=<%d,%d> tx,ty=<%u,%u> n=<%u>,\n", -           p->angle, p->momentum.x1, p->momentum.y1, p->momentum.x2, p->momentum.y2, -           p->momentum.tx, p->momentum.ty, p->momentum.n); + Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; + printf("line end angle=<%lf> x1,y1=<%d,%d> x2,y2=<%d,%d> tx,ty=<%u,%u> n=<%u>,\n", + p->angle, p->momentum.x1, p->momentum.y1, p->momentum.x2, p->momentum.y2, + p->momentum.tx, p->momentum.ty, p->momentum.n); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -492,10 +492,10 @@ line_end(void *data, void *event_info) static Evas_Event_Flags line_abort(void *data, void *event_info) { -    Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; -    printf("line abort\n"); + Elm_Gesture_Line_Info *p = (Elm_Gesture_Line_Info *)event_info; + printf("line abort\n"); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -508,7 +508,7 @@ line_abort(void *data, void *event_info) 
     /* Get or set the gesture layer flick time limit (in milliseconds) of an object */
 void elm_gesture_layer_flick_time_limit_ms_set(Evas_Object *obj,
-                                               unsigned int flick_time_limit_ms);
+                                               unsigned int flick_time_limit_ms);
 unsigned int elm_gesture_layer_flick_time_limit_ms_get(const Evas_Object *obj);
    @@ -520,11 +520,11 @@ unsigned int elm_gesture_layer_flick_time_limit_ms_get(const Evas_Object *obj);

    Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

     elm_gesture_layer_cb_set(g, ELM_GESTURE_N_FLICKS, ELM_GESTURE_STATE_START,
-                         flick_start, NULL);
+                         flick_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_FLICKS, ELM_GESTURE_STATE_END,
-                         flick_end, NULL);
+                         flick_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_N_FLICKS, ELM_GESTURE_STATE_ABORT,
-                         flick_abort, NULL);
+                         flick_abort, NULL);

    The flick_move() callback function works the same way as the line_move() callback.

    @@ -553,7 +553,7 @@ double elm_gesture_layer_zoom_step_get(const Evas_Object *obj); /* Get or set the gesture layer zoom distance tolerance of an object */ void elm_gesture_layer_zoom_distance_tolerance_set(Evas_Object *obj, -                                                   Evas_Coord zoom_distance_tolerance); + Evas_Coord zoom_distance_tolerance); Evas_Coord elm_gesture_layer_zoom_distance_tolerance_get(const Evas_Object *obj); /* Get or set the gesture layer zoom wheel factor of an object */ @@ -571,7 +571,7 @@ double elm_gesture_layer_zoom_finger_factor_get(const Evas_Object *obj);

    • The default zoom value is 1, when the zoom gesture starts. After every zoom gesture, the value is increased or decreased according to the internal calculation logic. The radius value is used for the calculation.

    • If the mouse wheel events are sent with the Ctrl key on the gesture layer, the zoom_start() callback function is called with the default zoom value (1) and the zoom value (zoom_finger_factor * zoom _wheel_factor) is increased or decreased on every step to follow the wheel up or down.

      • -

    • If a 2-finger down event points closer than the zoom distance tolerance value, the zoom gesture is not started. After the gap is bigger than the zoom_distance_tolerance value, the zoom gesture is started with the default value 1 and the event info gets a radius value and the gesture's momentum value.

    +

  • If a 2-finger down event points closer than the zoom distance tolerance value, the zoom gesture is not started. After the gap is bigger than the zoom_distance_tolerance value, the zoom gesture is started with the default value 1 and the event info gets a radius value and the gesture's momentum value.

    • To create a zoom gesture:

      @@ -579,13 +579,13 @@ double elm_gesture_layer_zoom_finger_factor_get(const Evas_Object *obj);

      Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

       elm_gesture_layer_cb_set(g, ELM_GESTURE_ZOOM, ELM_GESTURE_STATE_START,
-                         zoom_start, NULL);
+                         zoom_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_ZOOM, ELM_GESTURE_STATE_END,
-                         zoom_end, NULL);
+                         zoom_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_ZOOM, ELM_GESTURE_STATE_ABORT,
-                         zoom_abort, NULL);
+                         zoom_abort, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_ZOOM, ELM_GESTURE_STATE_MOVE,
-                         zoom_move, NULL);
+                         zoom_move, NULL);
    1. @@ -594,21 +594,21 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_ZOOM, ELM_GESTURE_STATE_MOVE, static Evas_Event_Flags zoom_start(void *data, void *event_info) { -    Elm_Gesture_Zoom_Info *p = (Elm_Gesture_Zoom_Info *)event_info; -    printf("zoom started <%d,%d> zoom=<%f> radius=<%d> momentum=<%f>\n", -           p->x, p->y, p->zoom, p->radius, p->momentum); + Elm_Gesture_Zoom_Info *p = (Elm_Gesture_Zoom_Info *)event_info; + printf("zoom started <%d,%d> zoom=<%f> radius=<%d> momentum=<%f>\n", + p->x, p->y, p->zoom, p->radius, p->momentum); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; }

      The event_info attribute contains the zoom information in the Elm_Gesture_Zoom_Info data structure:

       struct _Elm_Gesture_Zoom_Info {
-    Evas_Coord x, y; /* Zoom center point reported to the user */
-    Evas_Coord radius; /* Radius between fingers reported to the user */
-    double zoom; /* Zoom value: 1.0 means no zoom */
-    double momentum; /* Zoom momentum: zoom growth per second (NOT YET SUPPORTED) */
+    Evas_Coord x, y; /* Zoom center point reported to the user */
+    Evas_Coord radius; /* Radius between fingers reported to the user */
+    double zoom; /* Zoom value: 1.0 means no zoom */
+    double momentum; /* Zoom momentum: zoom growth per second (NOT YET SUPPORTED) */
 };
      @@ -626,11 +626,11 @@ struct _Elm_Gesture_Zoom_Info { static Evas_Event_Flags zoom_move(void *data, void *event_info) { -    Elm_Gesture_Zoom_Info *p = (Elm_Gesture_Zoom_Info *)event_info; -    printf("zoom move <%d,%d> zoom=<%f> radius=<%d> momentum=<%f>\n", -           p->x, p->y, p->zoom, p->radius, p->momentum); + Elm_Gesture_Zoom_Info *p = (Elm_Gesture_Zoom_Info *)event_info; + printf("zoom move <%d,%d> zoom=<%f> radius=<%d> momentum=<%f>\n", + p->x, p->y, p->zoom, p->radius, p->momentum); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; }
      2. @@ -640,11 +640,11 @@ zoom_move(void *data, void *event_info) static Evas_Event_Flags zoom_end(void *data, void *event_info) { -    Elm_Gesture_Zoom_Info *p = (Elm_Gesture_Zoom_Info *)event_info; -    printf("zoom end <%d,%d> zoom=<%f> radius=<%d> momentum=<%f>\n", -           p->x, p->y, p->zoom, p->radius, p->momentum); + Elm_Gesture_Zoom_Info *p = (Elm_Gesture_Zoom_Info *)event_info; + printf("zoom end <%d,%d> zoom=<%f> radius=<%d> momentum=<%f>\n", + p->x, p->y, p->zoom, p->radius, p->momentum); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -654,9 +654,9 @@ zoom_end(void *data, void *event_info) static Evas_Event_Flags zoom_abort(void *data, void *event_info EINA_UNUSED) { -    printf("zoom abort\n"); + printf("zoom abort\n"); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -673,7 +673,7 @@ double elm_gesture_layer_rotate_step_get(const Evas_Object *obj); /* Get or set the gesture layer rotate angular tolerance of an object */ void elm_gesture_layer_rotate_angular_tolerance_set(Evas_Object *obj, -                                                    double rotate_angular_tolerance); + double rotate_angular_tolerance); double elm_gesture_layer_rotate_angular_tolerance_get(const Evas_Object *obj); @@ -691,13 +691,13 @@ double elm_gesture_layer_rotate_angular_tolerance_get(const Evas_Object *obj);

      Use the elm_gesture_layer_cb_set() function to set callbacks to be notified about the change of the gesture state:

       elm_gesture_layer_cb_set(g, ELM_GESTURE_ROTATE, ELM_GESTURE_STATE_START,
-                         rotate_start, NULL);
+                         rotate_start, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_ROTATE, ELM_GESTURE_STATE_END,
-                         rotate_end, NULL);
+                         rotate_end, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_ROTATE, ELM_GESTURE_STATE_ABORT,
-                         rotate_abort, NULL);
+                         rotate_abort, NULL);
 elm_gesture_layer_cb_set(g, ELM_GESTURE_ROTATE, ELM_GESTURE_STATE_MOVE,
-                         rotate_move, NULL);
+                         rotate_move, NULL);
    2. @@ -706,21 +706,21 @@ elm_gesture_layer_cb_set(g, ELM_GESTURE_ROTATE, ELM_GESTURE_STATE_MOVE, static Evas_Event_Flags rotate_start(void *data, void *event_info) { -    Elm_Gesture_Rotate_Info *p = (Elm_Gesture_Rotate_Info *)event_info; -    printf("rotate started <%d,%d> base=<%f> angle=<%f> radius=<%d> momentum=<%f>\n", -           p->x, p->y, p->base_angle, p->angle, p->radius, p->momentum); + Elm_Gesture_Rotate_Info *p = (Elm_Gesture_Rotate_Info *)event_info; + printf("rotate started <%d,%d> base=<%f> angle=<%f> radius=<%d> momentum=<%f>\n", + p->x, p->y, p->base_angle, p->angle, p->radius, p->momentum); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; }

      The event_info attribute contains the rotation information in the Elm_Gesture_Rotate_Info data structure:

       struct _Elm_Gesture_Rotate_Info {
-    Evas_Coord x, y; /* Zoom center point reported to the user */
-    Evas_Coord radius; /* Radius between fingers reported to the user */
-    double base_angle; /* Holds the start angle */
-    double angle; /* Rotation value: 0.0 means no rotation */
-    double momentum; /* Rotation momentum: rotation done per second (NOT SUPPORTED) */
+    Evas_Coord x, y; /* Zoom center point reported to the user */
+    Evas_Coord radius; /* Radius between fingers reported to the user */
+    double base_angle; /* Holds the start angle */
+    double angle; /* Rotation value: 0.0 means no rotation */
+    double momentum; /* Rotation momentum: rotation done per second (NOT SUPPORTED) */
 };
      3. @@ -730,11 +730,11 @@ struct _Elm_Gesture_Rotate_Info { static Evas_Event_Flags rotate_move(void *data, void *event_info) { -    Elm_Gesture_Rotate_Info *p = (Elm_Gesture_Rotate_Info *)event_info; -    printf("rotate move <%d,%d> base=<%f> angle=<%f> radius=<%d> momentum=<%f>\n", -           p->x, p->y, p->base_angle, p->angle, p->radius, p->momentum); + Elm_Gesture_Rotate_Info *p = (Elm_Gesture_Rotate_Info *)event_info; + printf("rotate move <%d,%d> base=<%f> angle=<%f> radius=<%d> momentum=<%f>\n", + p->x, p->y, p->base_angle, p->angle, p->radius, p->momentum); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -744,11 +744,11 @@ rotate_move(void *data, void *event_info) static Evas_Event_Flags rotate_end(void *data, void *event_info) { -    Elm_Gesture_Rotate_Info *p = (Elm_Gesture_Rotate_Info *)event_info; -    printf("rotate end <%d,%d> base=<%f> angle=<%f> radius=<%d> momentum=<%f>\n", -           p->x, p->y, p->base_angle, p->angle, p->radius, p->momentum); + Elm_Gesture_Rotate_Info *p = (Elm_Gesture_Rotate_Info *)event_info; + printf("rotate end <%d,%d> base=<%f> angle=<%f> radius=<%d> momentum=<%f>\n", + p->x, p->y, p->base_angle, p->angle, p->radius, p->momentum); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -758,9 +758,9 @@ rotate_end(void *data, void *event_info) static Evas_Event_Flags rotate_abort(void *data, void *event_info EINA_UNUSED) { -    printf("rotate abort\n"); + printf("rotate abort\n"); -    return EVAS_EVENT_FLAG_ON_HOLD; + return EVAS_EVENT_FLAG_ON_HOLD; } @@ -775,7 +775,7 @@ rotate_abort(void *data, void *event_info EINA_UNUSED) +
    + - Mobile UI Components - + Mobile UI Components + - +

    Mobile native

    - + -
    +
    -

    Mobile UI Components

    - +

    Mobile UI Components

    +

    EFL Elementary is a set of fast, finger-friendly, scalable, and themeable UI component libraries. The number of supported UI components is around 80, including both containers and non-containers (listed in this topic). Originally, Elementary was developed as part of the Window Manager development on desktop devices. For the mobile profile, Tizen reused the proper UI components and created new ones, and then enhanced and adjusted all of them for Tizen native applications.

    This feature is supported in mobile applications only.

    The UI components are mobile-friendly: for example, the naviframe container component supports multiple view management, the entry component supports various modes (such as password, single-line or multi-line, edit or no-edit), the index component supports fast access to another group of UI items, and the toolbar component shows a menu when an item is selected.

    The mobile UI components are designed to allow the user to interact with touch screen-equipped mobile devices. Therefore, when developing mobile applications, you can easily use them through the mobile-related infrastructure in company with view management, and when reacting to touch events and the user finger size.

    - -

    Table: Available UI components

    - - - - - - - - - - - - + +

    Table: Available UI components

    +
    CategoryComponent nameDescription
    + + + + + + + + + + + - + - - - + + + - - - + + + - - + + - + - - + + - - + + - - + + - - + + - - + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - + + - + - - + + - - + + - - + + - - - + + + - - + + - - - + + + - - + + - - - + + + - - + + - - + + - + - - - + + + - - + + - - + + - - + + - - + + - + - - - + + + - + - + - + - + - - + + - -
    CategoryComponent nameDescription
    Navigation elementsToolbarToolbar The toolbar component is a scrollable list of items. It can also show a menu when an item is selected. Only one item can be selected at a time.
    Index
    Index The index component provides an index for fast access to another group of UI items.
    Segmentcontrol
    Segmentcontrol The segmentcontrol component is a horizontal control made of multiple segment items, each segment item functioning similarly as a discrete 2-state button.
    Presentation viewsWinWin The win component is the root window component often used in an application. It allows you to create some content in it, and it is handled by the window manager.
    Background
    Background The background component can be used to set a solid background decoration to a window or a container object. It works like an image, but has some background-specific properties, such as setting it to a tiled, centered, scaled, or stretched mode.
    Genlist
    Genlist The genlist component displays a scrollable list of items. It can hold a lot of items while still being fast and memory-efficient (since only the visible items are allocated memory).
    Gengrid
    Gengrid The gengrid component displays objects on a grid layout and renders only the visible objects.
    Panel
    Panel The panel component is an animated object that can contain child objects. It can be expanded or contracted by clicking the button on its edge.
    List
    List The list component is a very simple list for managing a small number of items. If you need to manage a lot of items, use the genlist component instead.
    Label
    Label The label component displays text with simple HTML-like markup.
    Image
    Image The image component can load and display an image from a file or memory.
    Icon
    Icon The icon component inherits from the image component. It is used to display images in an icon context.
    Progressbar
    Progressbar The progressbar component can be used to display the progress status of a given job.
    Photocam
    Photocam The photocam component is designed to display high-resolution photos taken with a digital camera. It allows you to zoom photos, load photos fast, and fit photos. It is optimized for JPEG images and has a low memory footprint.
    User inputButtonButton The button component is a simple push button. It is composed of a label icon and an icon object, and has an auto-repeat feature.
    Check
    Check The check component toggles the Boolean value between true and false.
    Radio
    Radio The radio component can display 1 or more options, while the user can only select one of them. The UI component is composed of an indicator (selected or unselected), an optional icon, and an optional label. Even though it is usually grouped with 2 or more other radio components, it can also be used alone.
    Entry
    Entry The entry component is a box to which the user can enter text.
    Slider
    Slider The slider component is a draggable bar that is used to select a value from a range of values.
    Datetime
    Datetime The datetime component can display and accept input for date and time values.
    Colorselector
    Colorselector The colorselector component provides a color selection solution to the user. It has different modes, each of them showing a different configuration of the color selection.
    Spinner
    Spinner The spinner component enables the user to increase or decrease a numeric value by using arrow buttons.
    Flipselector
    Flipselector The flipselector component shows a set of text items one at a time. The user can flip up or down the selector to change the text on it.
    Calendar
    Calendar The calendar component displays and manipulates month views.
    Assist viewsPopupPopup The popup component shows a pop-up area that can contain a title area, a content area, and an action area.
    Ctxpopup
    Ctxpopup The ctxpopup component is a contextual popup that can show a list of items.
    Notify
    Notify The notify component displays a container in a specific region of the parent object. It can receive some content, and it can be automatically hidden after a certain amount of time.
    Tooltip
    Tooltip The tooltip component is a smart object used to show tips or information about a parent object when the mouse hovers over the parent object.
    Hoversel
    Hoversel The hoversel component is a button that pops up a list of items.
    TransitionTransitTransit The transit component can apply several transition effects to an Evas object, such as translations and rotations.
    Flip
    Flip The flip component can hold 2 Evas objects and let the user flip between these objects using a variety of predefined animations.
    Hardware accelerationGLViewGLView The GLView component can render OpenGL in an Elementary object, hiding EvasGL complexity.
    MiscellaneousMapMap The map component can display a geographic map. The default map data is provided by the OpenStreetMap project.
    Plug
    Plug The plug component allows you to show an Evas object created by another process. It can be used anywhere like any other Elementary UI component.
    - + + +
    Note Except as noted, this content is licensed under LGPLv2.1+.
    - +
    diff --git a/org.tizen.guides/html/native/ui/efl/ui_components_n.htm b/org.tizen.guides/html/native/ui/efl/ui_components_n.htm index f541fa3..6a2124c 100644 --- a/org.tizen.guides/html/native/ui/efl/ui_components_n.htm +++ b/org.tizen.guides/html/native/ui/efl/ui_components_n.htm @@ -5,20 +5,20 @@ - + - UI Components - + UI Components + - +

    Mobile native Wearable native

    - +

    Dependencies

    +

    Related Info

    • Elementary API for Mobile Native
      • @@ -42,7 +42,7 @@
      -

      UI Components

      +

      UI Components

      Elementary library provides a set of pre-built UI components that allow you to build a rich graphical user interface for your applications. Each profile provides different set of UI components, as you can see in Mobile UI Components and Wearable UI Components.

      @@ -65,7 +65,7 @@

      Styles

      The style of a UI component refers to its graphical appearance determined by the layout, shapes, fonts, and colors. Every UI component has a distinguished layout according to its function and feature, and the layout of a UI component varies somewhat according to the styles.

      -

      In the layout, there are spaces for texts or images which sometimes remain empty for you to fill. In EFL, that space is a "part" (the term comes from part in EDC). A layout of a UI component has 2 types of parts: a text part and a swallow part. A swallow part is a blank you can fill with any kind of object.

      +

      In the layout, there are spaces for texts or images which sometimes remain empty for you to fill. In EFL, that space is a "part" (the term comes from part in EDC). A layout of a UI component has 2 types of parts: a text part and a swallow part. A swallow part is a blank you can fill with any kind of object.

      The following figure shows a default style button. The default style of a button has 1 swallow part and 1 text part. If you create a button and do not set a text or an image, the button looks like the left side. If you set a text and an image to the button, it looks like the right side.

      Figure: Empty button and button filled with an icon and a text

      @@ -78,11 +78,11 @@ Evas_Object *icon; btn = elm_button_add(parent); icon = elm_icon_add(btn); -elm_icon_standard_set(icon, "home"); +elm_icon_standard_set(icon, "home"); /* Set a text to the button */ -elm_object_text_set(btn, "Home"); +elm_object_text_set(btn, "Home"); /* Set an icon to the button */ -elm_object_part_content_set(btn, "icon", icon); +elm_object_part_content_set(btn, "icon", icon);

      Use the following functions to fill a part with a text or an icon:

        @@ -90,32 +90,32 @@ elm_object_part_content_set(btn, "icon", icon);
      • elm_object_part_content_set()

      If the part name is default, you can use the following functions without specifying the part name:

      - +
      • elm_object_text_set()
      • elm_object_content_set()
      - +

      Callbacks

      -

      UI components emit signals on specific situations so that you can perform some action by registering a callback function connected to the signal. The callback is called a "smart callback", distinguished from an event callback.

      +

      UI components emit signals on specific situations so that you can perform some action by registering a callback function connected to the signal. The callback is called a "smart callback", distinguished from an event callback.

      For example, a button object emits a clicked signal when it is clicked, and you can define a specific action every time the button is clicked. Each UI component provides different kinds of signals. For the available signals, see the topic for each individual UI component.

      Use the evas_object_smart_callback_add() function to register a callback. The following code snippet shows how to register a callback function to the clicked signal:

      - + 
       /* Add a callback function connected to the clicked signal */
-evas_object_smart_callback_add(btn, "clicked", _clicked_cb, NULL);
+evas_object_smart_callback_add(btn, "clicked", _clicked_cb, NULL);
 
 /* Print a log every time the button is clicked */
 void
 _clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Button clicked\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Button clicked\n");
 }

      Besides smart signals, which are defined on the Elementary level, Evas event signals are also available on UI components. You can register callback functions connected to input events (key up, key down, mouse wheel) using the evas_object_event_callback_add() function.

      The following code snippet shows how to register a callback function to the mouse down event:

      - + 
       /* Add a callback function to the mouse down event */
 evas_object_event_callback_add(btn, EVAS_CALLBACK_MOUSE_DOWN, _down_cb, NULL);
@@ -124,13 +124,13 @@ evas_object_event_callback_add(btn, EVAS_CALLBACK_MOUSE_DOWN, _down_cb, NULL);
 void
 _down_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Mouse down on button\n");
+    dlog_print(DLOG_INFO, LOG_TAG, "Mouse down on button\n");
 }
      -

      For more information about event handling, see Event Handling.

      +

      For more information about event handling, see Event Handling.

      Topics on UI Components

      - +

      For more information about UI components in general, see the following topics:

      • Configuring UI Components @@ -142,7 +142,7 @@ _down_cb(void *data, Evas *e, Evas_Object *obj, void *event_info)
      • Managing UI Component Focus -

        The Elementary user interface has the concept of "focus". A UI component receives input from the user when it is focused.

        +

        The Elementary user interface has the concept of "focus". A UI component receives input from the user when it is focused.

      • Scaling diff --git a/org.tizen.guides/html/native/ui/efl/ui_components_wn.htm b/org.tizen.guides/html/native/ui/efl/ui_components_wn.htm index 65ad190..46c87bc 100644 --- a/org.tizen.guides/html/native/ui/efl/ui_components_wn.htm +++ b/org.tizen.guides/html/native/ui/efl/ui_components_wn.htm @@ -5,12 +5,12 @@ - + - Wearable UI Components + Wearable UI Components @@ -36,12 +36,12 @@
      • Elementary API for Wearable Native
      -
      +

    Wearable UI Components

    - +

    EFL Elementary is a set of fast, finger-friendly, scalable, and themeable UI component libraries. A number of UI components, including both containers and non-containers (listed in this topic), are supported. Originally, Elementary was developed as part of the Window Manager development on desktop devices. In the wearable profile, Tizen created new UI styles for circular wearable devices with existing UI components, and optimized all of them for Tizen native applications.

    This feature is supported in wearable applications only.

    @@ -56,8 +56,8 @@ Category Component name Description - - + + Navigation elements Index The index component provides an index for fast access to another group of UI items. @@ -82,8 +82,8 @@ Label The label component displays text with simple HTML-like markup. - - + + Image The image component can load and display an image from a file or memory. @@ -131,7 +131,7 @@ Transition - Transit + Transit The transit component can apply several transition effects to an Evas object, such as translations and rotations. @@ -145,8 +145,8 @@ The plug component allows you to show an Evas object created by another process. It can be used anywhere like any other Elementary UI component. - - + +

    The following UI components are designed for specific circular wearable devices which have rotary component parts. In a circular device, you can draw round UI components, such as a slider, progressbar, and scroller. Generally, wearable UI components provide compatibility between the rectangular and circular wearable devices. However, use circular UI components for circular wearable devices only, because they have a dependency with the round UX and rotary events. For more information on the compatibility of the UI components between rectangular and circular, see the Wearable Design guidelines.

    Table: Available circular UI components

    @@ -330,7 +330,7 @@ default default - elm.guide: for the guide text. + elm.guide: for the guide text.

    elm.text: for the main text.

    The guide text is automatically erased when the main text is entered. @@ -350,7 +350,7 @@ default default elm.text - elm.swallow.icon: for the icon on the left. + elm.swallow.icon: for the icon on the left.

    elm.swallow.end: for the icon on the right.

    @@ -365,7 +365,7 @@ elm.text - + 1text 1text @@ -543,9 +543,9 @@ - -

    Wearable Rectangular UI Component Styles

    - + +

    Wearable Rectangular UI Component Styles

    +

    EFL can separate the UI and logic of each UI component, resulting in each component having a different style of look. To change the styles of UI components, use the elm_object_style_get() and elm_object_style_set() functions to get and apply the style for a specific UI component.

    The following tables list the styles for each UI component, including the names of the available styles, and the name of the part in the EDC file where you can define the text or some other Evas_Object included in the UI component. The style list in the EFL upstream is more extensive, but only the styles in the following tables are actually supported by Tizen. For more detailed information, see Style, Theme, and EDC.

    @@ -600,7 +600,7 @@ naviframe/title_icon elm.swallow.content - The icon can be set with the elm_object_part_content_set(btn, "icon", ic) function. + The icon can be set with the elm_object_part_content_set(btn, "icon", ic) function. @@ -621,7 +621,7 @@ on&off on_off - + @@ -673,7 +673,7 @@ default default - elm.guide: for the guide text. + elm.guide: for the guide text.

    elm.text: for the main text.

    The guide text is automatically erased when the main text is entered. @@ -694,7 +694,7 @@ default default elm.text - elm.swallow.icon: for the icon on the left. + elm.swallow.icon: for the icon on the left.

    elm.swallow.end: for the icon on the right.

    @@ -704,7 +704,7 @@ elm.text: for the main text.

    elm.text.1: for the sub text.

    elm.icon - + 1text 1text @@ -764,7 +764,7 @@ multiline/2text multiline/2text - elm.text: for the main text. + elm.text: for the main text.

    elm.text.1: for the multi-line sub text.

    @@ -836,7 +836,7 @@ process/groupindex process/groupindex - +

    Table: Radio styles

    @@ -875,7 +875,7 @@ Note Except as noted, this content is licensed under LGPLv2.1+.
    - +
    diff --git a/org.tizen.guides/html/native/ui/efl/ui_layouts_n.htm b/org.tizen.guides/html/native/ui/efl/ui_layouts_n.htm index b8e8d00..8e3ebc0 100644 --- a/org.tizen.guides/html/native/ui/efl/ui_layouts_n.htm +++ b/org.tizen.guides/html/native/ui/efl/ui_layouts_n.htm @@ -5,13 +5,13 @@ - + - Building UI Layouts + Building UI Layouts @@ -38,7 +38,7 @@
  • EFL API References for Wearable Native
    • - +
    @@ -53,18 +53,18 @@

    Container UI components do not have their own visual identity. They only have logical structures for assignment or placement of other UI components. The use of container UI components only differs from the use of the UI components due to the absence of a visual identity.

    -

    Table: UI containers

    +

    Table: UI containers

    - + - + - - + + - + @@ -76,7 +76,7 @@ - + @@ -99,8 +99,8 @@ - -
    NameDescriptionNameDescription
    BoxBox Arrange more than 2 objects linearly.
    Place objects at specific positions along a fixed grid.
    LayoutLayout Take a standard Edje design file and wrap it very thinly in a UI component.
    Table Arrange multiple objects like for a box, but with 2 dimensions.
    + +

    Basic EFL UI Layout

    @@ -109,9 +109,9 @@

    Each component has a specific role:

      -
    • A conformant accounts for the space taken up by a factor outside the application layout, such as rotation, an indicator, a virtual keyboard, and a softkey window. A conformant has to be present in every application. +
    • A conformant accounts for the space taken up by a factor outside the application layout, such as rotation, an indicator, a virtual keyboard, and a softkey window. A conformant has to be present in every application.

      The content is resized and positioned based on the space available.

      • - +
    • A naviframe acts as a view manager and optionally provides the application title. Most of the time, your application has to manage multiple views, and the easiest way to handle them is to create a naviframe object. Every Tizen application can use this top-layer object to facilitate navigation.

      The main layout of the application is added to the naviframe view area.

    @@ -126,47 +126,47 @@ static void create_base_gui(appdata_s *ad) { -    /* Window */ -    /* Create and initialize elm_win, -     which is mandatory to manipulate a window -    */ -    ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -    elm_win_autodel_set(ad->win, EINA_TRUE); - -    if (elm_win_wm_rotation_supported_get(ad->win)) { -        int rots[4] = {0, 90, 180, 270}; -        elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); -    } - -    evas_object_smart_callback_add(ad->win, "delete,request", -                                   win_delete_request_cb, NULL); -    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); - -    /* Conformant */ -    /* Create and initialize elm_conformant, -     which is mandatory for the base UI to have a proper size -     when an indicator or virtual keypad is visible -    */ -    ad->conform = elm_conformant_add(ad->win); -    elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_HIDE); -    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(ad->win, ad->conform); -    evas_object_show(ad->conform); - -    /* Naviframe */ -    ad->nf = elm_naviframe_add(ad->conform); -    evas_object_show(ad->nf); -    elm_naviframe_prev_btn_auto_pushed_set(ad->nf, EINA_TRUE); -    elm_object_content_set(ad->conform, ad->nf); - -    evas_object_show(ad->win); + /* Window */ + /* Create and initialize elm_win, + which is mandatory to manipulate a window + */ + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_autodel_set(ad->win, EINA_TRUE); + + if (elm_win_wm_rotation_supported_get(ad->win)) { + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + } + + evas_object_smart_callback_add(ad->win, "delete,request", + win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + + /* Conformant */ + /* Create and initialize elm_conformant, + which is mandatory for the base UI to have a proper size + when an indicator or virtual keypad is visible + */ + ad->conform = elm_conformant_add(ad->win); + elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_HIDE); + evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, ad->conform); + evas_object_show(ad->conform); + + /* Naviframe */ + ad->nf = elm_naviframe_add(ad->conform); + evas_object_show(ad->nf); + elm_naviframe_prev_btn_auto_pushed_set(ad->nf, EINA_TRUE); + elm_object_content_set(ad->conform, ad->nf); + + evas_object_show(ad->win); }

    Size Hints

    When you use a container component, such as a naviframe, a conformant, or a box, you need to understand certain APIs related to size hints.

    -

    Size hints are a set of functions that can be used on any Evas object. You request Evas to take care of various properties, and Evas honors these requests if it can. This is why they are called "hints". You can also use the respective get functions to get the current hint values. You can use more than 2 size hint functions together to make the layout you want.

    +

    Size hints are a set of functions that can be used on any Evas object. You request Evas to take care of various properties, and Evas honors these requests if it can. This is why they are called "hints". You can also use the respective get functions to get the current hint values. You can use more than 2 size hint functions together to make the layout you want.

    • Alignment diff --git a/org.tizen.guides/html/native/ui/efl/ui_scalability_n.htm b/org.tizen.guides/html/native/ui/efl/ui_scalability_n.htm index dd48a6f..3a11bab 100644 --- a/org.tizen.guides/html/native/ui/efl/ui_scalability_n.htm +++ b/org.tizen.guides/html/native/ui/efl/ui_scalability_n.htm @@ -5,20 +5,20 @@ - + - Scaling - + Scaling + - +

      Mobile native Wearable native

      - +

      Dependencies

      -
      +
    -

    Scaling

    - +

    Scaling

    +

    Supporting UI scalability in a user interface toolkit means that container components and UI components are scaled properly when the resolution or screen size changes. The Elementary library allows you to manipulate scaling on a per-UI-component basis using a scale factor based on the screen resolution, size, and profile configurations.

    Tizen native applications can run on different types of devices, such as wearable, phone, tablet, and TV. Tizen also supports various resolutions (WVGA - XQXGA) with the same layouts and resources. However, remember that you must always polish your work to create an optimal application for each device.

    - +

    The main scalability features are:

    • Multiple Screen Support

      Enables you to design applications for different kinds of screens.

    • Scalability Support

      Enables you to design applications so that their UI can be scaled for diverse devices without problems.

    • Resource Fallback Support

      Enables you to design applications which can use alternative resources for the device display state.

    - -

    Scaling UI Components

    + +

    Scaling UI Components

    Through its configuration (Elementary Config API in mobile and wearable applications), Elementary provides a way to scale UI components with 2 different parameters:

    • The finger_size parameter is used when the interactive (clickable or editable) zones of the UI components need to be scaled in order to be comfortably used with a finger. -

      The finger_size parameter scales UI components based on the user's finger size. This is useful when using a touch screen with a finger rather than with a stylus. The finger size parameter is in pixels, and determines the minimum size of a square on the screen that is reliably hittable with a finger.

      +

      The finger_size parameter scales UI components based on the user's finger size. This is useful when using a touch screen with a finger rather than with a stylus. The finger size parameter is in pixels, and determines the minimum size of a square on the screen that is reliably hittable with a finger.

      The global finger size is set with the elm_config_finger_size_set() function. This adjusts the size and hit area of the UI components so that they are easy to hit with a finger. The current value is retrieved with the elm_config_finger_size_get() function. The finger size is always in pixels.

      @@ -81,7 +81,7 @@ elm_config_finger_size_set(finger_size + 20);
      Note - The scaling factor is multiplicative: if a child already has a scale size set, it is multiplied by its parent's scale size. + The scaling factor is multiplicative: if a child already has a scale size set, it is multiplied by its parent's scale size.

      The following example sets the global scaling factor to 2.0 and the scaling factor of an existing Elementary button object to 2.0. As a result, the button appears as if it had a 4.0 scaling factor, while the rest of the application is displayed with a 2.0 scaling factor.

      @@ -129,41 +129,41 @@ elm_object_scale_set(button, 2.0); 
       group
 {
-   name: "button";
-   images
-   {
-      image: "bg.png" COMP;
-   }
-   parts
-   {
-      part
-      {
-         name: "bg";
-         type: IMAGE;
-         scale: 1;
-         description
-         {
-            state: "default" 0.0;
-            image.normal: "bg.png";
-         }
-      }
-      part
-      {
-         name: "elm.swallow.content";
-         type: SWALLOW;
-         scale: 1;
-         description
-         {
-            state: "default" 0.0;
-            visible: 0;
-         }
-         description
-         {
-            state: "visible" 0.0;
-            visible: 1;
-         }
-      }
-   }
+   name: "button";
+   images
+   {
+      image: "bg.png" COMP;
+   }
+   parts
+   {
+      part
+      {
+         name: "bg";
+         type: IMAGE;
+         scale: 1;
+         description
+         {
+            state: "default" 0.0;
+            image.normal: "bg.png";
+         }
+      }
+      part
+      {
+         name: "elm.swallow.content";
+         type: SWALLOW;
+         scale: 1;
+         description
+         {
+            state: "default" 0.0;
+            visible: 0;
+         }
+         description
+         {
+            state: "visible" 0.0;
+            visible: 1;
+         }
+      }
+   }
 }
      @@ -175,24 +175,24 @@ group
      • Use the bg_low.png image file when the size of the image is under 200 px.
      • Use the bg_high.png image file for higher resolutions.
        • -
      +
     images
 {
-   set
-   {
-      name: "bg.png";
-      image
-      {
-         image: "bg_low.png" COMP;
-         size: 0 0 200 100;
-      }
-      image
-      {
-         image: "bg_high.png" COMP;
-         size: 201 101 5000 5000;
-      }
-   }
+   set
+   {
+      name: "bg.png";
+      image
+      {
+         image: "bg_low.png" COMP;
+         size: 0 0 200 100;
+      }
+      image
+      {
+         image: "bg_high.png" COMP;
+         size: 201 101 5000 5000;
+      }
+   }
 }
    @@ -204,7 +204,7 @@ images

    Figure: Image set example

    -

    Image set example

    +

    Image set example

  • Image borders

    When the button defined above is resized, its image part is also resized because it is marked as scalable. To resize only the image itself, but not its borders, use the border parameter to specify a static unscalable border size.

    @@ -214,28 +214,28 @@ images 
     parts
 {
-   part
-   {
-      name: "bg";
-      type: IMAGE;
-      scale: 1;
-      description
-      {
-         state: "default" 0.0;
-         image.normal: "bg.png";
-         image.border: 40 40 20 20;
-      }
-   }
-   /* Other parts */
+   part
+   {
+      name: "bg";
+      type: IMAGE;
+      scale: 1;
+      description
+      {
+         state: "default" 0.0;
+         image.normal: "bg.png";
+         image.border: 40 40 20 20;
+      }
+   }
+   /* Other parts */
 }

    The following figure shows the original button at the top, and the resized button at the bottom. When the button is resized, the borders (and consequently the corners) keep their initial ratio, and only the middle part of the button is changed.

    -

    Figure: Image border example

    -

    Image border example

    +

    Figure: Image border example

    +

    Image border example

    • - +
    diff --git a/org.tizen.guides/html/native/ui/ui_cover_n.htm b/org.tizen.guides/html/native/ui/ui_cover_n.htm index 755d1bd..65e8b47 100644 --- a/org.tizen.guides/html/native/ui/ui_cover_n.htm +++ b/org.tizen.guides/html/native/ui/ui_cover_n.htm @@ -5,13 +5,13 @@ - + - User Interface + User Interface @@ -31,7 +31,7 @@
  • Creating Applications with Graphics and Animation
    • - +

    User Interface

    @@ -51,7 +51,7 @@

    You can use the DALi 3D UI toolkit if you are creating a high-performance rich UI application. DALi is based on OpenGL ES 2.0 and 3.0; however it hides the complexity of the OpenGL ES API from you. DALi requires a GPU (Graphical Processing Unit) on the device.

    - +
    diff --git a/org.tizen.guides/html/web/alarm/alarms_w.htm b/org.tizen.guides/html/web/alarm/alarms_w.htm index 6944714..87b52c1 100644 --- a/org.tizen.guides/html/web/alarm/alarms_w.htm +++ b/org.tizen.guides/html/web/alarm/alarms_w.htm @@ -35,7 +35,7 @@
  • Managing Alarm Notifications

    • Related Info

    - @@ -242,25 +242,25 @@ tizen.application.launchAppControl(new tizen.ApplicationControl("http://tiz

  • The service application can terminate itself when it receives a particular request. The following example code uses the Message Port API to send such a request to the service application.

    The application sends a message by calling the sendMessage() method.

    -var remoteMsgPort = tizen.messageport.requestRemoteMessagePort("websvcapp0.service1",
-                                                               "SERVICE_SAMPLE2");
-remoteMsgPort.sendMessage([{key: "key", value: "SERVICE_EXIT"}]);
+var remoteMsgPort = tizen.messageport.requestRemoteMessagePort("websvcapp0.service1",
+                                                               "SERVICE_SAMPLE2");
+remoteMsgPort.sendMessage([{key: "key", value: "SERVICE_EXIT"}]);
  • The service application can terminate itself by calling the exit() method after getting a signal through the message port: 
    -var localMsgPort = tizen.messageport.requestLocalMessagePort("SERVICE_SAMPLE2");
+var localMsgPort = tizen.messageport.requestLocalMessagePort("SERVICE_SAMPLE2");
 function onreceived(data, remoteMsgPort)
 {
-   for (var i = 0; i < data.length; i++)
-   {
-      if (data[i].value == "SERVICE_EXIT")
-      {
-         localMsgPort.removeMessagePortListener(watchId);
-         tizen.application.getCurrentApplication().exit();
-      }
-   }
+   for (var i = 0; i < data.length; i++)
+   {
+      if (data[i].value == "SERVICE_EXIT")
+      {
+         localMsgPort.removeMessagePortListener(watchId);
+         tizen.application.getCurrentApplication().exit();
+      }
+   }
 }
 var watchId = localMsgPort.addMessagePortListener(onreceived);
    @@ -289,7 +289,7 @@ var watchId = localMsgPort.addMessagePortListener(onreceived); Application - This API provides information about the currently running and installed applications and ways to launch other applications. + This API provides information about the currently running and installed applications and ways to launch other applications.

    Note that the getRequestedAppControl() method is only valid inside the onRequest() callback.

    @@ -311,7 +311,7 @@ var watchId = localMsgPort.addMessagePortListener(onreceived); System Information - This API provides information about the device's display, network, storage, and other capabilities. + This API provides information about the device's display, network, storage, and other capabilities. diff --git a/org.tizen.guides/html/web/app_management/web_widget_ww.htm b/org.tizen.guides/html/web/app_management/web_widget_ww.htm index d00a2b9..77e8312 100644 --- a/org.tizen.guides/html/web/app_management/web_widget_ww.htm +++ b/org.tizen.guides/html/web/app_management/web_widget_ww.htm @@ -5,7 +5,7 @@ - + @@ -37,9 +37,9 @@
  • FAQ
    • - + -
    +

    Widget Application

    Widget applications (or simply widgets) are specialized applications useful in providing users with a quick view of specific information from the parent application. Also, widgets allow users to access certain features without launching the parent applications. Combined with the parent application, your widget can have various features to increase the usability of your application set.

    @@ -63,7 +63,7 @@

    Application Model

    Web widgets use only a subset of HTML, CSS, and DOM APIs available for Web applications. Since a design goal of widgets is to provide a quick view of the widget content to the user, there are some restrictions in the Web widget implementation to prevent unnecessary performance degradation:

    -
      +
      • Web widgets cannot use external network resource loading (for example, CSS, JavaScript, and image files).
      • The total size of the HTML, CSS, and JavaScript files in the widget is limited to less than 50 Kbytes.
      • The image resolution in a widget must be less than 1.5 times the base image resolution of the Web Widget Specification.
        • @@ -89,7 +89,7 @@

        The package ID is a random sequence of characters and numbers, which is automatically generated by the Tizen Studio, while you must define the Web application and widget name when creating the applications. For example, if you name your Web application foo and its widget bar, and the Tizen Studio creates the package ID as Zyj5WR, the Web application ID is Zyj5WR.foo and the Web widget ID is Zyj5WR.foo.bar.

        Life-cycle

        -

        The Tizen framework manages the operational states and life-cycle of the Web widgets: installation, creation, termination, and uninstallation. The following figure illustrates the Web widget's operational state changes.

        +

        The Tizen framework manages the operational states and life-cycle of the Web widgets: installation, creation, termination, and uninstallation. The following figure illustrates the Web widget's operational state changes.

        Figure: Operational state changes

        Operational state changes

        @@ -101,7 +101,7 @@
      • The users selects the widget in the Add Widget menu (by swiping right on the home screen), and the Tizen framework creates an instance of the Web widget and makes it available in the widget board.
      • When the user launches the widget from the widget board, an onload event is generated. -

        A visibilityChange event is also generated and the value of the visibilityState property is set to visible. This means that the widget is in operation and its content is displayed on the screen. Whenever a widget is visible, the user can tap the UI screen to invoke specified tasks, such as launching the widget's parent application.

        • +

        A visibilityChange event is also generated and the value of the visibilityState property is set to visible. This means that the widget is in operation and its content is displayed on the screen. Whenever a widget is visible, the user can tap the UI screen to invoke specified tasks, such as launching the widget's parent application.

      • While the widget is running:
        • The user can suspend the widget by navigating away from the widget UI screen, for example, by rotating the Gear bezel. The visibilityChange event is generated and the value of the visibilityState property is set to hidden. The widget content is no longer visible on the UI screen, but the widget instance remains.
        • By navigating to the widget in the widget board, the user can resume the widget operations. The visibilityChange event is generated again, the value of the visibilityState property is set to visible, and the widget content is displayed on the screen.
          • @@ -119,39 +119,39 @@ 
           .wgt
-   index.html
-   config.xml
-   icon.png
-   css
-   images
-   js
-   lib
-   locales
-   widget
-      widget001
-         index.html
-         config.xml
-         preview.png
-         css
-         images
-         js
-         lib
-         locales
-      widget002
-         index.html
-         config.xml
-         preview.png
-         css
-         images
-         js
-         lib
-         locales
+   index.html
+   config.xml
+   icon.png
+   css
+   images
+   js
+   lib
+   locales
+   widget
+      widget001
+         index.html
+         config.xml
+         preview.png
+         css
+         images
+         js
+         lib
+         locales
+      widget002
+         index.html
+         config.xml
+         preview.png
+         css
+         images
+         js
+         lib
+         locales

          The package contains a general config.xml file for the entire package, and a separate config.xml file for each widget:

          • The config.xml file of the package contains the information from all the widget configuration files, in addition to the details of the parent Web application. The runtime of the Tizen platform uses the general config.xml file for installing the widget applications.
            • -
          • The config.xml file of each widget has that widget's own information.
            • +
          • The config.xml file of each widget has that widget's own information.

          The following examples show the config.xml files in a Web application package:

          @@ -159,56 +159,56 @@
          • The general config.xml file for the Web application package: 
            -<?xml version="1.0" encoding="UTF-8"?>
-<widget xmlns="http://www.w3.org/ns/widgets" xmlns:tizen="http://tizen.org/ns/widgets"
-   id="http://yourdomain/DynamicSample">
-
-   <!--Information about the widget001-->
-   <tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget001" primary="true">
-      <tizen:widget-label>TEST_1</tizen:widget-label>
-      <tizen:widget-content src="widget/widget001/index.html">
-         <tizen:widget-size preview="widget/widget001/preview.png">
-            2x2
-         </tizen:widget-size>
-      </tizen:widget-content>
-   </tizen:app-widget>
-
-   <!--Information about the widget002-->
-   <tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget002" primary="false">
-      <tizen:widget-label>TEST_2</tizen:widget-label>
-      <tizen:widget-content src="widget/widget002/index.html">
-         <tizen:widget-size preview="widget/widget002/preview.png">
-            2x2
-         </tizen:widget-size>
-      </tizen:widget-content>
-   </tizen:app-widget>
-
-   <tizen:application id="Zyj5WRVa13.DynamicSample" package="Zyj5WRVa13"
-                      required_version="2.3.2"/>
-   <icon src="icon.png"/>
-   <name>DynamicSample</name>
+<?xml version="1.0" encoding="UTF-8"?>
+<widget xmlns="http://www.w3.org/ns/widgets" xmlns:tizen="http://tizen.org/ns/widgets"
+   id="http://yourdomain/DynamicSample">
+
+   <!--Information about the widget001-->
+   <tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget001" primary="true">
+      <tizen:widget-label>TEST_1</tizen:widget-label>
+      <tizen:widget-content src="widget/widget001/index.html">
+         <tizen:widget-size preview="widget/widget001/preview.png">
+            2x2
+         </tizen:widget-size>
+      </tizen:widget-content>
+   </tizen:app-widget>
+
+   <!--Information about the widget002-->
+   <tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget002" primary="false">
+      <tizen:widget-label>TEST_2</tizen:widget-label>
+      <tizen:widget-content src="widget/widget002/index.html">
+         <tizen:widget-size preview="widget/widget002/preview.png">
+            2x2
+         </tizen:widget-size>
+      </tizen:widget-content>
+   </tizen:app-widget>
+
+   <tizen:application id="Zyj5WRVa13.DynamicSample" package="Zyj5WRVa13"
+                      required_version="2.3.2"/>
+   <icon src="icon.png"/>
+   <name>DynamicSample</name>
 </widget>
          • The config.xml file of the widget001: 
            -<tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget001" primary="true">
-   <tizen:widget-label>TEST_1</tizen:widget-label>
-   <tizen:widget-content src="widget/widget001/index.html">
-      <tizen:widget-size preview="widget/widget001/preview.png">2x2</tizen:widget-size>
-   </tizen:widget-content>
+<tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget001" primary="true">
+   <tizen:widget-label>TEST_1</tizen:widget-label>
+   <tizen:widget-content src="widget/widget001/index.html">
+      <tizen:widget-size preview="widget/widget001/preview.png">2x2</tizen:widget-size>
+   </tizen:widget-content>
 </tizen:app-widget>
          • The config.xml file of the widget002: 
            -<tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget002" primary="false">
-   <tizen:widget-label>TEST_2</tizen:widget-label>
-   <tizen:widget-content src="widget/widget002/index.html">
-      <tizen:widget-size preview="widget/widget002/preview.png">2x2<tizen:widget-size>
-   </tizen:widget-content>
+<tizen:app-widget id="Zyj5WRVa13.DynamicSample.widget002" primary="false">
+   <tizen:widget-label>TEST_2</tizen:widget-label>
+   <tizen:widget-content src="widget/widget002/index.html">
+      <tizen:widget-size preview="widget/widget002/preview.png">2x2<tizen:widget-size>
+   </tizen:widget-content>
 </tizen:app-widget>
            • @@ -233,27 +233,27 @@ 
             <head>
-   <style>
-      body
-      {
-         margin: 0px;
-         text-align: center;
-      }
-      #content
-      {
-         margin-top: 10px;
-         padding-left: 33px;
-         padding-right: 33px;
-         font-size: 20px;
-      }
-   </style>
+   <style>
+      body
+      {
+         margin: 0px;
+         text-align: center;
+      }
+      #content
+      {
+         margin-top: 10px;
+         padding-left: 33px;
+         padding-right: 33px;
+         font-size: 20px;
+      }
+   </style>
 </head>
 <body>
-   <div id="content">
-      Go grandmaster Lee Sedol regained a sizeable slice of human pride on Sunday night
-      when he won the latest game in his historic match with
-      an artificially intelligent machine built by Google researchers.
-   </div>
+   <div id="content">
+      Go grandmaster Lee Sedol regained a sizeable slice of human pride on Sunday night
+      when he won the latest game in his historic match with
+      an artificially intelligent machine built by Google researchers.
+   </div>
 </body>
            @@ -266,29 +266,29 @@ 
             <head>
-   <style>
-      body
-      {
-         text-align: center;
-      }
-      #secondDiv
-      {
-         padding-top: 10px; padding-bottom: 10px;
-      }
-   </style>
+   <style>
+      body
+      {
+         text-align: center;
+      }
+      #secondDiv
+      {
+         padding-top: 10px; padding-bottom: 10px;
+      }
+   </style>
 </head>
 <body>
-   <div id="parentDiv">
-      <div id="firstDiv">
-         <div id="firstChildDiv1">Text1</div>
-         <div id="firstChildDiv2">Text2</div>
-      </div>
-      <div id="secondDiv">
-         <div id="secondChildDiv1">Text1</div>
-         <div id="secondChildDiv2">Text2</div>
-      </div>
-      <div id="thirdChildDiv">Text1</div>
-   </div>
+   <div id="parentDiv">
+      <div id="firstDiv">
+         <div id="firstChildDiv1">Text1</div>
+         <div id="firstChildDiv2">Text2</div>
+      </div>
+      <div id="secondDiv">
+         <div id="secondChildDiv1">Text1</div>
+         <div id="secondChildDiv2">Text2</div>
+      </div>
+      <div id="thirdChildDiv">Text1</div>
+   </div>
 </body>
            @@ -300,24 +300,24 @@ 
             <style>
-   body
-   {
-      text-align: center;
-   }
+   body
+   {
+      text-align: center;
+   }
 </style>
 <body>
-   <div id="parentDiv">
-      <div>
-         <div id="firstChildDiv1"><img src="images/image1.jpg"/></div>
-         <div id="firstChildDiv2">Text2</div>
-         <div id="firstChildDiv3">Text3</div>
-      </div>
-      <div>
-         <div id="secondChildDiv1"><img src="images/image2.jpg"/></div>
-         <div id="secondChildDiv2">Text2</div>
-         <div id="secondChildDiv3">Text3</div>
-      </div>
-   </div>
+   <div id="parentDiv">
+      <div>
+         <div id="firstChildDiv1"><img src="images/image1.jpg"/></div>
+         <div id="firstChildDiv2">Text2</div>
+         <div id="firstChildDiv3">Text3</div>
+      </div>
+      <div>
+         <div id="secondChildDiv1"><img src="images/image2.jpg"/></div>
+         <div id="secondChildDiv2">Text2</div>
+         <div id="secondChildDiv3">Text3</div>
+      </div>
+   </div>
 </body>
            @@ -329,29 +329,29 @@ 
             <head>
-   <style>
-      body
-      {
-         text-align: center;
-      }
-      #largeImage
-      {
-         width: 150px; height: 150px;
-      }
-   </style>
+   <style>
+      body
+      {
+         text-align: center;
+      }
+      #largeImage
+      {
+         width: 150px; height: 150px;
+      }
+   </style>
 </head>
 <body>
-   <div>
-      <div id="firstChildDiv1">Text1</div>
-      <div id="firstChildDiv2">Text2</div>
-   </div>
-   <div>
-      <div id="secondChildDiv1"><img id="largeImage" src="images/image1.jpg"/></div>
-   </div>
-   <div>
-      <div id="thirdChildDiv1">Text1</div>
-      <div id="thirdChildDiv2">Text2</div>
-   </div>
+   <div>
+      <div id="firstChildDiv1">Text1</div>
+      <div id="firstChildDiv2">Text2</div>
+   </div>
+   <div>
+      <div id="secondChildDiv1"><img id="largeImage" src="images/image1.jpg"/></div>
+   </div>
+   <div>
+      <div id="thirdChildDiv1">Text1</div>
+      <div id="thirdChildDiv2">Text2</div>
+   </div>
 </body>
            @@ -367,44 +367,44 @@ 
             #more
 {
-   .display: inline-block;
+   .display: inline-block;
 }
 
     <head>
-   <style>
-      #leftDiv
-      {
-         text-align: right;
-      }
-      #rightDiv
-      {
-         text-align: left;
-      }
-      .split
-      {
-         display: inline-block;
-         width: 45%; height: 100%;
-      }
-      .imgArea
-      {
-         width: 50px; height: 100px;
-      }
-   </style>
+   <style>
+      #leftDiv
+      {
+         text-align: right;
+      }
+      #rightDiv
+      {
+         text-align: left;
+      }
+      .split
+      {
+         display: inline-block;
+         width: 45%; height: 100%;
+      }
+      .imgArea
+      {
+         width: 50px; height: 100px;
+      }
+   </style>
 </head>
 <body>
-   <div id="parentDiv">
-      <div class="split" id="leftDiv">
-         <div id="leftChildDiv1"><img class="imgArea" src="images/image1.jpg"/></div>
-         <div id="leftChildDiv2">Text</div>
-      </div>
-      <div class="split" id="rightDiv">
-         <div id="rightChildDiv1"><img class="imgArea" src="images/image2.jpg"/></div>
-         <div id="rightChildDiv2">Text</div>
-      </div>
-   </div>
+   <div id="parentDiv">
+      <div class="split" id="leftDiv">
+         <div id="leftChildDiv1"><img class="imgArea" src="images/image1.jpg"/></div>
+         <div id="leftChildDiv2">Text</div>
+      </div>
+      <div class="split" id="rightDiv">
+         <div id="rightChildDiv1"><img class="imgArea" src="images/image2.jpg"/></div>
+         <div id="rightChildDiv2">Text</div>
+      </div>
+   </div>
 </body>
    @@ -417,106 +417,106 @@

    Absolute positioning:

     <head>
-   <style>
-      body
-      {
-         width: 360px; height: 360px; margin: 0;
-      }
-      .box
-      {
-         position: absolute;
-         width: 100px; height: 100px;
-      }
-      #topDiv
-      {
-         left: 130px; /* (360/2)-(100/2) */
-      }
-      #leftDiv
-      {
-         top: 100px;
-      }
-      #rightDiv
-      {
-         top: 100px;
-         left: 260px; /* 360-100 */
-      }
-      #bottomDiv
-      {
-         top: 200px;
-         left: 130px; /* (360/2)-(100/2) */
-      }
-   </style>
+   <style>
+      body
+      {
+         width: 360px; height: 360px; margin: 0;
+      }
+      .box
+      {
+         position: absolute;
+         width: 100px; height: 100px;
+      }
+      #topDiv
+      {
+         left: 130px; /* (360/2)-(100/2) */
+      }
+      #leftDiv
+      {
+         top: 100px;
+      }
+      #rightDiv
+      {
+         top: 100px;
+         left: 260px; /* 360-100 */
+      }
+      #bottomDiv
+      {
+         top: 200px;
+         left: 130px; /* (360/2)-(100/2) */
+      }
+   </style>
 </head>
 <body>
-   <div class="box" id="topDiv">
-      <div id="topChildDiv1"><img src="images/image1.jpg"/></div>
-      <div id="topChildDiv2">Top Text</div>
-   </div>
-   <div class="box" id="leftDiv">
-      <div id="leftChildDiv1"><img src="images/image2.jpg"/></div>
-      <div id="leftChildDiv2">Left Text</div>
-   </div>
-   <div class="box" id="rightDiv">
-      <div id="rightChildDiv1"><img src="images/image3.jpg"/></div>
-      <div id="rightChildDiv2">Right Text</div>
-   </div>
-   <div class="box" id="bottomDiv">
-      <div id="bottomChildDiv1"><img src="images/image4.jpg"/></div>
-      <div id="bottomChildDiv2">Bottom Text</div>
-   </div>
+   <div class="box" id="topDiv">
+      <div id="topChildDiv1"><img src="images/image1.jpg"/></div>
+      <div id="topChildDiv2">Top Text</div>
+   </div>
+   <div class="box" id="leftDiv">
+      <div id="leftChildDiv1"><img src="images/image2.jpg"/></div>
+      <div id="leftChildDiv2">Left Text</div>
+   </div>
+   <div class="box" id="rightDiv">
+      <div id="rightChildDiv1"><img src="images/image3.jpg"/></div>
+      <div id="rightChildDiv2">Right Text</div>
+   </div>
+   <div class="box" id="bottomDiv">
+      <div id="bottomChildDiv1"><img src="images/image4.jpg"/></div>
+      <div id="bottomChildDiv2">Bottom Text</div>
+   </div>
 </body>

    Static positioning:

     <head>
-   <style>
-      body
-      {
-         width: 360px; height: 360px; margin: 0;
-      }
-      .box
-      {
-         width: 100px; height: 100px;
-         display: inline-block;
-      }
-      #topDiv, #midDiv, #bottomDiv
-      {
-         text-align: center;
-      }
-      #leftDiv
-      {
-         margin-right: 50px;
-      }
-      #rightDiv
-      {
-         margin-left: 50px;
-      }
-   </style>
+   <style>
+      body
+      {
+         width: 360px; height: 360px; margin: 0;
+      }
+      .box
+      {
+         width: 100px; height: 100px;
+         display: inline-block;
+      }
+      #topDiv, #midDiv, #bottomDiv
+      {
+         text-align: center;
+      }
+      #leftDiv
+      {
+         margin-right: 50px;
+      }
+      #rightDiv
+      {
+         margin-left: 50px;
+      }
+   </style>
 </head>
 <body>
-   <div id="topDiv">
-      <div class="box" id="topInnerDiv">
-         <div id="topChildDiv1"><img src="images/image1.jpg"/></div>
-         <div id="topChildDiv2">Top Text</div>
-      </div>
-   </div>
-   <div id="midDiv">
-      <div class="box" id="leftDiv">
-         <div id="leftChildDiv1"><img src="images/image2.jpg"/></div>
-         <div id="leftChildDiv2">Left Text</div>
-      </div>
-      <div class="box" id="rightDiv">
-         <div id="rightChildDiv1"><img src="images/image3.jpg"/></div>
-         <div id="rightChildDiv2">Right Text</div>
-      </div>
-   </div>
-   <div id="bottomDiv">
-      <div class="box" id="bottomInnerDiv">
-         <div id="bottomChildDiv1"><img src="images/image4.jpg"/></div>
-         <div id="bottomChildDiv2">Bottom Text</div>
-      </div>
-   </div>
+   <div id="topDiv">
+      <div class="box" id="topInnerDiv">
+         <div id="topChildDiv1"><img src="images/image1.jpg"/></div>
+         <div id="topChildDiv2">Top Text</div>
+      </div>
+   </div>
+   <div id="midDiv">
+      <div class="box" id="leftDiv">
+         <div id="leftChildDiv1"><img src="images/image2.jpg"/></div>
+         <div id="leftChildDiv2">Left Text</div>
+      </div>
+      <div class="box" id="rightDiv">
+         <div id="rightChildDiv1"><img src="images/image3.jpg"/></div>
+         <div id="rightChildDiv2">Right Text</div>
+      </div>
+   </div>
+   <div id="bottomDiv">
+      <div class="box" id="bottomInnerDiv">
+         <div id="bottomChildDiv1"><img src="images/image4.jpg"/></div>
+         <div id="bottomChildDiv2">Bottom Text</div>
+      </div>
+   </div>
 </body>
    @@ -527,16 +527,16 @@ 
     #text
 {
-   font-size: 20pt;
-   font-weight: bold; /* Available values: normal, bold, bolder, lighter, number */
-   text-align: center;
+   font-size: 20pt;
+   font-weight: bold; /* Available values: normal, bold, bolder, lighter, number */
+   text-align: center;
 }
 
 #more
 {
-   border-style: solid;
-   border-left-color: lightgray;
-   border-top-color: lightgray;
+   border-style: solid;
+   border-left-color: lightgray;
+   border-top-color: lightgray;
 }
    @@ -548,50 +548,50 @@ <!--HTML--> <!DOCTYPE html> <html> -   <body> -      <div id="viewport"> -         <div id="day">26</div> -         <div id="week">Thursday</div> -         <div id="scheduleTitle">Project meeting</div> -         <div id="scheduleTime">1:00PM-2:00PM</div> -         <div id="scheduleTitle">Conference call</div> -         <div id="scheduleTime">3:00PM-3:30PM</div> -         <div id="more">+3</div> -      </div> -   </body> + <body> + <div id="viewport"> + <div id="day">26</div> + <div id="week">Thursday</div> + <div id="scheduleTitle">Project meeting</div> + <div id="scheduleTime">1:00PM-2:00PM</div> + <div id="scheduleTitle">Conference call</div> + <div id="scheduleTime">3:00PM-3:30PM</div> + <div id="more">+3</div> + </div> + </body> </html> <!--CSS--> #viewport { -   font-size: 20pt; -   text-align: center; + font-size: 20pt; + text-align: center; } #day { -   color: green; -   font-size: 30pt; + color: green; + font-size: 30pt; } #scheduleTitle { -   margin-top: 5%; -   height: 13%; -   font-weight: bold; -   font-size: 30pt; + margin-top: 5%; + height: 13%; + font-weight: bold; + font-size: 30pt; } #more { -   font-size: 16pt; -   width: 50px; -   display: inline-block; -   border-style: solid; -   border-left-color: lightgray; -   border-top-color: lightgray; + font-size: 16pt; + width: 50px; + display: inline-block; + border-style: solid; + border-left-color: lightgray; + border-top-color: lightgray; } #scheduleTime, #more { -   margin-top: 2%; -   color: gray; + margin-top: 2%; + color: gray; } @@ -606,64 +606,64 @@ <!--HTML--> <!DOCTYPE html> <html> -   <body> -      <div class="category"> -         <img id="imgCategory1" src="images/science.png" width="70px"/> -      </div> -      <div id="content1">Counter-Terror Office Funds Tube-Launched...</div> -      <div class="category"> -         <img id="imgCategory2" src="images/sports.png" width="70px"/> -      </div> -      <div id="content2">Presidential Medal of Freedom for Yogi, Mays</div> -      <div class="more">+12</div> -   </body> + <body> + <div class="category"> + <img id="imgCategory1" src="images/science.png" width="70px"/> + </div> + <div id="content1">Counter-Terror Office Funds Tube-Launched...</div> + <div class="category"> + <img id="imgCategory2" src="images/sports.png" width="70px"/> + </div> + <div id="content2">Presidential Medal of Freedom for Yogi, Mays</div> + <div class="more">+12</div> + </body> </html> <!--CSS--> body { -   position: absolute; -   width: 360px; height: 360px; -   font-size: 20px; -   text-align: center; + position: absolute; + width: 360px; height: 360px; + font-size: 20px; + text-align: center; } * { -   display: block; -   margin: 0px; padding: 0px; + display: block; + margin: 0px; padding: 0px; } .category { -   margin-top: 40px; -   margin-left: 137.5px; + margin-top: 40px; + margin-left: 137.5px; } .content { -   margin-top: 10px; -   padding-left: 33px; -   padding-right: 33px; -   height: 66px; -   font-size: 26px; + margin-top: 10px; + padding-left: 33px; + padding-right: 33px; + height: 66px; + font-size: 26px; } .more { -   margin-top: 28px; -   height: 20.2px; + margin-top: 28px; + height: 20.2px; } 
     /* JavaScript */
 function onload()
 {
-   /* Load news data here */
-
-   /* Content update */
-   document.getElementById('imgCategory1').src = newsData.firstNewsType + '.png';
-   document.getElementById('imgCategory2').src = newsData.secondNewsType + '.png';
-   document.getElementById('content1').textContent =
-      newsData.firstNewsData.substring(0,40) + '...';
-   document.getElementById('content2').textContent =
-      newsData.secondNewsData.substring(0,40) + '...';
+   /* Load news data here */
+
+   /* Content update */
+   document.getElementById('imgCategory1').src = newsData.firstNewsType + '.png';
+   document.getElementById('imgCategory2').src = newsData.secondNewsType + '.png';
+   document.getElementById('content1').textContent =
+      newsData.firstNewsData.substring(0,40) + '...';
+   document.getElementById('content2').textContent =
+      newsData.secondNewsData.substring(0,40) + '...';
 }
    @@ -680,16 +680,16 @@ var cntImage = 0; function step() { -   document.getElementById("imgWeather").src = "images/sun_" + (cntImage++) + ".png"; -   if (cntImage < 4) -   { -      window.requestAnimationFrame(step); -   } + document.getElementById("imgWeather").src = "images/sun_" + (cntImage++) + ".png"; + if (cntImage < 4) + { + window.requestAnimationFrame(step); + } } function goAni() { -   window.requestAnimationFrame(step); + window.requestAnimationFrame(step); } @@ -703,17 +703,17 @@ var scrollLength = 0; function step() { -   document.getElementById('scheduleTitle').style.transform = -      "translateX(" + (scrollLength--) + "px)" -   if (scrollLength > -300) /* Max length */ -   { -      window.requestAnimationFrame(step); -   } + document.getElementById('scheduleTitle').style.transform = + "translateX(" + (scrollLength--) + "px)" + if (scrollLength > -300) /* Max length */ + { + window.requestAnimationFrame(step); + } } function goAni() { -   window.requestAnimationFrame(step); + window.requestAnimationFrame(step); } @@ -729,7 +729,7 @@ function goAni() 
     <!--HTML-->
-<element onload="load">
+<element onload="load">
 
    @@ -739,22 +739,22 @@ function goAni()
 object.onload=load;
 
 /* Set the event listener */
-object.addEventListener('load', load);
+object.addEventListener('load', load);
 
 /* Define the event handler in the main.js file */
 function load()
 {
-   /* Load water data from shared file */
-   loadWaterData();
+   /* Load water data from shared file */
+   loadWaterData();
 
-   /* Change the current amount of water */
-   document.getElementById('currentWaterNum').textContent = currentWaterNum;
+   /* Change the current amount of water */
+   document.getElementById('currentWaterNum').textContent = currentWaterNum;
 
-   /* Change the color of the water cups */
-   for (var i = 1; i <= currentWaterNum; ++i)
-   {
-      document.getElementById('watercup' + i)).style.backgroundColor = 'blue';
-   }
+   /* Change the color of the water cups */
+   for (var i = 1; i <= currentWaterNum; ++i)
+   {
+      document.getElementById('watercup' + i)).style.backgroundColor = 'blue';
+   }
 }
    @@ -766,7 +766,7 @@ function load() 
     <!--HTML-->
-<element onclick="click">
+<element onclick="click">
 
    @@ -776,23 +776,23 @@ function load()
 object.onclick=click;
 
 /* Set the event listener */
-object.addEventListener('click', click);
+object.addEventListener('click', click);
 
 /* Define the event handler in the main.js file */
 /* When the user clicks the button, update the status and change the style */
 function click()
 {
-   /* Increase the water amount */
-   currentWaterNum++;
+   /* Increase the water amount */
+   currentWaterNum++;
 
-   /* Change the current amount of water */
-   document.getElementById('currentWaterNum').textContent = currentWaterNum;
+   /* Change the current amount of water */
+   document.getElementById('currentWaterNum').textContent = currentWaterNum;
 
-   /* Change the color of the water cup */
-   document.getElementById('watercup' + currentWaterNum).style.backgroundColor = 'blue';
+   /* Change the color of the water cup */
+   document.getElementById('watercup' + currentWaterNum).style.backgroundColor = 'blue';
 
-   /* Store water data into a shared file */
-   storeWaterData();
+   /* Store water data into a shared file */
+   storeWaterData();
 }
    @@ -806,19 +806,19 @@ function click() /* JavaScript */ /* Set the event listener */ -document.addEventListener('visibilitychange', visibilitychange); +document.addEventListener('visibilitychange', visibilitychange); /* Define the event handler in the main.js file */ function visibilitychange() { -   if (document.visibilityState === 'hidden') -   { -      /* Store shared data */ -   } -   else -   { -      /* Load stored data and update the page */ -   } + if (document.visibilityState === 'hidden') + { + /* Store shared data */ + } + else + { + /* Load stored data and update the page */ + } } @@ -849,10 +849,10 @@ function visibilitychange()

    Communicating with a Web Application on a Wearable Device

    - -

    For data sharing between a Web widget and its parent application on the same device, use the Tizen Preference API. The Preference API allows a Web widget to communicate with its parent Web app (and vice versa) by storing key-value pairs in a hashtable-like data structure. The data stored by the Preference API has a "package" scope, which means that any widgets (or a Web app) in a package can access the data stored by the other widgets (or a Web app) in the same package. In addition, the Preference API does not need additional permissions, so no modifications in the config.xml file are required.

    + +

    For data sharing between a Web widget and its parent application on the same device, use the Tizen Preference API. The Preference API allows a Web widget to communicate with its parent Web app (and vice versa) by storing key-value pairs in a hashtable-like data structure. The data stored by the Preference API has a "package" scope, which means that any widgets (or a Web app) in a package can access the data stored by the other widgets (or a Web app) in the same package. In addition, the Preference API does not need additional permissions, so no modifications in the config.xml file are required.

    The following table lists the Preference API methods.

    - +

    Table: Preference API methods

    @@ -861,77 +861,77 @@ function visibilitychange() - + - - + + - + - - + + - - + + - - + +
    Description
    tizen.preference.setValue("key", "value")tizen.preference.setValue("key", "value") Stores a key-value pair.
    tizen.preference.getValue("key")Retrieves a value for the "key" key.tizen.preference.getValue("key")Retrieves a value for the "key" key.
    tizen.preference.exists("key")tizen.preference.exists("key") Returns true if the given key exists.
    tizen.preference.remove("key")Removes a key-value pair for the "key" key.tizen.preference.remove("key")Removes a key-value pair for the "key" key.
    tizen.preference.setChangeListener("key", listener)Registers a change listener for "key".tizen.preference.setChangeListener("key", listener)Registers a change listener for "key".
    tizen.preference.unsetChangeListener("key")Unregisters the change listener for "key".tizen.preference.unsetChangeListener("key")Unregisters the change listener for "key".
    - +

    The following example shows how to set a key-value pair in the Widget_main.js file:

     function checkPreference()
 {
-   if (!tizen.preference.exists("KEY"))
-   {
-      tizen.preference.setValue("KEY", "Widget_HELLOWORLD1");
-   }
-
-   if (tizen.preference.exists("KEY"))
-   {
-      tizen.preference.remove("KEY");
-      tizen.preference.setValue("KEY", "Widget_HELLOWORLD2");
-   }
-
-   /* [Log] value for KEY: Widget_HELLOWORLD2 */
-   console.log('value for KEY: ' + tizen.preference.getValue('KEY'));
-
-   /* Callback function */
-   var listener = function(data)
-   {
-      /* [Log] Preference with the key: KEY has a new value: APP_HELLOWORLD */
-      console.log('Preference with the key: ' + data.key 
-                  + ' has a new value: ' + data.value);
-      tizen.preference.unsetChangeListener('KEY');
-   };
-
-   tizen.preference.setChangeListener('KEY', listener);
+   if (!tizen.preference.exists("KEY"))
+   {
+      tizen.preference.setValue("KEY", "Widget_HELLOWORLD1");
+   }
+
+   if (tizen.preference.exists("KEY"))
+   {
+      tizen.preference.remove("KEY");
+      tizen.preference.setValue("KEY", "Widget_HELLOWORLD2");
+   }
+
+   /* [Log] value for KEY: Widget_HELLOWORLD2 */
+   console.log('value for KEY: ' + tizen.preference.getValue('KEY'));
+
+   /* Callback function */
+   var listener = function(data)
+   {
+      /* [Log] Preference with the key: KEY has a new value: APP_HELLOWORLD */
+      console.log('Preference with the key: ' + data.key
+                  + ' has a new value: ' + data.value);
+      tizen.preference.unsetChangeListener('KEY');
+   };
+
+   tizen.preference.setChangeListener('KEY', listener);
 }

    To set the value in the WebApp_main.js file:

     window.onload = function()
 {
-   var timer = setInterval(function()
-      {
-         clearInterval(timer);
-         try
-         {
-            tizen.preference.setValue("KEY", "APP_HELLOWORLD");
-            tizen.application.getCurrentApplication().exit();
-         }
-         catch (ignore)
-         {
-         }
-      }, 2000);
+   var timer = setInterval(function()
+      {
+         clearInterval(timer);
+         try
+         {
+            tizen.preference.setValue("KEY", "APP_HELLOWORLD");
+            tizen.application.getCurrentApplication().exit();
+         }
+         catch (ignore)
+         {
+         }
+      }, 2000);
 };
    @@ -939,16 +939,16 @@ window.onload = function()

    The Application API allows a widget to launch and access installed applications on the same device. For this, you need to set the following privileges:

    -<tizen:privilege name="http://tizen.org/privilege/application.info"/>
-<tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-<tizen:privilege name="http://tizen.org/privilege/appmanager.certificate"/>
-<tizen:privilege name="http://tizen.org/privilege/appmanager.kill"/>
+<tizen:privilege name="http://tizen.org/privilege/application.info"/>
+<tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+<tizen:privilege name="http://tizen.org/privilege/appmanager.certificate"/>
+<tizen:privilege name="http://tizen.org/privilege/appmanager.kill"/>

    In addition, to launch an application, its application ID must be used to identify the application:

     /* Launch the application */
-tizen.application.launch('ApplicationIDToLaunch', onGetAppsContextSuccess);
+tizen.application.launch('ApplicationIDToLaunch', onGetAppsContextSuccess);
    @@ -957,21 +957,21 @@ tizen.application.launch('ApplicationIDToLaunch', onGetAppsContextSucces

    Communicating with a Host Application on a Host Device

    - +

    The widget and its parent application can reside on separate devices, as when a Web widget is on a wearable device while the host (parent) application is on a mobile device. In this case, the widget and parent applications can communicate through SAP (Samsung Accessory Protocol) to share data between the widget (the consumer in SAP) and the parent application (the provider in SAP).

    The following example shows SAP communication implementation between a Web widget on a Tizen wearable device and its parent application on an Android mobile device:

    -
      +
      • Widget on a Tizen wearable device: 
         <!--Privilege-->
-<tizen:privilege name="http://developer.samsung.com/privilege/accessoryprotocol"/>
+<tizen:privilege name="http://developer.samsung.com/privilege/accessoryprotocol"/>
 
 <!--HTML-->
 <body>
-   <button id="button1" onclick="getDataFromHostApp();">GetData</button>
-   <div id="result"></div>
+   <button id="button1" onclick="getDataFromHostApp();">GetData</button>
+   <div id="result"></div>
 </body>
 
        @@ -979,93 +979,93 @@ tizen.application.launch('ApplicationIDToLaunch', onGetAppsContextSucces
 var SAAgent = 0;
 var SASocket = 0;
 var CHANNELID = 2000;
-var providerAppName = 'WeatherProvider';
+var providerAppName = 'WeatherProvider';
 
 function onerror(err)
 {
-   /* Error handling */
+   /* Error handling */
 }
 
 var agentCallback =
 {
-   onconnect: function(socket)
-   {
-      SASocket = socket;
-      SASocket.setSocketStatusListener(function(reason)
-         {
-            disconnect();
-         });
-      SASocket.setDataReceiveListener(onreceive);
-      /* Request the provider to get weather info */
-      SASocket.sendData(CHANNELID, 'request');
-   },
-   onerror: onerror
+   onconnect: function(socket)
+   {
+      SASocket = socket;
+      SASocket.setSocketStatusListener(function(reason)
+         {
+            disconnect();
+         });
+      SASocket.setDataReceiveListener(onreceive);
+      /* Request the provider to get weather info */
+      SASocket.sendData(CHANNELID, 'request');
+   },
+   onerror: onerror
 };
 
 var peerAgentFindCallback =
 {
-   onpeeragentfound: function(peerAgent)
-   {
-      try
-      {
-         if (peerAgent.appName == providerAppName)
-         {
-            SAAgent.setServiceConnectionListener(agentCallback);
-            SAAgent.requestServiceConnection(peerAgent);
-         }
-      }
-      catch (err)
-      {
-         /* Error handling */
-      }
-   },
-   onerror: onerror
+   onpeeragentfound: function(peerAgent)
+   {
+      try
+      {
+         if (peerAgent.appName == providerAppName)
+         {
+            SAAgent.setServiceConnectionListener(agentCallback);
+            SAAgent.requestServiceConnection(peerAgent);
+         }
+      }
+      catch (err)
+      {
+         /* Error handling */
+      }
+   },
+   onerror: onerror
 };
 
 function onsuccess(agents)
 {
-   try
-   {
-      if (agents.length > 0)
-      {
-         SAAgent = agents[0];
-         SAAgent.setPeerAgentFindListener(peerAgentFindCallback);
-         SAAgent.findPeerAgents();
-      }
-   }
-   catch (err)
-   {
-      /* Error handling */
-   }
+   try
+   {
+      if (agents.length > 0)
+      {
+         SAAgent = agents[0];
+         SAAgent.setPeerAgentFindListener(peerAgentFindCallback);
+         SAAgent.findPeerAgents();
+      }
+   }
+   catch (err)
+   {
+      /* Error handling */
+   }
 }
 
 function onreceive(channelId, data)
 {
-   document.getElementById('result').textContent = data;
+   document.getElementById('result').textContent = data;
 }
 
 function getDataFromHostApp()
 {
-   if (SASocket)
-   {
-      return false; /* Already connected */
-   }
-   try
-   {
-      webapis.sa.requestSAAgent(onsuccess, function(err)
-         {
-            /* Error handling */
-         });
-   }
-   catch (err)
-   {
-      /* Error handling */
-   }
+   if (SASocket)
+   {
+      return false; /* Already connected */
+   }
+   try
+   {
+      webapis.sa.requestSAAgent(onsuccess, function(err)
+         {
+            /* Error handling */
+         });
+   }
+   catch (err)
+   {
+      /* Error handling */
+   }
 }
      • Parent application on an Android mobile device: - +

        For the provider application on the host device, you need to:

          @@ -1075,147 +1075,147 @@ function getDataFromHostApp() 
           <!--Permissions-->
-<uses-permission android:name="android.permission.BLUETOOTH"/>
-<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
-<uses-permission android:name="com.samsung.accessory.permission.ACCESSORY_FRAMEWORK"/>
-<uses-permission android:name="com.samsung.wmanager.APP"/>
-<uses-permission android:name="com.samsung.wmanager.ENABLE_NOTIFICATION"/>
+<uses-permission android:name="android.permission.BLUETOOTH"/>
+<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
+<uses-permission android:name="com.samsung.accessory.permission.ACCESSORY_FRAMEWORK"/>
+<uses-permission android:name="com.samsung.wmanager.APP"/>
+<uses-permission android:name="com.samsung.wmanager.ENABLE_NOTIFICATION"/>
 
 <!--Service registration-->
-<service android:name=".WeatherProviderForWidget"/>
+<service android:name=".WeatherProviderForWidget"/>
 
 <!--Broadcast receiver and intent-filter-->
-<receiver android:name="com.samsung.android.sdk.accessory.ServiceConnectionIndicationBroadcastReceiver">
-   <intent-filter>
-      <action android:name="android.accessory.service.action.ACCESSORY_SERVICE_CONNECTION_IND"/>
-   </intent-filter>
+<receiver android:name="com.samsung.android.sdk.accessory.ServiceConnectionIndicationBroadcastReceiver">
+   <intent-filter>
+      <action android:name="android.accessory.service.action.ACCESSORY_SERVICE_CONNECTION_IND"/>
+   </intent-filter>
 </receiver>
-<receiver android:name="com.samsung.android.sdk.accessory.RegisterUponInstallReceiver">
-   <intent-filter>
-      <action android:name="android.accessory.device.action.REGISTER_AFTER_INSTALL"/>
-   </intent-filter>
+<receiver android:name="com.samsung.android.sdk.accessory.RegisterUponInstallReceiver">
+   <intent-filter>
+      <action android:name="android.accessory.device.action.REGISTER_AFTER_INSTALL"/>
+   </intent-filter>
 </receiver>
 
 <!--Service profile information-->
-<meta-data android:name="AccessoryServicesLocation"
-           android:value="/res/xml/accessoryservices.xml"/>
+<meta-data android:name="AccessoryServicesLocation"
+           android:value="/res/xml/accessoryservices.xml"/>
 
           // Activity (Main) code
 try {
-   // To widget
-   WeatherProviderForWidget.mConnectionHandler
-      .send(WeatherProviderForWidget.WIDGET_CHANNEL_ID, jsonData.toString().getBytes());
+   // To widget
+   WeatherProviderForWidget.mConnectionHandler
+      .send(WeatherProviderForWidget.WIDGET_CHANNEL_ID, jsonData.toString().getBytes());
 } catch (JSONException e) {
-   e.printStackTrace();
+   e.printStackTrace();
 }
 catch (IOException e_io) {
-   e_io.printStackTrace();
+   e_io.printStackTrace();
 }
 
 // Service (WeatherProviderForWidget)
 @Override
 protected void onServiceConnectionResponse(SAPeerAgent peerAgent, SASocket socket,
-                                           int result) {
-   if (result == SAAgent.CONNECTION_SUCCESS) {
-      if (socket != null) {
-         mConnectionHandler = (ServiceConnection) socket;
-      }
-   } else if (result == SAAgent.CONNECTION_ALREADY_EXIST) {
-      Log.e(TAG, "onServiceConnectionResponse, CONNECTION_ALREADY_EXIST");
-   }
+                                           int result) {
+   if (result == SAAgent.CONNECTION_SUCCESS) {
+      if (socket != null) {
+         mConnectionHandler = (ServiceConnection) socket;
+      }
+   } else if (result == SAAgent.CONNECTION_ALREADY_EXIST) {
+      Log.e(TAG, "onServiceConnectionResponse, CONNECTION_ALREADY_EXIST");
+   }
 }
 
 public class WeatherProviderForWidget extends SAAgent {
-   private static final String TAG = "WeatherProviderForWidget";
-   private static final Class<ServiceConnection> SASOCKET_CLASS =
-      ServiceConnection.class;
-   static ServiceConnection mConnectionHandler = null;
-   static final int WIDGET_CHANNEL_ID = 1000;
-
-   @Override
-   public void onCreate() {
-      super.onCreate();
-      SA mAccessory = new SA();
-      try {
-         mAccessory.initialize(this);   // Connect to Widget
-      } catch (Exception e1) {
-         e1.printStackTrace();
-      }
-   }
-
-   @Override
-   protected void onServiceConnectionRequested(SAPeerAgent peerAgent) {
-      if (peerAgent != null) {
-         acceptServiceConnectionRequest(peerAgent);   // Connection Accepted
-      }
-   }
-
-   public class ServiceConnection extends SASocket {
-      public ServiceConnection() {
-         super(ServiceConnection.class.getName());
-      }
-
-      @Override
-      public void onReceive(int channelId, byte[] data) {
-         if (mConnectionHandler == null) {
-            return;
-         }
-         String req_message = new String(data);   // Get data from Widget
-
-         if (req_message.equals(new String("request"))) {
-            final JSONObject jsonData = new JSONObject();
-            try {
-               Calendar calendar = new GregorianCalendar();
-               SimpleDateFormat dateFormat = new SimpleDateFormat("hh:mm");
-               String timeStr = dateFormat.format(calendar.getTime());
-               jsonData.put("time_text", timeStr);
-               jsonData.put("city_text", "city name");
-               mConnectionHandler.send(WIDGET_CHANNEL_ID,
-                                       jsonData.toString().getBytes());
-            } catch (JSONException e) {
-               e.printStackTrace();
-            } catch (IOException e) {
-               e.printStackTrace();
-            }
-         } else if (req_message.equals(new String("delete_widget"))) {
-               Log.e(TAG, "The widget was deleted from the viewer");
-         } else if (req_message.equals(new String("Add city"))) {
-               Context context = getApplicationContext();
-               Intent intent = new Intent(context, ProviderActivity.class);
-               intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
-               context.startActivity(intent);
-         }
-      }
-
-      @Override
-      protected void onServiceConnectionLost(int reason) {
-         Log.e(TAG, "Service Connection is Lost");
-         mConnectionHandler = null;
-      }
-   }
+   private static final String TAG = "WeatherProviderForWidget";
+   private static final Class<ServiceConnection> SASOCKET_CLASS =
+      ServiceConnection.class;
+   static ServiceConnection mConnectionHandler = null;
+   static final int WIDGET_CHANNEL_ID = 1000;
+
+   @Override
+   public void onCreate() {
+      super.onCreate();
+      SA mAccessory = new SA();
+      try {
+         mAccessory.initialize(this);   // Connect to Widget
+      } catch (Exception e1) {
+         e1.printStackTrace();
+      }
+   }
+
+   @Override
+   protected void onServiceConnectionRequested(SAPeerAgent peerAgent) {
+      if (peerAgent != null) {
+         acceptServiceConnectionRequest(peerAgent);   // Connection Accepted
+      }
+   }
+
+   public class ServiceConnection extends SASocket {
+      public ServiceConnection() {
+         super(ServiceConnection.class.getName());
+      }
+
+      @Override
+      public void onReceive(int channelId, byte[] data) {
+         if (mConnectionHandler == null) {
+            return;
+         }
+         String req_message = new String(data);   // Get data from Widget
+
+         if (req_message.equals(new String("request"))) {
+            final JSONObject jsonData = new JSONObject();
+            try {
+               Calendar calendar = new GregorianCalendar();
+               SimpleDateFormat dateFormat = new SimpleDateFormat("hh:mm");
+               String timeStr = dateFormat.format(calendar.getTime());
+               jsonData.put("time_text", timeStr);
+               jsonData.put("city_text", "city name");
+               mConnectionHandler.send(WIDGET_CHANNEL_ID,
+                                       jsonData.toString().getBytes());
+            } catch (JSONException e) {
+               e.printStackTrace();
+            } catch (IOException e) {
+               e.printStackTrace();
+            }
+         } else if (req_message.equals(new String("delete_widget"))) {
+               Log.e(TAG, "The widget was deleted from the viewer");
+         } else if (req_message.equals(new String("Add city"))) {
+               Context context = getApplicationContext();
+               Intent intent = new Intent(context, ProviderActivity.class);
+               intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
+               context.startActivity(intent);
+         }
+      }
+
+      @Override
+      protected void onServiceConnectionLost(int reason) {
+         Log.e(TAG, "Service Connection is Lost");
+         mConnectionHandler = null;
+      }
+   }
 }
          - +

        Communicating with a Web Server

        - +

        To get data from a Web server through the Internet, use the XMLHttpRequest API. The Web widget engine, however, does not support the full XMLHttpRequest specification. It supports only the GET method, and the TEXT and JSON data types.

        The following example shows Web widget communication with a Web server:

         <!--Privilege-->
-<tizen:privilege name="http://tizen.org/privilege/internet"/>
+<tizen:privilege name="http://tizen.org/privilege/internet"/>
 
 <!--HTML-->
 <body>
-   <button id="button1"
-           onclick="getDataFromNetwork('txt.txt', handleResponseTEXT);">Text</button>
-   <button id="button2"
-           onclick="getDataFromNetwork('json.json', handleResponseJSON);">Json</button>
-   <div id="result"></div>
+   <button id="button1"
+           onclick="getDataFromNetwork('txt.txt', handleResponseTEXT);">Text</button>
+   <button id="button2"
+           onclick="getDataFromNetwork('json.json', handleResponseJSON);">Json</button>
+   <div id="result"></div>
 </body>
        @@ -1223,61 +1223,61 @@ public class WeatherProviderForWidget extends SAAgent { /* JavaScript */ function errorHandling(e) { -   if (e.target.readyState == 3) -   { -      /* Error handling */ -      e.target.abort(); -   } + if (e.target.readyState == 3) + { + /* Error handling */ + e.target.abort(); + } } function getDataFromNetwork(file, handler) { -   var xhr = new XMLHttpRequest(); -   xhr.open('GET', file, true); -   xhr.onreadystatechange = handler; -   xhr.onload = function() -   { -      if (this.status == 200) -      { -         /* Handle the response */ -      } -   }; -   xhr.send(); + var xhr = new XMLHttpRequest(); + xhr.open('GET', file, true); + xhr.onreadystatechange = handler; + xhr.onload = function() + { + if (this.status == 200) + { + /* Handle the response */ + } + }; + xhr.send(); } /* In case of getting Text data */ function handleResponseTEXT(e) { -   if (e.target.readyState == 4) -   { -      if (e.target.status == 200) -      { -         document.getElementById('result').textContent = e.target.responseText; -      } -      else -      { -         /* Error handling */ -      } -   } + if (e.target.readyState == 4) + { + if (e.target.status == 200) + { + document.getElementById('result').textContent = e.target.responseText; + } + else + { + /* Error handling */ + } + } } /* In case of getting JSON data */ function handleResponseJSON(e) { -   if (e.target.readyState == 4) -   { -      if (e.target.status == 200) -      { -         var data = JSON.parse(e.target.responseText); -         var val = data.employees; -         var result = val[0].firstName + ' ' + val[0].lastName; -         document.getElementById('result').textContent = result; -      } -      else -      { -         /* Error handling */ -      } -   } + if (e.target.readyState == 4) + { + if (e.target.status == 200) + { + var data = JSON.parse(e.target.responseText); + var val = data.employees; + var result = val[0].firstName + ' ' + val[0].lastName; + document.getElementById('result').textContent = result; + } + else + { + /* Error handling */ + } + } } @@ -1358,45 +1358,45 @@ sdb dlog | grep ConsoleMessage

        Performance Considerations

        It is important to prevent unnecessary performance degradation in widgets. As a result, some restrictions must be followed when implementing Web widgets:

        -
          +
          • External network resources - +

            Linking external network resources in an HTML document often introduces significant network delays that result in slow loading of Web applications. Therefore, it is not allowed to load resources from external networks in a Web widget application.

            The following example illustrates forbidden external network resources:

             <!--HTML-->
-<img id="img_water" src="http://spec.example.com/image.png">
+<img id="img_water" src="http://spec.example.com/image.png">
 
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"/>
-<script src="http://code.angularjs.org/angular-1.0.0rc10.min.js"/>
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"/>
+<script src="http://code.angularjs.org/angular-1.0.0rc10.min.js"/>
 
-<link rel="stylesheet" type="text/css" href="http://spec.example.com/theme.css">
+<link rel="stylesheet" type="text/css" href="http://spec.example.com/theme.css">
 
 <!--CSS-->
 #myImage
 {
-   content: url('http://spec.example.com/image.png');
+   content: url('http://spec.example.com/image.png');
 }
            - +
          • Image size - +

            The width and the height of the image files in Web widgets are limited to 1.5 times the base image resolution. For the wearable profile, for example, the base image resolution is 360 x 360, so the maximum size of the images is 540 x 540. As long as the image size is within the limit, you can include multiple images in the widget.

            - +

            Figure: Width and height of the image

            Width and height of the image

            -
            • +
          • Resource size

            A Web widget application consists of HTML documents, and JavaScript, CSS, and other resource files. To improve the loading performance, the total size of the Web widget application cannot exceed 50 Kbytes. Because of this limitation, you cannot include heavy JavaScript and CSS libraries, such as jQuery and AngularJS:

            - + 
             <!--HTML-->
-<script src="lib/tau/wearable/js/tau.js"/>
-<link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.css">
+<script src="lib/tau/wearable/js/tau.js"/>
+<link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.css">
 
-<script src="libs/jquery/1.12.0/jquery.min.js"/>
+<script src="libs/jquery/1.12.0/jquery.min.js"/>
          @@ -1408,7 +1408,7 @@ sdb dlog | grep ConsoleMessage
        • Can I use hyperlinks in Web widgets?
        • Which font styles are supported?
        • What is the best way to use the <img> element?
          • -
        • Why can't I use iframes?
          • +
        • Why can't I use iframes?
        • Which media elements are supported?
        • How can I create tables?
        • What kind of forms can I use?
          • @@ -1508,7 +1508,7 @@ sdb dlog | grep ConsoleMessage
        • Supported resolutions: lower than 1.5 times the base image resolution
        -

        Why can't I use iframes?

        +

        Why can't I use iframes?

        Typically, iframes are used for embedding another document within the current document. However, Web widgets provide simple services and content. Therefore, the Web widget engine does not support iframes.

        @@ -1523,68 +1523,68 @@ sdb dlog | grep ConsoleMessage 
         <!--CSS style-->
 <style>
-   body
-   {
-      position: absolute;
-      margin: 0px;
-      padding: 0px;
-      top: 0px;
-      left: 0px;
-      width: 360px;
-      height: 360px;
-      font-size: 1.125rem;
-      color: Black;
-      background-color: White;
-   }
-
-   #leftDiv
-   {
-      text-align: center;
-      border: 1px solid red;
-   }
-
-   #rightDiv
-   {
-      text-align: center;
-      border: 1px solid red;
-      margin-left: -5px;
-   }
-
-   .split
-   {
-      display: inline-block;
-      width: 45%; height: 100%;
-   }
+   body
+   {
+      position: absolute;
+      margin: 0px;
+      padding: 0px;
+      top: 0px;
+      left: 0px;
+      width: 360px;
+      height: 360px;
+      font-size: 1.125rem;
+      color: Black;
+      background-color: White;
+   }
+
+   #leftDiv
+   {
+      text-align: center;
+      border: 1px solid red;
+   }
+
+   #rightDiv
+   {
+      text-align: center;
+      border: 1px solid red;
+      margin-left: -5px;
+   }
+
+   .split
+   {
+      display: inline-block;
+      width: 45%; height: 100%;
+   }
 </style>
 
 <!--Table-like div-->
-<div id="parentDiv">
-   <div class="split" id="leftDiv">
-      First Name
-   </div>
-   <div class="split" id="rightDiv">
-      Last Name
-   </div>
+<div id="parentDiv">
+   <div class="split" id="leftDiv">
+      First Name
+   </div>
+   <div class="split" id="rightDiv">
+      Last Name
+   </div>
 </div>
-<div id="parentDiv">
-   <div class="split" id="leftDiv">
-      Eve
-   </div>
-   <div class="split" id="rightDiv">
-      Jackson
-   </div>
-   <div class="split" id="leftDiv">
-      John
-   </div>
-   <div class="split" id="rightDiv">
-      Doe
-   </div>
-   <div class="split" id="leftDiv">
-      Adam
-   </div>
-   <div class="split" id="rightDiv">
-      Johnson
-   </div>
+<div id="parentDiv">
+   <div class="split" id="leftDiv">
+      Eve
+   </div>
+   <div class="split" id="rightDiv">
+      Jackson
+   </div>
+   <div class="split" id="leftDiv">
+      John
+   </div>
+   <div class="split" id="rightDiv">
+      Doe
+   </div>
+   <div class="split" id="leftDiv">
+      Adam
+   </div>
+   <div class="split" id="rightDiv">
+      Johnson
+   </div>
 </div>
        @@ -1597,16 +1597,16 @@ sdb dlog | grep ConsoleMessage

        The Web widget engine does not support the querySelector() method. However, you can create an alternative select element, as shown in the following example:

        -var parent = document.getElementById('parentDiv');
+var parent = document.getElementById('parentDiv');
 var c = parent.children;
 var i;
 
 for (i = 0; i < c.length; i++)
 {
-   if (c[i].id === 'leftDiv')
-   {
-      /* Do something */
-   }
+   if (c[i].id === 'leftDiv')
+   {
+      /* Do something */
+   }
 }
        @@ -1620,7 +1620,7 @@ var i; for (i = 0; i < c.length; i++) { -   c[i].style.backgroundColor = "red"; + c[i].style.backgroundColor = "red"; } @@ -1629,7 +1629,7 @@ for (i = 0; i < c.length; i++)

        The Web widget engine does not support innerHTML and innerText properties. To get the text data of an element, use the textContent attribute, as shown in the following example:

        -var parent = document.getElementById('parentDiv');
+var parent = document.getElementById('parentDiv');
 var parentText = parent.textContent;
        @@ -1683,7 +1683,7 @@ var parentText = parent.textContent;

        Is it possible to implement Web widgets without a Web application?

        -

        For your convenience during testing and debugging only, the Web widget engine supports the "Only Web Widget Mode". To distribute Web widgets through the Tizen Store, each Web widget must have at least 1 parent Web application in the package. For more information, see Application Model.

        +

        For your convenience during testing and debugging only, the Web widget engine supports the "Only Web Widget Mode". To distribute Web widgets through the Tizen Store, each Web widget must have at least 1 parent Web application in the package. For more information, see Application Model.

        How can I determine which APIs are supported in Web widgets?

        @@ -1691,7 +1691,7 @@ var parentText = parent.textContent;

        Can Web widgets reuse the JavaScript library or CSS styles of their parent Web application?

        -

        Because Web application and Web widget resources are isolated from each other, Web widgets cannot use the JavaScript or CSS files in their parent Web application. The virtual root paths of the Web application and its Web widgets are not the same. You can copy Web application JavaScript and CSS files to the Web widget's folder. However, the Web Widget Specification places more restrictions on the Web widget files than on the Web application files. Therefore, verify all copied Web application JavaScript and CSS files using the Web widget validator.

        +

        Because Web application and Web widget resources are isolated from each other, Web widgets cannot use the JavaScript or CSS files in their parent Web application. The virtual root paths of the Web application and its Web widgets are not the same. You can copy Web application JavaScript and CSS files to the Web widget's folder. However, the Web Widget Specification places more restrictions on the Web widget files than on the Web application files. Therefore, verify all copied Web application JavaScript and CSS files using the Web widget validator.

        What are the benefits of Web widgets compared with native widget applications?

        diff --git a/org.tizen.guides/html/web/app_management/widget_app_w.htm b/org.tizen.guides/html/web/app_management/widget_app_w.htm index 0ea4b35..42b5276 100644 --- a/org.tizen.guides/html/web/app_management/widget_app_w.htm +++ b/org.tizen.guides/html/web/app_management/widget_app_w.htm @@ -5,20 +5,20 @@ - + - Widget Information - + Widget Information + - +

        Mobile Web Wearable Web

        - +

        Dependencies

          @@ -63,21 +63,21 @@
          Note - Do not use "widget" as a name for any of your global variables, as it is the name of a global W3C object. + Do not use "widget" as a name for any of your global variables, as it is the name of a global W3C object.

          The main features of the Widget Service API include:

            -
          • Widget retrieval +
          • Widget retrieval

            You can retrieve widgets, for example, get the widgets installed on the device or information about their primary ID or size.

            • -
          • Widget management +
          • Widget management

            You can manage individual widgets by getting the widget name and a list of widget instances and widget variants, and by receiving notifications about the widget life-cycle events.

            • -
          • Widget instance management +
          • Widget instance management

            You can manage widget instances by changing the instance data update interval and managing the instance content.

          - +

          Widget Retrieval

          @@ -90,26 +90,26 @@

          Retrieving a Widget

          Learning how to retrieve the installed widget list is a basic widget management skill:

            -

          1. Define a success handler implementing the WidgetArraySuccessCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

            +

          2. Define a success handler implementing the WidgetArraySuccessCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

             var successCallback = function(widgets)
 {
-   console.log("There are " + widgets.length + " installed widgets");
+   console.log("There are " + widgets.length + " installed widgets");
 };
 
 var errorCallback = function(error)
 {
-   console.log("Error " + error.message);
+   console.log("Error " + error.message);
 };

          3. To get a list of all installed widgets, use the getWidgets() method of the WidgetServiceManager interface. If the optional packageId parameter is given, only the widgets belonging to the given package are returned.

            -var packageId = "org.tizen.contacts";
+var packageId = "org.tizen.contacts";
 tizen.widgetservice.getWidgets(successCallback, errorCallback, packageId);

            You can also get a specific widget object by using the getWidget() method of the WidgetServiceManager interface:

            -var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
+var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
          @@ -117,13 +117,13 @@ var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget"

          Learning how to retrieve the primary widget ID or size makes using the Widget Service API easy and convenient:

            -

          • To get the primary widget ID of a given application or package ID, use the getPrimaryWidgetId() method of the WidgetServiceManager interface:

            +

          • To get the primary widget ID of a given application or package ID, use the getPrimaryWidgetId() method of the WidgetServiceManager interface:

            -var widgetId = tizen.widgetservice.getPrimaryWidgetId("org.tizen.music-player");
+var widgetId = tizen.widgetservice.getPrimaryWidgetId("org.tizen.music-player");
            • -

          • To get the size of the corresponding size type, use the getSize() method of the WidgetServiceManager interface, specifying the size type:

            +

          • To get the size of the corresponding size type, use the getSize() method of the WidgetServiceManager interface, specifying the size type:

            -var widgetSize = tizen.widgetservice.getSize("4x4");
+var widgetSize = tizen.widgetservice.getSize("4x4");
          @@ -141,11 +141,11 @@ var widgetSize = tizen.widgetservice.getSize("4x4");

          1. Retrieve the widget whose name you need:

            -var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
+var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");

          2. To get the widget name, use the getName() method of the Widget interface. If the locale parameter is omitted, the system locale is used.

            -var name = myWidget.getName("en-us");
+var name = myWidget.getName("en-us");
          @@ -153,20 +153,20 @@ var name = myWidget.getName("en-us");

          Learning how to retrieve information about installed widget instances makes the Widget Service API more useful:

            -

          1. Define a success handler implementing the WidgetInstancesCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

            +

          2. Define a success handler implementing the WidgetInstancesCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

             var successCallback = function(instances)
 {
-   console.log("There are " + instances.length + " instances");
+   console.log("There are " + instances.length + " instances");
 };
 
 var errorCallback = function(error)
 {
-   console.log("Error " + error.message);
+   console.log("Error " + error.message);
 };
            3. -

          3. To retrieve a list of all instances belonging to the widget, use the getInstances() method of the Widget interface:

            +

          4. To retrieve a list of all instances belonging to the widget, use the getInstances() method of the Widget interface:

             myWidget.getInstances(successCallback, errorCallback);
            5. @@ -176,21 +176,21 @@ myWidget.getInstances(successCallback, errorCallback);

            To retrieve variants representing all of the supported widget size types:

              -

            1. Define a success handler implementing the WidgetVariantsCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

              +

            2. Define a success handler implementing the WidgetVariantsCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

               var successCallback = function(variants)
 {
-   console.log("There are " + variants.length + " variants of the widget");
+   console.log("There are " + variants.length + " variants of the widget");
 };
 
 var errorCallback = function(error)
 {
-   console.log("Error " + error.message);
+   console.log("Error " + error.message);
 };

            3. Retrieve the widget whose variants you need:

              -var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
+var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");

            4. To get a list of all variants, use the getVariants() method of the Widget interface:

              @@ -198,7 +198,7 @@ myWidget.getVariants(successCallback, errorCallback);

              You can also get a specific variant by using the getVariant() method with one of the supported size types as a parameter:

              -var variant = myWidget.getVariant("4x4");
+var variant = myWidget.getVariant("4x4");
            @@ -206,24 +206,24 @@ var variant = myWidget.getVariant("4x4");

            Learning to receive notifications when the state of the widget has been changed is a useful widget management skill. There are 4 states that can be noticed: CREATE, DESTROY, PAUSE, and RESUME.

              -

            1. Define the event handler for state notifications using the WidgetChangeCallback listener interface (in mobile and wearable applications):

              +

            2. Define the event handler for state notifications using the WidgetChangeCallback listener interface (in mobile and wearable applications):

               var WidgetChangeCallback = function(instance, event)
 {
-   console.log("The instance " + instance + " has state " + event);
+   console.log("The instance " + instance + " has state " + event);
 };
              3. -

            3. Retrieve the widget object using the getWidget() method of the WidgetServiceManager interface (in mobile and wearable applications):

              +

            4. Retrieve the widget object using the getWidget() method of the WidgetServiceManager interface (in mobile and wearable applications):

              -var myWidget = tizen.widgetservice.getWidget("org.tizen.music-player.widget");
+var myWidget = tizen.widgetservice.getWidget("org.tizen.music-player.widget");
              5. -

            5. Add the listener to use the defined event handler with the addStateChangeListener() method of the Widget interface:

              +

            6. Add the listener to use the defined event handler with the addStateChangeListener() method of the Widget interface:

               var watchId = myWidget.addStateChangeListener(WidgetChangeCallback);
              7. -

            7. To stop receiving notifications for the defined listener, use the removeStateChangeListener() method of the Widget interface with the previously obtained listener ID:

              +

            8. To stop receiving notifications for the defined listener, use the removeStateChangeListener() method of the Widget interface with the previously obtained listener ID:

               myWidget.removeStateChangeListener(watchId);
              9. @@ -235,20 +235,20 @@ myWidget.removeStateChangeListener(watchId);
            9. Change the update period of the instance using the changeUpdatePeriod() method.
            10. Send or get content to and from the widget instance.
        - +

        Changing the Update Period

        To change the update interval for the widget instance:

          -

        1. Retrieve the widget instance with the getInstances() method:

          +

        2. Retrieve the widget instance with the getInstances() method:

           var instance;
 var successCallback = function(instances)
 {
-   instance = instances[0];
+   instance = instances[0];
 };
 
-var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
+var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
 myWidget.getInstances(successCallback);

        3. To change the update interval, use the changeUpdatePeriod() method of the WidgetInstance interface with the new value (in seconds):

          @@ -261,15 +261,15 @@ instance.changeUpdatePeriod(2);

          Learning how to send and get the widget content is a useful widget management skill:

            -

          1. Obtain the widget instance with the getInstances() method:

            +

          2. Obtain the widget instance with the getInstances() method:

             var instance;
 var successCallback = function(instances)
 {
-   instance = instances[0];
+   instance = instances[0];
 };
 
-var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
+var myWidget = tizen.widgetservice.getWidget("org.tizen.gallery.widget");
 myWidget.getInstances(successCallback);
            3. @@ -277,16 +277,16 @@ myWidget.getInstances(successCallback); 
             instance.sendContent(data, true);
            -

          3. To retrieve widget instance content, define a success handler implementing the WidgetContentCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

            +

          4. To retrieve widget instance content, define a success handler implementing the WidgetContentCallback interface (in mobile and wearable applications). Optionally, you can specify an error handler too.

             var successCallback = function(object)
 {
-   console.log("Data successfully retrieved");
+   console.log("Data successfully retrieved");
 };
 
 var errorCallback = function(error)
 {
-   console.log("Error " + error.message);
+   console.log("Error " + error.message);
 };

            Afterwards, use the getContent() method of the WidgetInstance interface:

            @@ -317,4 +317,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - + diff --git a/org.tizen.guides/html/web/connectivity/bluetooth_w.htm b/org.tizen.guides/html/web/connectivity/bluetooth_w.htm index 6d648ad..e96c65e 100644 --- a/org.tizen.guides/html/web/connectivity/bluetooth_w.htm +++ b/org.tizen.guides/html/web/connectivity/bluetooth_w.htm @@ -64,15 +64,15 @@

            The main features of the Bluetooth API include:

              -
            • Managing the local Bluetooth adapter +
            • Managing the local Bluetooth adapter

              You can enable and disable the local Bluetooth adapter, and change the device name for it.

              • -
            • Discovering devices +
            • Discovering devices

              You can discover other Bluetooth devices.

              • -
            • Creating a bonding with a Bluetooth device +
            • Creating a bonding with a Bluetooth device

              You can create a bonding with another device retrieved through the discovery process. The bonding allows the 2 devices to establish a connection.

              • -
            • Connecting to and exchanging data with a Bluetooth device +
            • Connecting to and exchanging data with a Bluetooth device

              You can connect to and exchange data with a remote Bluetooth device.

              • -
            • Communicating with a health source device +
            • Communicating with a health source device

              The Health Device Profile defines the requirements for the Bluetooth health device implementation. In the profile, there are 2 device type: one device is a source, such as a blood pressure monitor or pulse oximeter, while the other is a sink, such as a mobile phone or laptop. You can use your device as a sink and communicate with a health source device.

            @@ -105,14 +105,14 @@

            Prerequisites

            To use the Application (in mobile and wearable applications) and Bluetooth (in mobile and wearable applications) APIs, the application has to request permission by adding the following privileges to the config.xml file:

            -<tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-<tizen:privilege name="http://tizen.org/privilege/bluetooth"/>
+<tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+<tizen:privilege name="http://tizen.org/privilege/bluetooth"/>

            Managing the Local Bluetooth Adapter

            -

            You can enable or disable the local Bluetooth adapter, and set the device name using the system-provided service through the ApplicationControl interface (in mobile and wearable applications).

            +

            You can enable or disable the local Bluetooth adapter, and set the device name using the system-provided service through the ApplicationControl interface (in mobile and wearable applications).

            To use the Bluetooth functionality of the device, you must switch the Bluetooth adapter on. The Bluetooth API does not provide a method to enable or disable the Bluetooth adapter of the device directly. Whenever Bluetooth is required, request a built-in Settings application to present the relevant switch to the user so that they can enable or disable the Bluetooth.

            Figure: Bluetooth setting screen

            Bluetooth setting screen

            @@ -120,8 +120,8 @@
          5. Retrieve a BluetoothAdapter object (in mobile and wearable applications) with the getDefaultAdapter() method and prepare the ApplicationControl object (in mobile and wearable applications) to request the Bluetooth switching operation: 
             var bluetoothSwitchAppControl =
-   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/edit",
-                                null, "application/x-bluetooth-on-off");
+   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/edit",
+                                null, "application/x-bluetooth-on-off");
 var adapter = tizen.bluetooth.getDefaultAdapter();
            6. @@ -129,12 +129,12 @@ var adapter = tizen.bluetooth.getDefaultAdapter(); 
             function launchSuccess()
 {
-   console.log("Bluetooth Settings application is successfully launched.");
+   console.log("Bluetooth Settings application is successfully launched.");
 }
 function launchError(error)
 {
-   alert("An error occurred: " + error.name
-         + ". Please enable Bluetooth through the Settings application.");
+   alert("An error occurred: " + error.name
+         + ". Please enable Bluetooth through the Settings application.");
 }
            @@ -142,23 +142,23 @@ function launchError(error) 
             var serviceReply =
 {
-   /* Called when the launched application reports success */
-   onsuccess: function(data)
-   {
-      if (adapter.powered)
-      {
-         console.log("Bluetooth is successfully turned on.");
-      }
-      else
-      {
-         console.log("Bluetooth is still switched off.");
-      }
-   },
-   /* Called when launched application reports failure */
-   onfailure: function()
-   {
-      alert("Bluetooth Settings application reported failure.");
-   }
+   /* Called when the launched application reports success */
+   onsuccess: function(data)
+   {
+      if (adapter.powered)
+      {
+         console.log("Bluetooth is successfully turned on.");
+      }
+      else
+      {
+         console.log("Bluetooth is still switched off.");
+      }
+   },
+   /* Called when launched application reports failure */
+   onfailure: function()
+   {
+      alert("Bluetooth Settings application reported failure.");
+   }
 };
            @@ -166,48 +166,48 @@ var serviceReply = 
             if (adapter.powered)
 {
-   console.log("Bluetooth is already enabled");
+   console.log("Bluetooth is already enabled");
 }
 else
 {
-   console.log("Try to launch the Bluetooth Settings application.");
-   tizen.application.launchAppControl(bluetoothSwitchAppControl, null, launchSuccess,
-                                      launchError, serviceReply);
+   console.log("Try to launch the Bluetooth Settings application.");
+   tizen.application.launchAppControl(bluetoothSwitchAppControl, null, launchSuccess,
+                                      launchError, serviceReply);
 }

          6. To display the Bluetooth visibility switch, use the application/x-bluetooth-visibility mime option. Bluetooth visibility means that the device is discoverable by other Bluetooth devices.

             var bluetoothVisibilityAppControl =
-   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/edit",
-                                null, "application/x-bluetooth-visibility");
+   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/edit",
+                                null, "application/x-bluetooth-visibility");
 function launchVisibilityError(error)
 {
-   alert("An error occurred: " + error.name
-         + ". Please enable Bluetooth visibility through the Settings application.");
+   alert("An error occurred: " + error.name
+         + ". Please enable Bluetooth visibility through the Settings application.");
 }
 var serviceVisibilityReply =
 {
-   /* Called when the launched application reports success */
-   onsuccess: function(data)
-   {
-      console.log("Bluetooth is " 
-                  + (adapter.visible ? "now discoverable." : "still not visible."));
-   },
-   /* Called when launched application reports failure */
-   onfailure: function()
-   {
-      alert("Bluetooth Settings application reported failure.");
-   }
+   /* Called when the launched application reports success */
+   onsuccess: function(data)
+   {
+      console.log("Bluetooth is "
+                  + (adapter.visible ? "now discoverable." : "still not visible."));
+   },
+   /* Called when launched application reports failure */
+   onfailure: function()
+   {
+      alert("Bluetooth Settings application reported failure.");
+   }
 };
 tizen.application.launchAppControl(bluetoothVisibilityAppControl, null, null,
-                                   launchVisibilityError, serviceVisibilityReply);
+                                   launchVisibilityError, serviceVisibilityReply);

          7. Set a friendly name for the device using the setName() method.

            The name helps to recognize the device in a list of retrieved devices.

             adapter.setName(chatServerName);
-
            8. +

          Discovering Bluetooth Devices

          @@ -215,7 +215,7 @@ adapter.setName(chatServerName);

          You can also retrieve the known devices which were bonded or found in a prior discovery process.

          To search for remote devices and get the known devices:

            -
          1. Retrieve a BluetoothAdapter object (in mobile and wearable applications) with the getDefaultAdapter() method: +
          2. Retrieve a BluetoothAdapter object (in mobile and wearable applications) with the getDefaultAdapter() method: 
             var adapter = tizen.bluetooth.getDefaultAdapter();
            3. @@ -224,11 +224,11 @@ var adapter = tizen.bluetooth.getDefaultAdapter(); 
             var discoverDevicesSuccessCallback =
 {
-   /* When a device is found */
-   ondevicefound: function(device)
-   {
-      console.log("Found device - name: " + device.name);
-   }
+   /* When a device is found */
+   ondevicefound: function(device)
+   {
+      console.log("Found device - name: " + device.name);
+   }
 }
 
 /* Discover devices */
@@ -245,7 +245,7 @@ adapter.discoverDevices(discoverDevicesSuccessCallback, null);
 /* When a known device is found */
 function onGotDevices(devices)
 {
-   console.log("The number of known devices: " + devices.length);
+   console.log("The number of known devices: " + devices.length);
 }
 
 /* Retrieve known devices */
@@ -265,26 +265,26 @@ var adapter = tizen.bluetooth.getDefaultAdapter();
 
             function onBondingSuccessCallback(device)
 {
-   console.log("A bonding is created - name: " + device.name);
+   console.log("A bonding is created - name: " + device.name);
 }
 
 function onErrorCallback(e)
 {
-   console.log("Cannot create a bonding, reason: " + e.message);
+   console.log("Cannot create a bonding, reason: " + e.message);
 }
 
-adapter.createBonding("35:F4:59:D1:7A:03", onBondingSuccessCallback, onErrorCallback);
+adapter.createBonding("35:F4:59:D1:7A:03", onBondingSuccessCallback, onErrorCallback);
 
            
 
 
            
 	Note
-	The MAC address of the Bluetooth device is a BluetoothAddress object (in mobile and wearable applications). You can get the MAC address of the peer device from the BluetoothDevice object (in mobile and wearable applications), which is returned in the success callback of the BluetoothAdapter's getKnownDevices() and discoverDevices() methods.
+	The MAC address of the Bluetooth device is a BluetoothAddress object (in mobile and wearable applications). You can get the MAC address of the peer device from the BluetoothDevice object (in mobile and wearable applications), which is returned in the success callback of the BluetoothAdapter's getKnownDevices() and discoverDevices() methods.
 
            
    
 
    
          3. To end the bonding with a remote device, use the destroyBonding() method:
            
 
            -adapter.destroyBonding("35:F4:59:D1:7A:03");
+adapter.destroyBonding("35:F4:59:D1:7A:03");
 
            4.
          @@ -300,7 +300,7 @@ var adapter = tizen.bluetooth.getDefaultAdapter();

        4. To register a service and allow client devices to connect to it, use the registerRFCOMMServiceByUUID() method on the server device:

          -adapter.registerRFCOMMServiceByUUID(serviceUUID, "My service");
+adapter.registerRFCOMMServiceByUUID(serviceUUID, "My service");
          Note @@ -314,13 +314,13 @@ adapter.registerRFCOMMServiceByUUID(serviceUUID, "My service");

        5. To connect to the server device, use the connectToServiceByUUID() method on the client device:

           device.connectToServiceByUUID(serviceUUID, function(sock)
-   {
-      console.log("socket connected");
-      socket = sock;
-   }, function(error)
-   {
-      console.log("Error while connecting: " + error.message);
-   }
+   {
+      console.log("socket connected");
+      socket = sock;
+   }, function(error)
+   {
+      console.log("Error while connecting: " + error.message);
+   }
 );
          @@ -339,7 +339,7 @@ var length = socket.writeData(somemsg); var data = socket.readData(); -

          When an incoming message is received from the peer device, the onmessage event handler in the BluetoothSocket interface is triggered.

          6. +

          When an incoming message is received from the peer device, the onmessage event handler in the BluetoothSocket interface is triggered.

        Communicating with a Health Source Device

        @@ -349,18 +349,18 @@ var data = socket.readData();
      • Retrieve a BluetoothHealthProfileHandler object (in mobile and wearable applications): 
         var adapter = tizen.bluetooth.getDefaultAdapter();
-var healthProfileHandler = adapter.getBluetoothProfileHandler("HEALTH");
+var healthProfileHandler = adapter.getBluetoothProfileHandler("HEALTH");
 var healthApplication = null, healthChannel = null;

      • Register an application as a sink to wait for connection requests from health source devices (4100 means oximeter):

         function onSinkApp(app)
 {
-   console.log("Success");
-   healthApplication = app;
+   console.log("Success");
+   healthApplication = app;
 }
 
-healthProfileHandler.registerSinkApplication(4100, "testSinkApp", onSinkApp);
+healthProfileHandler.registerSinkApplication(4100, "testSinkApp", onSinkApp);

        When the sink application is registered successfully, the BluetoothHealthApplicationSuccessCallback interface (in mobile and wearable applications) is invoked and you can get the registered sink application object.

      • Before establishing a connection, your device must be bonded with a health source device. For more information, see Creating a Bonding with a Bluetooth Device.
        • @@ -368,16 +368,16 @@ healthProfileHandler.registerSinkApplication(4100, "testSinkApp", onSi 
         function onConnect(channel)
 {
-   console.log("Success");
-   healthChannel = channel;
+   console.log("Success");
+   healthChannel = channel;
 }
 
-adapter.getDevice("35:F4:59:D1:7A:03", function(device)
-   {
-      healthProfileHandler.connectToSource(device, healthApplication, onConnect);
-   });
+adapter.getDevice("35:F4:59:D1:7A:03", function(device)
+   {
+      healthProfileHandler.connectToSource(device, healthApplication, onConnect);
+   });
        -

        When a connection between 2 devices is established, the success callback of the connectToSource() method is called. In addition, the onconnect event handler of the BluetoothHealthApplication instance (in mobile and wearable applications) is called, if the success callback attribute is set. You can get the connected BluetoothHealthChannel object (in mobile and wearable applications) from the callbacks.

        +

        When a connection between 2 devices is established, the success callback of the connectToSource() method is called. In addition, the onconnect event handler of the BluetoothHealthApplication instance (in mobile and wearable applications) is called, if the success callback attribute is set. You can get the connected BluetoothHealthChannel object (in mobile and wearable applications) from the callbacks.

      • To send data to the source device, use the sendData() method:

         var dataToSend = [0, 0, 0];
@@ -401,7 +401,7 @@ healthChannel.close();
 
         function successcallback(device)
 {
-   console.log("Found device: " + device.name + " [" + device.address + "]");
+   console.log("Found device: " + device.name + " [" + device.address + "]");
 };
 
        
 
@@ -445,18 +445,18 @@ var adapter = tizen.bluetooth.getLEAdapter();
 
         var advertiseData = new tizen.BluetoothLEAdvertiseData(
 {
-   includeName: true,
-   serviceuuids: ["180f"] /* 180F is 16bit Battery Service UUID */
+   includeName: true,
+   serviceuuids: ["180f"] /* 180F is 16bit Battery Service UUID */
 });
 var connectable = true;
 
-adapter.startAdvertise(advertiseData, "ADVERTISE", function onstate(state)
-   {
-      console.log("Advertising configured: " + state);
-   }, function(error)
-   {
-      console.log("startAdvertise() failed: " + error.message);
-   }, "LOW_LATENCY", connectable);
+adapter.startAdvertise(advertiseData, "ADVERTISE", function onstate(state)
+   {
+      console.log("Advertising configured: " + state);
+   }, function(error)
+   {
+      console.log("startAdvertise() failed: " + error.message);
+   }, "LOW_LATENCY", connectable);
 
        
 
 
        
@@ -484,12 +484,12 @@ var adapter = tizen.bluetooth.getLEAdapter();
 
         function connectFail(error)
 {
-   console.log("Failed to connect to device: " + e.message);
+   console.log("Failed to connect to device: " + e.message);
 }
 
 function connectSuccess()
 {
-   console.log("Connected to device");
+   console.log("Connected to device");
 }
        • @@ -501,15 +501,15 @@ var remoteDevice = null; function onDeviceFound(device) { -   if (remoteDevice === null) -   { -      remoteDevice = device; -      console.log("Found device " + device.name + ". Connecting..."); + if (remoteDevice === null) + { + remoteDevice = device; + console.log("Found device " + device.name + ". Connecting..."); -      device.connect(connectSuccess, connectFail); -   } + device.connect(connectSuccess, connectFail); + } -   adapter.stopScan(); + adapter.stopScan(); } @@ -540,16 +540,16 @@ var adapter = tizen.bluetooth.getLEAdapter(); 
         var connectionListener =
 {
-   onconnected: function(device)
-   {
-      console.log("Connected to the device: " + device.name
-                  + " [" + device.address + "]");
-   },
-   ondisconnected: function(device)
-   {
-      console.log("Disconnected from the device " + device.name
-                  + " [" + device.address + "]");
-   }
+   onconnected: function(device)
+   {
+      console.log("Connected to the device: " + device.name
+                  + " [" + device.address + "]");
+   },
+   ondisconnected: function(device)
+   {
+      console.log("Disconnected from the device " + device.name
+                  + " [" + device.address + "]");
+   }
 };
        @@ -562,17 +562,17 @@ var watchId; function onDeviceFound(device) { -   if (remoteDevice === null) -   { -      remoteDevice = device; -      console.log("Found device " + device.name + ". Connecting..."); + if (remoteDevice === null) + { + remoteDevice = device; + console.log("Found device " + device.name + ". Connecting..."); -      watchId = remoteDevice.addConnectStateChangeListener(connectionListener); + watchId = remoteDevice.addConnectStateChangeListener(connectionListener); -      remoteDevice.connect(); -   } + remoteDevice.connect(); + } -   adapter.stopScan(); + adapter.stopScan(); } @@ -598,19 +598,19 @@ remoteDevice.removeConnectStateChangeListener(watchId); 
         function showGATTService(service, indent)
 {
-   if (indent === undefined)
-   {
-      indent = "";
-   }
+   if (indent === undefined)
+   {
+      indent = "";
+   }
 
-   console.log(indent + "Service " + service.uuid + ". Has "
-               + service.characteristics.length + " characteristics and " 
-               + service.services.length + " sub-services.");
+   console.log(indent + "Service " + service.uuid + ". Has "
+               + service.characteristics.length + " characteristics and "
+               + service.services.length + " sub-services.");
 
-   for (var i = 0; i < service.services.length; i++)
-   {
-      showGATTService(service.services[i], indent + "   ");
-   }
+   for (var i = 0; i < service.services.length; i++)
+   {
+      showGATTService(service.services[i], indent + "   ");
+   }
 }
        @@ -625,9 +625,9 @@ var i = 0, service = null; for (i; i < serviceUUIDs.length; i++) { -   service = remoteDevice.getService(serviceUUIDs[i]); + service = remoteDevice.getService(serviceUUIDs[i]); -   showGATTService(service); + showGATTService(service); } @@ -635,7 +635,7 @@ for (i; i < serviceUUIDs.length; i++) 
         var services = remoteDevice.getServiceAllUuids();
 
-console.log("Services length " + services.length);
+console.log("Services length " + services.length);
        @@ -665,12 +665,12 @@ var property = gattService.characteristics[0]; 
         function readSuccess(value)
 {
-   console.log("Characteristic value: " + value);
+   console.log("Characteristic value: " + value);
 }
 
 function readFail(error)
 {
-   console.log("readValue() failed: " + error);
+   console.log("readValue() failed: " + error);
 }
        @@ -678,7 +678,7 @@ function readFail(error) 
         if (!property.isReadable)
 {
-   console.log("Property seems not to be readable. Attempting to read...");
+   console.log("Property seems not to be readable. Attempting to read...");
 }
 property.readValue(readSuccess, readFail);
        @@ -687,17 +687,17 @@ property.readValue(readSuccess, readFail); 
         function writeSuccess(value)
 {
-   console.log("Written");
+   console.log("Written");
 }
 
 function writeFail(error)
 {
-   console.log("writeValue() failed: " + error);
+   console.log("writeValue() failed: " + error);
 }
 
 if (!property.isWritable)
 {
-   console.log("Property seems not to be writable. Attempting to write...");
+   console.log("Property seems not to be writable. Attempting to write...");
 }
 var newValue = [82];
 
@@ -731,7 +731,7 @@ var property = gattService.characteristics[0];
 
         function onValueChange(value)
 {
-   console.log("Characteristic value is now: " + value);
+   console.log("Characteristic value is now: " + value);
 }
 
        
    
@@ -776,12 +776,12 @@ var descriptor = characteristic.descriptors[0];
 
         function readSuccess(value)
 {
-   console.log("Descriptor value: " + value);
+   console.log("Descriptor value: " + value);
 }
 
 function readFail(error)
 {
-   console.log("readValue() failed: " + error);
+   console.log("readValue() failed: " + error);
 }
 
        
    
@@ -794,12 +794,12 @@ descriptor.readValue(readSuccess, readFail);
 
         function writeSuccess(value)
 {
-   console.log("Written");
+   console.log("Written");
 }
 
 function writeFail(error)
 {
-   console.log("writeValue() failed: " + error);
+   console.log("writeValue() failed: " + error);
 }
 
 var newValue = [3];
diff --git a/org.tizen.guides/html/web/connectivity/convergence_w.htm b/org.tizen.guides/html/web/connectivity/convergence_w.htm
index ad36ae5..bbf335e 100644
--- a/org.tizen.guides/html/web/connectivity/convergence_w.htm
+++ b/org.tizen.guides/html/web/connectivity/convergence_w.htm
@@ -75,9 +75,9 @@
     
        Prerequisites
        
     
        To use the Convergence API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the config.xml file:
        
     
        -<tizen:privilege name="http://tizen.org/privilege/bluetooth"/>
-<tizen:privilege name="http://tizen.org/privilege/internet"/>
-<tizen:privilege name="http://tizen.org/privilege/d2d.datasharing"/>
+<tizen:privilege name="http://tizen.org/privilege/bluetooth"/>
+<tizen:privilege name="http://tizen.org/privilege/internet"/>
+<tizen:privilege name="http://tizen.org/privilege/d2d.datasharing"/>
 
        
 
     
        Searching for Nearby Devices
        
@@ -90,11 +90,11 @@ var timeout = 60 * 60;
 
 try
 {
-   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, timeout);
+   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, timeout);
 }
 catch (err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }
 
        
 
@@ -108,45 +108,45 @@ catch (err)
     
         var discoverySuccessCallback =
 {
-   onfound: function(device)
-   {
-      console.log('Found a device');
-      console.log(" - id: " + device.id);
-      console.log(" - name: " + device.name);
-      console.log(" - type: " + device.type);
-      console.log(" - service amount: " + device.services.length);
-      for (i in device.services)
-      {
-         if (device.services[i] instanceof RemoteAppControlService)
-         {
-            if (device.services[i].connectionState != "CONNECTED")
-            {
-              device.services[i].connect(onconnected, onerror);
-            }
-         }
-      }
-   },
-
-   onfinished: function(foundDevices)
-   {
-      console.log(' Device discovery has finished');
-      if (foundDevices.length > 0)
-      {
-        console.log(" - devices found: " + foundDevices.length);
-     }
-   }
+   onfound: function(device)
+   {
+      console.log('Found a device');
+      console.log(" - id: " + device.id);
+      console.log(" - name: " + device.name);
+      console.log(" - type: " + device.type);
+      console.log(" - service amount: " + device.services.length);
+      for (i in device.services)
+      {
+         if (device.services[i] instanceof RemoteAppControlService)
+         {
+            if (device.services[i].connectionState != "CONNECTED")
+            {
+              device.services[i].connect(onconnected, onerror);
+            }
+         }
+      }
+   },
+
+   onfinished: function(foundDevices)
+   {
+      console.log(' Device discovery has finished');
+      if (foundDevices.length > 0)
+      {
+        console.log(" - devices found: " + foundDevices.length);
+     }
+   }
 };
 
 function onerror(err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }
 
        
       
      • When a connection is established, the onconnected callback is invoked with the connected service as a parameter:
        
       
         function onconnected(service)
 {
-   console.log('Connected to the service');
+   console.log('Connected to the service');
 }
 
        
         
        • 
@@ -159,31 +159,31 @@ function onconnected(service)
     
        To instantiate a server service:
        
 
     
          
-        
        1. Create a ChannelInfo object. It identifies the server and is used by the clients to address their demands. The first parameter of the ChannelInfo constructor is the server's application ID, set in its config.xml file. The second parameter is an ID set by you.
+        
        2. Create a ChannelInfo object. It identifies the server and is used by the clients to address their demands. The first parameter of the ChannelInfo constructor is the server's application ID, set in its config.xml file. The second parameter is an ID set by you.
         
          -var requestChannel = new tizen.ChannelInfo('targetApp0.main', 'chA');
+var requestChannel = new tizen.ChannelInfo('targetApp0.main', 'chA');
 
          
         
          3. 
         
        3. Define the success and error callbacks for the server service start:
         
           function onerror(err)
 {
-   console.log(err.name +': ' + err.message);
+   console.log(err.name +': ' + err.message);
 }
 
 function onstarted(channel, clientInfo)
 {
-   console.log('Channel started');
-   console.log('channel uri: ' + channel.uri);
-   console.log('channel id: ' + channel.id);
-
-   if (clientInfo)
-   {
-      console.log('clientInfo');
-      console.log('isHost: ' + clientInfo.isHost);
-      console.log('client id: ' + clientInfo.clientId);
-      console.log('connection time: ' + clientInfo.connectionTime);
-   }
+   console.log('Channel started');
+   console.log('channel uri: ' + channel.uri);
+   console.log('channel id: ' + channel.id);
+
+   if (clientInfo)
+   {
+      console.log('clientInfo');
+      console.log('isHost: ' + clientInfo.isHost);
+      console.log('client id: ' + clientInfo.clientId);
+      console.log('connection time: ' + clientInfo.connectionTime);
+   }
 }
 
          
         
          4. 
@@ -206,14 +206,14 @@ service.start(requestChannel, onstarted, onerror);
         
           function onnotify(channel, payload, senderclientid)
 {
-   console.log('On service notification');
-   console.log('channel uri: ' + channel.uri);
-   console.log('channel id: ' + channel.id);
-   console.log('client id of sender: ' + senderclientid);
-   for (i in payload)
-   {
-      console.log('payload: ' + payload[i].key + '-' + payload[i].value);
-   }
+   console.log('On service notification');
+   console.log('channel uri: ' + channel.uri);
+   console.log('channel id: ' + channel.id);
+   console.log('client id of sender: ' + senderclientid);
+   for (i in payload)
+   {
+      console.log('payload: ' + payload[i].key + '-' + payload[i].value);
+   }
 }
 
          
 
@@ -233,72 +233,72 @@ service.setListener(onnotify);
         
           function onerror(err)
 {
-   console.log(err.name +': ' + err.message);
+   console.log(err.name +': ' + err.message);
 }
 
 var timeout = 60 * 60;
 
 try
 {
-   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, timeout);
+   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, timeout);
 }
 catch (err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }
 
          
         
        4. Create a ChannelInfo instance with the same URI and ID as the channel used on the server side. Then start the available server service and send the payload to it.
          
         
           var serverService;
-var channel = new tizen.ChannelInfo('targetApp0.main', 'chA');
+var channel = new tizen.ChannelInfo('targetApp0.main', 'chA');
 
 function onerror(err)
 {
-   console.log(err.name +': ' + err.message);
+   console.log(err.name +': ' + err.message);
 }
 
 var requestPayload =
 {
-   key: "testPayload",
-   value: "Hello!"
+   key: "testPayload",
+   value: "Hello!"
 };
 
 function sendSuccessCallback(channel)
 {
-   console.log('requestPayload sent');
-   console.log('channel uri: ' + channel.uri);
-   console.log('channel id: ' + channel.id);
+   console.log('requestPayload sent');
+   console.log('channel uri: ' + channel.uri);
+   console.log('channel id: ' + channel.id);
 }
 
 function onstarted(channel, clientInfo)
 {
-   serverService.send(channel, requestPayload, sendSuccessCallback, onerror);
+   serverService.send(channel, requestPayload, sendSuccessCallback, onerror);
 }
 
 var discoverySuccessCallback =
 {
-   onfound: function(device)
-   {
-      for (i in device.services)
-      {
-         if (device.services[i] instanceof AppCommunicationServerService)
-         {
-            serverService = device.services[i];
-            device.services[i].start(channel, onstarted, onerror);
-         }
-      }
-   },
-
-   onfinished: function(foundDevices)
-   {
-      console.log(' Device discovery has finished');
-   }
+   onfound: function(device)
+   {
+      for (i in device.services)
+      {
+         if (device.services[i] instanceof AppCommunicationServerService)
+         {
+            serverService = device.services[i];
+            device.services[i].start(channel, onstarted, onerror);
+         }
+      }
+   },
+
+   onfinished: function(foundDevices)
+   {
+      console.log(' Device discovery has finished');
+   }
 };
 
          5. 
     
        
     
        Launching an Application Remotely
        
 
-	
        This use case assumes that a "targetApp0.main" application has been installed on the remote device.
        
+	
        This use case assumes that a "targetApp0.main" application has been installed on the remote device.
        
 
     
        To launch an application on a remote device:
        
 
@@ -307,70 +307,70 @@ var discoverySuccessCallback =
         
         var discoverySuccessCallback =
 {
-   onfound: function(device)
-   {
-      for (i in device.services)
-      {
-         if (device.services[i].type === "REMOTE_APP_CONTROL")
-         {
-            if (device.services[i].connectionState != "CONNECTED")
-            {
-               device.services[i].connect(onconnected, onerror);
-            }
-            else
-            {
-               device.services[i].start(onstarted, onerror);
-            }
-         }
-      }
-   },
-
-   onfinished: function(foundDevices)
-   {
-      console.log('Device discovery has finished');
-   }
+   onfound: function(device)
+   {
+      for (i in device.services)
+      {
+         if (device.services[i].type === "REMOTE_APP_CONTROL")
+         {
+            if (device.services[i].connectionState != "CONNECTED")
+            {
+               device.services[i].connect(onconnected, onerror);
+            }
+            else
+            {
+               device.services[i].start(onstarted, onerror);
+            }
+         }
+      }
+   },
+
+   onfinished: function(foundDevices)
+   {
+      console.log('Device discovery has finished');
+   }
 };
 
 function onerror(err)
 {
-   console.log(err.name +': ' + err.message);
+   console.log(err.name +': ' + err.message);
 }
 
 var timeout = 60 * 60;
 
 try
 {
-   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, timeout);
+   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, timeout);
 }
 catch (err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }
 
        
         
      • An application on the remote device is started from the onconnected callback. The remoteAppControlCallback method handles the data sent from the remote device.
        
         
        -var requestAppId = 'targetApp0.main';
+var requestAppId = 'targetApp0.main';
 
 function remoteAppControlCallback(data)
 {
-   for (var i = 0; i < data.length; i++)
-   {
-      console.log("key: " + data[i].key + "value: " + data[i].value[0]);
-   }
-   service.disconnect();
+   for (var i = 0; i < data.length; i++)
+   {
+      console.log("key: " + data[i].key + "value: " + data[i].value[0]);
+   }
+   service.disconnect();
 }
 
 function onstarted(service)
 {
-   console.log('Remote app control service started');
-   service.launch(requestAppId, remoteAppControlCallback, onerror);
+   console.log('Remote app control service started');
+   service.launch(requestAppId, remoteAppControlCallback, onerror);
 }
 
 function onconnected(service)
 {
-   console.log('Connected to the remote app control service');
-   service.start(onstarted, onerror);
-   service.launch(requestAppId, remoteAppControlCallback, onerror);
+   console.log('Connected to the remote app control service');
+   service.start(onstarted, onerror);
+   service.launch(requestAppId, remoteAppControlCallback, onerror);
 }
 
        • 
     
@@ -382,61 +382,61 @@ function onconnected(service)
         
         var discoverySuccessCallback =
 {
-   onfound: function(device)
-   {
-      for (i in device.services)
-      {
-         if (device.services[i] instanceof RemoteAppControlService)
-         {
-            if (device.services[i].connectionState != "CONNECTED")
-            {
-               device.services[i].connect(onconnected, onerror);
-            }
-         }
-      }
-   },
-
-   onfinished: function(foundDevices)
-   {
-     console.log(' Device discovery has finished');
-   }
+   onfound: function(device)
+   {
+      for (i in device.services)
+      {
+         if (device.services[i] instanceof RemoteAppControlService)
+         {
+            if (device.services[i].connectionState != "CONNECTED")
+            {
+               device.services[i].connect(onconnected, onerror);
+            }
+         }
+      }
+   },
+
+   onfinished: function(foundDevices)
+   {
+     console.log(' Device discovery has finished');
+   }
 };
 
 function onerror(err)
 {
-   console.log(err.name +': ' + err.message);
+   console.log(err.name +': ' + err.message);
 }
 
 try
 {
-   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, 60 * 60);
+   tizen.convergence.startDiscovery(discoverySuccessCallback, onerror, 60 * 60);
 }
 catch (err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }
 
        
     
      • Create the ApplicationControl object:
        
 	
         var requestAppControl =
-   new tizen.ApplicationControl('http://tizen.org/appcontrol/operation/view', null,
-                                'image/jpeg', null,
-                                [new tizen.ApplicationControlData('images',
-                                                                  [testImgData])]);
+   new tizen.ApplicationControl('http://tizen.org/appcontrol/operation/view', null,
+                                'image/jpeg', null,
+                                [new tizen.ApplicationControlData('images',
+                                                                  [testImgData])]);
 
        • 
     
      • Use the onconnected() callback to send the application control request to the remote service. The launchAppControl() method takes as parameters the ApplicationControl object, optionally the target application ID, and a callback defining the actions to be taken on the remote service reply.
         function remoteAppControlCallback(data)
 {
-   for (var i = 0; i < data.length; i++)
-   {
-      console.log("key: " + data[i].key + "value: " + data[i].value[0]);
-   }
+   for (var i = 0; i < data.length; i++)
+   {
+      console.log("key: " + data[i].key + "value: " + data[i].value[0]);
+   }
 }
 
 function onconnected(service)
 {
-   service.launchAppControl(requestAppControl, null,
-                            remoteAppControlCallback, onerror);
+   service.launchAppControl(requestAppControl, null,
+                            remoteAppControlCallback, onerror);
 }
 
        • 
     
diff --git a/org.tizen.guides/html/web/connectivity/download_w.htm b/org.tizen.guides/html/web/connectivity/download_w.htm
index d602d4d..3b74fb6 100644
--- a/org.tizen.guides/html/web/connectivity/download_w.htm
+++ b/org.tizen.guides/html/web/connectivity/download_w.htm
@@ -62,7 +62,7 @@
 
 
        To use the Download API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privilege to the config.xml file:
        
 
        -<tizen:privilege name=" http://tizen.org/privilege/download"/>
+<tizen:privilege name=" http://tizen.org/privilege/download"/>
 
        
 
 
@@ -73,55 +73,55 @@
    
      • Create an instance of the DownloadRequest interface (in mobile, wearable, and TV applications) that defines the URL of the file to be downloaded:
        
 
         var downloadRequest =
-   new tizen.DownloadRequest("http://download.tizen.org/tools/README.txt", "downloads");
+   new tizen.DownloadRequest("http://download.tizen.org/tools/README.txt", "downloads");
 
        
-
        The final parameter (downloads) defines the folder where the downloaded content is stored. The parameter uses a relative folder location defined in the Filesystem API (in mobile, wearable, and TV applications). The folder is not an absolute folder location, but instead uses a virtual root location (downloads is the default download location in the virtual root).
        •  
+
        The final parameter (downloads) defines the folder where the downloaded content is stored. The parameter uses a relative folder location defined in the Filesystem API (in mobile, wearable, and TV applications). The folder is not an absolute folder location, but instead uses a virtual root location (downloads is the default download location in the virtual root).
        
 
      • It is not possible to download anything when the device is not connected to a network. To check whether any connection is available, use the getPropertyValue() method of the SystemInfo interface (in mobile, wearable, and TV applications):
        
 
        -tizen.systeminfo.getPropertyValue("NETWORK", function(networkInfo)
-   {
-      if (networkInfo.networkType === "NONE")
-      {
-         console.log("Network connection is not available.
-                      Download is not possible.");
-         downloadRequest = null;
-      }
-   });
+tizen.systeminfo.getPropertyValue("NETWORK", function(networkInfo)
+   {
+      if (networkInfo.networkType === "NONE")
+      {
+         console.log("Network connection is not available.
+                      Download is not possible.");
+         downloadRequest = null;
+      }
+   });
 
        • 
 
  
      • Define the event handlers for different download process notifications using the DownloadCallback listener interface  (in mobile, wearable, and TV applications):
 
         var listener =
 {
-   /* When the download progresses (interval is platform-dependent) */
-   onprogress: function(id, receivedSize, totalSize)
-   {
-      console.log('Received with id: ' + id + ', ' + receivedSize + '/' + totalSize);
-   },
-
-   /* When the user pauses the download */
-   onpaused: function(id)
-   {
-      console.log('Paused with id: ' + id);
-   },
-
-   /* When the user cancels the download */
-   oncanceled: function(id)
-   {
-      console.log('Canceled with id: ' + id);
-   },
-
-   /* When the download is completed */
-   oncompleted: function(id, fullPath)
-   {
-      console.log('Completed with id: ' + id + ', full path: ' + fullPath);
-   },
-
-   /* When the download fails */
-   onfailed: function(id, error)
-   {
-      console.log('Failed with id: ' + id + ', error name: ' + error.name);
-   }
+   /* When the download progresses (interval is platform-dependent) */
+   onprogress: function(id, receivedSize, totalSize)
+   {
+      console.log('Received with id: ' + id + ', ' + receivedSize + '/' + totalSize);
+   },
+
+   /* When the user pauses the download */
+   onpaused: function(id)
+   {
+      console.log('Paused with id: ' + id);
+   },
+
+   /* When the user cancels the download */
+   oncanceled: function(id)
+   {
+      console.log('Canceled with id: ' + id);
+   },
+
+   /* When the download is completed */
+   oncompleted: function(id, fullPath)
+   {
+      console.log('Completed with id: ' + id + ', full path: ' + fullPath);
+   },
+
+   /* When the download fails */
+   onfailed: function(id, error)
+   {
+      console.log('Failed with id: ' + id + ', error name: ' + error.name);
+   }
 };
 
        • 
    
      • To start the download of the HTML file from the Internet, use the start() method of the DownloadManager interface (in mobile, wearable, and TV applications):
        
@@ -129,8 +129,8 @@ var listener =
 downloadId = tizen.download.start(downloadRequest, listener);

        • The start() method returns a unique identifier for the download operation.

        -
      • During the download: -
          +
        1. During the download: +

          1. To pause the download, use the pause() method with the download ID:

             tizen.download.pause(downloadId);
@@ -158,12 +158,12 @@ downloadId = tizen.download.start(downloadRequest, listener);
 
             var state = tizen.download.getState(downloadId);
 
            
-
            The method returns a DownloadState enumerator value (in mobile, wearable, and TV applications).
            2. +

            The method returns a DownloadState enumerator value (in mobile, wearable, and TV applications).

          2. Use the getDownloadRequest() method with the download ID as a parameter to get the download request details that the user has previously set:

             var downloadRequest = tizen.download.getDownloadRequest(downloadId);
            -

            The method returns the DownloadRequest information (in mobile, wearable, and TV applications) which is used as the parameter when starting the download.

            3. +

            The method returns the DownloadRequest information (in mobile, wearable, and TV applications) which is used as the parameter when starting the download.

          3. Use the getMIMEType() method with the download ID as a parameter to get the MIME type of the file that you have started downloading:

             var MIMEType = tizen.download.getMIMEType(downloadId);
diff --git a/org.tizen.guides/html/web/connectivity/iotcon_w.htm b/org.tizen.guides/html/web/connectivity/iotcon_w.htm
index 1dbd292..b4d78b3 100644
--- a/org.tizen.guides/html/web/connectivity/iotcon_w.htm
+++ b/org.tizen.guides/html/web/connectivity/iotcon_w.htm
@@ -84,13 +84,13 @@
 
              
 
            1. To use the Iotcon API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privilege to the config.xml file:
 
              -<tizen:privilege name="http://tizen.org/privilege/internet"/>
+<tizen:privilege name="http://tizen.org/privilege/internet"/>
 
              
 
              2. 
-
            2. To make your application visible only for devices that support Iotcon, the application must specify the following feature in the config.xml file: 
+
            3. To make your application visible only for devices that support Iotcon, the application must specify the following feature in the config.xml file:
 
 
              -<feature name="http://tizen.org/feature/iot.ocf"/>
+<feature name="http://tizen.org/feature/iot.ocf"/>
 
              
 
 
              You can also check whether a device supports the API by using the tizen.systeminfo.getCapability() method and accordingly enabling or disabling the code requiring the API:
              
@@ -98,14 +98,14 @@
 
               try
 {
-   /* Checks whether a device supports the Iotcon API */
-   var iotcon_feature =
-      tizen.systeminfo.getCapability("http://tizen.org/feature/iot.ocf");
-   console.log("Iotcon = " + iotcon_feature);
+   /* Checks whether a device supports the Iotcon API */
+   var iotcon_feature =
+      tizen.systeminfo.getCapability("http://tizen.org/feature/iot.ocf");
+   console.log("Iotcon = " + iotcon_feature);
 }
 catch (error)
 {
-   console.log("Error name: " + error.name + ", message: " + error.message);
+   console.log("Error name: " + error.name + ", message: " + error.message);
 }
 
              
 
              4. 
@@ -125,14 +125,14 @@ catch (error)
   
              For managing secure virtual resources, a CBOR format file (Concise Binary Object Representation) must be
 	available, preferably in the application local storage. For more information on security, see Iotivity Security.
              
 
              -var cborPath = "path_to_my_app_storage/iotcon-server-test.dat";
+var cborPath = "path_to_my_app_storage/iotcon-server-test.dat";
 
              
 
 
            4. 
   
              Initialize Iotcon and set a human friendly name:
              
 
               tizen.iotcon.initialize(cborPath);
-tizen.iotcon.deviceName = "Device 1";
+tizen.iotcon.deviceName = "Device 1";
 
              
 
              5. 
 
            5. 
@@ -149,20 +149,20 @@ var iotServer = tizen.iotcon.getServer();
   
              On the server side, prepare a variable for storing the resource object and its attributes. The following example shows a door resource:
              
 
               var doorResource;
-var doorAttributes = {openstate: "open"};
+var doorAttributes = {openstate: "open"};
 
              
 
              6. 
 
            6. 
   
              Prepare handlers for the get, put, post, delete, and observing requests from the client.
              
-
              The exact list of required handlers depends on the resource interfaces. The following example uses the "oic.if.b" interface.
              
+
              The exact list of required handlers depends on the resource interfaces. The following example uses the "oic.if.b" interface.
              
 
               var requestCallbacks =
 {
-   onget: function(request) {/* Handler code */},
-   onput: function(request) {/* Handler code */},
-   onpost: function(request) {/* Handler code */},
-   ondelete: function(request) {/* Handler code */},
-   onobserving: function(request, observeType, observeId) {/* Handler code */}
+   onget: function(request) {/* Handler code */},
+   onput: function(request) {/* Handler code */},
+   onpost: function(request) {/* Handler code */},
+   ondelete: function(request) {/* Handler code */},
+   onobserving: function(request, observeType, observeId) {/* Handler code */}
 }
 
              
 
              7. 
@@ -179,43 +179,43 @@ var requestCallbacks =
 
               var requestCallbacks =
 {
-   onget: function(request)
-   {
-      console.log("onget");
-      var response = new tizen.Response(request);
-      try
-      {
-         var representation = new tizen.Representation(doorResource.uriPath);
-         representation.resourceTypes = doorResource.resourceTypes;
-         representation.resourceInterfaces = doorResource.resourceInterfaces;
-         representation.attributes = doorAttributes;
-         response.representation = representation;
-         response.result = "SUCCESS";
-      }
-      catch (err)
-      {
-         console.log(err.name + ": " + err.message);
-         response.result = "ERROR";
-      }
-      response.send();
-   }
+   onget: function(request)
+   {
+      console.log("onget");
+      var response = new tizen.Response(request);
+      try
+      {
+         var representation = new tizen.Representation(doorResource.uriPath);
+         representation.resourceTypes = doorResource.resourceTypes;
+         representation.resourceInterfaces = doorResource.resourceInterfaces;
+         representation.attributes = doorAttributes;
+         response.representation = representation;
+         response.result = "SUCCESS";
+      }
+      catch (err)
+      {
+         console.log(err.name + ": " + err.message);
+         response.result = "ERROR";
+      }
+      response.send();
+   }
 }
 
              
 
 
            7. 
   
              Create a resource using the prepared handlers, chosen resource path, types, and interfaces:
              
 
              -var uriPath = "/door";
-var resourceTypes = ["core.door"];
-var resourceInterfaces = ["oic.if.b"];
+var uriPath = "/door";
+var resourceTypes = ["core.door"];
+var resourceInterfaces = ["oic.if.b"];
 var policy =
 {
-   isObservable: true,
-   isDiscoverable: true
+   isObservable: true,
+   isDiscoverable: true
 };
 
 doorResource = iotServer.createResource(uriPath, resourceTypes, resourceInterfaces,
-                                        requestCallbacks, policy);
+                                        requestCallbacks, policy);
 
              
 
              8. 
 
            
@@ -232,14 +232,14 @@ doorResource = iotServer.createResource(uriPath, resourceTypes, resourceInterfac
   
            For managing secure virtual resources, a CBOR format file (Concise Binary Object Representation) must be
 	available, preferably in the application local storage. For more information on security, see Iotivity Security.
            
 
            -var cborPath = "path_to_my_app_storage/iotcon-client-test.dat";
+var cborPath = "path_to_my_app_storage/iotcon-client-test.dat";

          4. Initialize Iotcon and set a human friendly name:

             tizen.iotcon.initialize(cborPath);
-tizen.iotcon.deviceName = "Device 2";
+tizen.iotcon.deviceName = "Device 2";
          5. @@ -264,13 +264,13 @@ var client = tizen.iotcon.getClient();

            The hostAddress value must be in the Constrained Application Protocol (CoAP) format (coap(s)://address:port), for example, coaps://[fe80::ae5a:14ff:fe24:b8fe]:12345 or coaps://192.168.1.10:12345. The null value indicates that the client communicates with all nodes (multicast).

             var hostAddress = null;
-var connectivityType = "IP";
+var connectivityType = "IP";

          6. Prepare a query. You can search for specific resourceType and resourceInterface values, and add an attribute filter:

            -var query = {resourceType: "core.door"};
+var query = {resourceType: "core.door"};

            For more information, see the Query interface (in mobile, wearable, and TV applications).

            7. @@ -283,29 +283,29 @@ client.findResource(hostAddress, query, connectivityType, foundSuccess, onerror) 
             function onerror(err)
 {
-   console.log("Failed to find resource: " + err.message);
+   console.log("Failed to find resource: " + err.message);
 }

            The success callback lists information, types, and interfaces for every found remote resource:

             function foundSuccess(resource)
 {
-   if (resource)
-   {
-      console.log(resource.uriPath);
-      console.log(resource.hostAddress);
-      console.log(resource.deviceId);
-      var resourceTypes = resource.resourceTypes;
-      for (var i in resourceTypes)
-      {
-         console.log(resourceTypes[i]);
-      }
-      var resourceInterfaces = resource.resourceInterfaces;
-      for (var i in resourceInterfaces)
-      {
-         console.log(resourceInterfaces[i]);
-      }
-   }
+   if (resource)
+   {
+      console.log(resource.uriPath);
+      console.log(resource.hostAddress);
+      console.log(resource.deviceId);
+      var resourceTypes = resource.resourceTypes;
+      for (var i in resourceTypes)
+      {
+         console.log(resourceTypes[i]);
+      }
+      var resourceInterfaces = resource.resourceInterfaces;
+      for (var i in resourceInterfaces)
+      {
+         console.log(resourceInterfaces[i]);
+      }
+   }
 }
            @@ -321,17 +321,17 @@ function foundSuccess(resource) 
             function onerror(err)
 {
-   console.log("Failed to find resource: " + err.message);
+   console.log("Failed to find resource: " + err.message);
 }
 
 function foundSuccess(platformInfo)
 {
-   console.log(platformInfo.platformId);
-   console.log(platformInfo.modelNumber);
-   console.log(platformInfo.platformVersion);
-   console.log(platformInfo.operatingSystemVersion);
-   console.log(platformInfo.systemTime);
-   /* Other PlatformInfo object attributes; see the API Reference for details */
+   console.log(platformInfo.platformId);
+   console.log(platformInfo.modelNumber);
+   console.log(platformInfo.platformVersion);
+   console.log(platformInfo.operatingSystemVersion);
+   console.log(platformInfo.systemTime);
+   /* Other PlatformInfo object attributes; see the API Reference for details */
 }
            @@ -345,8 +345,8 @@ var client = tizen.iotcon.getClient();

            Prepare the server address, connectivity type, and query (with optional filters):

             /* hostAddress must be a valid IP address, or null for all nodes (multicast) */
-var hostAddress = "coaps://192.168.0.10:12345";
-var connectivityType = "IP";
+var hostAddress = "coaps://192.168.0.10:12345";
+var connectivityType = "IP";
 /* null means no filter */
 var query = null;
            @@ -357,7 +357,7 @@ var query = null;

            Get the platform information from the remote server:

             client.findPlatformInfo(hostAddress, query, connectivityType,
-                        foundSuccess, onerror);
+                        foundSuccess, onerror);

            The success callback is called with the PlatformInfo object (in mobile, wearable, and TV applications) as a parameter. You can access the platform information in the object attributes.

            @@ -365,7 +365,7 @@ client.findPlatformInfo(hostAddress, query, connectivityType,

            Get the device information from the remote server:

             client.findDeviceInfo(hostDeviceIpAddress, query, connectivityType,
-                      foundSuccess, onerror);
+                      foundSuccess, onerror);

            The success callback is called with the DeviceInfo object (in mobile, wearable, and TV applications) as a parameter. You can access the device information in the object attributes.

            @@ -380,20 +380,20 @@ client.findDeviceInfo(hostDeviceIpAddress, query, connectivityType, 
             function onresponse(remoteResponse)
 {
-   if (remoteResponse.result != "SUCCESS")
-   {
-      console.log("the result is not SUCCESS");
+   if (remoteResponse.result != "SUCCESS")
+   {
+      console.log("the result is not SUCCESS");
 
-      return;
-   }
+      return;
+   }
 
-   var repr = remoteResponse.representation;
+   var repr = remoteResponse.representation;
 
-   /* You can retrieve attributes from Representation object in RemoteResponse */
-   for (var key in repr.attributes)
-   {
-      console.log(key + ": " + repr.attributes[key]);
-   }
+   /* You can retrieve attributes from Representation object in RemoteResponse */
+   for (var key in repr.attributes)
+   {
+      console.log(key + ": " + repr.attributes[key]);
+   }
 }
            @@ -404,7 +404,7 @@ function onresponse(remoteResponse)

            Once you have a RemoteResource object, use the methodGet() method to send a request to the server. For a list of resource attributes you can request, see the API Reference (in mobile, wearable, and TV applications).

             /* filter results, query = null means no filter */
-query["filter"] = {openstate: "open"};
+query["filter"] = {openstate: "open"};
 resource.methodGet(onresponse, query, onerror);

            As a result, the onresponse or (optional) onerror callback is called.

            @@ -419,8 +419,8 @@ resource.methodGet(onresponse, query, onerror); 
             function onresponse(remoteResponse)
 {
-   console.log("result is " + remoteResponse.result);
-   /* remoteResponse.result is expected to be "RESOURCE_CHANGED" */
+   console.log("result is " + remoteResponse.result);
+   /* remoteResponse.result is expected to be "RESOURCE_CHANGED" */
 }
            @@ -431,15 +431,15 @@ function onresponse(remoteResponse)

            Once you have a RemoteResource object (in mobile, wearable, and TV applications), use the success callback to create a Representation object (in mobile, wearable, and TV applications). This object represents the changes in attributes, types, and interfaces.

             representation = new tizen.Representation(uriPath);
-representation.resourceTypes = ["core.door"];
-representation.attributes = {openstate: "closed"};
+representation.resourceTypes = ["core.door"];
+representation.attributes = {openstate: "closed"};

          7. Call the methodPut() method on the RemoteResource object:

             /* Optional filter, query = null means no filter */
-query["filter"] = {openstate: "open"}
+query["filter"] = {openstate: "open"}
 resource.methodPut(representation, onresponse, query, onerror);

            After a successful request, the onresponse callback is called with the result and updated resource representation. In case of a failure, the (optional) onerror callback is called.

            @@ -459,14 +459,14 @@ resource.methodPut(representation, onresponse, query, onerror); 
             function onchanged(isAlive)
 {
-   if (isAlive == true)
-   {
-      console.log("Remote resource is alive");
-   }
-   else
-   {
-      console.log("Remote resource is lost");
-   }
+   if (isAlive == true)
+   {
+      console.log("Remote resource is alive");
+   }
+   else
+   {
+      console.log("Remote resource is lost");
+   }
 }
            8. diff --git a/org.tizen.guides/html/web/connectivity/nfc_w.htm b/org.tizen.guides/html/web/connectivity/nfc_w.htm index 908b98b..5a2dc75 100644 --- a/org.tizen.guides/html/web/connectivity/nfc_w.htm +++ b/org.tizen.guides/html/web/connectivity/nfc_w.htm @@ -40,7 +40,7 @@
          8. Using NFC Card Emulation
          9. Using NFC Host-based Card Emulation
          10. NFC Application Control Operations
            11. -
      +

    Related Info

    • NFC API for Mobile Web
      • @@ -53,7 +53,7 @@

      Near Field Communication (NFC)

      -

      Near Field Communication (NFC) service enables information exchange between NFC-enabled devices (called "peers") or tags. The NFC-enabled devices can share contacts, photos, and videos, and can also act as smart cards. You can use an NFC-enabled device to send NDEF messages to NFC tags to implement a variety of activities, such as paying the grocery bill or downloading a coupon. With application controls, you can launch NFC applications when NFC-related operations occur.

      +

      Near Field Communication (NFC) service enables information exchange between NFC-enabled devices (called "peers") or tags. The NFC-enabled devices can share contacts, photos, and videos, and can also act as smart cards. You can use an NFC-enabled device to send NDEF messages to NFC tags to implement a variety of activities, such as paying the grocery bill or downloading a coupon. With application controls, you can launch NFC applications when NFC-related operations occur.

      This feature is supported in mobile and wearable applications only.

      @@ -99,14 +99,14 @@

      Structure of an NDEF message

      A record in an NDEF message can be created by using the following payload types:

        -
      • Text -

        The NDEF record content is created using text format.

        +
      • Text +

        The NDEF record content is created using text format.

        The NDEFRecordText interface (in mobile and wearable applications) is used to create the text format payload using the text, languageCode, and encoding attributes.

        • -
      • URI -

        The NDEF record content is created using a URI.

        +
      • URI +

        The NDEF record content is created using a URI.

        The NDEFRecordURI interface (in mobile and wearable applications) is used to create the URI type payload using the uri attribute.

        • -
      • Media -

        The NDEF record content is created using a media format.

        +
      • Media +

        The NDEF record content is created using a media format.

        The NDEFRecordMedia interface (in mobile and wearable applications) is used to create the media format payload using the mimeType attribute.

      @@ -115,11 +115,11 @@

      To use the Application (in mobile and wearable applications) and NFC (in mobile and wearable applications) APIs, the application has to request permission by adding the following privileges to the config.xml file:

      -<tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-<tizen:privilege name="http://tizen.org/privilege/nfc.cardemulation"/>
-<tizen:privilege name="http://tizen.org/privilege/nfc.common"/>
-<tizen:privilege name="http://tizen.org/privilege/nfc.p2p"/>
-<tizen:privilege name="http://tizen.org/privilege/nfc.tag"/>
+<tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+<tizen:privilege name="http://tizen.org/privilege/nfc.cardemulation"/>
+<tizen:privilege name="http://tizen.org/privilege/nfc.common"/>
+<tizen:privilege name="http://tizen.org/privilege/nfc.p2p"/>
+<tizen:privilege name="http://tizen.org/privilege/nfc.tag"/>
      @@ -137,56 +137,56 @@

    • To get the default NFC adapter, use the getDefaultAdapter() method and prepare an ApplicationControl object (in mobile and wearable applications) to request the NFC switching operation:

       var nfcSwitchAppControl =
-   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/setting/nfc",
-                                null, null, null,
-                                [new tizen.ApplicationControlData("type", "nfc")]);
+   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/setting/nfc",
+                                null, null, null,
+                                [new tizen.ApplicationControlData("type", "nfc")]);
 var adapter = tizen.nfc.getDefaultAdapter();
    • Define the event listener for the launchAppControl() method: 
       function launchSuccess()
 {
-   console.log("NFC Settings application has successfully launched.");
+   console.log("NFC Settings application has successfully launched.");
 }
-function launchError(error) 
+function launchError(error)
 {
-   alert("An error occurred: " + error.name
-         + ". Please enable NFC through the Settings application.");
+   alert("An error occurred: " + error.name
+         + ". Please enable NFC through the Settings application.");
 }
    • Define the event handler for an application control, which implements the ApplicationControlDataArrayReplyCallback interface (in mobile and wearable applications): 
       var serviceReply =
 {
-   /* onsuccess is called when the launched application reports success */
-   onsuccess: function(data)
-   {
-      if (adapter.powered)
-      {
-         console.log("NFC is successfully turned on.");
-      }
-   }
-   /*
-      onfailure is called when the launched application
-      reports failure of the requested operation
-   */
-   onfailure: function()
-   {
-      alert("NFC Settings application reported failure.");
-   }
+   /* onsuccess is called when the launched application reports success */
+   onsuccess: function(data)
+   {
+      if (adapter.powered)
+      {
+         console.log("NFC is successfully turned on.");
+      }
+   }
+   /*
+      onfailure is called when the launched application
+      reports failure of the requested operation
+   */
+   onfailure: function()
+   {
+      alert("NFC Settings application reported failure.");
+   }
 }
    • If necessary, request launching the NFC Settings with nfcSwitchAppControl as a parameter: 
       if (adapter.powered)
 {
-   console.log("NFC is already enabled");
+   console.log("NFC is already enabled");
 }
 else
 {
-   console.log("Try to launch the NFC Settings application.");
-   tizen.application.launchAppControl(nfcSwitchAppControl, null, launchSuccess,
-                                      launchError, serviceReply);
+   console.log("Try to launch the NFC Settings application.");
+   tizen.application.launchAppControl(nfcSwitchAppControl, null, launchSuccess,
+                                      launchError, serviceReply);
 }
      • @@ -203,24 +203,24 @@ var nfcAdapter = tizen.nfc.getDefaultAdapter(); 
       var setTagDetect =
 {
-   /* When an NFC tag is detected */
-   onattach: function(nfcTag)
-   {
-      console.log("NFC Tag detected. Its type is: " + nfcTag.type);
-   }
-
-   /* When an NFC tag becomes unavailable */
-   ondetach: function()
-   {
-      console.log("NFC Tag unavailable");
-   }
+   /* When an NFC tag is detected */
+   onattach: function(nfcTag)
+   {
+      console.log("NFC Tag detected. Its type is: " + nfcTag.type);
+   }
+
+   /* When an NFC tag becomes unavailable */
+   ondetach: function()
+   {
+      console.log("NFC Tag unavailable");
+   }
 }

    • Register the listener to use the defined event handlers.

      You can limit the listener to detect only specific NFC tag types by defining the tag types as the second parameter of the setTagListener() method. In the following example, only MIFARE tags are detected.

       /* Defines the tag types to be detected */
-var tagFilter = ["MIFARE_MINI", "MIFARE_1K", "MIFARE_4K",
-                 "MIFARE_ULTRA", "MIFARE_DESFIRE"];
+var tagFilter = ["MIFARE_MINI", "MIFARE_1K", "MIFARE_4K",
+                 "MIFARE_ULTRA", "MIFARE_DESFIRE"];
 
 /* Registers the event listener */
 nfcAdapter.setTagListener(setTagDetect, tagFilter);
@@ -231,16 +231,16 @@ nfcAdapter.unsetTagListener();

      • NFC peers are detected similarly as NFC tags, except that the setPeerListener() method is used to register the NFCPeerDetectCallback listener interface, and the unsetPeerListener() method is used to stop the peer detection.

      - +

      Handling NDEF Messages

      You can handle NDEF messages by first creating NDEF records using the NDEFRecord interface (in mobile and wearable applications), and then adding the records to an NDEF message using the records attribute of the NDEFMessage interface (in mobile and wearable applications).

      To create NDEF messages:

        -

      1. To create an NDEF URI record, create an NDEFRecordURI interface instance (in mobile and wearable applications) and specify the URI parameter.

        -

        Additionally, you can create instances of the NDEFRecord, NDEFRecordText (in mobile and wearable applications), or NDEFRecordMedia (in mobile and wearable applications) interfaces based on the record type to be created.

        +

      2. To create an NDEF URI record, create an NDEFRecordURI interface instance (in mobile and wearable applications) and specify the URI parameter.

        +

        Additionally, you can create instances of the NDEFRecord, NDEFRecordText (in mobile and wearable applications), or NDEFRecordMedia (in mobile and wearable applications) interfaces based on the record type to be created.

        -var newRecord = new tizen.NDEFRecordURI("https://www.tizen.org/");
+var newRecord = new tizen.NDEFRecordURI("https://www.tizen.org/");

      3. Create an NDEFMessage interface instance:

        @@ -252,18 +252,18 @@ newMessage.records[0] = newRecord;
      -

      Exchanging NDEF Data with Peers

      -

      To exchange data between peers, the setReceiveNDEFListener() method of the NFCPeer interface (in mobile and wearable applications) registers an event listener, which triggers an event when an NDEF message is received from a peer.

      +

      Exchanging NDEF Data with Peers

      +

      To exchange data between peers, the setReceiveNDEFListener() method of the NFCPeer interface (in mobile and wearable applications) registers an event listener, which triggers an event when an NDEF message is received from a peer.

      You can use the NDEFMessageReadCallback interface (in mobile and wearable applications) to define event handlers for reading NDEF messages from peer devices.

      To exchange NDEF messages:

      1. To receive NDEF messages from a peer device, use the setReceiveNDEFListener() method of the NFCPeer interface.

        -

        The setReceiveNDEFListener() method registers the NDEFMessageReadCallback listener interface, which is invoked when an NDEF message from a peer device is read.

        +

        The setReceiveNDEFListener() method registers the NDEFMessageReadCallback listener interface, which is invoked when an NDEF message from a peer device is read.

         /* NDEFMessageReadCallback listener */
 function readMessage(message)
 {
-   console.log("Record Count is " + message.recordCount);
+   console.log("Record Count is " + message.recordCount);
 }
 
 /* Set a listener to receive an NDEF message */
@@ -283,32 +283,32 @@ Peer.sendNDEF(newMessage);

      Exchanging NDEF Data with Tags

      -

      To exchange data between tags, you can read from tags and write to tags using the readNDEF() and writeNDEF() methods.

      +

      To exchange data between tags, you can read from tags and write to tags using the readNDEF() and writeNDEF() methods.

      You can use the NDEFMessageReadCallback interface (in mobile and wearable applications) to define event handlers for reading NDEF messages from tags.

      To exchange NDEF data with tags:

        -

      1. To read data from an NFC tag, use the readNDEF() method of the NFCTag interface (in mobile and wearable applications).

        -

        The readNDEF() method registers the NDEFMessageReadCallback listener interface, which is invoked when an NDEF message is read.

        +

      2. To read data from an NFC tag, use the readNDEF() method of the NFCTag interface (in mobile and wearable applications).

        +

        The readNDEF() method registers the NDEFMessageReadCallback listener interface, which is invoked when an NDEF message is read.

         /* NDEFMessageReadCallback listener */
 function readMessage(message)
 {
-   console.log("Record Count is " + message.recordCount);
+   console.log("Record Count is " + message.recordCount);
 }
 
 /* Check whether the NFC tag supports NDEF format */
 if (Tag.isSupportedNDEF)
 {
-   /* Read NDEF data */
-   Tag.readNDEF(readMessage);
+   /* Read NDEF data */
+   Tag.readNDEF(readMessage);
 }
        3. -

      3. To write data on an NFC tag, use the writeNDEF() method:

        +

      4. To write data on an NFC tag, use the writeNDEF() method:

         var newMessage = new tizen.NDEFMessage();
 function writeCallback()
 {
-   console.log("Success!");
+   console.log("Success!");
 }
 Tag.writeNDEF(newMessage, writeCallback);
        @@ -332,39 +332,39 @@ var modeListenerId = 0, aseListenerId = 0, transListenerId = 0;
      5. Use the addCardEmulationModeChangeListener() method of the NFCAdapter interface to register a listener to monitor the current card emulation mode: 
         modeListenerId = adapter.addCardEmulationModeChangeListener(function(mode)
-   {
-      if (mode === "ALWAYS_ON")
-      {
-         console.log("We are ready to go now");
-      }
-   });
+   {
+      if (mode === "ALWAYS_ON")
+      {
+         console.log("We are ready to go now");
+      }
+   });
      6. To enable NFC card emulation, change the value of the cardEmulationMode attribute: 
        -adapter.cardEmulationMode = "ALWAYS_ON";
+adapter.cardEmulationMode = "ALWAYS_ON";
      7. To be notified when the type of an active NFC secure element changes, use the addActiveSecureElementChangeListener() method of the NFCAdapter interface: 
         aseListenerId = adapter.addActiveSecureElementChangeListener(function(seType)
-   {
-      console.log("Active secure element is " + seType);
-   });
+   {
+      console.log("Active secure element is " + seType);
+   });
      8. To be notified when a NFC secure element transaction data is exchanged, use the addTransactionEventListener() method of the NFCAdapter interface: 
         function onDetected(appletId, data)
 {
-   console.log("NFC secure element transaction detected. Application: "
-               + appletId + ". Protocol data: " + data);
+   console.log("NFC secure element transaction detected. Application: "
+               + appletId + ". Protocol data: " + data);
 });
-transListenerId = adapter.addTransactionEventListener("UICC", onDetected);
+transListenerId = adapter.addTransactionEventListener("UICC", onDetected);
      9. Remove the registered listeners when they are no longer necessary and disable NFC card emulation: 
         adapter.removeActiveSecureElementChangeListener(aseListenerId);
 adapter.removeTransactionEventListener(transListenerId);
 adapter.removeCardEmulationModeChangeListener(modeListenerId);
-adapter.cardEmulationMode = "OFF";
+adapter.cardEmulationMode = "OFF";
      @@ -377,24 +377,24 @@ adapter.cardEmulationMode = "OFF";

    • To tell the platform which AID groups are requested by the application, a metadata element must be included in the config.xml file:

      -<?xml version="1.0" encoding="utf-8"?>
-<widget xmlns:tizen="http://tizen.org/ns/widgets"
-        xmlns="http://www.w3.org/ns/widgets"
-        id="http://yourdomain/NFCtest" version="1.0.0" viewmodes="maximized">
-   <profile name="wearable"/>
-   <tizen:application id="ZmAk4fxZWY.NFCtest" package="ZmAk4fxZWY"
-                      required_version="2.3.1"/>
-   <icon src="icon.png"/>
-   <name>NFCtest</name>
-   <tizen:privilege name="http://tizen.org/privilege/nfc.common"/>
-   <tizen:privilege name="http://tizen.org/privilege/nfc.cardemulation"/>
-   <tizen:app-control>
-         <tizen:src name="index.xml" reload="enable"/>
-         <tizen:operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/host_apdu_service"/>
-         <tizen:uri name="nfc://secure/HCE/aid/A0000000041010"/>
-   </tizen:app-control>
-   <tizen:metadata key="http://tizen.org/metadata/nfc_cardemulation"
-                   value="/res/wgt/wallet.xml"/>
+<?xml version="1.0" encoding="utf-8"?>
+<widget xmlns:tizen="http://tizen.org/ns/widgets"
+        xmlns="http://www.w3.org/ns/widgets"
+        id="http://yourdomain/NFCtest" version="1.0.0" viewmodes="maximized">
+   <profile name="wearable"/>
+   <tizen:application id="ZmAk4fxZWY.NFCtest" package="ZmAk4fxZWY"
+                      required_version="2.3.1"/>
+   <icon src="icon.png"/>
+   <name>NFCtest</name>
+   <tizen:privilege name="http://tizen.org/privilege/nfc.common"/>
+   <tizen:privilege name="http://tizen.org/privilege/nfc.cardemulation"/>
+   <tizen:app-control>
+         <tizen:src name="index.xml" reload="enable"/>
+         <tizen:operation name="http://tizen.org/appcontrol/operation/nfc/card_emulation/host_apdu_service"/>
+         <tizen:uri name="nfc://secure/HCE/aid/A0000000041010"/>
+   </tizen:app-control>
+   <tizen:metadata key="http://tizen.org/metadata/nfc_cardemulation"
+                   value="/res/wgt/wallet.xml"/>
 </widget>
      • The tizen:app-control element must contain the tizen:src and tizen:operation and tizen:uri elements: @@ -414,16 +414,16 @@ adapter.cardEmulationMode = "OFF";

      • The metadata element points to an AID XML file. The following is an example of the file with an AID declaration:

        -<?xml version="1.0" encoding="utf-8"?>
-<application name="NFCtest">
-   <wallet>
-      <aid-group category="payment">
-         <aid aid="A0000000041010" se_type="hce" unlock="false" power="on"/>
-      </aid-group>
-      <aid-group category="other">
-         <aid aid="D4100000030001" se_type="hce" unlock="false" power="on"/>
-      </aid-group>
-   </wallet>
+<?xml version="1.0" encoding="utf-8"?>
+<application name="NFCtest">
+   <wallet>
+      <aid-group category="payment">
+         <aid aid="A0000000041010" se_type="hce" unlock="false" power="on"/>
+      </aid-group>
+      <aid-group category="other">
+         <aid aid="D4100000030001" se_type="hce" unlock="false" power="on"/>
+      </aid-group>
+   </wallet>
 </application>
        • The application element must contain a name attribute with an application name.
          • @@ -446,7 +446,7 @@ adapter.cardEmulationMode = "OFF"; var hceListenerId = 0; var adapter = tizen.nfc.getDefaultAdapter(); -adapter.cardEmulationMode = "ALWAYS_ON"; +adapter.cardEmulationMode = "ALWAYS_ON";

        • To detect the HCE event, use the addHCEEventListener() method of the NFCAdapter interface to register a listener.

          @@ -454,74 +454,74 @@ adapter.cardEmulationMode = "ALWAYS_ON"; 
           var successCB = function()
 {
-   console.log("Sending APDU response was successful.");
+   console.log("Sending APDU response was successful.");
 };
 
 var errorCB = function()
 {
-   console.log("Sending APDU response failed.");
+   console.log("Sending APDU response failed.");
 };
 
 hceListenerId = adapter.addHCEEventListener(function(event_data)
-   {
-      if (event_data.eventType == "ACTIVATED")
-      {
-        console.log("HCE activated");
-      }
-      else if (event_data.eventType == "DEACTIVATED")
-      {
-        console.log("HCE deactivated");
-      }
-      else if (event_data.eventType == "APDU_RECEIVED")
-      {
-        console.log("APDU received");
-        var apdu_response = [0x00,0xA4,0x04,0x00,0x04,0x11,0x12, 0x13, 0x14];
-        adapter.sendHostAPDUResponse(apdu_response, successCB, errorCB);
-      }
-   });
+   {
+      if (event_data.eventType == "ACTIVATED")
+      {
+        console.log("HCE activated");
+      }
+      else if (event_data.eventType == "DEACTIVATED")
+      {
+        console.log("HCE deactivated");
+      }
+      else if (event_data.eventType == "APDU_RECEIVED")
+      {
+        console.log("APDU received");
+        var apdu_response = [0x00,0xA4,0x04,0x00,0x04,0x11,0x12, 0x13, 0x14];
+        adapter.sendHostAPDUResponse(apdu_response, successCB, errorCB);
+      }
+   });
        • To register an AID for a specific category and secure element type, use the registerAID() method of the NFCAdapter interface: 
           try
 {
-   var aid = "ABC0012345";
-   adapter.registerAID("HCE", aid, "PAYMENT")
+   var aid = "ABC0012345";
+   adapter.registerAID("HCE", aid, "PAYMENT")
 }
 catch (err)
 {
-   console.log(err.name + ":" + err.message);
+   console.log(err.name + ":" + err.message);
 }
        • To retrieve the registered AIDs for a specific category and secure element type, use the getAIDsForCategory() method of the NFCAdapter interface: 
           try
 {
-   var successCallback = function(aid_datas)
-   {
-      for (var i = 0; i < aid_datas.length; i++)
-      {
-         console.log("SE Type is " + aid_datas[i].type);
-         console.log("AID is " + aid_datas[i].aid);
-         console.log("readonly: " + aid_datas[i].readOnly);
-      }
-   };
-
-   var errorCallback = function(error)
-   {
-     console.log("getAIDsForCategory failed.");
-   };
-
-   adapter.getAIDsForCategory("HCE", "PAYMENT", successCallback, errorCallback);
+   var successCallback = function(aid_datas)
+   {
+      for (var i = 0; i < aid_datas.length; i++)
+      {
+         console.log("SE Type is " + aid_datas[i].type);
+         console.log("AID is " + aid_datas[i].aid);
+         console.log("readonly: " + aid_datas[i].readOnly);
+      }
+   };
+
+   var errorCallback = function(error)
+   {
+     console.log("getAIDsForCategory failed.");
+   };
+
+   adapter.getAIDsForCategory("HCE", "PAYMENT", successCallback, errorCallback);
 }
 catch (err)
 {
-   console.log(err.name + ":" + err.message);
+   console.log(err.name + ":" + err.message);
 }
        • Remove the registered listeners when they are no longer necessary, and disable NFC card emulation: 
           adapter.removeHCEEventListener(hceListenerId);
-adapter.cardEmulationMode = "OFF";
+adapter.cardEmulationMode = "OFF";
          • diff --git a/org.tizen.guides/html/web/connectivity/secure_element_w.htm b/org.tizen.guides/html/web/connectivity/secure_element_w.htm index 10b76ec..4eedaeb 100644 --- a/org.tizen.guides/html/web/connectivity/secure_element_w.htm +++ b/org.tizen.guides/html/web/connectivity/secure_element_w.htm @@ -43,10 +43,10 @@

          Secure Element Access

          - +

          Tizen enables you to access secure elements in a device. You can access various secure elements, such as UICC and SIM cards, embedded secure elements, and secure SD cards.

          - -

          This feature is supported in mobile and wearable applications only.

          + +

          This feature is supported in mobile and wearable applications only.

          The main features of the Secure Element API include:

            @@ -59,46 +59,46 @@
          • Closing sessions and channels

            When the channel or session is no longer needed, you can close them.

          - +

          Prerequisites

          - +

          To use the Secure Element API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the config.xml file:

          -<tizen:privilege name="http://tizen.org/privilege/secureelement"/>
+<tizen:privilege name="http://tizen.org/privilege/secureelement"/>

          Managing Secure Elements

          - -

          To use secure elements in your application, you must learn to retrieve them and track changes in them:

          -
            + +

            To use secure elements in your application, you must learn to retrieve them and track changes in them:

            +

            1. To retrieve all the available secure element readers, use the getReaders() method of the SEService interface (in mobile and wearable applications). The method registers the ReaderArraySuccessCallback interface (in mobile and wearable applications), which is invoked when the list of available secure element readers has been successfully retrieved.

               function success(readers)
 {
-   for (var i = 0; i < readers.length; i++)
-   {
-      if (readers[i].isPresent)
-         console.log("Reader Name: " + readers[i].getName());
-   }
+   for (var i = 0; i < readers.length; i++)
+   {
+      if (readers[i].isPresent)
+         console.log("Reader Name: " + readers[i].getName());
+   }
 }
 tizen.seService.getReaders(success, function(err) {/* Error handling */});
              2. -

            2. To receive reader change notifications, use the registerSEListener() method of the SEService interface:

              +

            3. To receive reader change notifications, use the registerSEListener() method of the SEService interface:

              1. Define a listener using the SEChangeListener interface (in mobile and wearable applications):

                 var setSEChange =
 {
-   onSEReady: function(reader)
-   {
-      console.log(reader.getName() + " is ready.");
-   },
-   onSENotReady: function(reader)
-   {
-      console.log(reader.getName() + " is not ready.");
-   },
+   onSEReady: function(reader)
+   {
+      console.log(reader.getName() + " is ready.");
+   },
+   onSENotReady: function(reader)
+   {
+      console.log(reader.getName() + " is not ready.");
+   },
 }

              2. Register the listener:

                @@ -111,22 +111,22 @@ var seListener = tizen.seService.registerSEListener(setSEChange); 
                 tizen.seService.unregisterSEListener(seListener);
                3. -
              - +
            +

            Opening Sessions and Channels

            - -

            To use secure elements in your application, you must learn to open sessions and channels:

            -
              + +

              To use secure elements in your application, you must learn to open sessions and channels:

              +

              1. To open a session, use the openSession() method of the Reader interface (in mobile and wearable applications). The method registers the SessionSuccessCallback interface (in mobile and wearable applications), which is invoked when a session on a specific reader is opened.

                 function successCB(session)
 {
-   console.log("A session is open successfully");
+   console.log("A session is open successfully");
 }
 
 function errorCB(err)
 {
-   /* Error handling */
+   /* Error handling */
 }
 reader.openSession(successCB, errorCB);
                2. @@ -136,36 +136,36 @@ reader.openSession(successCB, errorCB); 
                 function successCB(channel)
 {
-   if (channel.isBasicChannel)
-      console.log("A basic channel is opened successfully");
-   else
-      console.log("A logical channel is opened successfully");
+   if (channel.isBasicChannel)
+      console.log("A basic channel is opened successfully");
+   else
+      console.log("A logical channel is opened successfully");
 }
 
 function errorCB(err)
 {
-   /* Error handling */
+   /* Error handling */
 }
 
 /* This aid is for testing purposes for your applet */
 session.openBasicChannel([0x1, 0x2, 0x3, 0x4, 0x5, 0x6, 0x7,
-                          0x8, 0x9, 0xa, 0xb, 0xc, 0xd, 0xe],
-                         successCB, errorCB);
+                          0x8, 0x9, 0xa, 0xb, 0xc, 0xd, 0xe],
+                         successCB, errorCB);

              2. Open a logical channel with the openLogicalChannel() method of the Session interface. As with a basic channel, the method registers the ChannelSuccessCallback interface.

                 session.openLogicalChannel([0x1, 0x2, 0x3, 0x4, 0x5, 0x6, 0x7,
-                            0x8, 0x9, 0xa, 0xb, 0xc, 0xd, 0xe],
-                           successCB, errorCB);
+                            0x8, 0x9, 0xa, 0xb, 0xc, 0xd, 0xe],
+                           successCB, errorCB);
                3. -
              - +
            +
          - +

          Transmitting APDUs to Secure Elements

          - -

          To use secure elements in your application, you must learn to transmit application protocol data units (APDU) to secure elements:

          -
            + +

            To use secure elements in your application, you must learn to transmit application protocol data units (APDU) to secure elements:

            +

            1. To transmit an APDU command to a secure element, use the transmit() method of the Channel interface (in mobile and wearable applications).

               /* APDU command is defined in ISO7816-4 */
@@ -175,19 +175,19 @@ channel.transmit(command, successCB, errorCB);
 
               function successCB(response)
 {
-   console.log("An APDU is transmitted successfully. The response is " + response);
+   console.log("An APDU is transmitted successfully. The response is " + response);
 }
 function errorCB(err)
 {
-   /* Error handling */
+   /* Error handling */
 }
              2. -
            - +
          +

          Closing Sessions and Channels

          - -

          To use secure elements in your application, you must learn to close sessions and channels:

          -
            + +

            To use secure elements in your application, you must learn to close sessions and channels:

            +

            1. To close a specific channel, use the close() method of the Channel interface (in mobile and wearable applications):

               channel.close();
diff --git a/org.tizen.guides/html/web/connectivity/task_bluetoothchat_w.htm b/org.tizen.guides/html/web/connectivity/task_bluetoothchat_w.htm
index 776c546..013f822 100644
--- a/org.tizen.guides/html/web/connectivity/task_bluetoothchat_w.htm
+++ b/org.tizen.guides/html/web/connectivity/task_bluetoothchat_w.htm
@@ -35,7 +35,7 @@

        Related Info

      • @@ -44,14 +44,14 @@

      Task: Bluetooth Chat

      -

      This task, based on the BluetoothChat sample delivered with the Tizen Studio, demonstrates how you can use the Bluetooth API to create a chat between 2 devices. For more information on the sample functionality and creating the sample with the full source code, see Bluetooth Chat.

      +

      This task, based on the BluetoothChat sample delivered with the Tizen Studio, demonstrates how you can use the Bluetooth API to create a chat between 2 devices. For more information on the sample functionality and creating the sample with the full source code, see Bluetooth Chat.

      This task consists of the following parts:

      +

    This sample is a fully functional application for creating a chat application.

    Defining the Application Layout

    @@ -69,28 +69,28 @@ 
     <!--Main screen layout-->
-<div id="start" data-role="page">
-   <!--Header section-->
-   <div id="start-header" data-role="header" data-position="fixed">
-      <h1>Bluetooth chat</h1>
-   </div>
+<div id="start" data-role="page">
+   <!--Header section-->
+   <div id="start-header" data-role="header" data-position="fixed">
+      <h1>Bluetooth chat</h1>
+   </div>

  • The actual content section of the screen is defined within a <div> element whose data-role attribute is set to content. It contains buttons for turning on the Bluetooth connection and either creating or joining a server connection. The buttons displayed depend on whether the Bluetooth adapter is on.

    -   <!--Content section-->
-   <div id="start-content" data-role="content" data-scroll="none">
-      <div class="box">
-         <div data-role="button" class="ui-btn-start" id="turnOnButton" 
-              style="display: none;">Turn bluetooth on</div>
-         <div data-role="button" class="ui-btn-start" id="serverButton"
-              style="display: none;">Create server</div>
-         <div data-role="button" class="ui-btn-start" id="clientButton"
-              style="display: none;">Join server</div>
-         <div id="start-monit" style="display: none;">
-            <p>Waiting for Bluetooth...</p>
-         </div>
-      </div>
-   </div>
+   <!--Content section-->
+   <div id="start-content" data-role="content" data-scroll="none">
+      <div class="box">
+         <div data-role="button" class="ui-btn-start" id="turnOnButton"
+              style="display: none;">Turn bluetooth on</div>
+         <div data-role="button" class="ui-btn-start" id="serverButton"
+              style="display: none;">Create server</div>
+         <div data-role="button" class="ui-btn-start" id="clientButton"
+              style="display: none;">Join server</div>
+         <div id="start-monit" style="display: none;">
+            <p>Waiting for Bluetooth...</p>
+         </div>
+      </div>
+   </div>
 </div>
    • @@ -101,26 +101,26 @@ 
     checkPowerState: function App_checkPowerState()
 {
-   this.ui.setContentStartAttributes(this.model.checkPowerState.bind(this.model,
-                                                                     this.ui.showPowerOnButton,
-                                                                     this.ui.showStartButtons));
+   this.ui.setContentStartAttributes(this.model.checkPowerState.bind(this.model,
+                                                                     this.ui.showPowerOnButton,
+                                                                     this.ui.showStartButtons));
 },
  • app.ui.events.js Source File

    The Create server and Join server button events are defined in the app.ui.events.js file. All the application events are based on jQuery selectors.

    -$('#serverButton').on('click', function(event)
-   {
-      app.resetApplicationMode();
-      app.startServer();
-   });
-
-$('#clientButton').on('click', function(event)
-   {
-      app.resetApplicationMode();
-      app.startClient();
-   });
+$('#serverButton').on('click', function(event)
+   {
+      app.resetApplicationMode();
+      app.startServer();
+   });
+
+$('#clientButton').on('click', function(event)
+   {
+      app.resetApplicationMode();
+      app.startClient();
+   });
    • @@ -129,48 +129,48 @@ $('#clientButton').on('click', function(event)

  • When the user taps the Create server or Join server button, a keyboard is displayed and the user can enter the server or client name.

    -<div data-role="page" id="keyboard">
-   <!--Header section-->
-   <div data-role="header" id="keyboard-header" data-position="fixed">
-      <h1></h1>
-   </div>
-
-   <!--Content section-->
-   <div data-role="content" id="keyboard-content">
-      <input type="text" id="keyboard-text" maxlength="20"/>
-   </div>
-
-   <!--Footer section-->
-   <div data-role="footer" data-position="fixed">
-      <div data-role="tabbar" data-style="tabbar">
-         <ul>
-            <li id="keyboard-ok-button"><a href="#">OK</a></li>
-         </ul>
-      </div>
-   </div>
+<div data-role="page" id="keyboard">
+   <!--Header section-->
+   <div data-role="header" id="keyboard-header" data-position="fixed">
+      <h1></h1>
+   </div>
+
+   <!--Content section-->
+   <div data-role="content" id="keyboard-content">
+      <input type="text" id="keyboard-text" maxlength="20"/>
+   </div>
+
+   <!--Footer section-->
+   <div data-role="footer" data-position="fixed">
+      <div data-role="tabbar" data-style="tabbar">
+         <ul>
+            <li id="keyboard-ok-button"><a href="#">OK</a></li>
+         </ul>
+      </div>
+   </div>
 </div>

  • When the user enters the server or client name and taps OK, the getApplicationMode() method analyzes the input and displays the server selection or chat screen, respectively.

    -$('#keyboard-ok-button').on('click', function(event)
-   {
-      event.preventDefault();
-      var value = $('#keyboard-text').val(), mode;
-      if (value.length !== 0)
-      {
-         app.setUserName(value);
-         mode = app.getApplicationMode();
-         if (mode === 'server')
-         {
-            app.setAdapterName();
-         }
-         else if (mode === 'client')
-         {
-            $.mobile.changePage('#choose');
-         }
-      }
-   });
+$('#keyboard-ok-button').on('click', function(event)
+   {
+      event.preventDefault();
+      var value = $('#keyboard-text').val(), mode;
+      if (value.length !== 0)
+      {
+         app.setUserName(value);
+         mode = app.getApplicationMode();
+         if (mode === 'server')
+         {
+            app.setAdapterName();
+         }
+         else if (mode === 'client')
+         {
+            $.mobile.changePage('#choose');
+         }
+      }
+   });
    • @@ -178,67 +178,67 @@ $('#keyboard-ok-button').on('click', function(event) -

    Defining the Choose Your Server Screen

    +

    Defining the Choose Your Server Screen

    1. templates/choose_page.tpl Source File

      1. The content section of the Choose your server screen displays a list of available servers.

        -<div data-role="page" id="choose">
-   <!--Header section-->
-   <div data-role="header" id="choose-header" data-position="fixed">
-      <h1>Choose your server</h1>
-      <div data-role="progress" data-style="circle" id="discovering"></div>
-   </div>
-
-   <!--Content section-->
-   <div data-role="content" id="choose-content">
-      <ul data-role="listview"></ul>
-   </div>
+<div data-role="page" id="choose">
+   <!--Header section-->
+   <div data-role="header" id="choose-header" data-position="fixed">
+      <h1>Choose your server</h1>
+      <div data-role="progress" data-style="circle" id="discovering"></div>
+   </div>
+
+   <!--Content section-->
+   <div data-role="content" id="choose-content">
+      <ul data-role="listview"></ul>
+   </div>
 </div>

      2. When the user taps a server name, the system starts searching for the server and attempts to connect to it. After connecting, the system displays confirmation pop-ups.

        -$('#choose-content').on('tap', 'ul.ui-listview li', function()
-   {
-      app.client.stopServerSearching($(this).attr('address'));
-   });
+$('#choose-content').on('tap', 'ul.ui-listview li', function()
+   {
+      app.client.stopServerSearching($(this).attr('address'));
+   });
      2. -
    +

    Defining the Chat Screen

    1. templates/chat_page.tpl Source File -

      The structure of this template is similar to the main screen. The header displays the current role of the device (server or client) and its name.

      +

      The structure of this template is similar to the main screen. The header displays the current role of the device (server or client) and its name.

      The content area displays a list view with message bubbles. The layout of the bubbles is defined in the left_bubble.tpl and right_bubble.tpl template files.

      The footer section contains a textArea for writing a message and a button for sending it.

      -<div id="chat" data-role="page" data-footer-exist="true">
-   <!--Header section-->
-   <div id="chat-header" data-role="header" data-position="fixed">
-      <h1><span id="chat-header-type"></span><span id="chat-header-name"></span></h1>
-   </div>
-
-   <!--Content section-->
-   <div id="chat-content" data-role="content">
-      <ul data-role="listview"></ul>
-   </div>
-
-   <!--Footer section-->
-   <div id="chat-footer" data-role="footer" data-position="fixed">
-      <div id="ui-textArea">
-         <div id="ui-textArea-text">
-            <textarea id="text" placeholder="Your message" data-role="none"></textarea>
-         </div>
-         <div id="ui-textArea-button">
-            <a data-role="button" id="ui-mySend">Send</a>
-         </div>
-      </div>
-   </div>
+<div id="chat" data-role="page" data-footer-exist="true">
+   <!--Header section-->
+   <div id="chat-header" data-role="header" data-position="fixed">
+      <h1><span id="chat-header-type"></span><span id="chat-header-name"></span></h1>
+   </div>
+
+   <!--Content section-->
+   <div id="chat-content" data-role="content">
+      <ul data-role="listview"></ul>
+   </div>
+
+   <!--Footer section-->
+   <div id="chat-footer" data-role="footer" data-position="fixed">
+      <div id="ui-textArea">
+         <div id="ui-textArea-text">
+            <textarea id="text" placeholder="Your message" data-role="none"></textarea>
+         </div>
+         <div id="ui-textArea-button">
+            <a data-role="button" id="ui-mySend">Send</a>
+         </div>
+      </div>
+   </div>
 </div>
      @@ -248,14 +248,14 @@ $('#choose-content').on('tap', 'ul.ui-listview li', func 
       checkSendButtonState: function Ui_checkSendButtonState()
 {
-   if (app.helpers.checkStringLength($('#text').val().trim()) && app.isConnection())
-   {
-      this.enableSendButton();
-   }
-   else
-   {
-      this.disableSendButton();
-   }
+   if (app.helpers.checkStringLength($('#text').val().trim()) && app.isConnection())
+   {
+      this.enableSendButton();
+   }
+   else
+   {
+      this.disableSendButton();
+   }
 },
      2. @@ -268,12 +268,12 @@ checkSendButtonState: function Ui_checkSendButtonState() 
       <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-   <tizen:privilege name="http://tizen.org/privilege/bluetooth.admin"/>
-   <tizen:privilege name="http://tizen.org/privilege/bluetooth.gap"/>
-   <tizen:privilege name="http://tizen.org/privilege/bluetooth.spp"/>
-   <!--Other configuration details-->
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+   <tizen:privilege name="http://tizen.org/privilege/bluetooth.admin"/>
+   <tizen:privilege name="http://tizen.org/privilege/bluetooth.gap"/>
+   <tizen:privilege name="http://tizen.org/privilege/bluetooth.spp"/>
+   <!--Other configuration details-->
 </widget>
      @@ -297,21 +297,21 @@ this.adapter = tizen.bluetooth.getDefaultAdapter(); 
       powerOn: function Model_powerOn(callback)
 {
-   if (!this.adapter.powered)
-   {
-      try
-      {
-         this.adapter.setPowered(true, function()
-            {
-               setTimeout(function() {callback();}, 500);
-            });
-         app.ui.showPowerOnButton();
-      }
-   }
-   else
-   {
-      callback();
-   }
+   if (!this.adapter.powered)
+   {
+      try
+      {
+         this.adapter.setPowered(true, function()
+            {
+               setTimeout(function() {callback();}, 500);
+            });
+         app.ui.showPowerOnButton();
+      }
+   }
+   else
+   {
+      callback();
+   }
 },
      @@ -325,8 +325,8 @@ powerOn: function Model_powerOn(callback) 
       registerServer: function Server_registerServer()
 {
-   this.model.registerServer(this.adapter, this.serviceUUID,
-                             this.registerServerSuccess.bind(this));
+   this.model.registerServer(this.adapter, this.serviceUUID,
+                             this.registerServerSuccess.bind(this));
 },
      @@ -340,15 +340,15 @@ registerServer: function Server_registerServer()

      After defining the default Bluetooth adapter and setting up the server, you can select the requested server and bond the devices using the connectToService() method.

       connectToService: function ClientModel_connectToService(device, serviceUUID,
-                                                        successCallback,
-                                                        errorCallback)
+                                                        successCallback,
+                                                        errorCallback)
 {
-   this.client.chatServerDevice = device;
-   try
-   {
-      device.connectToServiceByUUID(serviceUUID, successCallback,
-                                    errorCallback, 'RFCOMM');
-   }
+   this.client.chatServerDevice = device;
+   try
+   {
+      device.connectToServiceByUUID(serviceUUID, successCallback,
+                                    errorCallback, 'RFCOMM');
+   }
 },
      @@ -372,24 +372,24 @@ sendPing: function ClientModel_sendPing(name, socket) 
       sendMessage: function ClientModel_sendMessage(name, socket, message, callback)
 {
-   var sendTextMsg = [], messageObj, messageObjToString, i, len;
-   name = encodeURIComponent(name);
-   message = encodeURIComponent(message);
-   messageObj = {name: name, text: message, ping: false, bye: false};
-   messageObjToString = JSON.stringify(messageObj);
-   len = messageObjToString.length;
-   for (i = 0; i < len; i += 1)
-   {
-      sendTextMsg[i] = messageObjToString.charCodeAt(i);
-   }
-   try
-   {
-      if (socket !== null && socket.state === "OPEN")
-      {
-         socket.writeData(sendTextMsg);
-         callback(message);
-      }
-   }
+   var sendTextMsg = [], messageObj, messageObjToString, i, len;
+   name = encodeURIComponent(name);
+   message = encodeURIComponent(message);
+   messageObj = {name: name, text: message, ping: false, bye: false};
+   messageObjToString = JSON.stringify(messageObj);
+   len = messageObjToString.length;
+   for (i = 0; i < len; i += 1)
+   {
+      sendTextMsg[i] = messageObjToString.charCodeAt(i);
+   }
+   try
+   {
+      if (socket !== null && socket.state === "OPEN")
+      {
+         socket.writeData(sendTextMsg);
+         callback(message);
+      }
+   }
 },
      diff --git a/org.tizen.guides/html/web/connectivity/task_contactsexchanger_w.htm b/org.tizen.guides/html/web/connectivity/task_contactsexchanger_w.htm index b54e1a3..493f21b 100644 --- a/org.tizen.guides/html/web/connectivity/task_contactsexchanger_w.htm +++ b/org.tizen.guides/html/web/connectivity/task_contactsexchanger_w.htm @@ -44,11 +44,11 @@
      -

      Task: Contacts Exchanger

      +

      Task: Contacts Exchanger

      This task, based on the ContactsExchanger sample delivered with the Tizen Studio, demonstrates how you can use the NFC API to exchange contacts between devices. For more information on the sample functionality and creating the sample with the full source code, see Contacts Exchanger.

      This task consists of the following parts:

      -
        +

        This sample is a fully functional application for exchanging between devices contact information based on contacts on a SIM card.

        -

        Defining the Application Layout

        -

        The ContactsExchanger sample application layout consists of 4 screens: the main screen displays the default contact and the operation buttons, the Contacts list screen displays a list of contacts, the Add contact screen allows the user to add a new contact, and the transfer screen is displayed when the user clicks an operation button on the main screen.

        +

        Defining the Application Layout

        +

        The ContactsExchanger sample application layout consists of 4 screens: the main screen displays the default contact and the operation buttons, the Contacts list screen displays a list of contacts, the Add contact screen allows the user to add a new contact, and the transfer screen is displayed when the user clicks an operation button on the main screen.

        The following figure shows the main screens of the application.

        @@ -68,23 +68,23 @@

        Defining the Main Screen

        1. index.html Source File -
          1. +

            1. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

               <!--Main screen layout-->
-<div data-role="page" id="main">
-   <!--Header section-->
-   <div data-role="header" id="header-start">
-      <h1>Contacts exchanger</h1>
-   </div>
+<div data-role="page" id="main">
+   <!--Header section-->
+   <div data-role="header" id="header-start">
+      <h1>Contacts exchanger</h1>
+   </div>

            2. The main screen content is dynamic and created during the runtime.

              -   <!--Content section-->
-   <div data-role="content" id="content-start">
-      <!--Dynamic content-->
-   </div>
+   <!--Content section-->
+   <div data-role="content" id="content-start">
+      <!--Dynamic content-->
+   </div>
 </div>
              3. @@ -95,51 +95,51 @@ 
               loadStartPage: function ui_loadStartPage()
 {
-   if (localStorage.started === undefined)
-   {
-      this.loadTemporaryContent();
-   }
-   else
-   {
-      this.loadStartContent();
-   }
+   if (localStorage.started === undefined)
+   {
+      this.loadTemporaryContent();
+   }
+   else
+   {
+      this.loadStartContent();
+   }
 }

            3. If the default contact card is not defined, the content section of the screen displays a message and a button allowing user to create the default card.

              -<div class="box" id="temporaryBox">
-   <p class="defaultText">
-      Default card is not defined yet!<br/> Do you want to define it now?
-   </p>
-   <div data-role="button" class="ui-btn-create">Create default card</div>
+<div class="box" id="temporaryBox">
+   <p class="defaultText">
+      Default card is not defined yet!<br/> Do you want to define it now?
+   </p>
+   <div data-role="button" class="ui-btn-create">Create default card</div>
 </div>

            4. When the default card is defined and the default contact is selected, the main screen displays information about the default contact, and the operation buttons for changing the default contact, reading from or writing to the card, and communicating with another device.

              -<div class="box" id="startBox">
-   <div id="comment">
-      <p class="comment">Your default contact</p>
-      <p class="comment" id="comment-name"></p>
-      <p class="comment" id="comment-phone"></p>
-   </div>
-   <div data-role="button" class="ui-btn-create">
-      Change your default contact
-   </div>
-   <div class="gap"></div>
-   <div data-role="button" class="ui-btn-create">
-      Read from card
-   </div>
-   <div class="gap"></div>
-   <div data-role="button" class="ui-btn-create">
-      Write to card
-   </div>
-   <div class="gap"></div>
-   <div data-role="button" class="ui-btn-create">
-      Communicate with another device
-   </div>
+<div class="box" id="startBox">
+   <div id="comment">
+      <p class="comment">Your default contact</p>
+      <p class="comment" id="comment-name"></p>
+      <p class="comment" id="comment-phone"></p>
+   </div>
+   <div data-role="button" class="ui-btn-create">
+      Change your default contact
+   </div>
+   <div class="gap"></div>
+   <div data-role="button" class="ui-btn-create">
+      Read from card
+   </div>
+   <div class="gap"></div>
+   <div data-role="button" class="ui-btn-create">
+      Write to card
+   </div>
+   <div class="gap"></div>
+   <div data-role="button" class="ui-btn-create">
+      Communicate with another device
+   </div>
 </div>
              5. @@ -150,12 +150,12 @@ loadStartPage: function ui_loadStartPage()
              1. index.html Source File

                The Contacts list screen displays an aggregated contact list sorted by name. The contacts are loaded from the device default address book using the Contact API methods.

                -<ul data-role="listview" id="list-choose">
-   <li class="ui-li-multiline">
-      <a href="#"> <!--Contact name-->
-         <span class="ui-li-text-sub"><!--Contact phone number--></span>
-      </a>
-   </li>
+<ul data-role="listview" id="list-choose">
+   <li class="ui-li-multiline">
+      <a href="#"> <!--Contact name-->
+         <span class="ui-li-text-sub"><!--Contact phone number--></span>
+      </a>
+   </li>
 </ul>

                Selecting a list item saves the contact information in the local storage, and returns the user to the main screen.

                @@ -168,51 +168,51 @@ loadStartPage: function ui_loadStartPage()

                1. The transfer page is displayed shortly when the user taps the Read from card, Write to card, or Communicate with another device button on the main screen.

                  -$.mobile.changePage('#transfer');
+$.mobile.changePage('#transfer');

                2. After the pageshow event, the screen is prepared according to the selected button. The getDefaultAdapter() method is used to check the NFC connection status.

                  -$('#transfer').on('pageshow', function()
-   {
-      if (tizen.nfc.getDefaultAdapter().powered)
-      {
-         try
-         {
-            var option = $(this).data('option');
-            if (option === 'read')
-            {
-               self.prepareWaitingPage('Card to device',
-                                       'PUT WIRELESS TAG<br/>
-                                        CLOSE TO<br/>
-                                        YOUR DEVICE');
-               self.app.nfc.card.setTagDetectRead();
-            }
-            else if (option === 'write')
-            {
-               self.prepareWaitingPage('Device to card',
-                                       'PUT WIRELESS TAG<br/>
-                                        CLOSE TO<br/>
-                                        YOUR DEVICE');
-               self.app.nfc.card.setTagDetectWrite();
-            }
-            else
-            {
-               self.prepareWaitingPage('Device to device',
-                                       'PUT YOUR DEVICE<br/>
-                                        CLOSE TO<br/>
-                                        OTHER DEVICE');
-               self.app.nfc.peer.setTargetDetect();
-            }
-         }
-      }
-      else
-      {
-         $.mobile.changePage('#start');
-         alert('Please turn on NFC adapter');
-      }
-   });
+$('#transfer').on('pageshow', function()
+   {
+      if (tizen.nfc.getDefaultAdapter().powered)
+      {
+         try
+         {
+            var option = $(this).data('option');
+            if (option === 'read')
+            {
+               self.prepareWaitingPage('Card to device',
+                                       'PUT WIRELESS TAG<br/>
+                                        CLOSE TO<br/>
+                                        YOUR DEVICE');
+               self.app.nfc.card.setTagDetectRead();
+            }
+            else if (option === 'write')
+            {
+               self.prepareWaitingPage('Device to card',
+                                       'PUT WIRELESS TAG<br/>
+                                        CLOSE TO<br/>
+                                        YOUR DEVICE');
+               self.app.nfc.card.setTagDetectWrite();
+            }
+            else
+            {
+               self.prepareWaitingPage('Device to device',
+                                       'PUT YOUR DEVICE<br/>
+                                        CLOSE TO<br/>
+                                        OTHER DEVICE');
+               self.app.nfc.peer.setTargetDetect();
+            }
+         }
+      }
+      else
+      {
+         $.mobile.changePage('#start');
+         alert('Please turn on NFC adapter');
+      }
+   });
                3. @@ -220,15 +220,15 @@ $('#transfer').on('pageshow', function() 
                   prepareWaitingPage: function ui_prepareWaitingPage(title, text)
 {
-   var waitingBox, waitingContent, contentTransfer = $('#content-transfer');
-   waitingBox = $('<div class="box" id="waitingBox"></div>');
-   waitingContent = $(this.getWaitingContentHtml(text));
-   $('#header-transfer H1').text(title);
-   contentTransfer.empty();
-   waitingBox.append(waitingContent);
-   contentTransfer.append(waitingBox);
-   $('#content-start').trigger('create');
-   this.app.countDown(10, $('#counter'));
+   var waitingBox, waitingContent, contentTransfer = $('#content-transfer');
+   waitingBox = $('<div class="box" id="waitingBox"></div>');
+   waitingContent = $(this.getWaitingContentHtml(text));
+   $('#header-transfer H1').text(title);
+   contentTransfer.empty();
+   waitingBox.append(waitingContent);
+   contentTransfer.append(waitingBox);
+   $('#content-start').trigger('create');
+   this.app.countDown(10, $('#counter'));
 },
                  4. @@ -238,36 +238,36 @@ prepareWaitingPage: function ui_prepareWaitingPage(title, text) 
                   countDown: function countDown(time, obj)
 {
-   if (!this.counterState)
-   {
-      setTimeout(function()
-         {
-            this.countDown(time, obj);
-         }.bind(this), 500);
-
-      return;
-   }
-
-   obj.text(time);
-   if (time > 0)
-   {
-      if (this.nfc.isPowered())
-      {
-         time -= 1;
-         this.timeOutHandler = setTimeout(function()
-            {
-               this.countDown(time, obj);
-            }.bind(this), 1000);
-      }
-      else
-      {
-         this.nfc.timeExpired();
-      }
-   }
-   else
-   {
-      this.nfc.timeExpired();
-   }
+   if (!this.counterState)
+   {
+      setTimeout(function()
+         {
+            this.countDown(time, obj);
+         }.bind(this), 500);
+
+      return;
+   }
+
+   obj.text(time);
+   if (time > 0)
+   {
+      if (this.nfc.isPowered())
+      {
+         time -= 1;
+         this.timeOutHandler = setTimeout(function()
+            {
+               this.countDown(time, obj);
+            }.bind(this), 1000);
+      }
+      else
+      {
+         this.nfc.timeExpired();
+      }
+   }
+   else
+   {
+      this.nfc.timeExpired();
+   }
 },
                  @@ -279,32 +279,32 @@ countDown: function countDown(time, obj)

                  The Add contact screen displays the contact information received from another device. The user can save the contact information in the device default address book by tapping the Save button.

                  -<div id="contact" data-role="page" data-footer-exist="true">
-   <div data-role="header" id="header-contact" data-position="fixed">
-      <h1>Add contact</h1>
-      <a data-role="button" id="save-contact">Save</a>
-   </div>
+<div id="contact" data-role="page" data-footer-exist="true">
+   <div data-role="header" id="header-contact" data-position="fixed">
+      <h1>Add contact</h1>
+      <a data-role="button" id="save-contact">Save</a>
+   </div>
 
-   <div data-role="content" id="content-contact"></div>
+   <div data-role="content" id="content-contact"></div>
 
-   <div data-role="footer" id="footer-contact" data-position="fixed"></div>
+   <div data-role="footer" id="footer-contact" data-position="fixed"></div>
 </div>

                Initializing the Application

                -
                  +
                  1. config.xml Source File

                    The required privileges are declared in the config.xml file.

                     <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/nfc.admin"/>
-   <tizen:privilege name="http://tizen.org/privilege/nfc.common"/>
-   <tizen:privilege name="http://tizen.org/privilege/nfc.p2p"/>
-   <tizen:privilege name="http://tizen.org/privilege/nfc.tag"/>
-   <!--Other configuration details-->
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/nfc.admin"/>
+   <tizen:privilege name="http://tizen.org/privilege/nfc.common"/>
+   <tizen:privilege name="http://tizen.org/privilege/nfc.p2p"/>
+   <tizen:privilege name="http://tizen.org/privilege/nfc.tag"/>
+   <!--Other configuration details-->
 </widget>
                    2. @@ -318,23 +318,23 @@ countDown: function countDown(time, obj) 
                     startNFC: function nfc_startNFC()
 {
-   try
-   {
-      this.nfcAdapter = tizen.nfc.getDefaultAdapter();
+   try
+   {
+      this.nfcAdapter = tizen.nfc.getDefaultAdapter();
 
-      if (this.nfcAdapter.powered)
-      {
-         this.nfcStateMemory = true;
-         this.onPowerOn();
+      if (this.nfcAdapter.powered)
+      {
+         this.nfcStateMemory = true;
+         this.onPowerOn();
 
-         return;
-      }
+         return;
+      }
 
-      this.nfcStateMemory = false;
-      this.nfcAdapter.setPowered(true, this.onPowerOn.bind(this),
-                                 this.onPowerOnFails.bind(this));
+      this.nfcStateMemory = false;
+      this.nfcAdapter.setPowered(true, this.onPowerOn.bind(this),
+                                 this.onPowerOnFails.bind(this));
 
-   },
+   },
 }
                    @@ -352,11 +352,11 @@ startNFC: function nfc_startNFC() 
                     setTagDetectRead: function nfc_card_setTagDetectRead()
 {
-   this.nfc.nfcAdapter.setTagListener(
-   {
-      onattach: this.sucTagReadAttach.bind(this),
-      ondetach: this.nfc.sucDetach.bind(this.nfc)
-   });
+   this.nfc.nfcAdapter.setTagListener(
+   {
+      onattach: this.sucTagReadAttach.bind(this),
+      ondetach: this.nfc.sucDetach.bind(this.nfc)
+   });
 }
                    @@ -364,15 +364,15 @@ setTagDetectRead: function nfc_card_setTagDetectRead() 
                     sucTagReadAttach: function nfc_card_sucTagReadAttach(tag)
 {
-   try
-   {
-      if (!tag.isSupportedNDEF)
-      {
-         throw {message: "This tag doesn't support NDEF"};
-      }
-      tag.readNDEF(this.nfc.readMessage.bind(this.nfc),
-                   this.readMessageErr.bind(this));
-   }
+   try
+   {
+      if (!tag.isSupportedNDEF)
+      {
+         throw {message: "This tag doesn't support NDEF"};
+      }
+      tag.readNDEF(this.nfc.readMessage.bind(this.nfc),
+                   this.readMessageErr.bind(this));
+   }
 }
                    @@ -380,19 +380,19 @@ sucTagReadAttach: function nfc_card_sucTagReadAttach(tag) 
                     readMessage: function nfc_readMessage(message)
 {
-   try
-   {
-      this.fillRecordInfo(message.records[0]);
-   } 
+   try
+   {
+      this.fillRecordInfo(message.records[0]);
+   }
 },
 fillRecordInfo: function nfc_fillRecordInfo(record)
 {
-   try
-   {
-      var contactsData =
-         this.resolveContact(this.convertNDEF2phoneNumber(record.payload));
-      this.app.nfc.displayContact(contactsData);
-   }
+   try
+   {
+      var contactsData =
+         this.resolveContact(this.convertNDEF2phoneNumber(record.payload));
+      this.app.nfc.displayContact(contactsData);
+   }
 }

                    The retrieved contact information can be saved using the methods of the Contact API.

                    @@ -409,32 +409,32 @@ fillRecordInfo: function nfc_fillRecordInfo(record) 
                     setTagDetectWrite: function nfc_card_setTagDetectWrite()
 {
-   var suc =
-   {
-      onattach: this.sucTagWriteAttach.bind(this),
-      ondetach: this.nfc.sucDetach.bind(this.nfc)
-   };
-   this.nfc.nfcAdapter.setTagListener(suc);
+   var suc =
+   {
+      onattach: this.sucTagWriteAttach.bind(this),
+      ondetach: this.nfc.sucDetach.bind(this.nfc)
+   };
+   this.nfc.nfcAdapter.setTagListener(suc);
 }

                  2. When the tag is attached, the contact is prepared for sending it over the NFC connection. The prepareForNFC() and phoneNumber2NDEF() methods convert the contact object to VCARD_30 format, create a new NDEFMessage object, and attach it to the NDEFRecordMedia record with the VCARD_30 data. The NDEF message is saved to the tag and the main screen of the application is displayed.

                     sucTagWriteAttach: function nfc_card_sucTagWriteAttach(tag)
 {
-   var newMessage = null, fullContact = '';
-   try
-   {
-      /* Local storage contains the contact object */
-      fullContact = this.nfc.prepareForNFC(localStorage);
-      newMessage = this.nfc.phoneNumber2NDEF(fullContact);
-      if (!tag.isSupportedNDEF)
-      {
-         throw {message: "This tag doesn't support NDEF"};
-      }
-      tag.writeNDEF(newMessage,
-                    this.sucSend.bind(this),
-                    this.errSend.bind(this));
-   }
+   var newMessage = null, fullContact = '';
+   try
+   {
+      /* Local storage contains the contact object */
+      fullContact = this.nfc.prepareForNFC(localStorage);
+      newMessage = this.nfc.phoneNumber2NDEF(fullContact);
+      if (!tag.isSupportedNDEF)
+      {
+         throw {message: "This tag doesn't support NDEF"};
+      }
+      tag.writeNDEF(newMessage,
+                    this.sucSend.bind(this),
+                    this.errSend.bind(this));
+   }
 }
                    3. @@ -452,15 +452,15 @@ sucTagWriteAttach: function nfc_card_sucTagWriteAttach(tag) 
                     setTargetDetect: function nfc_peer_setTargetDetect()
 {
-   var successCallbacks =
-   {
-      onattach: this.sucTargetAttach.bind(this),
-      ondetach: this.nfc.sucDetach.bind(this.nfc)
-   };
-   try
-   {
-      this.nfc.nfcAdapter.setPeerListener(successCallbacks);
-   }
+   var successCallbacks =
+   {
+      onattach: this.sucTargetAttach.bind(this),
+      ondetach: this.nfc.sucDetach.bind(this.nfc)
+   };
+   try
+   {
+      this.nfc.nfcAdapter.setPeerListener(successCallbacks);
+   }
 }
                    @@ -469,16 +469,16 @@ setTargetDetect: function nfc_peer_setTargetDetect() 
                     sucTargetAttach: function nfc_peer_sucTargetAttach(target)
 {
-   var newMessage = null, fullContact = this.nfc.prepareForNFC(localStorage);
-   this.nfc.nfcTarget = target;
-   this.setReceiveFromTarget();
-   try
-   {
-      newMessage = this.nfc.phoneNumber2NDEF(fullContact);
-      target.sendNDEF(newMessage,
-                      this.sucSendToTarget.bind(this),
-                      this.errSendToTarget.bind(this));
-   }
+   var newMessage = null, fullContact = this.nfc.prepareForNFC(localStorage);
+   this.nfc.nfcTarget = target;
+   this.setReceiveFromTarget();
+   try
+   {
+      newMessage = this.nfc.phoneNumber2NDEF(fullContact);
+      target.sendNDEF(newMessage,
+                      this.sucSendToTarget.bind(this),
+                      this.errSendToTarget.bind(this));
+   }
 }
                    @@ -489,7 +489,7 @@ sucTargetAttach: function nfc_peer_sucTargetAttach(target) 
                     setReceiveFromTarget: function nfc_peer_setReceiveFromTarget()
 {
-   this.nfc.nfcTarget.setReceiveNDEFListener(this.nfc.readMessage.bind(this.nfc));
+   this.nfc.nfcTarget.setReceiveNDEFListener(this.nfc.readMessage.bind(this.nfc));
 }
                    diff --git a/org.tizen.guides/html/web/connectivity/task_downloadmanager_w.htm b/org.tizen.guides/html/web/connectivity/task_downloadmanager_w.htm index ea73503..0526e4b 100644 --- a/org.tizen.guides/html/web/connectivity/task_downloadmanager_w.htm +++ b/org.tizen.guides/html/web/connectivity/task_downloadmanager_w.htm @@ -20,7 +20,7 @@

                    Mobile Web Wearable Web

                    - +

                    Dependencies

                      @@ -43,14 +43,14 @@
                      -

                      Task: Download Manager

                      +

                      Task: Download Manager

                      This task, based on the DownloadManager sample delivered with the Tizen Studio, demonstrates how you can use the Download API (in mobile and wearable applications) to asynchronously download URL content to the device storage. For more information on the sample functionality and creating the sample with the full source code, see Download Manager.

                      -

                      This task consists of the following parts:

                      +

                      This task consists of the following parts:

                      +

                    This sample is a fully functional application which allows the user to download any content by providing its URL. The user can control the download process.

                    @@ -68,47 +68,47 @@
                  3. index.html Source File

                    The main screen of the application displays the URL input field, whose value is by default set to http://trailers.divx.com/divx_prod/profiles/WiegelesHeliSki_DivXPlus_19Mbps.mkv, and the OK button.

                    -<div id="main-header" data-role="header" data-position="fixed">
-   <h1>Download manager</h1>
-   <div id="main-url-div">
-      <div id="main-input-div">
-         <input type="text" id="main-url-text" placeholder="type URL"
-                value="http://trailers.divx.com/divx_prod/profiles/WiegelesHeliSki_DivXPlus_19Mbps.mkv"/>
-      </div>
-      <div id="main-button-div"><a data-role="button" id="main-url-ok">OK</a></div>
-   </div>
+<div id="main-header" data-role="header" data-position="fixed">
+   <h1>Download manager</h1>
+   <div id="main-url-div">
+      <div id="main-input-div">
+         <input type="text" id="main-url-text" placeholder="type URL"
+                value="http://trailers.divx.com/divx_prod/profiles/WiegelesHeliSki_DivXPlus_19Mbps.mkv"/>
+      </div>
+      <div id="main-button-div"><a data-role="button" id="main-url-ok">OK</a></div>
+   </div>
 </div>
                  4. js/app.ui.events.js Source File

                    Clicking the OK button starts the download.

                    -$('#main-header').on('tap', '#main-url-ok', function onUrlOkTap()
-   {
-      app.startDownloading($('#main-url-text').val());
-   });
+$('#main-header').on('tap', '#main-url-ok', function onUrlOkTap()
+   {
+      app.startDownloading($('#main-url-text').val());
+   });
                  5. index.html Source File

                    The download items are displayed on the main screen as a list, and the footer has the Refresh button.

                    -<div id="main-content" data-role="content">
-   <ul data-role="listview"></ul>
+<div id="main-content" data-role="content">
+   <ul data-role="listview"></ul>
 </div>
 
-<div id="main-footer" data-role="footer" data-position="fixed">
-   <div data-role="button" data-inline="true" data-style="round"
-        id="refresh-button">Refresh</div>
+<div id="main-footer" data-role="footer" data-position="fixed">
+   <div data-role="button" data-inline="true" data-style="round"
+        id="refresh-button">Refresh</div>
 </div>
                  6. js/app.ui.events.js Source File

                    Clicking the Refresh button refreshes the download item list.

                    -$('#refresh-button').on('tap', function onRefreshBtnTap(event)
-   {
-      event.preventDefault();
-      event.stopPropagation();
-      app.refreshDownloadsList();
-   });
+$('#refresh-button').on('tap', function onRefreshBtnTap(event)
+   {
+      event.preventDefault();
+      event.stopPropagation();
+      app.refreshDownloadsList();
+   });

                  Defining the Template Mechanism

                  @@ -123,70 +123,70 @@ $('#refresh-button').on('tap', function onRefreshBtnTap(event) 
                   loadToCache: function TemplateManager_loadToCache(tplNames, onSuccess)
 {
-   var self = this,
-       cachedTemplates = 0,
-       tplName,
-       tplPath;
-
-   if ($.isArray(tplNames))
-   {
-      /* For each template */
-      $.each(tplNames, function onTplIterate(index, fileName)
-         {
-            /* Cache template html */
-            if (self.cache[fileName] === undefined)
-            {
-               tplName =
-               [
-                  fileName,
-                  app.config.get('templateExtension')
-               ].join('');
-               tplPath =
-               [
-                  app.config.get('templateDir'),
-                  tplName
-               ].join('/');
-
-               $.ajax(
-               {
-                  url: tplPath,
-                  cache: true,
-                  dataType: 'html',
-                  async: true,
-                  success: function onTplLoadSuccess(data)
-                  {
-                     /* Increase counter */
-                     cachedTemplates += 1;
-
-                     /* Save to cache */
-                     self.cache[fileName] = data;
-
-                     /* If all templates are cached, launch callback */
-                     if (cachedTemplates >= tplNames.length
-                         && typeof onSuccess === 'function')
-                     {
-                        onSuccess();
-                     }
-                  },
-                  error: function onTplLoadError(jqXHR, textStatus, errorThrown)
-                  {
-                     /* Error handling */
-                  }
-               });
-            }
-            else
-            {
-               /* Template is already cached */
-               cachedTemplates += 1;
-               /* If all templates are cached, launch callback */
-               if (cachedTemplates >= tplNames.length
-                   && typeof onSuccess === 'function')
-               {
-                  onSuccess();
-               }
-            }
-      });
-   }
+   var self = this,
+       cachedTemplates = 0,
+       tplName,
+       tplPath;
+
+   if ($.isArray(tplNames))
+   {
+      /* For each template */
+      $.each(tplNames, function onTplIterate(index, fileName)
+         {
+            /* Cache template html */
+            if (self.cache[fileName] === undefined)
+            {
+               tplName =
+               [
+                  fileName,
+                  app.config.get('templateExtension')
+               ].join('');
+               tplPath =
+               [
+                  app.config.get('templateDir'),
+                  tplName
+               ].join('/');
+
+               $.ajax(
+               {
+                  url: tplPath,
+                  cache: true,
+                  dataType: 'html',
+                  async: true,
+                  success: function onTplLoadSuccess(data)
+                  {
+                     /* Increase counter */
+                     cachedTemplates += 1;
+
+                     /* Save to cache */
+                     self.cache[fileName] = data;
+
+                     /* If all templates are cached, launch callback */
+                     if (cachedTemplates >= tplNames.length
+                         && typeof onSuccess === 'function')
+                     {
+                        onSuccess();
+                     }
+                  },
+                  error: function onTplLoadError(jqXHR, textStatus, errorThrown)
+                  {
+                     /* Error handling */
+                  }
+               });
+            }
+            else
+            {
+               /* Template is already cached */
+               cachedTemplates += 1;
+               /* If all templates are cached, launch callback */
+               if (cachedTemplates >= tplNames.length
+                   && typeof onSuccess === 'function')
+               {
+                  onSuccess();
+               }
+            }
+      });
+   }
 };
                1. @@ -194,12 +194,12 @@ loadToCache: function TemplateManager_loadToCache(tplNames, onSuccess) 
                   get: function TemplateManager_get(tplName, tplParams)
 {
-   if (this.cache[tplName] !== undefined)
-   {
-      return this.getCompleted(this.cache[tplName], tplParams);
-   }
+   if (this.cache[tplName] !== undefined)
+   {
+      return this.getCompleted(this.cache[tplName], tplParams);
+   }
 
-   return '';
+   return '';
 }
                2. @@ -207,17 +207,17 @@ get: function TemplateManager_get(tplName, tplParams) 
                   getCompleted: function TemplateManager_getCompleted(tplHtml, tplParams)
 {
-   var tplParam;
+   var tplParam;
 
-   for (tplParam in tplParams)
-   {
-      if (tplParams.hasOwnProperty(tplParam))
-      {
-         tplHtml = this.passThruModifiers(tplHtml, tplParam, tplParams[tplParam]);
-      }
-   }
+   for (tplParam in tplParams)
+   {
+      if (tplParams.hasOwnProperty(tplParam))
+      {
+         tplHtml = this.passThruModifiers(tplHtml, tplParam, tplParams[tplParam]);
+      }
+   }
 
-   return tplHtml;
+   return tplHtml;
 }
              @@ -227,32 +227,32 @@ getCompleted: function TemplateManager_getCompleted(tplHtml, tplParams)
              1. templates/download-row.tpl Source File

                The download items are displayed in a list, where each item is its own row. The rows are placed in the list using the Template Manager.

                -

                Every list element contains an icon suitable for the content type, the file name, some control buttons proper for the current download state, and a progress bar representing the download progress. The elements also have additional attributes used to recognize the download element recognition from the JavaScript code, for example while updating the progress bar value.

                +

                Every list element contains an icon suitable for the content type, the file name, some control buttons proper for the current download state, and a progress bar representing the download progress. The elements also have additional attributes used to recognize the download element recognition from the JavaScript code, for example while updating the progress bar value.

                -<li class="downloadListElement" id="%downloadId%">
-   <div class="download-item">
-      <div class="download-desc" style="position: relative;">
-         <img src="images/%fileIcon%" alt="icon" class="ui-li-bigicon"></img>
-         <p class="download-name" id="name%downloadId%">%fileName%</p>
-      </div>
-      <div class="download-control">
-         <div data-role="progressbar" id="progressbar%downloadId%"></div>
-         <div class="download-buttons">
-            <div data-role="button" class="download-button download-navigation-button"
-                 state="play" for-download="%downloadId%" for-url="%url%"
-                 id="button%downloadId%" listener-flag="1">
-               <img src="images/pause.png" class="download-navigation-button-image"
-                    id="buttonimg%downloadId%"/>
-            </div>
-            <div data-role="button" class="download-button download-delete-button"
-                 state="play" for-download="%downloadId%"
-                 id="delete%downloadId%">
-               <img src="images/stop.png" class="download-navigation-button-image"
-                    id="deleteimg%downloadId%"/>
-            </div>
-         </div>
-      </div>
-   <div>
+<li class="downloadListElement" id="%downloadId%">
+   <div class="download-item">
+      <div class="download-desc" style="position: relative;">
+         <img src="images/%fileIcon%" alt="icon" class="ui-li-bigicon"></img>
+         <p class="download-name" id="name%downloadId%">%fileName%</p>
+      </div>
+      <div class="download-control">
+         <div data-role="progressbar" id="progressbar%downloadId%"></div>
+         <div class="download-buttons">
+            <div data-role="button" class="download-button download-navigation-button"
+                 state="play" for-download="%downloadId%" for-url="%url%"
+                 id="button%downloadId%" listener-flag="1">
+               <img src="images/pause.png" class="download-navigation-button-image"
+                    id="buttonimg%downloadId%"/>
+            </div>
+            <div data-role="button" class="download-button download-delete-button"
+                 state="play" for-download="%downloadId%"
+                 id="delete%downloadId%">
+               <img src="images/stop.png" class="download-navigation-button-image"
+                    id="deleteimg%downloadId%"/>
+            </div>
+         </div>
+      </div>
+   <div>
 </li>
              @@ -273,31 +273,31 @@ getCompleted: function TemplateManager_getCompleted(tplHtml, tplParams) 
               startDownloading: function Model_startDownloading(url, eventHandlers, onSuccess)
 {
-   console.log('Model_startDownloading: ' + url);
-   var downloadRequest, downloadId;
-
-   try
-   {
-      downloadRequest = new tizen.DownloadRequest(url, 'downloads');
-      downloadId = tizen.download.start(downloadRequest, eventHandlers);
-      onSuccess(downloadId, url);
-   }
+   console.log('Model_startDownloading: ' + url);
+   var downloadRequest, downloadId;
+
+   try
+   {
+      downloadRequest = new tizen.DownloadRequest(url, 'downloads');
+      downloadId = tizen.download.start(downloadRequest, eventHandlers);
+      onSuccess(downloadId, url);
+   }
 }
            5. js/app.js Source File -

              After the download process is started successfully, the download item information is added to the local storage and the application user interface is updated.

              +

              After the download process is started successfully, the download item information is added to the local storage and the application user interface is updated.

               onDownloadStarted: function App_onDownloadStarted(id, url)
 {
-   console.log('App_onDownloadStarted: ', id);
-   var fileName = this.helpers.getSourceName(url);
-   this.ui.onDownloadStarted(id, url, fileName, this.model.updateRecord.bind(this, id,
-   {
-      'fileName': fileName,
-      'url': url,
-      'state': 0
-   }));
+   console.log('App_onDownloadStarted: ', id);
+   var fileName = this.helpers.getSourceName(url);
+   this.ui.onDownloadStarted(id, url, fileName, this.model.updateRecord.bind(this, id,
+   {
+      'fileName': fileName,
+      'url': url,
+      'state': 0
+   }));
 }
            6. js/app.ui.js Source File @@ -305,23 +305,23 @@ onDownloadStarted: function App_onDownloadStarted(id, url)

              The user interface is updated using the download row template obtained through the templateManager object.

               addDownloadRecordToList: function Ui_addDownloadRecordToList(id, url, fileName,
-                                                             updateStorageCallback)
+                                                             updateStorageCallback)
 {
-   var ul = $('#main-content ul.ui-listview'),
-       fileIcon = app.helpers.resolveFileIcon(app.helpers.getFileExtension(fileName)),
-       listElement = this.templateManager.get('download-row',
-       {
-          downloadId: id,
-          fileName: fileName,
-          url: url,
-          fileIcon: fileIcon
-       });
-
-   ul.append(listElement).listview('refresh');
-   ul.find('#progressbar' + id).progressbar({value: 0});
-   ul.find('#delete' + id).button();
-   ul.find('#button' + id).button();
-   updateStorageCallback($('#progressbar' + id).progressbar('option', 'value'));
+   var ul = $('#main-content ul.ui-listview'),
+       fileIcon = app.helpers.resolveFileIcon(app.helpers.getFileExtension(fileName)),
+       listElement = this.templateManager.get('download-row',
+       {
+          downloadId: id,
+          fileName: fileName,
+          url: url,
+          fileIcon: fileIcon
+       });
+
+   ul.append(listElement).listview('refresh');
+   ul.find('#progressbar' + id).progressbar({value: 0});
+   ul.find('#delete' + id).button();
+   ul.find('#button' + id).button();
+   updateStorageCallback($('#progressbar' + id).progressbar('option', 'value'));
 }
            @@ -331,31 +331,31 @@ addDownloadRecordToList: function Ui_addDownloadRecordToList(id, url, fileName,
          2. js/app.ui.events.js Source File

            After the download item is created, the user can pause or resume operations through the applicable buttons in the download list element. To display the correct buttons, you must identify the current state of the download request.

            -$('#main').on('tap', '.download-navigation-button', function onNavigationBtnTap(event)
-   {
-      event.preventDefault();
-      event.stopPropagation();
-      var obj = $(this);
-      if (obj.attr('state') === 'play')
-      {
-         app.pauseDownloading(obj.attr('for-download'));
-      }
-      else if (obj.attr('state') === 'pause')
-      {
-         app.resumeDownloading(obj.attr('for-url'),
-                               obj.attr('for-download'),
-                               obj.attr('listener-flag'));
-      }
-      else if (obj.attr('state') === 'finished')
-      {
-         app.launchFile($('#name' + obj.attr('for-download')).text());
-      }
-      else if (obj.attr('state') === 'canceled')
-      {
-         app.startDownloading(obj.attr('for-url'),
-                              obj.attr('for-download'));
-      }
-   });
+$('#main').on('tap', '.download-navigation-button', function onNavigationBtnTap(event)
+   {
+      event.preventDefault();
+      event.stopPropagation();
+      var obj = $(this);
+      if (obj.attr('state') === 'play')
+      {
+         app.pauseDownloading(obj.attr('for-download'));
+      }
+      else if (obj.attr('state') === 'pause')
+      {
+         app.resumeDownloading(obj.attr('for-url'),
+                               obj.attr('for-download'),
+                               obj.attr('listener-flag'));
+      }
+      else if (obj.attr('state') === 'finished')
+      {
+         app.launchFile($('#name' + obj.attr('for-download')).text());
+      }
+      else if (obj.attr('state') === 'canceled')
+      {
+         app.startDownloading(obj.attr('for-url'),
+                              obj.attr('for-download'));
+      }
+   });
          3. js/app.model.js Source File
            1. @@ -363,26 +363,26 @@ $('#main').on('tap', '.download-navigation-button', func 
               pauseDownloading: function Model_pauseDownloading(downloadId)
 {
-   console.log('Model_pauseDownloading', downloadId);
-   try
-   {
-      tizen.download.pause(downloadId);
-   }
+   console.log('Model_pauseDownloading', downloadId);
+   try
+   {
+      tizen.download.pause(downloadId);
+   }
 }

            2. If the request in the paused state, the download process is resumed.

               resumeDownloading: function Model_resumeDownloading(downloadId, eventHandlers,
-                                                    listenerCallback)
+                                                    listenerCallback)
 {
-   console.log('Model_resumeDownloading: ', downloadId);
-   tizen.download.resume(downloadId);
-   if (eventHandlers !== null)
-   {
-      tizen.download.setListener(downloadId, eventHandlers);
-      listenerCallback(downloadId);
-   }
+   console.log('Model_resumeDownloading: ', downloadId);
+   tizen.download.resume(downloadId);
+   if (eventHandlers !== null)
+   {
+      tizen.download.setListener(downloadId, eventHandlers);
+      listenerCallback(downloadId);
+   }
 }
            4. @@ -392,34 +392,34 @@ resumeDownloading: function Model_resumeDownloading(downloadId, eventHandlers,
          4. js/app.ui.events.js Source File

            To stop the download process, you must first determine the download request status.

            -$('#main').on('tap', '.download-delete-button', function onDeleteBtnTap(event)
-   {
-      event.preventDefault();
-      event.stopPropagation();
-      var obj = $(this);
-      if (obj.attr('state') === 'play')
-      {
-         app.cancelDownloading(obj.attr('for-download'));
-      }
-      else if (obj.attr('state') === 'pause' ||
-               obj.attr('state') === 'finished' ||
-               obj.attr('state') === 'canceled' ||
-               obj.attr('state') === 'failed')
-      {
-         app.deleteDownloading(obj.attr('for-download'));
-      }
-   });
+$('#main').on('tap', '.download-delete-button', function onDeleteBtnTap(event)
+   {
+      event.preventDefault();
+      event.stopPropagation();
+      var obj = $(this);
+      if (obj.attr('state') === 'play')
+      {
+         app.cancelDownloading(obj.attr('for-download'));
+      }
+      else if (obj.attr('state') === 'pause' ||
+               obj.attr('state') === 'finished' ||
+               obj.attr('state') === 'canceled' ||
+               obj.attr('state') === 'failed')
+      {
+         app.deleteDownloading(obj.attr('for-download'));
+      }
+   });
          5. js/app.model.js Source File

            If the download status is play, you can invoke the download cancellation function.

             cancelDownloading: function Model_cancelDownloading(downloadId)
 {
-   console.log('Model_cancelDownloading: ' + downloadId);
-   try
-   {
-      tizen.download.cancel(downloadId);
-   }
+   console.log('Model_cancelDownloading: ' + downloadId);
+   try
+   {
+      tizen.download.cancel(downloadId);
+   }
 }
          6. js/app.ui.js Source File @@ -427,7 +427,7 @@ cancelDownloading: function Model_cancelDownloading(downloadId) 
             deleteDownloading: function Ui_deleteDownloading(id)
 {
-   $('#' + id).remove();
+   $('#' + id).remove();
 }
          diff --git a/org.tizen.guides/html/web/cordova/console_w.htm b/org.tizen.guides/html/web/cordova/console_w.htm index 6c2bef9..9e44645 100644 --- a/org.tizen.guides/html/web/cordova/console_w.htm +++ b/org.tizen.guides/html/web/cordova/console_w.htm @@ -37,7 +37,7 @@
      @@ -70,12 +70,12 @@

      Prerequisites

      To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):

      -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
-   console.log("Connection type: " + navigator.connection.type);
+   console.log("Cordova features now available");
+   console.log("Connection type: " + navigator.connection.type);
 }

      The console global object is available earlier, but it points to a default system console.

      @@ -83,8 +83,8 @@ function onDeviceReady()

      Writing Log Messages and Errors

      To write simple log and error messages to the system console, use the log() and error() methods:

      -console.log("console.log works well");
-console.error("console.error works well");
+console.log("console.log works well");
+console.error("console.error works well");
      @@ -99,13 +99,13 @@ console.error("console.error works well");
      • To print without formatting: 
        -var john = {name: "John", surname: "Doe"};
+var john = {name: "John", surname: "Doe"};
 console.dir(john.name);
      • To print with formatting, use %o: 
        -var john = {name: "John", surname: "Doe"};
-console.dir("my object %o", john);
+var john = {name: "John", surname: "Doe"};
+console.dir("my object %o", john);
      @@ -117,19 +117,19 @@ console.dir("my object %o", john);
      1. Start the timer and give it a label (a string), which is used to identify the timer: 
        -console.time("Big array initialization");
+console.time("Big array initialization");
      2. Perform some operation: 
         var array = new Array(1000000);
 for (var i = array.length - 1; i >= 0; i -= 1)
 {
-   array[i] = new Object();
+   array[i] = new Object();
 };
      3. Stop the timer by passing the same label to the timeEnd() method: 
        -console.timeEnd("Big array initialization");
+console.timeEnd("Big array initialization");

        The following output is shown in the system console:

        diff --git a/org.tizen.guides/html/web/cordova/cordova_cover_w.htm b/org.tizen.guides/html/web/cordova/cordova_cover_w.htm
index 0457e2e..aa59f8c 100644
--- a/org.tizen.guides/html/web/cordova/cordova_cover_w.htm
+++ b/org.tizen.guides/html/web/cordova/cordova_cover_w.htm
@@ -5,7 +5,7 @@
 	
 	
 	
-		
+	
 	
 	
 	
@@ -13,7 +13,7 @@
   Cordova
  
  
- 
+
  
        
 	
        
 		
        Mobile Web Wearable Web TV Web
        
@@ -29,7 +29,7 @@
 
        
 
 
        
-  
        Cordova
         
+  
        Cordova
        
   
        The Cordova features include common functionalities useful in creating Tizen Web applications.
        
   
        The main Cordova features are:
        
   
        
 
        
@@ -64,12 +64,12 @@ function f(error) {}
 	Note
 	To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):
 
        -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
-   console.log("Connection type: " + navigator.connection.type);
+   console.log("Cordova features now available");
+   console.log("Connection type: " + navigator.connection.type);
 }
 
        
 
        
diff --git a/org.tizen.guides/html/web/cordova/device_w.htm b/org.tizen.guides/html/web/cordova/device_w.htm
index c57b2b1..0033d3c 100644
--- a/org.tizen.guides/html/web/cordova/device_w.htm
+++ b/org.tizen.guides/html/web/cordova/device_w.htm
@@ -29,13 +29,13 @@
 		 
        Content
        
         
         
        Related Info
    @@ -67,7 +67,7 @@ platformOperating system name. For example: Tizen - uuidDevice's Universally Unique Identifier (UUID). The value can be the device IMEI (International Mobile Equipment Identity) or other unique value for the device. The value is converted to a string. + uuidDevice's Universally Unique Identifier (UUID). The value can be the device IMEI (International Mobile Equipment Identity) or other unique value for the device. The value is converted to a string. versionOperating system version (as a string). For example: 3.0 @@ -78,11 +78,11 @@

    Prerequisites

    To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):

    -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
+   console.log("Cordova features now available");
 }
    @@ -95,20 +95,20 @@ function onDeviceReady() 
     function onDeviceReady()
 {
-   /* Cordova is ready */
+   /* Cordova is ready */
 
-   console.log("Cordova version: " + device.cordova);
-   console.log("Model name: " + device.model);
-   console.log("Platform: " + device.platform);
-   console.log("OS version: " + device.version);
-   console.log("Device UUID: " + device.uuid);
+   console.log("Cordova version: " + device.cordova);
+   console.log("Model name: " + device.model);
+   console.log("Platform: " + device.platform);
+   console.log("OS version: " + device.version);
+   console.log("Device UUID: " + device.uuid);
 }

    UUID is a unique identifier for a device, and can be the device IMEI (International Mobile Equipment Identity).

  • Wait for the deviceready event: 
    -document.addEventListener("deviceready", onDeviceReady);
+document.addEventListener("deviceready", onDeviceReady);
    • diff --git a/org.tizen.guides/html/web/cordova/devicemotion_w.htm b/org.tizen.guides/html/web/cordova/devicemotion_w.htm index af4c30e..84d95a0 100644 --- a/org.tizen.guides/html/web/cordova/devicemotion_w.htm +++ b/org.tizen.guides/html/web/cordova/devicemotion_w.htm @@ -37,7 +37,7 @@
    @@ -90,14 +90,14 @@

    Prerequisites

    To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):

    -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
+   console.log("Cordova features now available");
 }
    - +

    Getting the Current Acceleration

    To get the current acceleration along the X, Y, and Z axes:

    @@ -106,17 +106,17 @@ function onDeviceReady() 
     function onSuccess(acceleration)
 {
-   console.log('Acceleration X: ' + acceleration.x + '\n' +
-               'Acceleration Y: ' + acceleration.y + '\n' +
-               'Acceleration Z: ' + acceleration.z + '\n' +
-               'Timestamp: ' + acceleration.timestamp);
+   console.log('Acceleration X: ' + acceleration.x + '\n' +
+               'Acceleration Y: ' + acceleration.y + '\n' +
+               'Acceleration Z: ' + acceleration.z + '\n' +
+               'Timestamp: ' + acceleration.timestamp);
 }

  • Define a callback method to be invoked when errors occur:

     function onError()
 {
-   console.log('onError!');
+   console.log('onError!');
 }

  • Call the getCurrentAcceleration() method and pass the callbacks:

    @@ -133,18 +133,18 @@ navigator.accelerometer.getCurrentAcceleration(onSuccess, onError); 
     function onSuccess(acceleration)
 {
-   console.log('Acceleration X: ' + acceleration.x + '\n' +
-               'Acceleration Y: ' + acceleration.y + '\n' +
-               'Acceleration Z: ' + acceleration.z + '\n' +
-               'Timestamp: '+ acceleration.timestamp);
-   console.log('Please wait 3 seconds for the next measurement...');
+   console.log('Acceleration X: ' + acceleration.x + '\n' +
+               'Acceleration Y: ' + acceleration.y + '\n' +
+               'Acceleration Z: ' + acceleration.z + '\n' +
+               'Timestamp: '+ acceleration.timestamp);
+   console.log('Please wait 3 seconds for the next measurement...');
 }

  • Define a callback method to be invoked when errors occur:

     function onError()
 {
-   console.log('onError!');
+   console.log('onError!');
 }
  • diff --git a/org.tizen.guides/html/web/cordova/dialogs_w.htm b/org.tizen.guides/html/web/cordova/dialogs_w.htm index ef33974..6dabdc3 100644 --- a/org.tizen.guides/html/web/cordova/dialogs_w.htm +++ b/org.tizen.guides/html/web/cordova/dialogs_w.htm @@ -38,7 +38,7 @@ @@ -71,11 +71,11 @@

    Prerequisites

    To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):

    -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
+   console.log("Cordova features now available");
 }
    @@ -89,18 +89,18 @@ function onDeviceReady() 
     var alertDismissed = function()
 {
-   console.log('Alert was dismissed');
+   console.log('Alert was dismissed');
 };

  • Open the alert dialog box with an alert text and callback function:

    -navigator.notification.alert('Please click OK button.', alertDismissed);
+navigator.notification.alert('Please click OK button.', alertDismissed);

    Alternatively, you can open the alert dialog box with an optional title (default is Dialog), and an optional button name (default is OK):

    -navigator.notification.alert('Please click Close button.', alertDismissed,
-                             'Alert title', 'Close');
+navigator.notification.alert('Please click Close button.', alertDismissed,
+                             'Alert title', 'Close');
    • @@ -116,14 +116,14 @@ navigator.notification.alert('Please click Close button.', alertDismisse 
     var confirmCallback = function(buttonIndex)
 {
-   console.log('Selected button was ' + buttonIndex);
+   console.log('Selected button was ' + buttonIndex);
 };
    -

  • Open the confirmation dialog box with a set of buttons as the last parameter. The default value is ['OK', 'Cancel'].

    +

  • Open the confirmation dialog box with a set of buttons as the last parameter. The default value is ['OK', 'Cancel'].

    -navigator.notification.confirm('Choose one option:', confirmCallback,
-                               'Options title', ['Option1', 'Option2']);
+navigator.notification.confirm('Choose one option:', confirmCallback,
+                               'Options title', ['Option1', 'Option2']);
    • @@ -140,15 +140,15 @@ navigator.notification.confirm('Choose one option:', confirmCallback, 
     var promptCallback = function(results)
 {
-   console.log('User entered a value ' + results.input1
-               + ', and selected option ' + results.buttonIndex);
+   console.log('User entered a value ' + results.input1
+               + ', and selected option ' + results.buttonIndex);
 };
    -

  • Open a prompt dialog box with a set of buttons and default text to be shown in the text input field. The default values are ['OK', 'Cancel'] and an empty string.

    +

  • Open a prompt dialog box with a set of buttons and default text to be shown in the text input field. The default values are ['OK', 'Cancel'] and an empty string.

    -navigator.notification.prompt('Please enter text:', promptCallback, 'Prompt dialog box',
-                              ['OK', 'Exit'], 'default text');
+navigator.notification.prompt('Please enter text:', promptCallback, 'Prompt dialog box',
+                              ['OK', 'Exit'], 'default text');
    • diff --git a/org.tizen.guides/html/web/cordova/events_w.htm b/org.tizen.guides/html/web/cordova/events_w.htm index d1da9b6..796ec67 100644 --- a/org.tizen.guides/html/web/cordova/events_w.htm +++ b/org.tizen.guides/html/web/cordova/events_w.htm @@ -37,7 +37,7 @@ @@ -53,7 +53,7 @@

    The Events API provides the following events:

    All Globalization functions are accessible by the navigator.globalization object (in mobile, wearable, and TV applications).

    Prerequisites

    To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):

    -document.addEventListener("deviceready",
-                          onDeviceReady, false);
+document.addEventListener("deviceready",
+                          onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
+   console.log("Cordova features now available");
 }
    - +

    Retrieving the Current Language

    To get the current BCP 47 language identifier:

     navigator.globalization.getPreferredLanguage(function(language)
-   {
-      console.log('Language: ' + language.value);
-   }, function() {console.log('Error getting language.');});
+   {
+      console.log('Language: ' + language.value);
+   }, function() {console.log('Error getting language.');});

    The following output is shown in the system log:

    @@ -113,9 +113,9 @@ Language: en-US 

     navigator.globalization.getLocaleName(function(locale)
-   {
-      console.log('Locale: ' + locale.value);
-   }, function() {console.log('Error getting locale.');});
+   {
+      console.log('Locale: ' + locale.value);
+   }, function() {console.log('Error getting locale.');});

    The following output is shown in the system log:

    @@ -141,15 +141,15 @@ Locale: en-US 
    -navigator.globalization.getCurrencyPattern('USD', function(pattern)
-   {
-      console.log('pattern: ' + pattern.pattern);
-      console.log('code: ' + pattern.code);
-      console.log('fraction: ' + pattern.fraction);
-      console.log('rounding: ' + pattern.rounding);
-      console.log('decimal: ' + pattern.decimal);
-      console.log('grouping: ' + pattern.grouping);
-   }, function() {console.log('Error getting pattern.');});
+navigator.globalization.getCurrencyPattern('USD', function(pattern)
+   {
+      console.log('pattern: ' + pattern.pattern);
+      console.log('code: ' + pattern.code);
+      console.log('fraction: ' + pattern.fraction);
+      console.log('rounding: ' + pattern.rounding);
+      console.log('decimal: ' + pattern.decimal);
+      console.log('grouping: ' + pattern.grouping);
+   }, function() {console.log('Error getting pattern.');});

    The following output is shown in the system log:

    @@ -172,17 +172,17 @@ grouping: ,

    To obtain the names of months:

     navigator.globalization.getDateNames(function(names)
-   {
-      for (var i = 0; i < names.value.length; i++)
-      {
-         console.log('month: ' + names.value[i]);
-      }
-   }, function() {console.log('Error getting names.');},
-   {type: 'wide', item: 'months'});
+   {
+      for (var i = 0; i < names.value.length; i++)
+      {
+         console.log('month: ' + names.value[i]);
+      }
+   }, function() {console.log('Error getting names.');},
+   {type: 'wide', item: 'months'});
    -

    In the above example, the third parameter is {type: 'wide', item: 'months'}, and the names of months are obtained. To obtain the names of weekdays, pass {type: 'wide', item: 'days'} as the third parameter.

    - +

    In the above example, the third parameter is {type: 'wide', item: 'months'}, and the names of months are obtained. To obtain the names of weekdays, pass {type: 'wide', item: 'days'} as the third parameter.

    +

    The following output is shown in the system log:

     /*
@@ -209,18 +209,18 @@ month: December
 
 
 
     function checkDatePattern()
 {
-   navigator.globalization.getDatePattern(function(date)
-      {
-         console.log('Date pattern: ' + date.pattern);
-      }, function() {console.log('Error getting pattern');},
-      {formatLength: 'short', selector: 'date and time'});
+   navigator.globalization.getDatePattern(function(date)
+      {
+         console.log('Date pattern: ' + date.pattern);
+      }, function() {console.log('Error getting pattern');},
+      {formatLength: 'short', selector: 'date and time'});
 }
 
 checkDatePattern();
@@ -241,12 +241,12 @@ Date pattern: M/d/yyyy h:mm a
 
    To obtain information on which day is the first day of the week (1 means Sunday):
    
 
     navigator.globalization.getFirstDayOfWeek(function(day)
-   {
-      console.log('day: ' + day.value);
-   }, function()
-   {
-      console.log('Error getting first day of week.');
-   });
+   {
+      console.log('day: ' + day.value);
+   }, function()
+   {
+      console.log('Error getting first day of week.');
+   });
 
    
 
 
    The following output is shown in the system log:
    
@@ -265,7 +265,7 @@ day: 1
 
      
   
    • Number pattern that follows Unicode Technical Standard #35
      • 
   
    • Symbol to use when formatting and parsing, such as percent or currency symbol
-  
      It depends on the third parameter of the getNumberPattern() method, which can be 'decimal', 'percent', or 'currency'.
      • 
+  
      It depends on the third parameter of the getNumberPattern() method, which can be 'decimal', 'percent', or 'currency'.
      
   
    • Number of fractional digits
      • 
   
    • Rounding increment
      • 
   
    • Symbol to use for positive numbers
      • 
@@ -275,17 +275,17 @@ day: 1
 
    
 
     navigator.globalization.getNumberPattern(function(pattern)
-   {
-      console.log('pattern: ' + pattern.pattern);
-      console.log('symbol: ' + pattern.symbol);
-      console.log('fraction: ' + pattern.fraction);
-      console.log('rounding: ' + pattern.rounding);
-      console.log('positive: ' + pattern.positive);
-      console.log('negative: ' + pattern.negative);
-      console.log('decimal: ' + pattern.decimal);
-      console.log('grouping: ' + pattern.grouping);
-   }, function() {console.log('An error occurred.');},
-   {type: 'decimal'});
+   {
+      console.log('pattern: ' + pattern.pattern);
+      console.log('symbol: ' + pattern.symbol);
+      console.log('fraction: ' + pattern.fraction);
+      console.log('rounding: ' + pattern.rounding);
+      console.log('positive: ' + pattern.positive);
+      console.log('negative: ' + pattern.negative);
+      console.log('decimal: ' + pattern.decimal);
+      console.log('grouping: ' + pattern.grouping);
+   }, function() {console.log('An error occurred.');},
+   {type: 'decimal'});
 
    
 
 
    The following output is shown in the system log:
    
@@ -310,9 +310,9 @@ grouping: ,
 
    To obtain information on whether the daylight saving time is in effect for a given date using the current time zone:
    
 
     navigator.globalization.isDayLightSavingsTime(new Date(), function(date)
-   {
-      console.log('dst: ' + date.dst);
-   }, function() {console.log('Error getting the DST state.');});
+   {
+      console.log('dst: ' + date.dst);
+   }, function() {console.log('Error getting the DST state.');});
 
    
 
 
    The following output is shown in the system log:
    
@@ -330,15 +330,15 @@ dst: true
 
    To make conversions between strings, numbers, and dates according to the current locale:
    
 
      
   
    • Date to string
-  
      To convert a date to a string according to the user's locale and time zone:
      
+  
      To convert a date to a string according to the user's locale and time zone:
      
 
       /* This example uses the default conversion options */
 
 navigator.globalization.dateToString(new Date(), function(date)
-   {
-      console.log('Date: ' + date.value);
-   }, function() {console.log('Error getting dateString.');},
-   {formatLength: 'short', selector: 'date and time'});
+   {
+      console.log('Date: ' + date.value);
+   }, function() {console.log('Error getting dateString.');},
+   {formatLength: 'short', selector: 'date and time'});
 
      
 
 
      The following output is shown in the system log:
      
@@ -353,15 +353,15 @@ Date: 9/25/2012 4:21PM
 
    
   
   
  • String to date
-  
    To convert a date formatted as a DOMString according to the user's locale and time zone:
    
+  
    To convert a date formatted as a DOMString according to the user's locale and time zone:
    
 
 
    -navigator.globalization.stringToDate('9/25/2012', function(date)
-   {
-      console.log('month: ' + date.month + ', day: ' + date.day +
-                  ', year: ' + date.year)
-   }, function() {console.log('Error getting date.');},
-   {selector: 'date'});
+navigator.globalization.stringToDate('9/25/2012', function(date)
+   {
+      console.log('month: ' + date.month + ', day: ' + date.day +
+                  ', year: ' + date.year)
+   }, function() {console.log('Error getting date.');},
+   {selector: 'date'});
 
    
 
 
    The following output is shown in the system log:
    
@@ -378,31 +378,31 @@ month: 8, day: 25, year: 2012
  • Number to string -

    To return a number formatted as a string according to the user's preferences:

    +

    To return a number formatted as a string according to the user's preferences:

     navigator.globalization.numberToString(3.1415926, function(number)
-   {
-      console.log('decimal number: ' + number.value);
-   }, function() {console.log('Error getting number.');},
-   {type: 'decimal'});
+   {
+      console.log('decimal number: ' + number.value);
+   }, function() {console.log('Error getting number.');},
+   {type: 'decimal'});
 
 navigator.globalization.numberToString(1000003, function(number)
-   {
-      console.log('big decimal number: ' + number.value);
-   }, function() {console.log('Error getting number.');},
-   {type: 'decimal'});
+   {
+      console.log('big decimal number: ' + number.value);
+   }, function() {console.log('Error getting number.');},
+   {type: 'decimal'});
 
 navigator.globalization.numberToString(0.3183099, function(number)
-   {
-      console.log('percentile: ' + number.value);
-   }, function() {console.log('Error getting number.');},
-   {type: 'percent'});
+   {
+      console.log('percentile: ' + number.value);
+   }, function() {console.log('Error getting number.');},
+   {type: 'percent'});
 
 navigator.globalization.numberToString(1099.95, function(number)
-   {
-      console.log('currency: ' + number.value);
-   }, function() {console.log('Error getting number');},
-   {type: 'currency'});
+   {
+      console.log('currency: ' + number.value);
+   }, function() {console.log('Error getting number');},
+   {type: 'currency'});

    The following output is shown in the system log:

    @@ -420,13 +420,13 @@ currency: $1,099.95
  • String to number -

    To parse a number formatted as a string according to the user's preferences and return the corresponding number:

    +

    To parse a number formatted as a string according to the user's preferences and return the corresponding number:

    -navigator.globalization.stringToNumber('1234.56', function(number)
-   {
-      console.log('number: ' + number.value);
-   }, function() {console.log('Error getting number.');},
-   {type: 'decimal'});
+navigator.globalization.stringToNumber('1234.56', function(number)
+   {
+      console.log('number: ' + number.value);
+   }, function() {console.log('Error getting number.');},
+   {type: 'decimal'});

    The following output is shown in the system log:

    diff --git a/org.tizen.guides/html/web/cordova/media_w.htm b/org.tizen.guides/html/web/cordova/media_w.htm index 127446b..5805125 100644 --- a/org.tizen.guides/html/web/cordova/media_w.htm +++ b/org.tizen.guides/html/web/cordova/media_w.htm @@ -40,7 +40,7 @@ @@ -76,11 +76,11 @@

  • To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):

    -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
+   console.log("Cordova features now available");
 }
    • @@ -88,9 +88,9 @@ function onDeviceReady()

    To use the Media API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privileges to the config.xml file:

     <!--To record audio-->
-<tizen:privilege name="http://tizen.org/privilege/mediacapture"/>
+<tizen:privilege name="http://tizen.org/privilege/mediacapture"/>
 <!--To change the volume during playback-->
-<tizen:privilege name="http://tizen.org/privilege/volume.set"/>
+<tizen:privilege name="http://tizen.org/privilege/volume.set"/>
    @@ -103,7 +103,7 @@ function onDeviceReady()

  • Place the audio file in a directory on a device. In this example, it is in the owner home directory: /home/owner/content/Music/play.mp3.

  • Construct a new media object from the audio file. No additional parameters are required.

    -var myMedia = new Media("file:///home/owner/content/Music/play.mp3");
+var myMedia = new Media("file:///home/owner/content/Music/play.mp3");

  • Call the play() method:

    @@ -120,7 +120,7 @@ myMedia.play();

    1. Construct a new media object from the audio file.

      -var myMedia = new Media("file:///home/owner/content/Music/play.mp3");
+var myMedia = new Media("file:///home/owner/content/Music/play.mp3");

    2. Start playing:

      @@ -132,17 +132,17 @@ myMedia.play();

      A timer is registered using the setTimeout() global function.

       setTimeout(function()
-   {
-      myMedia.seekTo(10000);
-      console.log('Playback position has been set to 10 seconds.');
-   }, 5000);
+   {
+      myMedia.seekTo(10000);
+      console.log('Playback position has been set to 10 seconds.');
+   }, 5000);

    3. Stop the media and release after 10 seconds:

       setTimeout(function()
-   {
-      myMedia.release();
-   }, 10000);
+   {
+      myMedia.release();
+   }, 10000);
    @@ -153,7 +153,7 @@ setTimeout(function()

    1. Construct a new media object from the audio file:

      -var myMedia = new Media("file:///home/owner/content/Music/play.mp3");
+var myMedia = new Media("file:///home/owner/content/Music/play.mp3");

    2. Start playing:

      @@ -164,16 +164,16 @@ myMedia.play();

    3. Mute the volume after 2 seconds:

       setTimeout(function()
-   {
-      myMedia.setVolume(0.0);
-   }, 2000);
+   {
+      myMedia.setVolume(0.0);
+   }, 2000);

    4. Set volume to 1.0 after 5 seconds:

       setTimeout(function()
-   {
-      myMedia.setVolume(1.0);
-   }, 5000);
+   {
+      myMedia.setVolume(1.0);
+   }, 5000);
    @@ -215,7 +215,7 @@ setTimeout(function() 
     var successCallback = function()
 {
-   console.log('Audio file has been played back.');
+   console.log('Audio file has been played back.');
 }
    • @@ -224,7 +224,7 @@ var successCallback = function() 
     var errorCallback = function(err)
 {
-   console.log('An error occurred: ' + err.code);
+   console.log('An error occurred: ' + err.code);
 }
    @@ -233,28 +233,28 @@ var errorCallback = function(err) 
     var statusCallback = function(status)
 {
-   switch (status)
-   {
-      case Media.MEDIA_NONE: console.log('Audio file status is none');
-         break;
-      case Media.MEDIA_STARTING: console.log('Audio file is starting');
-         break;
-      case Media.MEDIA_RUNNING: console.log('Audio file is running');
-         break;
-      case Media.MEDIA_PAUSED: console.log('Audio file is paused');
-         break;
-      case Media.MEDIA_STOPPED: console.log('Audio file is stopped');
-         break;
-      default: console.log('Audio file status unknown');
-         break;
-   }
+   switch (status)
+   {
+      case Media.MEDIA_NONE: console.log('Audio file status is none');
+         break;
+      case Media.MEDIA_STARTING: console.log('Audio file is starting');
+         break;
+      case Media.MEDIA_RUNNING: console.log('Audio file is running');
+         break;
+      case Media.MEDIA_PAUSED: console.log('Audio file is paused');
+         break;
+      case Media.MEDIA_STOPPED: console.log('Audio file is stopped');
+         break;
+      default: console.log('Audio file status unknown');
+         break;
+   }
 }

  • Construct a new media object and pass the callbacks as parameters.

    Since the callbacks are optional, you do not need to provide them all. However, to monitor status changes, you must provide the status callback defined in the previous step.

    -var src = "file:///home/owner/content/Music/play.mp3";
+var src = "file:///home/owner/content/Music/play.mp3";
 var myMedia = new Media(src, successCallback, errorCallback, statusCallback);
    • @@ -267,14 +267,14 @@ myMedia.play();

    Test the callbacks by pausing and resuming playback after 3 and 5 seconds:

     setTimeout(function()
-   {
-      myMedia.pause();
-   }, 3000);
+   {
+      myMedia.pause();
+   }, 3000);
 
 setTimeout(function()
-   {
-      myMedia.play();
-   }, 5000);
+   {
+      myMedia.play();
+   }, 5000);
    @@ -285,13 +285,13 @@ setTimeout(function()

  • Construct a new media object from an audio file:

    -var myMedia = new Media("file:///home/owner/content/Music/play.mp3");
+var myMedia = new Media("file:///home/owner/content/Music/play.mp3");

  • Get the duration and print it to the system log. The -1 value means that the duration is unknown.

    -console.log('Audio duration in seconds is ' + myMedia.getDuration());
+console.log('Audio duration in seconds is ' + myMedia.getDuration());

  • Start playing:

    @@ -304,7 +304,7 @@ myMedia.play(); 
     var positionCallback = function(position)
 {
-   console.log('Current position in seconds is ' + position);
+   console.log('Current position in seconds is ' + position);
 }
    • @@ -313,7 +313,7 @@ var positionCallback = function(position) 
     var errorCallback = function(err)
 {
-   console.log('An error occurred: ' + err.code);
+   console.log('An error occurred: ' + err.code);
 }
    @@ -327,9 +327,9 @@ myMedia.getCurrentPosition(positionCallback, errorCallback);

    You can set a timer to get the position 5 seconds later:

     setTimeout(function()
-   {
-      myMedia.getCurrentPosition(positionCallback, errorCallback);
-   }, 5000);
+   {
+      myMedia.getCurrentPosition(positionCallback, errorCallback);
+   }, 5000);

    Something similar to the following example is shown in the system log:

    @@ -348,18 +348,18 @@ Current position in seconds is 4.919
 
     var successCallback = function()
 {
-   console.log('Started recording audio file.');
+   console.log('Started recording audio file.');
 }
 
 var errorCallback = function(err)
 {
-   console.log('Error occurred ' + err.code);
+   console.log('Error occurred ' + err.code);
 }
 
    
     
     
  • Construct a media object and pass the name for the new audio file:
    
 
    -var myMedia = new Media("recording.mp3", successCallback, errorCallback);
+var myMedia = new Media("recording.mp3", successCallback, errorCallback);
 
    
     
    • 
     
  • Start recording:
    
@@ -370,11 +370,11 @@ myMedia.startRecord();
     
  • Stop recording after 10 seconds and release the media object:
    
 
     setTimeout(function()
-   {
-      myMedia.stopRecord();
-      console.log('Stopped recording an audio file.');
-      myMedia.release();
-   }, 10000);
+   {
+      myMedia.stopRecord();
+      console.log('Stopped recording an audio file.');
+      myMedia.release();
+   }, 10000);
 
    
 
    Always release the media object when no longer needed.
    
     
    • 
diff --git a/org.tizen.guides/html/web/cordova/network_information_w.htm b/org.tizen.guides/html/web/cordova/network_information_w.htm
index 383eab0..19d4d49 100644
--- a/org.tizen.guides/html/web/cordova/network_information_w.htm
+++ b/org.tizen.guides/html/web/cordova/network_information_w.htm
@@ -36,7 +36,7 @@
         
     
 
@@ -66,18 +66,18 @@
 
  • 
 
    To perform any Cordova-related operations, you must wait until Cordova is fully set up (the deviceready event occurs):
    
 
    -document.addEventListener("deviceready", onDeviceReady, false);
+document.addEventListener("deviceready", onDeviceReady, false);
 
 function onDeviceReady()
 {
-   console.log("Cordova features now available");
+   console.log("Cordova features now available");
 }
 
    
 
    • 
 
  • 
 
    To use the Network Information API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privilege to the config.xml file:
    
 
    -<tizen:privilege name="http://tizen.org/privilege/telephony"/>
+<tizen:privilege name="http://tizen.org/privilege/telephony"/>
 
    
 
    • 
 
@@ -123,9 +123,9 @@ function onDeviceReady()
 
    To determine whether the device is connected to a Wi-Fi network:
    
 
 
      
-
    1. Place a div element with the id="wifi-indicator" attribute somewhere in the application HTML for text output:
+
    2. Place a div element with the id="wifi-indicator" attribute somewhere in the application HTML for text output:
 
      -<div id="wifi-indicator">
+<div id="wifi-indicator">
 </div>
 
      
 
      3. 
@@ -139,11 +139,11 @@ var state = navigator.connection.type;
 
       if (state == Connection.WIFI)
 {
-   document.querySelector('#wifi-indicator').textContent = "Connected to WiFi";
+   document.querySelector('#wifi-indicator').textContent = "Connected to WiFi";
 }
 else
 {
-   document.querySelector('#wifi-indicator').textContent = "Not connected to WiFi";
+   document.querySelector('#wifi-indicator').textContent = "Not connected to WiFi";
 }
 
      
 
@@ -157,12 +157,12 @@ else
 
        
     
      1. Register event handlers after Cordova is set up. The most convenient way is to use the deviceready event callback.
 
        -document.addEventListener('deviceready', register);
+document.addEventListener('deviceready', register);
 
 function register()
 {
-   document.addEventListener('online', went_online);
-   document.addEventListener('offline', went_offline);
+   document.addEventListener('online', went_online);
+   document.addEventListener('offline', went_offline);
 }
 
        
     
        2. 
@@ -170,12 +170,12 @@ function register()
 
         function went_online()
 {
-   console.log("Went online");
+   console.log("Went online");
 }
 
 function went_offline()
 {
-   console.log("Went offline");
+   console.log("Went offline");
 }
 
        
     
        The online event fires when connection.type changes from Connection.NONE to any other value. Similarly, the offline event fires when connection.type becomes Connection.NONE.
        
diff --git a/org.tizen.guides/html/web/data/data_cover_w.htm b/org.tizen.guides/html/web/data/data_cover_w.htm
index 5d2c59b..6b55736 100644
--- a/org.tizen.guides/html/web/data/data_cover_w.htm
+++ b/org.tizen.guides/html/web/data/data_cover_w.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Data Storage and Management  
+	Data Storage and Management
 
 
 
@@ -28,7 +28,7 @@
 			
      2. Tizen 3.0 and Higher for TV
        3. 
 		
 	
-	
+
 
 
        
 
        Data Storage and Management
        
@@ -54,7 +54,7 @@
 
 
        You can manage ZIP archives on the device. You can create and browse the archives, and extract files from the archive.
        
 
-    
+
 
 
 
        
diff --git a/org.tizen.guides/html/web/data/data_filter_w.htm b/org.tizen.guides/html/web/data/data_filter_w.htm
index 87fda93..e851d4a 100644
--- a/org.tizen.guides/html/web/data/data_filter_w.htm
+++ b/org.tizen.guides/html/web/data/data_filter_w.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Data Filtering and Sorting 
-  
+  Data Filtering and Sorting
+ 
  
- 
+
  	
+
 
 
        
-  
        Data Filtering and Sorting
         
+  
        Data Filtering and Sorting
        
   
        When managing large amounts of data, you can create filters to search for specific information, and make queries to receive only the information you are looking for. You can use various filter attributes and sort the received data.
        
-  
-
        The Tizen API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.
         
- 
-  
        The main data handling features of the Tizen API include:
         
-  
           
+
+
          The Tizen API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.
          
+
+  
          The main data handling features of the Tizen API include:
          
+  
            
    
          • Filters 
            The Tizen API supports the following filter types, which are subtypes of the AbstractFilter interface (in mobile, wearable, and TV applications):
            
-    
 
 
            Creating Attribute Filters
            
@@ -78,14 +78,14 @@
    
            Create the filter with the AttributeFilter constructor. You can specify attribute options, such as the attribute name, match flag, and match value.
            
 
             /* Use the firstName attribute with the EXACTLY match flag and the Chris value */
-var firstNameFilter = new tizen.AttributeFilter('name.firstName', 'EXACTLY', 'Chris');
+var firstNameFilter = new tizen.AttributeFilter('name.firstName', 'EXACTLY', 'Chris');
 
            • 
      
          • Call the find() method of the AddressBook interface to find contacts. The filter (firstNameFilter) you created is included as a parameter.
            
 
             tizen.contact.getDefaultAddressBook().find(successCB, errorCB, firstNameFilter);
 
            • 
     
      
-	
+
 
  
      Creating Attribute Range Filters
      
 
@@ -98,16 +98,16 @@ tizen.contact.getDefaultAddressBook().find(successCB, errorCB, firstNameFilter);
 /* (meaning that you search for all events occurring today) */
 var now = tizen.time.getCurrentDateTime();
 var today_begin = new tizen.TZDate(now.getFullYear(), now.getMonth(), now.getDate());
-var today_end = today_begin.addDuration(new tizen.TimeDuration(1, "DAYS"));
+var today_end = today_begin.addDuration(new tizen.TimeDuration(1, "DAYS"));
 var dateRangeFilter =
-   new tizen.AttributeRangeFilter("startDate", today_begin, today_end);
+   new tizen.AttributeRangeFilter("startDate", today_begin, today_end);

  • Call the find() method of the Calendar interface to find events. The filter (dateRangeFilter) you created is included as a parameter.

    -tizen.calendar.getDefaultCalendar("EVENT").find(successCB, errorCB, dateRangeFilter);
+tizen.calendar.getDefaultCalendar("EVENT").find(successCB, errorCB, dateRangeFilter);
    • - +

    Creating Composite Filters

    Learning how to use composite filters allows you effectively incorporate query methods in your application:

    @@ -116,10 +116,10 @@ tizen.calendar.getDefaultCalendar("EVENT").find(successCB, errorCB, da

    Create the filter with the CompositeFilter constructor. You can specify multiple sub-filters for the filter set.

     /* Create an attribute filter based on the firstName attribute */
-var firstNameFilter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris");
+var firstNameFilter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris");
 
 /* Create an attribute filter based on the lastName attribute */
-var lastNameFilter = new tizen.AttributeFilter("name.lastName", "EXACTLY", "Smith");
+var lastNameFilter = new tizen.AttributeFilter("name.lastName", "EXACTLY", "Smith");
 
 /*
    Create a composite filter based on the intersection of these 2 filters
@@ -127,20 +127,20 @@ var lastNameFilter = new tizen.AttributeFilter("name.lastName", "
    for the contact to be included in the results)
 */
 var nameCompositeFilter =
-   new tizen.CompositeFilter("INTERSECTION", [firstNameFilter, lastNameFilter]);
+   new tizen.CompositeFilter("INTERSECTION", [firstNameFilter, lastNameFilter]);

  • Call the find() method of the AddressBook interface to find matching contacts. The filter (nameCompositeFilter) you created is included as a parameter.

     tizen.contact.getDefaultAddressBook().find(successCB, errorCB, nameCompositeFilter);
    • - +

    Using Sorting Modes

    - -

    The following sorting modes are supported:

    -

    Related Info

    File Archiving

    - +

    Tizen enables you to operate on the zip archive files.

    - -

    The Archive API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    + +

    The Archive API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    The main features of the Archive API include:

      -
    • Accessing archive content +
    • Accessing archive content

      You can read the content of an archive file.

    • Creating new archives

      You can create archive files and add files into them.

      • @@ -101,8 +101,8 @@

      Prerequisites

      To use the Archive API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privileges to the config.xml file:

      -<tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
-<tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>
+<tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
+<tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>

      Reading the Content of an Archive

      @@ -115,10 +115,10 @@ var myArchive = null; function openSuccess(arch) { -   console.log("ArchiveFile mode: " + arch.mode); -   myArchive = arch; + console.log("ArchiveFile mode: " + arch.mode); + myArchive = arch; } -tizen.archive.open("downloads/archive.zip", "r", openSuccess); +tizen.archive.open("downloads/archive.zip", "r", openSuccess);

    • Get the list of all files contained inside the archive using the getEntries() method of the ArchiveFile interface.

      @@ -126,17 +126,17 @@ tizen.archive.open("downloads/archive.zip", "r", openSuccess 
       function listSuccess(members)
 {
-   if (members.length === 0)
-   {
-      console.log("The archive is empty");
-
-      return;
-   }
-   console.log("Files in the archive:")
-   for (var i = 0; i < members.length; i++)
-   {
-      console.log(members[i].name);
-   }
+   if (members.length === 0)
+   {
+      console.log("The archive is empty");
+
+      return;
+   }
+   console.log("Files in the archive:")
+   for (var i = 0; i < members.length; i++)
+   {
+      console.log(members[i].name);
+   }
 }
 myArchive.getEntries(listSuccess);
      @@ -157,7 +157,7 @@ archive.close();

    • To create the archive file, use the open() method of the ArchiveManager interface (in mobile, wearable, and TV applications) and set the mode as w:

      -tizen.archive.open("downloads/new_archive.zip", "w", createSuccess);
+tizen.archive.open("downloads/new_archive.zip", "w", createSuccess);
      • @@ -167,30 +167,30 @@ tizen.archive.open("downloads/new_archive.zip", "w", createS 
       function progressCallback(opId, val, name)
 {
-   console.log("opId: " + opId + " with progress val: " + (val * 100).toFixed(0) + "%");
+   console.log("opId: " + opId + " with progress val: " + (val * 100).toFixed(0) + "%");
 }
 function successCallback()
 {
-   console.log("File added");
+   console.log("File added");
 }
 function createSuccess(archive)
 {
-   archive.add("downloads/file.txt", successCallback, null, progressCallback);
+   archive.add("downloads/file.txt", successCallback, null, progressCallback);
 }
      - +

      Extracting Files from an Archive

      Extracting a file from an archive is a basic archive management skill:

      1. -

        To access an archive file, use the open() method of the ArchiveManager interface (in mobile, wearable, and TV applications). The "r" mode is suitable for extracting from the archive.

        +

        To access an archive file, use the open() method of the ArchiveManager interface (in mobile, wearable, and TV applications). The "r" mode is suitable for extracting from the archive.

        -tizen.archive.open("downloads/some_archive.zip", "r", openSuccess, openError);
+tizen.archive.open("downloads/some_archive.zip", "r", openSuccess, openError);
        2. @@ -202,13 +202,13 @@ tizen.archive.open("downloads/some_archive.zip", "r", openSu 
         function progressCallback(opId, val, name)
 {
-   console.log("extracting operation (: " + opId + ") is in progress ("
-               + (val * 100).toFixed(1) + "%)");
+   console.log("extracting operation (: " + opId + ") is in progress ("
+               + (val * 100).toFixed(1) + "%)");
 }
 
 function openSuccess(archive)
 {
-   archive.extractAll("music", null, null, progressCallback);
+   archive.extractAll("music", null, null, progressCallback);
 }
        @@ -219,22 +219,22 @@ function openSuccess(archive) 
         function extractSuccessCallback()
 {
-   console.log("File extracted");
+   console.log("File extracted");
 }
 function getEntrySuccess(entry)
 {
-   entry.extract("downloads/extract", extractSuccessCallback);
+   entry.extract("downloads/extract", extractSuccessCallback);
 }
 
 function openSuccess(archive)
 {
-   archive.getEntryByName("my_file.txt", getEntrySuccess);
+   archive.getEntryByName("my_file.txt", getEntrySuccess);
 }
    - +

    Aborting File Operations

    @@ -245,11 +245,11 @@ function openSuccess(archive) 
     function openSuccess(archive)
 {
-   operationId = archive.extractAll("downloads/extracted");
-   tizen.archive.abort(operationId);
+   operationId = archive.extractAll("downloads/extracted");
+   tizen.archive.abort(operationId);
 }
 
-tizen.archive.open("downloads/some_archive.zip", "r", openSuccess);
+tizen.archive.open("downloads/some_archive.zip", "r", openSuccess);
    diff --git a/org.tizen.guides/html/web/data/file_system_w.htm b/org.tizen.guides/html/web/data/file_system_w.htm index 717d368..a796518 100644 --- a/org.tizen.guides/html/web/data/file_system_w.htm +++ b/org.tizen.guides/html/web/data/file_system_w.htm @@ -52,19 +52,19 @@

    File System

    - +

    Tizen enables you to access the files and directories in the device file system.

    - -

    The Filesystem API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    -

    The Filesystem API provides access to accessible parts of the file system, which are represented as virtual root locations.

    +

    The Filesystem API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    + +

    The Filesystem API provides access to accessible parts of the file system, which are represented as virtual root locations.

    The main features of the Filesystem API include:

      -
    • File storage management +
    • File storage management

      You can manage different storages on the device and retrieve additional information about the storages, including listing available storages and receiving storage change notifications.

      • -
    • Files and directory management +
    • Files and directory management

      You can perform basic file and directory management tasks using the File interface:

      • You can create files and directories in the file system.
        • @@ -78,7 +78,7 @@

        For a practical example of managing files in your application, see the File Manager sample task.

        File and Directory Access

        -

        You can access the virtual file system using the FileSystemManager interface (in mobile, wearable, and TV applications):

        +

        You can access the virtual file system using the FileSystemManager interface (in mobile, wearable, and TV applications):

        • To access a file or directory within the virtual file system, you must use the fully qualified path, <root name>/<path>, where <rootname> is the name of the virtual root and <path> is the relative path to the file or directory within the root. @@ -86,7 +86,7 @@
          Note When you use a path to access the device file system, make sure that the file path encoding uses the default encoding of the platform. -
          +
  • To access a file or directory, you must also retrieve a file handle using the resolve() method of the FileSystemManager interface.

    A file handle is a reference object that points to and represents a file or directory.

    • @@ -97,27 +97,27 @@

    Prerequisites

    To use the Filesystem API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privileges to the config.xml file:

    -<tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
-<tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>
+<tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
+<tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>

    Managing File Storages

    -

    You can manage different storages on the device with the FileSystemManager interface (in mobile, wearable, and TV applications).

    +

    You can manage different storages on the device with the FileSystemManager interface (in mobile, wearable, and TV applications).

    You can retrieve additional information about the storages, including listing available storages and receiving storage change notifications with the listStorages() and addStorageStateChangeListener() methods provided by the FileSystemManager interface.

    -

    To manage file storages:

    -
      +

      To manage file storages:

      +

      1. To list available storages, use the listStorages() method of the FileSystemManager interface to search for the storages available on the device.

        If the search is successful, a list of found FileSystemStorage objects (in mobile, wearable, and TV applications) is passed to the success event handler.

         /* Success event handler */
 function checkCorruptedRemovableDrives(storages)
 {
-   for (var i = 0; i < storages.length; i++)
-   {
-      if (storages[i].type != "EXTERNAL")
-         continue;
-      if (storages[i].state == "UNMOUNTABLE")
-         console.log("External drive " + storages[i].label + " is corrupted.");
-   }
+   for (var i = 0; i < storages.length; i++)
+   {
+      if (storages[i].type != "EXTERNAL")
+         continue;
+      if (storages[i].state == "UNMOUNTABLE")
+         console.log("External drive " + storages[i].label + " is corrupted.");
+   }
 }
 
 /* Search for the storages */
@@ -128,11 +128,11 @@ tizen.filesystem.listStorages(checkCorruptedRemovableDrives);
 /* Success event handler */
 function onStorage(storage)
 {
-   console.log("Storage found:" + storage.label);
+   console.log("Storage found:" + storage.label);
 }
 
 /* Retrieve a storage */
-tizen.filesystem.getStorage("music", onStorage);
+tizen.filesystem.getStorage("music", onStorage);

      2. To receive notifications on the storage state changes, for example, additions and removals, register an event handler with the addStorageStateChangeListener() method.

        An event is generated each time the storage state changes.

        @@ -141,8 +141,8 @@ var watchID;
 /* Define the event handler */
 function onStorageStateChanged(storage)
 {
-   if (storage.state == "MOUNTED")
-      console.log("Storage " + storage.label + " was added!");
+   if (storage.state == "MOUNTED")
+      console.log("Storage " + storage.label + " was added!");
 }
 
 /* Register the event handler */
@@ -152,39 +152,39 @@ watchID = tizen.filesystem.addStorageStateChangeListener(onStorageStateChanged);
 
         tizen.filesystem.removeStorageStateChangeListener(watchID);
        3. -
      - +
    +

    Creating and Deleting Files and Directories

    -

    You can create files and directories using the createFile() and createDirectory() methods. The file or directory is created relative to the current directory that the operation is performed on.

    +

    You can create files and directories using the createFile() and createDirectory() methods. The file or directory is created relative to the current directory that the operation is performed on.

    Note - Do not use "." or ".." characters in the directory or file path components. + Do not use "." or ".." characters in the directory or file path components.

    To create and delete files and directories:

    -
      +

      1. To create a file in the current directory, use the createFile() method of the File interface (in mobile, wearable, and TV applications):

         var documentsDir, newFile;
-tizen.filesystem.resolve("documents", function(result)
-   {
-      documentsDir = result;
-      newFile = documentsDir.createFile("newFilePath");
-   });
+tizen.filesystem.resolve("documents", function(result)
+   {
+      documentsDir = result;
+      newFile = documentsDir.createFile("newFilePath");
+   });

      2. To create a directory within the file system, use the createDirectory() method.

        The directory (and any sub-directories defined in the method parameter) is created relative to the current directory where the operation is performed on.

        -var newDir = documentsDir.createDirectory("newDir");
-var anotherNewDir = documentsDir.createDirectory("newDir1/subNewDir1");
+var newDir = documentsDir.createDirectory("newDir");
+var anotherNewDir = documentsDir.createDirectory("newDir1/subNewDir1");

      3. To delete a file, use the deleteFile() method:

         function onDelete()
 {
-   console.log("deletedFile() is successfully done.");
+   console.log("deletedFile() is successfully done.");
 }
 
 documentsDir.deleteFile(newFile.fullPath, onDelete);
@@ -194,51 +194,51 @@ documentsDir.deleteFile(newFile.fullPath, onDelete);
 documentsDir.deleteDirectory(newDir.fullPath, false, onDelete);
 anotherNewDir.parent.deleteDirectory(anotherNewDir.fullPath, false, onDelete);
        4. -
      - +
    +

    Retrieving Files and File Details

    You can retrieve a list of files or file URIs using the listFiles() and toURI() methods. The URI can be used to identify the file, for example, by using it as the src attribute on an HTML img element.

    -

    You can retrieve file content as a DOMString with the readAsText() method. The encoding input parameter of the method defines the format in which the file content is returned.

    -

    To get files and file details from the file system:

    -
      +

      You can retrieve file content as a DOMString with the readAsText() method. The encoding input parameter of the method defines the format in which the file content is returned.

      +

      To get files and file details from the file system:

      +

      1. To access a specific file or directory within the file system, retrieve a file handle using the resolve() method of the FileSystemManager interface (in mobile, wearable, and TV applications):

        -tizen.filesystem.resolve('documents', onResolveSuccess, null, 'r');
+tizen.filesystem.resolve('documents', onResolveSuccess, null, 'r');
        -

        The File object (in mobile, wearable, and TV applications) is returned in the success event handler.

        2. +

        The File object (in mobile, wearable, and TV applications) is returned in the success event handler.

      2. To retrieve a list of all the files and their directories located in a specified directory, use the listFiles() method of the File object: 
         function onResolveSuccess(dir)
 {
-   dir.listFiles(onsuccess);
+   dir.listFiles(onsuccess);
 }
        -

        The method returns an array of File objects.

        3. +

        The method returns an array of File objects.

      3. To retrieve the file URI, use the toURI() method:

         function onsuccess(files)
 {
-   for (var i = 0; i < files.length; i++)
-   {
-      /* Display the file name and URI */
-      console.log("File name is " + files[i].name + ", URI is " + files[i].toURI());
+   for (var i = 0; i < files.length; i++)
+   {
+      /* Display the file name and URI */
+      console.log("File name is " + files[i].name + ", URI is " + files[i].toURI());

      4. To retrieve the file content as a DOMString, use the readAsText() method.

        The encoding input parameter of the method defines the format in which the file content is returned.

        -      if (files[i].isDirectory == false)
-      {
-         files[i].readAsText(function(str)
-            {
-               console.log("File content: " + str);
-            }, null, "UTF-8");
-      }
-   }
+      if (files[i].isDirectory == false)
+      {
+         files[i].readAsText(function(str)
+            {
+               console.log("File content: " + str);
+            }, null, "UTF-8");
+      }
+   }
 }
        5. -
      - +
    +

    Managing Files and Directories

    - +

    YTou can manage files and directories in many ways:

    • You can read and write to a file by first using the openStream() method to open the file. You can specify the file mode and encoding. @@ -253,38 +253,38 @@ function onsuccess(files)
    -

    To read and write to files, and move and copy files and directories:

    -
      +

      To read and write to files, and move and copy files and directories:

      +

      1. To open a file, use the openStream() method of the File interface (in mobile, wearable, and TV applications).

        The method returns a FileStream object, which is a handle to the opened file. 

         var documentsDir;
 
-tizen.filesystem.resolve("documents", function(result)
-   {
-      documentsDir = result;
-   });
+tizen.filesystem.resolve("documents", function(result)
+   {
+      documentsDir = result;
+   });
 
-var testFile = documentsDir.createFile("test.txt");
+var testFile = documentsDir.createFile("test.txt");
 if (testFile != null)
 {
-   testFile.openStream("rw", onOpenSuccess, null, "UTF-8");
+   testFile.openStream("rw", onOpenSuccess, null, "UTF-8");
 }
      2. Perform all actual operations, such as reading, writing, or closing, on the file through the FileStream object based on a position attribute, which represents the current position in the file: 
         function onOpenSuccess(fs)
 {
-   /* Write HelloWorld to the file */
-   fs.write("HelloWorld");
+   /* Write HelloWorld to the file */
+   fs.write("HelloWorld");
 
-   /* Move pointer to the beginning */
-   fs.position = 0;
+   /* Move pointer to the beginning */
+   fs.position = 0;
 
-   /* Read the file content from the beginning */
-   fs.read(testFile.fileSize);
+   /* Read the file content from the beginning */
+   fs.read(testFile.fileSize);
 
-   /* Close the file */
-   fs.close();
+   /* Close the file */
+   fs.close();
 }

      3. To copy a file or directory, use the copyTo() method. The following example copies the files to the images/backup/ directory. Since the third parameter is set to true, any existing files with the same name in the target directory are overwritten.

        @@ -292,13 +292,13 @@ function onOpenSuccess(fs) var files; /* Assume that this is an array of File objects */ function onSuccess() { -   console.log("success"); + console.log("success"); } for (var i = 0; i < files.length; i++) { -   documentsDir.copyTo(files[i].fullPath, "images/backup/"+files[i].name, -                       true, onSuccess); + documentsDir.copyTo(files[i].fullPath, "images/backup/"+files[i].name, + true, onSuccess); }

      4. To move a file or directory, use the moveTo() method. The following example moves the files to the images/newFolder/ directory. Since the third parameter is set to false, no existing files with the same name in the target directory are overwritten.

        @@ -307,8 +307,8 @@ var files; /* Assume that this is an array of File objects */ for (var i = 0; i < files.length; i++) { -   documentsDir.moveTo(files[i].fullPath, "images/newFolder/"+files[i].name, -                       false, onSuccess); + documentsDir.moveTo(files[i].fullPath, "images/newFolder/"+files[i].name, + false, onSuccess); }
      @@ -365,7 +365,7 @@ for (var i = 0; i < files.length; i++) - + diff --git a/org.tizen.guides/html/web/data/stored_content_w.htm b/org.tizen.guides/html/web/data/stored_content_w.htm index 91b6e07..a4ebde6 100644 --- a/org.tizen.guides/html/web/data/stored_content_w.htm +++ b/org.tizen.guides/html/web/data/stored_content_w.htm @@ -61,16 +61,16 @@

      Stored Content Management

      Tizen enables you to search for content (images, videos, music or other) located on the local device storage. You can also perform content management tasks, such as viewing and updating content attributes.

      - -

      The Content API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

      - + +

      The Content API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

      +

      The main features of Content API include:

      The Content API uses the same ContentManager interface instance (in mobile, wearable, and TV applications) for all content-related functionalities. The instance provides higher efficiency by performing batch operations on content items.

      - +
      Note The batch mode does not provide progress information about operations. To ensure that you can view the progress, break the batch operation down into multiple smaller batch operations. For example, break down a batch of 100 update requests into 10 batch operations that update 10 records at a time. Breaking down a batch operation also helps you avoid blocking other database operations, such as add or remove.
      - +

      For a practical example of browsing and managing the media directories in your application, see the Media Content sample task.

      Prerequisites

      To use the Content API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privileges to the config.xml file:

      -<tizen:privilege name="http://tizen.org/privilege/content.read"/>
-<tizen:privilege name="http://tizen.org/privilege/content.write"/>
+<tizen:privilege name="http://tizen.org/privilege/content.read"/>
+<tizen:privilege name="http://tizen.org/privilege/content.write"/>
      - +

      Browsing Content

      You can browse and search for content directories and content using the getDirectories() and find() methods of the ContentManager interface (in mobile, wearable, and TV applications). When searching for content items, you can create attribute filters, attribute range filters, and composite filters based on specific filter attributes of the ContentManager interface. You can also sort the search results.

      @@ -116,10 +116,10 @@ var manager = tizen.content; 
       function onDirectoryArraySuccess(directories)
 {
-   for (var i = 0; i < directories.length; i++)
-   {
-      /* Retrieve folder-specific information */
-   }
+   for (var i = 0; i < directories.length; i++)
+   {
+      /* Retrieve folder-specific information */
+   }
 }
 
 manager.getDirectories(onDirectoryArraySuccess);
@@ -128,23 +128,23 @@ manager.getDirectories(onDirectoryArraySuccess);
 
       function onContentItemArraySuccess(contents)
 {
-   for (var i = 0; i < contents.length; i++)
-   {
-      console.log(i + ":" + contents[i].type + ":" + contents[i].title
-                  + ":" + contents[i].mimeType);
-   }
+   for (var i = 0; i < contents.length; i++)
+   {
+      console.log(i + ":" + contents[i].type + ":" + contents[i].title
+                  + ":" + contents[i].mimeType);
+   }
 }
 
-var contentType = "VIDEO";
-var filter = new tizen.AttributeFilter("type", "EXACTLY", contentType);
+var contentType = "VIDEO";
+var filter = new tizen.AttributeFilter("type", "EXACTLY", contentType);
 manager.find(onContentItemArraySuccess, null, null, filter);
 
      
 
 
      In the find() method in the above example, the directory ID parameter is set to null (which means that all directories are searched), the filter retrieves all content items whose type is VIDEO, and no sorting order is defined (which means that the default sorting order is used).
    - +

    Managing Content

    - +

    You can manage content in many ways:

    • You can view content item details with the find() method.
      • @@ -160,39 +160,39 @@ manager.find(onContentItemArraySuccess, null, null, filter);

      To view and update content details:

        -

      1. Retrieve the ContentManager interface instance (in mobile, wearable, and TV applications) using the tizen global object, and search for the item whose details you want to update.

        In the following example, the item whose title is image7.jpg is retrieved.

        +

      2. Retrieve the ContentManager interface instance (in mobile, wearable, and TV applications) using the tizen global object, and search for the item whose details you want to update.

        In the following example, the item whose title is image7.jpg is retrieved.

         var manager = tizen.content;
 
-var filter = new tizen.AttributeFilter("title", "EXACTLY", "image7.jpg");
+var filter = new tizen.AttributeFilter("title", "EXACTLY", "image7.jpg");
 manager.find(onMediaItemArraySuccess, null, null, filter);
      3. In the success event handler of the find() method, view the content item details by displaying them in the console log: 
         function onMediaItemArraySuccess(item)
 {
-   if (items.length > 0)
-   {
-      console.log(items[0].type + ": " + items[0].title + ": " + items[0].mimeType);
-      console.log("geolocation-latitude: " + items[0].geolocation.latitude +
-                  " longitude:" + items[0].geolocation.longitude);
-      update(items[0]);
-   }
+   if (items.length > 0)
+   {
+      console.log(items[0].type + ": " + items[0].title + ": " + items[0].mimeType);
+      console.log("geolocation-latitude: " + items[0].geolocation.latitude +
+                  " longitude:" + items[0].geolocation.longitude);
+      update(items[0]);
+   }
 }

      4. To update the editable attributes of the content item, use the update() method. In the example below, the rating of the content item is increased.

         function update(item)
 {
-   /* Checks whether the attribute is editable */
-   if (item.editableAttributes.indexOf("rating") >= 0)
-   {
-      /* Changes an attribute */
-      item.rating = 1;
-
-      /* Updates the item */
-      manager.update(item);
-   }
+   /* Checks whether the attribute is editable */
+   if (item.editableAttributes.indexOf("rating") >= 0)
+   {
+      /* Changes an attribute */
+      item.rating = 1;
+
+      /* Updates the item */
+      manager.update(item);
+   }
 }

      5. To scan for the content item file, use the scanFile() method. Because scanning is not performed automatically when the content file is copied or moved, call the scanFile() method to find the file.

        @@ -200,34 +200,34 @@ function update(item) /* Assume the images/photo.jpg is copied to the device */ function onScanSuccessCallback(path) { -   console.log("Scanning completed:" + path); + console.log("Scanning completed:" + path); }; -tizen.filesystem.resolve("images/photo.jpg", function(file) -   { -      tizen.content.scanFile(file.toURI(), onScanSuccessCallback); -   }); +tizen.filesystem.resolve("images/photo.jpg", function(file) + { + tizen.content.scanFile(file.toURI(), onScanSuccessCallback); + });

      6. To create a thumbnail for a content item, use the createThumbnail() method:

         function createCB(path)
 {
-   console.log("A path of a just created thumbnail is " + path);
+   console.log("A path of a just created thumbnail is " + path);
 }
 
 function findCB(contents)
 {
-   if (contents.length > 0)
-   {
-      tizen.content.createThumbnail(contents[0], createCB);
-   }
+   if (contents.length > 0)
+   {
+      tizen.content.createThumbnail(contents[0], createCB);
+   }
 }
 
 tizen.content.find(findCB);
      - +

      Receiving Notifications on Content Changes

      You can receive notifications when a content item is added, updated, or deleted. The setChangeListener() method of the ContentManager interface (in mobile, wearable, and TV applications) registers a change listener. You can use the ContentChangeCallback interface (in mobile, wearable, and TV applications) to define listener event handlers for receiving the notifications.

      @@ -237,23 +237,23 @@ tizen.content.find(findCB); 
       var listener =
 {
-   /* When new items are added */
-   oncontentadded: function(content)
-   {
-      console.log(content.contentURI + " content was added");
-   },
-
-   /* When items are updated */
-   oncontentupdated: function(content)
-   {
-      console.log(content.contentURI + " content was updated");
-   },
-
-   /* When items are deleted */
-   oncontentremoved: function(id)
-   {
-      console.log(id + " was removed");
-   }
+   /* When new items are added */
+   oncontentadded: function(content)
+   {
+      console.log(content.contentURI + " content was added");
+   },
+
+   /* When items are updated */
+   oncontentupdated: function(content)
+   {
+      console.log(content.contentURI + " content was updated");
+   },
+
+   /* When items are deleted */
+   oncontentremoved: function(id)
+   {
+      console.log(id + " was removed");
+   }
 };

    • Register the listener to use the defined event handlers:

      @@ -276,10 +276,10 @@ tizen.content.removeChangeListener(listenerId); 
       function createSuccess(playlist)
 {
-   console.log("create SUCCESS");
+   console.log("create SUCCESS");
 }
 
-tizen.content.createPlaylist("My new playlist", createSuccess);
+tizen.content.createPlaylist("My new playlist", createSuccess);
    • To create a new playlist based on an existing one (basically copy the existing playlist content to a new playlist), use the createPlaylist() method, passing the source playlist as a parameter: @@ -287,19 +287,19 @@ tizen.content.createPlaylist("My new playlist", createSuccess); 
       function createSuccess(playlist)
 {
-   console.log("create SUCCESS");
+   console.log("create SUCCESS");
 }
 
 tizen.content.getPlaylists(function(playlists)
 {
-   var existingPlaylist = playlists[0];
-   tizen.content.createPlaylist("My new playlist", createSuccess,
-                                null, existingPlaylist);
+   var existingPlaylist = playlists[0];
+   tizen.content.createPlaylist("My new playlist", createSuccess,
+                                null, existingPlaylist);
 });
    - +

    Managing Playlists

    Learning how to retrieve and remove playlists is a basic playlist management skill:

    @@ -310,12 +310,12 @@ tizen.content.getPlaylists(function(playlists) 
     function getPlaylistsSuccess(playlists)
 {
-   for (var i = 0; i < playlists.length; i++)
-   {
-      var cur = playlists[i];
-      console.log("[" + i + "] name:" + cur.name
-                  + " number of tracks:" + cur.numberOfTracks);
-   }
+   for (var i = 0; i < playlists.length; i++)
+   {
+      var cur = playlists[i];
+      console.log("[" + i + "] name:" + cur.name
+                  + " number of tracks:" + cur.numberOfTracks);
+   }
 }
 tizen.content.getPlaylists(getPlaylistsSuccess);
    @@ -325,18 +325,18 @@ tizen.content.getPlaylists(getPlaylistsSuccess); 
     function removePlaylistSuccess()
 {
-   console.log("removePlaylist() is successfully done.");
+   console.log("removePlaylist() is successfully done.");
 }
 
 tizen.content.getPlaylists(function(playlists)
 {
-   var myPlaylist = playlists[0];
-   tizen.content.removePlaylist(myPlaylist.id, removePlaylistSuccess);
+   var myPlaylist = playlists[0];
+   tizen.content.removePlaylist(myPlaylist.id, removePlaylistSuccess);
 });
    - +

    Managing Playlist Items

    Learning how to manage list items is a basic playlist management skill:

    @@ -353,9 +353,9 @@ var myPlaylist; tizen.content.getPlaylists(function(playlists) { -   myPlaylist = playlists[0]; -   tizen.content.find(findSuccess, null, null, -                      new tizen.AttributeFilter("type", "EXACTLY", "AUDIO")); + myPlaylist = playlists[0]; + tizen.content.find(findSuccess, null, null, + new tizen.AttributeFilter("type", "EXACTLY", "AUDIO")); }); @@ -364,14 +364,14 @@ tizen.content.getPlaylists(function(playlists) 
     function findSuccess(contents)
 {
-   if (contents.length >= 3)
-   {
-      myPlaylist.addBatch([contents[0], contents[1], contents[2]]);
-   }
-   else
-   {
-      console.log("Not enough items. Need at least 3");
-   }
+   if (contents.length >= 3)
+   {
+      myPlaylist.addBatch([contents[0], contents[1], contents[2]]);
+   }
+   else
+   {
+      console.log("Not enough items. Need at least 3");
+   }
 }
    @@ -380,10 +380,10 @@ function findSuccess(contents) 
     function findSuccess(contents)
 {
-   if (contents.length > 0)
-   {
-      myPlaylist.add(contents[0]);
-   }
+   if (contents.length > 0)
+   {
+      myPlaylist.add(contents[0]);
+   }
 }
    @@ -393,17 +393,17 @@ function findSuccess(contents) 
     function getSuccess(items)
 {
-   console.log("Playlist items:");
-   for (var i = 0; i < items.length; ++i)
-   {
-      console.log("[" + i + "]: name:" + items[i].name);
-   }
+   console.log("Playlist items:");
+   for (var i = 0; i < items.length; ++i)
+   {
+      console.log("[" + i + "]: name:" + items[i].name);
+   }
 }
 
 tizen.content.getPlaylists(function(playlists)
 {
-   var myPlaylist = playlists[0];
-   myPlaylist.get(getSuccess);
+   var myPlaylist = playlists[0];
+   myPlaylist.get(getSuccess);
 });
    @@ -414,13 +414,13 @@ tizen.content.getPlaylists(function(playlists) var myItem; /* Assume that it was retrieved using the get() method */ function moveSuccess() { -   console.log("move item SUCCESS"); + console.log("move item SUCCESS"); } tizen.content.getPlaylists(function(playlists) { -   var myPlaylist = playlists[0]; -   myPlaylist.move(myItem, -2, moveSuccess); + var myPlaylist = playlists[0]; + myPlaylist.move(myItem, -2, moveSuccess); }); @@ -445,7 +445,7 @@ newOrder.reverse(); 
     function setOrderSuccess()
 {
-   console.log("Set items order SUCCESS");
+   console.log("Set items order SUCCESS");
 }
 
 myPlaylist.setOrder(newOrder, setOrderSuccess);
diff --git a/org.tizen.guides/html/web/data/task_filemanager_w.htm b/org.tizen.guides/html/web/data/task_filemanager_w.htm
index bce8820..c8f31c4 100644
--- a/org.tizen.guides/html/web/data/task_filemanager_w.htm
+++ b/org.tizen.guides/html/web/data/task_filemanager_w.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Task: File Manager  
+	Task: File Manager
 
 
 
@@ -20,7 +20,7 @@
 	
    
 		
    Mobile Web Wearable Web
    
 	
    
-	
+
 	
-
    +
    -

    Task: File Manager

    -

    This task, based on the FileManager sample delivered with the Tizen Studio, demonstrates how you can use the Filesystem API (in mobile and wearable applications) to manage files in your application. For more information on the sample functionality and creating the sample with the full source code, see File Manager.

    -

    This task consists of the following parts:

    - +

    Task: File Manager

    +

    This task, based on the FileManager sample delivered with the Tizen Studio, demonstrates how you can use the Filesystem API (in mobile and wearable applications) to manage files in your application. For more information on the sample functionality and creating the sample with the full source code, see File Manager.

    +

    This task consists of the following parts:

    +

    This sample is a fully functional application for browsing the device storage. The user can create, copy, move, and remove folders and files.

    - -

    Defining the Application Layout

    + +

    Defining the Application Layout

    The FileManager sample application layout uses the template manager based on the MVC (Model View Controller) architecture, and consists of 1 screen that displays the device storage folder and file structure.

    - -

    Additionally, the sample application layout consists of 2 UI elements: the clipboard footer controls enable you to delete, move, or copy selected folders and files, and the More pop-up window enables you to create a new folder and to paste content to a folder.

    - -

    The following figure shows the main screens of the application.

    -

    Figure: FileManager screen

    -

    FileManager screen

    -

    Using the Template Manager

    + +

    Additionally, the sample application layout consists of 2 UI elements: the clipboard footer controls enable you to delete, move, or copy selected folders and files, and the More pop-up window enables you to create a new folder and to paste content to a folder.

    + +

    The following figure shows the main screens of the application.

    +

    Figure: FileManager screen

    +

    FileManager screen

    +

    Using the Template Manager

    The template manager enables the HTML output generation to be divided into 3 parts.

    -
      +
      1. app.ui.templateManager.js Source File -
          +

          1. The template manager loads the template files into the cache.

             loadToCache: function TemplateManager_loadToCache(tplNames, onSuccess)
 {
-   var self = this,
-   cachedTemplates = 0,
-   tplName,
-   tplPath;
-
-   if ($.isArray(tplNames))
-   {
-      $.each(tplNames, function(index, fileName)
-         {
-            if (self.cache[fileName] === undefined)
-            {
-               tplName = [fileName, app.config.get('templateExtension')].join('');
-               tplPath = [app.config.get('templateDir'), tplName].join('/');
-               $.ajax(
-               {
-                  url: tplPath,
-                  cache: true,
-                  dataType: 'html',
-                  async: true,
-                  success: function(data)
-                  {
-                     cachedTemplates += 1;
-                     self.cache[fileName] = data;
-                     if (cachedTemplates >= tplNames.length
-                         && typeof onSuccess === 'function')
-                     {
-                        onSuccess();
-                     }
-                  },
-
-                  /* Error handling */
-               });
-            }
-            else
-            {
-               cachedTemplates += 1;
-               if (cachedTemplates >= tplNames.length
-                   && typeof onSuccess === 'function')
-               {
-                  onSuccess();
-               }
-            }
-         });
-   }
+   var self = this,
+   cachedTemplates = 0,
+   tplName,
+   tplPath;
+
+   if ($.isArray(tplNames))
+   {
+      $.each(tplNames, function(index, fileName)
+         {
+            if (self.cache[fileName] === undefined)
+            {
+               tplName = [fileName, app.config.get('templateExtension')].join('');
+               tplPath = [app.config.get('templateDir'), tplName].join('/');
+               $.ajax(
+               {
+                  url: tplPath,
+                  cache: true,
+                  dataType: 'html',
+                  async: true,
+                  success: function(data)
+                  {
+                     cachedTemplates += 1;
+                     self.cache[fileName] = data;
+                     if (cachedTemplates >= tplNames.length
+                         && typeof onSuccess === 'function')
+                     {
+                        onSuccess();
+                     }
+                  },
+
+                  /* Error handling */
+               });
+            }
+            else
+            {
+               cachedTemplates += 1;
+               if (cachedTemplates >= tplNames.length
+                   && typeof onSuccess === 'function')
+               {
+                  onSuccess();
+               }
+            }
+         });
+   }
 }

          2. Next, the template manager returns the template HTML content from the cache.

             get: function TemplateManager_get(tplName, tplParams)
 {
-   if (this.cache[tplName] !== undefined)
-   {
-      return this.getCompleted(this.cache[tplName], tplParams);
-   }
+   if (this.cache[tplName] !== undefined)
+   {
+      return this.getCompleted(this.cache[tplName], tplParams);
+   }
 
-   return '';
+   return '';
 }

          3. The getCompleted() method returns the completed template using the specified parameters, prepared by the passThruModifiers() method.

             getCompleted: function TemplateManager_getCompleted(tplHtml, tplParams)
 {
-   var tplParam, replaceRegExp;
+   var tplParam, replaceRegExp;
 
-   for (tplParam in tplParams)
-   {
-      if (tplParams.hasOwnProperty(tplParam))
-      {
+   for (tplParam in tplParams)
+   {
+      if (tplParams.hasOwnProperty(tplParam))
+      {
 
-         tplHtml = this.passThruModifiers(tplHtml, tplParam, tplParams[tplParam]);
-      }
-   }
+         tplHtml = this.passThruModifiers(tplHtml, tplParam, tplParams[tplParam]);
+      }
+   }
 
-   return tplHtml;
+   return tplHtml;
 }
 
 passThruModifiers: function(tplHtml, tplParam, content)
 {
-   var regModOn = new RegExp('%' + tplParam + '\\|([a-zA-Z]){1,}%', 'g'),
-   regModOff = new RegExp(['%', tplParam, '%'].join(''), 'g'),
-   regModGet = new RegExp('%' + tplParam + '\\|(.+?)%'),
-   specRegExp = new RegExp('\\$', 'g'), modifier;
-
-   if (content && (typeof content === 'string'))
-   {
-      content = content.replace(specRegExp, '$$$$');
-   }
-
-   if (regModOn.test(tplHtml))
-   {
-      modifier = tplHtml.match(regModGet)[1];
-      try
-      {
-         content = this.modifiers[modifier](content);
-      }
-
-      tplHtml = tplHtml.replace(regModOn, content);
-   }
-   else
-   {
-      tplHtml = tplHtml.replace(regModOff, content);
-   }
-
-   return tplHtml;
+   var regModOn = new RegExp('%' + tplParam + '\\|([a-zA-Z]){1,}%', 'g'),
+   regModOff = new RegExp(['%', tplParam, '%'].join(''), 'g'),
+   regModGet = new RegExp('%' + tplParam + '\\|(.+?)%'),
+   specRegExp = new RegExp('\\$', 'g'), modifier;
+
+   if (content && (typeof content === 'string'))
+   {
+      content = content.replace(specRegExp, '$$$$');
+   }
+
+   if (regModOn.test(tplHtml))
+   {
+      modifier = tplHtml.match(regModGet)[1];
+      try
+      {
+         content = this.modifiers[modifier](content);
+      }
+
+      tplHtml = tplHtml.replace(regModOn, content);
+   }
+   else
+   {
+      tplHtml = tplHtml.replace(regModOff, content);
+   }
+
+   return tplHtml;
 }
            4. -
          +
      - -

      Defining the Main Screen

      + +

      Defining the Main Screen

      The main screen elements initialization and display functionality is implemented in the app.ui.js file.

      -
        +
        1. main.tpl Source File

          The main screen of the application displays the device storage folder and file structure. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

          If the user navigates to another child directory, the header section displays navigation buttons - Up and Home - to move 1 directory up in the file system and to move to the root directory, respectively. In a child directory, the breadcrumb navigation from the root directory to the current directory is displayed as well.

           <!--Header section-->
-<div data-role="header" data-position="fixed">
-   <h1 id="mainTitle"></h1>
+<div data-role="header" data-position="fixed">
+   <h1 id="mainTitle"></h1>
 
-   <!--Other application code-->
+   <!--Other application code-->
 
-   <a id="homeBtn">Home</a>
-   <a id="levelUpBtn">Up</a>
+   <a id="homeBtn">Home</a>
+   <a id="levelUpBtn">Up</a>
 
-   <!--Other application code-->
+   <!--Other application code-->
 
-   <div id="navbar"></div>
-   <div class="selectAll" style="display: none"></div>
+   <div id="navbar"></div>
+   <div class="selectAll" style="display: none"></div>
 
-   <!--Other application code-->
+   <!--Other application code-->
 
 </div>
        2. folderRow.tpl Source File -

          The folderRow.tpl template file defines the actual content of the main screen, which is initialized in the app.ui.js source file.

          +

          The folderRow.tpl template file defines the actual content of the main screen, which is initialized in the app.ui.js source file.

           <!--Content section-->
-<li class="node folder ui-li-1line-bigicon1" id="row%id%" label="%name%"
-    uri="%uri|escapeEncies%" fullUri="%fullUri|escapeEncies%">
-   <form class="my-ui-checkbox hidden"><input type="checkbox"/></form>
-   <img src="images/folder.png" class="ui-li-bigicon"/>
-   <span class="ui-li-text-main nodename">%name|escape%</span>
+<li class="node folder ui-li-1line-bigicon1" id="row%id%" label="%name%"
+    uri="%uri|escapeEncies%" fullUri="%fullUri|escapeEncies%">
+   <form class="my-ui-checkbox hidden"><input type="checkbox"/></form>
+   <img src="images/folder.png" class="ui-li-bigicon"/>
+   <span class="ui-li-text-main nodename">%name|escape%</span>
 </li>
          3. -
        - - -
          -
        1. main.tpl Source File +
        + + +
          +
        1. main.tpl Source File

          The footer section of the screen is defined within a <div> element whose data-role attribute is set to footer. The footer section contains a tab bar with a button for enabling the clipboard functionality in the application.

          The clipboard consists of buttons for deleting, moving, and copying folders and files, and also canceling the clipboard operation. In the clipboard mode, check boxes appear next to the folders and files list in the current directory on the main screen.

          -<div data-role="footer" data-position="fixed">
-   <div class="ui-myToolBar">
-      <div data-role="tabbar" class="standardTabbar">
-         <ul>
-            <li><a id="editActionBtn" href="#">Edit</a></li>
+<div data-role="footer" data-position="fixed">
+   <div class="ui-myToolBar">
+      <div data-role="tabbar" class="standardTabbar">
+         <ul>
+            <li><a id="editActionBtn" href="#">Edit</a></li>
 
-            <!--Other application code-->
+            <!--Other application code-->
 
-         </ul>
-      </div>
+         </ul>
+      </div>
 
-      <div data-role="tabbar" class="editTabbar" style="display: none">
-         <ul>
-            <li><a id="deleteActionBtn" href="#">Delete</a></li>
-            <li><a id="moveActionBtn" href="#">Move</a></li>
-            <li><a id="copyActionBtn" href="#">Copy</a></li>
-            <li><a id="cancelActionBtn" href="#">Cancel</a></li>
-         </ul>
-      </div>
+      <div data-role="tabbar" class="editTabbar" style="display: none">
+         <ul>
+            <li><a id="deleteActionBtn" href="#">Delete</a></li>
+            <li><a id="moveActionBtn" href="#">Move</a></li>
+            <li><a id="copyActionBtn" href="#">Copy</a></li>
+            <li><a id="cancelActionBtn" href="#">Cancel</a></li>
+         </ul>
+      </div>
 
-   <!--Other application code-->
+   <!--Other application code-->
 
-   </div>
+   </div>
 </div>
        -
          -
        1. main.tpl Source File +
            +
          1. main.tpl Source File

            The pop-up window consists of a jQuery pop-up menu with options for creating a new folder at the current directory location or for pasting already copied content to the current directory location.

            -<div data-role="footer" data-position="fixed">
-   <div class="ui-myToolBar">
-      <div data-role="tabbar" class="standardTabbar">
-         <ul>
+<div data-role="footer" data-position="fixed">
+   <div class="ui-myToolBar">
+      <div data-role="tabbar" class="standardTabbar">
+         <ul>
 
-            <!--Other application code-->
+            <!--Other application code-->
 
-            <li><a id="moreActionBtn" href="#morePopup" data-rel="popup">More</a></li>
+            <li><a id="moreActionBtn" href="#morePopup" data-rel="popup">More</a></li>
 
-            <!--Other application code-->
+            <!--Other application code-->
 
-         </ul>
-      </div>
-      <div id="morePopup" data-role="popup">
-         <!--Other application code-->
+         </ul>
+      </div>
+      <div id="morePopup" data-role="popup">
+         <!--Other application code-->
 
-      </div>
-   </div>
+      </div>
+   </div>
 </div>
          - -

          Managing Clipboard

          + +

          Managing Clipboard

          This section builds upon the elements described in Managing Files and Directories.

          - +

          Initializing the Clipboard

          -

          The clipboard features definition functionality is implemented in the app.clipboard.js file.

          -
            +

            The clipboard features definition functionality is implemented in the app.clipboard.js file.

            +
            1. Retrieving Clipboard Content

              The get() method is defined to retrieve all the filesystem paths saved currently in the clipboard.

               get: function Clipboard_get()
 {
-   return this.data;
+   return this.data;
 }
            2. Adding New Content to the Clipboard @@ -299,19 +299,19 @@ get: function Clipboard_get() 
               add: function Clipboard_add(paths)
 {
-   var len = paths.length, i;
-
-   /* Clear clipboard */
-   this.clear();
-   for (i = 0; i < len; i += 1)
-   {
-      if (this.has(paths[i]) === false)
-      {
-         this.data.push(paths[i]);
-      }
-   }
-
-   return this.data.length;
+   var len = paths.length, i;
+
+   /* Clear clipboard */
+   this.clear();
+   for (i = 0; i < len; i += 1)
+   {
+      if (this.has(paths[i]) === false)
+      {
+         this.data.push(paths[i]);
+      }
+   }
+
+   return this.data.length;
 }
            3. Checking if a Path is Present in the Clipboard @@ -319,7 +319,7 @@ add: function Clipboard_add(paths) 
               has: function Clipboard_has(path)
 {
-   return $.inArray(path, this.data) === -1 ? false : true;
+   return $.inArray(path, this.data) === -1 ? false : true;
 }
            4. Setting the Clipboard Mode @@ -327,13 +327,13 @@ has: function Clipboard_has(path) 
               setMode: function Clipboard_setMode(mode)
 {
-   if ($.inArray(mode, [this.MOVE_MODE_ID, this.COPY_MODE_ID]) === false)
-   {
-      /* Error handling */
-   }
-   this.mode = mode;
+   if ($.inArray(mode, [this.MOVE_MODE_ID, this.COPY_MODE_ID]) === false)
+   {
+      /* Error handling */
+   }
+   this.mode = mode;
 
-   return true;
+   return true;
 }
            5. Clearing the Clipboard @@ -341,196 +341,196 @@ setMode: function Clipboard_setMode(mode) 
               clear: function Clipboard_clear()
 {
-   this.data = [];
-   this.mode = this.INACTIVE_MODE;
+   this.data = [];
+   this.mode = this.INACTIVE_MODE;
 }
              6. -
            -

            Performing Clipboard Operations

            -

            The clipboard operation functionality is implemented in the app.js file.

            -
              +
            +

            Performing Clipboard Operations

            +

            The clipboard operation functionality is implemented in the app.js file.

            +
            1. Copying Content to the Clipboard

              The saveToClipboard() method is used to add filesystem paths to the clipboard and set the appropriate clipboard mode.

               saveToClipboard: function App_saveToClipboard(paths, mode)
 {
-   var clipboardLength = this.clipboard.add(paths);
-
-   if (clipboardLength > 0)
-   {
-      this.clipboard.setMode(mode);
-      app.ui.alertPopup('Data saved in clipboard');
-      this.ui.clearTabbars();
-   }
-   else
-   {
-      alert('Error occurred. Data has not been saved in clipboard');
-   }
-
-   this.ui.refreshPasteActionBtn(this.clipboard.isEmpty());
+   var clipboardLength = this.clipboard.add(paths);
+
+   if (clipboardLength > 0)
+   {
+      this.clipboard.setMode(mode);
+      app.ui.alertPopup('Data saved in clipboard');
+      this.ui.clearTabbars();
+   }
+   else
+   {
+      alert('Error occurred. Data has not been saved in clipboard');
+   }
+
+   this.ui.refreshPasteActionBtn(this.clipboard.isEmpty());
 }
              2. -
            2. Pasting Content from the Clipboard -

              1. The pasteClipboard() method is used to copy filesystem paths from the clipboard or to move filesystem paths to the current directory location based on the current clipboard mode.

                +
              2. Pasting Content from the Clipboard +

                1. The pasteClipboard() method is used to copy filesystem paths from the clipboard or to move filesystem paths to the current directory location based on the current clipboard mode.

                   pasteClipboard: function App_pasteClipboard()
 {
-   var clipboardData = this.clipboard.get();
-
-   if (clipboardData.length === 0)
-   {
-      app.ui.alertPopup('Clipboard is empty');
-
-      return false;
-   }
-
-   if (this.clipboard.getMode() === this.clipboard.COPY_MODE_ID)
-   {
-      this.model.copyNodes(this.currentDirHandle, clipboardData, this.currentPath,
-                           this.onPasteClipboardSuccess.bind(this));
-   }
-   else
-   {
-      this.model.moveNodes(this.currentDirHandle, clipboardData, this.currentPath,
-                           this.onPasteClipboardSuccess.bind(this));
-   }
-   this.ui.refreshPasteActionBtn(this.clipboard.isEmpty());
-
-   return true;
+   var clipboardData = this.clipboard.get();
+
+   if (clipboardData.length === 0)
+   {
+      app.ui.alertPopup('Clipboard is empty');
+
+      return false;
+   }
+
+   if (this.clipboard.getMode() === this.clipboard.COPY_MODE_ID)
+   {
+      this.model.copyNodes(this.currentDirHandle, clipboardData, this.currentPath,
+                           this.onPasteClipboardSuccess.bind(this));
+   }
+   else
+   {
+      this.model.moveNodes(this.currentDirHandle, clipboardData, this.currentPath,
+                           this.onPasteClipboardSuccess.bind(this));
+   }
+   this.ui.refreshPasteActionBtn(this.clipboard.isEmpty());
+
+   return true;
 }
                  2. -

                2. The onPasteClipboardSuccess() event handler responds to the success event of pasting content from the clipboard by clearing the clipboard.

                  +

                3. The onPasteClipboardSuccess() event handler responds to the success event of pasting content from the clipboard by clearing the clipboard.

                   onPasteClipboardSuccess: function App_onPasteClipboardSuccess()
 {
-   this.clipboard.clear();
-   this.refreshCurrentPage();
+   this.clipboard.clear();
+   this.refreshCurrentPage();
 }
                -
                3. -
              +
              3. +
            -

            Managing Device Storage

            -

            This section builds upon the elements described in Managing File Storages, Creating and Deleting Files and Directories, and Retrieving Files and File Details.

            +

            Managing Device Storage

            +

            This section builds upon the elements described in Managing File Storages, Creating and Deleting Files and Directories, and Retrieving Files and File Details.

            -

            Initializing the Device Storage

            -
              +

              Initializing the Device Storage

              +
              1. config.xml Source File

                The required privileges are declared in the config.xml file.

                 <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/content.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/content.write"/>
-   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-   <tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>
-   <!--Other configuration details-->
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/content.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/content.write"/>
+   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+   <tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>
+   <!--Other configuration details-->
 </widget>
                2. -
              -

              Retrieving Storages

              +
            +

            Retrieving Storages

            -
              +
              1. app.model.js Source File

                The loadInternalStorages() method calls the getStorages() method to get the storages of a specific storage type.

                 loadInternalStorages: function Model_loadInternalStorages(onSuccess)
 {
-   var self = this;
-
-   this.systemIO.getStorages('INTERNAL', function(storages)
-      {
-         self.storages = storages;
-         if (typeof onSuccess === 'function')
-         {
-            onSuccess();
-         }
-      }, 'internal0');
+   var self = this;
+
+   this.systemIO.getStorages('INTERNAL', function(storages)
+      {
+         self.storages = storages;
+         if (typeof onSuccess === 'function')
+         {
+            onSuccess();
+         }
+      }, 'internal0');
 }
                2. -
              2. app.systemIO.js Source File +
              3. app.systemIO.js Source File

                The listStorages() method of the FileSystemManager interface (in mobile and wearable applications) is used to retrieve all the available storages.

                 getStorages: function SystemIO_getStorages(type, onSuccess, excluded)
 {
-   try
-   {
-      tizen.filesystem.listStorages(function(storages)
-         {
-            var tmp = [],
-            len = storages.length,
-            i;
-
-            if (type !== undefined)
-            {
-               for (i = 0; i < len; i += 1)
-               {
-                  if (storages[i].label !== excluded)
-                  {
-                     if (storages[i].type === 0 || storages[i].type === type)
-                        tmp.push(storages[i]);
-                  }
-               }
-            }
-            else
-            {
-               tmp = storages;
-            }
-
-            if (typeof onSuccess === 'function')
-               onSuccess(tmp);
-         });
-   }
+   try
+   {
+      tizen.filesystem.listStorages(function(storages)
+         {
+            var tmp = [],
+            len = storages.length,
+            i;
+
+            if (type !== undefined)
+            {
+               for (i = 0; i < len; i += 1)
+               {
+                  if (storages[i].label !== excluded)
+                  {
+                     if (storages[i].type === 0 || storages[i].type === type)
+                        tmp.push(storages[i]);
+                  }
+               }
+            }
+            else
+            {
+               tmp = storages;
+            }
+
+            if (typeof onSuccess === 'function')
+               onSuccess(tmp);
+         });
+   }
 }
              -

              Managing Files and Directories

              +

              Managing Files and Directories

              The directory creation functionality is implemented in the app.js file. The file creation, file deletion, and directory deletion functionality is implemented in the app.systemIO.js file.

              -
                +
                1. Creating a File -

                  The createFile() method of the File interface (in mobile and wearable applications) is used to create a new file in the current directory.

                  +

                  The createFile() method of the File interface (in mobile and wearable applications) is used to create a new file in the current directory.

                   createFile: function SystemIO_createFile(directoryHandle, fileName)
 {
-   try
-   {
-      return directoryHandle.createFile(fileName);
-   }
+   try
+   {
+      return directoryHandle.createFile(fileName);
+   }
 }
                  -

                  Similarly, the createDirectory() method is used to create a directory at the current storage location in the application.

                  2. -
                2. Deleting a File -

                  The deleteFile() method of the File interface is used to delete a file by specifying the filesystem path of the file.

                  +

                  Similarly, the createDirectory() method is used to create a directory at the current storage location in the application.

                  3. +
                3. Deleting a File +

                  The deleteFile() method of the File interface is used to delete a file by specifying the filesystem path of the file.

                   deleteFile: function SystemIO_deleteFile(dir, filePath, onDeleteSuccess, onDeleteError)
 {
-   try
-   {
-      dir.deleteFile(filePath, onDeleteSuccess, onDeleteError);
-   }
+   try
+   {
+      dir.deleteFile(filePath, onDeleteSuccess, onDeleteError);
+   }
 }
                  -

                  Similarly, the deleteDirectory() method is used to delete a selected directory. You can specify if the deletion is to be performed recursively for the sub-directories as well.

                  4. -
                -

                Retrieving File Details

                -

                The file and file list retrieval functionality is implemented in the app.systemIO.js file. The file URI retrieval functionality is implemented in the app.ui.js file.

                -
                  +

                  Similarly, the deleteDirectory() method is used to delete a selected directory. You can specify if the deletion is to be performed recursively for the sub-directories as well.

                  +
                +

                Retrieving File Details

                +

                The file and file list retrieval functionality is implemented in the app.systemIO.js file. The file URI retrieval functionality is implemented in the app.ui.js file.

                +
                1. Retrieving a File

                  The resolve() method of the FileSystemManager interface is used to retrieve a file handle by specifying the location of the file.

                   openDir: function SystemIO_openDir(directoryPath, onSuccess, onError, openMode)
 {
-   openMode = openMode || 'rw';
-   onSuccess = onSuccess || function() {};
+   openMode = openMode || 'rw';
+   onSuccess = onSuccess || function() {};
 
-   try
-   {
-      tizen.filesystem.resolve(directoryPath, onSuccess, onError, openMode);
-   }
+   try
+   {
+      tizen.filesystem.resolve(directoryPath, onSuccess, onError, openMode);
+   }
 }
                2. Retrieving a List of Files @@ -538,28 +538,28 @@ openDir: function SystemIO_openDir(directoryPath, onSuccess, onError, openMode) 
                   getFilesList: function SystemIO_getFilesList(dir, onSuccess)
 {
-   try
-   {
-      dir.listFiles(function(files)
-         {
-            var tmp = [],
-            len = files.length,
-            i;
-
-            for (i = 0; i < len; i += 1)
-            {
-               tmp.push(files[i].name);
-            }
-
-            if (typeof onSuccess === 'function')
-            {
-               onSuccess(tmp);
-            }
-         }, function(e)
-         {
-            console.error('SystemIO_getFilesList dir.listFiles() error:', e);
-         });
-   }
+   try
+   {
+      dir.listFiles(function(files)
+         {
+            var tmp = [],
+            len = files.length,
+            i;
+
+            for (i = 0; i < len; i += 1)
+            {
+               tmp.push(files[i].name);
+            }
+
+            if (typeof onSuccess === 'function')
+            {
+               onSuccess(tmp);
+            }
+         }, function(e)
+         {
+            console.error('SystemIO_getFilesList dir.listFiles() error:', e);
+         });
+   }
 }
                3. Retrieving a Folder or File URI @@ -567,43 +567,43 @@ getFilesList: function SystemIO_getFilesList(dir, onSuccess) 
                   displayFolder: function Ui_displayFolder(folderName, nodes, refresh)
 {
-   var len = nodes.length,
-   listElements =
-      [this.templateManager.get('levelUpRow')], nodeName, checkedRows = [], i;
-
-   /* Other application code */
-
-   for (i = 0; i < len; i = i + 1)
-   {
-      nodeName = nodes[i].name.trim();
-      if (nodeName !== '')
-      {
-         if (nodes[i].isDirectory)
-         {
-            listElements.push(this.templateManager.get('folderRow',
-            {
-               id: i,
-               name: nodeName,
-               uri: nodes[i].fullPath,
-               fullUri: nodes[i].toURI()
-            }));
-         }
-         else
-         {
-            listElements.push(this.templateManager.get('fileRow',
-            {
-               id: i,
-               name: nodeName,
-               uri: nodes[i].fullPath,
-               fullUri: nodes[i].toURI(),
-               thumbnailURI: this.helpers.getThumbnailURI(nodeName, nodes[i])
-            }));
-         }
-      }
-   }
+   var len = nodes.length,
+   listElements =
+      [this.templateManager.get('levelUpRow')], nodeName, checkedRows = [], i;
+
+   /* Other application code */
+
+   for (i = 0; i < len; i = i + 1)
+   {
+      nodeName = nodes[i].name.trim();
+      if (nodeName !== '')
+      {
+         if (nodes[i].isDirectory)
+         {
+            listElements.push(this.templateManager.get('folderRow',
+            {
+               id: i,
+               name: nodeName,
+               uri: nodes[i].fullPath,
+               fullUri: nodes[i].toURI()
+            }));
+         }
+         else
+         {
+            listElements.push(this.templateManager.get('fileRow',
+            {
+               id: i,
+               name: nodeName,
+               uri: nodes[i].fullPath,
+               fullUri: nodes[i].toURI(),
+               thumbnailURI: this.helpers.getThumbnailURI(nodeName, nodes[i])
+            }));
+         }
+      }
+   }
 }
                  4. -
                +
              diff --git a/org.tizen.guides/html/web/data/task_mediacontent_w.htm b/org.tizen.guides/html/web/data/task_mediacontent_w.htm index 6729a95..5129369 100644 --- a/org.tizen.guides/html/web/data/task_mediacontent_w.htm +++ b/org.tizen.guides/html/web/data/task_mediacontent_w.htm @@ -5,13 +5,13 @@ - + - Task: Media Content + Task: Media Content @@ -20,7 +20,7 @@

              Mobile Web Wearable Web

              - + -
    +
    -

    Task: Media Content

    -

    This task, based on the MediaContent sample delivered with the Tizen Studio, demonstrates how you can use the Content API (in mobile and wearable applications) to manage media files in your application. For more information on the sample functionality and creating the sample with the full source code, see Media Content.

    -

    This task consists of the following parts:

    -
      +

      Task: Media Content

      +

      This task, based on the MediaContent sample delivered with the Tizen Studio, demonstrates how you can use the Content API (in mobile and wearable applications) to manage media files in your application. For more information on the sample functionality and creating the sample with the full source code, see Media Content.

      +

      This task consists of the following parts:

      + -

      This sample is a fully functional application which searches for and browses media directories and media item files. The media item files can be viewed and updated.

      - -

      Defining the Application Layout

      -

      The MediaContent sample application layout consists of 3 screens: the main screen displays a list of storage types and folders, the item screen displays a list of media items, and the Details screen displays the media item details.

      +
    +

    This sample is a fully functional application which searches for and browses media directories and media item files. The media item files can be viewed and updated.

    + +

    Defining the Application Layout

    +

    The MediaContent sample application layout consists of 3 screens: the main screen displays a list of storage types and folders, the item screen displays a list of media items, and the Details screen displays the media item details.

    -

    The following figure shows the main screens of the application.

    -

    Figure: MediaContent screens

    -

    MediaContent screens

    -

    Defining the Main Screen

    -
      -
    1. index.html Source File -
        -

      1. The main screen of the application displays a list of storage types and folders containing media items. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

        +

        The following figure shows the main screens of the application.

        +

        Figure: MediaContent screens

        +

        MediaContent screens

        +

        Defining the Main Screen

        +
          +
        1. index.html Source File +
            +

          1. The main screen of the application displays a list of storage types and folders containing media items. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

             <!--Main screen layout-->
-<div data-role="page" id="main">
-   <!--Header section-->
-   <div data-role="header" data-position="fixed">
-      <h1>Media content</h1>
-   </div>
+<div data-role="page" id="main">
+   <!--Header section-->
+   <div data-role="header" data-position="fixed">
+      <h1>Media content</h1>
+   </div>

          2. The actual content section of the screen is defined within a <div> element whose data-role attribute is set to content.

            -

            The section has a list component displaying the storage types, and a list divider for the folder list (whose list items are defined in the main.js file).

            +

            The section has a list component displaying the storage types, and a list divider for the folder list (whose list items are defined in the main.js file).

            -   <!--Content section-->
-   <div data-role="content">
-      <ul data-role="listview" id="folder-list">
-         <li data-role="list-divider">Storage type</li>
-         <li class="folder-type-all">
-            ALL
-         </li>
-         <li class="folder-type-internal">
-            INTERNAL
-         </li>
-         <li class="folder-type-external">
-            EXTERNAL
-         </li>
-         <li data-role="list-divider" id="folder-text">Folders</li>
-      </ul>
-   </div>
+   <!--Content section-->
+   <div data-role="content">
+      <ul data-role="listview" id="folder-list">
+         <li data-role="list-divider">Storage type</li>
+         <li class="folder-type-all">
+            ALL
+         </li>
+         <li class="folder-type-internal">
+            INTERNAL
+         </li>
+         <li class="folder-type-external">
+            EXTERNAL
+         </li>
+         <li data-role="list-divider" id="folder-text">Folders</li>
+      </ul>
+   </div>
 </div>
        -

        Defining the Folder Screen

        -
          -
        1. index.html Source File +

          Defining the Folder Screen

          +
            +
          1. index.html Source File

            Similarly as the main screen, the folder screen contains a list component displaying radio buttons (defined within an <input> element whose type attribute is set to radio) for the content types and a list divider for the item list (whose list items are defined in the main.js file). 

             <!--Folder screen layout-->
-<div data-role="page" id="items">
-   <div data-role="header" data-position="fixed">
-      <h1 id="items-title"></h1>
-   </div>
+<div data-role="page" id="items">
+   <div data-role="header" data-position="fixed">
+      <h1 id="items-title"></h1>
+   </div>
 
-   <!--Content section-->
-   <div data-role="content">
-      <ul data-role="listview" id="items-list">
-         <li data-role="list-divider">Item type</li>
-         <li class="ui-li-has-radio">
-            ALL
-            <input type="radio" name="item-type" id="item-type-all"
-                   value="ALL" checked="checked"/>
-         </li>
-         <li class="ui-li-has-radio">
-            IMAGE
-            <input type="radio" name="item-type" id="item-type-image" value="IMAGE"/>
-         </li>
-         <li class="ui-li-has-radio">
-            VIDEO
-            <input type="radio" name="item-type" id="item-type-video" value="VIDEO"/>
-         </li>
-         <li class="ui-li-has-radio">
-            AUDIO
-            <input type="radio" name="item-type" id="item-type-audio" value="AUDIO"/>
-         </li>
-         <li data-role="list-divider">Items</li>
-      </ul>
-   </div>
+   <!--Content section-->
+   <div data-role="content">
+      <ul data-role="listview" id="items-list">
+         <li data-role="list-divider">Item type</li>
+         <li class="ui-li-has-radio">
+            ALL
+            <input type="radio" name="item-type" id="item-type-all"
+                   value="ALL" checked="checked"/>
+         </li>
+         <li class="ui-li-has-radio">
+            IMAGE
+            <input type="radio" name="item-type" id="item-type-image" value="IMAGE"/>
+         </li>
+         <li class="ui-li-has-radio">
+            VIDEO
+            <input type="radio" name="item-type" id="item-type-video" value="VIDEO"/>
+         </li>
+         <li class="ui-li-has-radio">
+            AUDIO
+            <input type="radio" name="item-type" id="item-type-audio" value="AUDIO"/>
+         </li>
+         <li data-role="list-divider">Items</li>
+      </ul>
+   </div>
 </div>
            2. -
          - +
        +

        The Details screen content section contains a list component, and every list item is defined in the main.js file.

        - +

        Initializing the Application

        -
          +
          1. config.xml Source File

            The required privileges are declared in the config.xml file.

             <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/content.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/content.write"/>
-   <!--Other configuration details-->
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/content.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/content.write"/>
+   <!--Other configuration details-->
 </widget>
            2. -
          +
        -

        Browsing Content

        -

        This section builds upon the elements described in Browsing Content.

        - +

        Browsing Content

        +

        This section builds upon the elements described in Browsing Content.

        -

        Retrieving Media Directories

        -
          -
        1. main.js Source File -
            + +

            Retrieving Media Directories

            +
              +
            1. main.js Source File +

              1. The Content API uses the same ContentManager interface instance (in mobile and wearable applications) for all content-related functionalities. Retrieve the ContentManager interface instance using the tizen global object.

                 gMediaSource = tizen.content;
@@ -172,147 +172,147 @@ gMediaSource = tizen.content;
 
                 function getFolders(storageType)
 {
-   try
-   {
-      gMediaSource = tizen.content;
-      gMediaSource.getDirectories(onGetFoldersSuccess, onGetFoldersError);
-   }
-   function onGetFoldersSuccess(folders)
-   {
-      $("#folder-list").delegate("li", "vclick", function()
-         {
-            var id = $(this).data("id");
-            if (id != null)
-            {
-               getFolderItems(Number(id), gMediaType);
-            }
+   try
+   {
+      gMediaSource = tizen.content;
+      gMediaSource.getDirectories(onGetFoldersSuccess, onGetFoldersError);
+   }
+   function onGetFoldersSuccess(folders)
+   {
+      $("#folder-list").delegate("li", "vclick", function()
+         {
+            var id = $(this).data("id");
+            if (id != null)
+            {
+               getFolderItems(Number(id), gMediaType);
+            }
 
-            return false;
-         });
-      gMediaFolders = folders;
-      showFolderList(storageType);
-   }
-   function onGetFoldersError(err)
-   {
-      alert("GetFolders failed:" + err.message);
-   }
+            return false;
+         });
+      gMediaFolders = folders;
+      showFolderList(storageType);
+   }
+   function onGetFoldersError(err)
+   {
+      alert("GetFolders failed:" + err.message);
+   }
 
-   flagInit = true;
+   flagInit = true;
 }

              2. The showFolderList() method calls the makeListItem() method, which creates a list of directories and displays it on the screen.

                Although all the directories are retrieved in the previous step, the showFolderList() method only displays the directories that match with the storage type the user has selected (INTERNAL or EXTERNAL).

                 function showFolderList(storageType)
 {
-   setLastStorage(storageType);
-   if (flagInit == false)
-   {
-      getFolders(storageType);
-   }
-   else
-   {
-      var str = '';
-      for (var i = 0; i < gMediaFolders.length; i++)
-      {
-         if (storageType == "ALL" || storageType == gMediaFolders[i].storageType)
-            str += makeListItem(i, gMediaFolders[i].title,
-                                gMediaFolders[i].directoryURI);
-      }
+   setLastStorage(storageType);
+   if (flagInit == false)
+   {
+      getFolders(storageType);
+   }
+   else
+   {
+      var str = '';
+      for (var i = 0; i < gMediaFolders.length; i++)
+      {
+         if (storageType == "ALL" || storageType == gMediaFolders[i].storageType)
+            str += makeListItem(i, gMediaFolders[i].title,
+                                gMediaFolders[i].directoryURI);
+      }
 
-      $("#folder-list>li[data-id]").remove();
-      $("#folder-list").append(str).trigger("create").listview("refresh");
-   }
+      $("#folder-list>li[data-id]").remove();
+      $("#folder-list").append(str).trigger("create").listview("refresh");
+   }
 }
                3. -
              2. -
            -

            Retrieving Media Items

            -
              -
            1. main.js Source File -
                +
              2. +
            +

            Retrieving Media Items

            +
              +
            1. main.js Source File +

              1. To get the media item list, use the getFolderItems() method. The method takes 2 attributes: folderId, which takes the folder ID whose media item list is to be displayed and mediaType, which specifies the media type (all, image, audio, or video).

                The getFolderItems() method is called when the user clicks a specific directory on the main screen, or changes the item type selection with the radio buttons on the item screen.

                 function getFolderItems(folderId, mediaType)
 {
-
                2. +

              2. The find() method is called to search and retrieve the required media items. After a successful search, the success event handler either updates the item list on the item screen with the showItemList() method (if the item screen is already displayed), or moves to the item screen (which means that the retrieved item list is automatically displayed).

                -   function onFindItemSuccess(items)
-   {
-      gMediaItems = items;
-      gFolderId = folderId;
-      gMediaType = mediaType;
+   function onFindItemSuccess(items)
+   {
+      gMediaItems = items;
+      gFolderId = folderId;
+      gMediaType = mediaType;
 
-      if ($.mobile.activePage.attr("id") == "items")
-      {
-         showItemList();
-      }
-      else
-      {
-         $.mobile.changePage("#items");
-      }
-   }
-   function onFindItemsError(err)
-   {
-      alert("getFolderItems findItems failed: " + err.message);
-   }
-   try
-   {
-      gMediaSource.find(onFindItemSuccess, onFindItemError,
-                    folderId == null ? null : gMediaFolders[folderId].id,
-                    mediaType ==
-                       "ALL" ? null : new tizen.AttributeFilter("type", "EXACTLY",
-                                                                mediaType),
-                    new tizen.SortMode("title", "ASC"));
-   }
+      if ($.mobile.activePage.attr("id") == "items")
+      {
+         showItemList();
+      }
+      else
+      {
+         $.mobile.changePage("#items");
+      }
+   }
+   function onFindItemsError(err)
+   {
+      alert("getFolderItems findItems failed: " + err.message);
+   }
+   try
+   {
+      gMediaSource.find(onFindItemSuccess, onFindItemError,
+                    folderId == null ? null : gMediaFolders[folderId].id,
+                    mediaType ==
+                       "ALL" ? null : new tizen.AttributeFilter("type", "EXACTLY",
+                                                                mediaType),
+                    new tizen.SortMode("title", "ASC"));
+   }
 }

              3. The showItemList() method creates a list of media items and displays it on the screen.

                 function showItemList()
 {
-   var str = '';
-   var title = gMediaFolders[gFolderId].title;
-   $("#items-title").html(gFolderId == null ? "All" : title.toString());
+   var str = '';
+   var title = gMediaFolders[gFolderId].title;
+   $("#items-title").html(gFolderId == null ? "All" : title.toString());
 
-   for (var i = 0; i < gMediaItems.length; i++)
-   {
-      str += makeListItem(i, gMediaItems[i].title, gMediaItems[i].type
-             + "  Rating: " + gMediaItems[i].rating);
-   }
+   for (var i = 0; i < gMediaItems.length; i++)
+   {
+      str += makeListItem(i, gMediaItems[i].title, gMediaItems[i].type
+             + "  Rating: " + gMediaItems[i].rating);
+   }
 
-   $("#items-list>li[data-id]").remove();
-   $("#items-list").append(str).trigger("create").listview("refresh");
+   $("#items-list>li[data-id]").remove();
+   $("#items-list").append(str).trigger("create").listview("refresh");
 }
                4. -
              2. -
            +
          2. +

        Viewing Media File Details

        -

        This section builds upon the elements described in Managing Content.

        -
          +

          This section builds upon the elements described in Managing Content.

          +
          1. main.js Source File

            To view the details of a media file, use the showMediaDetail() method, which displays the properties of the selected media file depending on the type of the file. The makeCommonPropertiesListItems() method defines a list of properties common to all the types of media files.

            The showMediaDetail() method is called when the user clicks a media file on the item screen and the Details screen is displayed.

             function showMediaDetail()
 {
-   var str, item = gMediaItems[gItemId];
-   /* Details for image items */
-   if (item.type == "IMAGE")
-   {
-      str = makeCommonPropertiesListItems(item)
-      + makeListItem(null, "Width", item.width)
-      + makeListItem(null, "Height", item.height)
-      + makeListItem(null, "Latitude", item.geolocation.latitude)
-      + makeListItem(null, "Longitude", item.geolocation.longitude);
-   }
-   /* Details for video and audio items */
+   var str, item = gMediaItems[gItemId];
+   /* Details for image items */
+   if (item.type == "IMAGE")
+   {
+      str = makeCommonPropertiesListItems(item)
+      + makeListItem(null, "Width", item.width)
+      + makeListItem(null, "Height", item.height)
+      + makeListItem(null, "Latitude", item.geolocation.latitude)
+      + makeListItem(null, "Longitude", item.geolocation.longitude);
+   }
+   /* Details for video and audio items */
 
-   $("#media-details").html(str).trigger("create").listview("refresh");
+   $("#media-details").html(str).trigger("create").listview("refresh");
 }
            2. -
          +
        diff --git a/org.tizen.guides/html/web/device/device_cover_w.htm b/org.tizen.guides/html/web/device/device_cover_w.htm index 34a9006..a339d19 100644 --- a/org.tizen.guides/html/web/device/device_cover_w.htm +++ b/org.tizen.guides/html/web/device/device_cover_w.htm @@ -5,13 +5,13 @@ - + - Device Settings and Systems + Device Settings and Systems @@ -28,7 +28,7 @@
      2. Tizen 3.0 and Higher for TV
    -
    +

    Device Settings and Systems

    @@ -62,7 +62,7 @@

    You can play a feedback pattern using sound or vibration. You can set specific patterns, and check whether a specific pattern is supported.

    - +
    diff --git a/org.tizen.guides/html/web/device/feedback_w.htm b/org.tizen.guides/html/web/device/feedback_w.htm index 4a5be71..93c5958 100644 --- a/org.tizen.guides/html/web/device/feedback_w.htm +++ b/org.tizen.guides/html/web/device/feedback_w.htm @@ -60,14 +60,14 @@

    You can check whether a feedback type (sound or vibration) is supported for a specified pattern. To get information about the supported specified system predefined pattern type pairs, use the isPatternSupported() method of the FeedbackManager interface (in mobile and wearable applications):

    -var pattern = "BT_CONNECTED", type = "TYPE_SOUND";
+var pattern = "BT_CONNECTED", type = "TYPE_SOUND";
 var isSupported = tizen.feedback.isPatternSupported(pattern, type);
-var isSupportedStr = "";
+var isSupportedStr = "";
 if (!isSupported)
 {
-   isSupportedStr = " not";
+   isSupportedStr = " not";
 }
-console.log("pattern " + pattern + " is" + isSupportedStr + " supported");
+console.log("pattern " + pattern + " is" + isSupportedStr + " supported");
    @@ -80,11 +80,11 @@ console.log("pattern " + pattern + " is" + isSupportedStr + 
     try
 {
-   tizen.feedback.play("CHARGERCONN");
+   tizen.feedback.play("CHARGERCONN");
 }
 catch (err)
 {
-   console.log(err.name +': ' + err.message);
+   console.log(err.name +': ' + err.message);
 }
    diff --git a/org.tizen.guides/html/web/device/power_w.htm b/org.tizen.guides/html/web/device/power_w.htm index 0ccb854..9511be6 100644 --- a/org.tizen.guides/html/web/device/power_w.htm +++ b/org.tizen.guides/html/web/device/power_w.htm @@ -36,7 +36,7 @@
    @@ -44,7 +44,7 @@

    Power States

    -

    Tizen enables you to access a device's power resource. Currently, the screen and CPU power resources are supported, allowing you to request a specific power state and control the brightness of the screen.

    +

    Tizen enables you to access a device's power resource. Currently, the screen and CPU power resources are supported, allowing you to request a specific power state and control the brightness of the screen.

    This feature is supported in mobile and wearable applications only.

    @@ -62,7 +62,7 @@

    To use the Power API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the config.xml file:

    -<tizen:privilege name="http://tizen.org/privilege/power"/>
+<tizen:privilege name="http://tizen.org/privilege/power"/>

    Managing the Power Resource

    @@ -100,21 +100,21 @@ If you request a new power state without releasing the previous state, the Tizen platform follows the highest minimum state requested.
    -

    To request and release the power state:

    -
      +

      To request and release the power state:

      +

      1. To set the power state, call the request() method of the PowerManager interface (in mobile and wearable applications) with the intended power resource and its state. In this example, the SCREEN_NORMAL state is requested for the screen resource:

        -tizen.power.request("SCREEN", "SCREEN_NORMAL");
+tizen.power.request("SCREEN", "SCREEN_NORMAL");

      2. To release a power state, call the release() method with the intended resource:

        -tizen.power.release("SCREEN");
+tizen.power.release("SCREEN");

      3. To listen to the screen state changes, use the setScreenStateChangeListener() method:

         function onScreenStateChanged(previousState, changedState)
 {
-   console.log("Screen state changed from" + previousState + "to" + changedState);
+   console.log("Screen state changed from" + previousState + "to" + changedState);
 }
 tizen.power.setScreenStateChangeListener(onScreenStateChanged);
        4. @@ -124,8 +124,8 @@ tizen.power.setScreenStateChangeListener(onScreenStateChanged); tizen.power.unsetScreenStateChangeListener(); -
      - +
    +

    Managing the Screen Brightness

    To get, set, and restore the screen brightness:

      @@ -144,7 +144,7 @@ tizen.power.setScreenBrightness(1); tizen.power.restoreScreenBrightness();
    - +

    Managing the Screen State

    To switch the screen on and off, and check whether the screen is on:

    Related Info

    @@ -98,10 +98,10 @@ tr.images td {

    You can access and monitor the device and system properties (both hardware and capability), such as the battery level, available device storage, version number, model name, and the cellular network being used.

    -

    The System Information API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    - +

    The System Information API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    +

    The main features of the System Information API include:

    - +
    • Checking the amount of total and available memory

      You can retrieve memory amounts, such as the total and available amount of system memory.

      • @@ -120,11 +120,11 @@ tr.images td {

      To use the System Information API (in mobile, wearable, and TV applications), the application has to request permission by adding the following privileges to the config.xml file:

      -<tizen:privilege name="http://tizen.org/privilege/system"/>
-<tizen:privilege name="http://tizen.org/privilege/telephony"/>
+<tizen:privilege name="http://tizen.org/privilege/system"/>
+<tizen:privilege name="http://tizen.org/privilege/telephony"/>
      - +

      Retrieving a Device Capability

      Retrieve a device capability using the getCapability() method of the SystemInfo interface (in mobile, wearable, and TV applications):

        @@ -132,8 +132,8 @@ tr.images td {

        To get a specific capability of the device, use the getCapability() method:

         var barometer =
-   tizen.systeminfo.getCapability("http://tizen.org/feature/sensor.barometer");
-console.log(" Barometer = " + barometer);
+   tizen.systeminfo.getCapability("http://tizen.org/feature/sensor.barometer");
+console.log(" Barometer = " + barometer);
      @@ -145,29 +145,29 @@ console.log(" Barometer = " + barometer);

      For a list of available keys and their meaning, see the device capability keys (in mobile and wearable applications).

      - +

      Retrieving the Current State of a Property

      -

      The property state can determine whether your application has enough resources to complete a particular task or service successfully. For example, if you are creating a file, you need to check the storage property to know whether a writable storage is available on the device.

      +

      The property state can determine whether your application has enough resources to complete a particular task or service successfully. For example, if you are creating a file, you need to check the storage property to know whether a writable storage is available on the device.

      Retrieve information about the property states using the applicable methods of the SystemInfo interface (in mobile, wearable, and TV applications):

      1. To check the current state of the property, use the getPropertyValue() method.

        The first method parameter must be of the SystemInfoPropertyId type (in mobile, wearable, and TV applications). For the available values, see the Available properties table.

         /* Retrieve the battery property */
-tizen.systeminfo.getPropertyValue("BATTERY", onPowerSuccessCallback);
+tizen.systeminfo.getPropertyValue("BATTERY", onPowerSuccessCallback);
 
 /* Retrieve the cellular network property */
-tizen.systeminfo.getPropertyValue("CELLULAR_NETWORK", onCellularSuccessCallback);
+tizen.systeminfo.getPropertyValue("CELLULAR_NETWORK", onCellularSuccessCallback);

        After retrieving a property, you can use all the details of the property in your code. The property values are returned in the success event handlers defined below.

      2. Use the power property values.

        In the following example, the battery level and charging status of the power property are printed to a console log.

         function onPowerSuccessCallback(battery)
 {
-   /* Log the device battery level to the console */
-   console.log("The battery level is " + battery.level);
+   /* Log the device battery level to the console */
+   console.log("The battery level is " + battery.level);
 
-   /* Check whether the device is charging */
-   var charging = battery.isCharging;
+   /* Check whether the device is charging */
+   var charging = battery.isCharging;
 }

      3. Retrieve the current states of a specific device property using the getPropertyValueArray() method. For example, you can check the state of SIM cards, which are mounted in the Tizen device.

        @@ -175,44 +175,44 @@ function onPowerSuccessCallback(battery) 
         function successCallback(properties)
 {
-   console.log("The number of the returned system properties is " + properties.length);
-   for (var i = 0; i properties.length; i++)
-   {
-      console.log("[" + (i+1) + "] SIM's state is " + properties[i].state);
-   }
+   console.log("The number of the returned system properties is " + properties.length);
+   for (var i = 0; i properties.length; i++)
+   {
+      console.log("[" + (i+1) + "] SIM's state is " + properties[i].state);
+   }
 }
 
-tizen.systeminfo.getPropertyValueArray("SIM", successCallback);
+tizen.systeminfo.getPropertyValueArray("SIM", successCallback);

      4. Retrieve the number of system property information using the getCount() method. For example, you can check the number of SIM cards, which are installed in the Tizen device.

        -console.log("The number of SIM cards in the device is "
-            + tizen.systeminfo.getCount("SIM"));
+console.log("The number of SIM cards in the device is "
+            + tizen.systeminfo.getCount("SIM"));
      - +

      Retrieving the Memory State

      Check the total or available amount of system memory using the applicable method of the SystemInfo interface (in mobile, wearable, and TV applications):

      • To get the total amount of system memory, use the getTotalMemory() method:

        -console.log("The total memory size is " + tizen.systeminfo.getTotalMemory()
-            + " bytes.");
+console.log("The total memory size is " + tizen.systeminfo.getTotalMemory()
+            + " bytes.");

      • To get the available amount of system memory, use the getAvailableMemory() method:

        -console.log("The available memory size is " + tizen.systeminfo.getAvailableMemory()
-            + " bytes.");
+console.log("The available memory size is " + tizen.systeminfo.getAvailableMemory()
+            + " bytes.");
      - +

      Retrieving and Monitoring the Device Orientation

      -

      The device orientation defines the angle between the direction of what is considered to be the "top" side of the device and the physical upward direction. The device orientation is not directly related to the screen orientation. For example, when the Auto rotate screen option is disabled or the Web application has the screen-orientation option (in mobile and wearable applications) set to "landscape" or "portrait", the screen is not rotated and the window.screen.orientation property does not change; however, the SystemInfo device orientation changes.

      +

      The device orientation defines the angle between the direction of what is considered to be the "top" side of the device and the physical upward direction. The device orientation is not directly related to the screen orientation. For example, when the Auto rotate screen option is disabled or the Web application has the screen-orientation option (in mobile and wearable applications) set to "landscape" or "portrait", the screen is not rotated and the window.screen.orientation property does not change; however, the SystemInfo device orientation changes.

      When a device is in its natural position, it is considered to be in the PORTRAIT_PRIMARY orientation (if the screen height is greater than its width) or the LANDSCAPE_PRIMARY orientation (otherwise). When the device is rotated 90 degrees clockwise (rotated right), the orientation changes from LANDSCAPE_PRIMARY to PORTRAIT_PRIMARY, from PORTRAIT_PRIMARY to LANDSCAPE_SECONDARY, from LANDSCAPE_SECONDARY to PORTRAIT_SECONDARY, and from PORTRAIT_SECONDARY back to LANDSCAPE_PRIMARY.

      Table: Device orientations

      @@ -237,43 +237,43 @@ console.log("The available memory size is " + tizen.systeminfo.getAvai -

      To retrieve information about the device orientation:

      +

      To retrieve information about the device orientation:

      -
        +

        1. To retrieve the current orientation of the device, use the getPropertyValue() method of the SystemInfo interface (in mobile, wearable, and TV applications) and query the DEVICE_ORIENTATION property:

           function onDeviceOrientation(deviceOrientation)
 {
-   console.log("The device orientation is now: " + deviceOrientation.status);
+   console.log("The device orientation is now: " + deviceOrientation.status);
 }
-tizen.systeminfo.getPropertyValue("DEVICE_ORIENTATION", onDeviceOrientation);
+tizen.systeminfo.getPropertyValue("DEVICE_ORIENTATION", onDeviceOrientation);
        2. The user can rotate the device and change its orientation. To receive notifications about the orientation changes, use the addPropertyValueChangeListener() method of the SystemInfo interface: 
           var orientationListenerId;
 orientationListenerId =
-   tizen.systeminfo.addPropertyValueChangeListener("DEVICE_ORIENTATION",
-                                                   onDeviceOrientation);
+   tizen.systeminfo.addPropertyValueChangeListener("DEVICE_ORIENTATION",
+                                                   onDeviceOrientation);
          3. -

        3. To stop receiving change notifications, use the removePropertyValueChangeListener() method of the SystemInfo interface:

          +

        4. To stop receiving change notifications, use the removePropertyValueChangeListener() method of the SystemInfo interface:

           tizen.systeminfo.removePropertyValueChangeListener(orientationListenerId);
          5. -
        +

      Receiving Notifications on Property Value Changes

      -

      You can receive state updates when a change occurs in a specific property. The addPropertyValueChangeListener() method registers an event listener for a specific property, and returns the subscription identifier for the listener. You can use the SystemInfoPropertySuccessCallback interface (in mobile, wearable, and TV applications) to define the event handler for receiving the change notification.

      +

      You can receive state updates when a change occurs in a specific property. The addPropertyValueChangeListener() method registers an event listener for a specific property, and returns the subscription identifier for the listener. You can use the SystemInfoPropertySuccessCallback interface (in mobile, wearable, and TV applications) to define the event handler for receiving the change notification.

      To receive notifications on property value changes:

      1. Register a SystemInfoPropertySuccessCallback event handler for the property value changes using the addPropertyValueChangeListener() method of the SystemInfo interface.

        The first parameter defines the property whose value changes you want to track, and the optional last parameter defines any thresholds when you want the notifications to be triggered. In the following example, an event handler is registered for the memory property value changes.

         function successCallback(memory)
 {
-   console.log("The memory state is " + memory.state);
+   console.log("The memory state is " + memory.state);
 }
 
-tizen.systeminfo.addPropertyValueChangeListener("MEMORY", successCallback);
+tizen.systeminfo.addPropertyValueChangeListener("MEMORY", successCallback);

        The method returns a watch identifier, which can be used to deregister the event handler.

      2. In the success event handler of the addPropertyValueChangeListener() method, define the notification event actions.

        In the following example, a warning about the low battery is logged to the console.

        @@ -281,23 +281,23 @@ tizen.systeminfo.addPropertyValueChangeListener("MEMORY", successCallb /* Trigger a notification */ function onSuccessCallback(battery) { -   console.log("Low battery: " + battery.level); + console.log("Low battery: " + battery.level); } -tizen.systeminfo.addPropertyValueChangeListener("BATTERY", onSuccessCallback); +tizen.systeminfo.addPropertyValueChangeListener("BATTERY", onSuccessCallback);

      3. To deregister the event handler, use removePropertyValueChangeListener() method with the watch identifier returned from the addPropertyValueChangeListener() method.

        In the following example, the event handler is deregistered when the first change of the SIM card state is detected.

         function successCallback(properties)
 {
-   for (var i = 0; i properties.length; i++)
-   {
-      console.log("[" + (i+1) + "] SIM's state is " + properties[i].state);
-   }
-   removePropertyValueChangeListener(id);
+   for (var i = 0; i properties.length; i++)
+   {
+      console.log("[" + (i+1) + "] SIM's state is " + properties[i].state);
+   }
+   removePropertyValueChangeListener(id);
 }
 
-var id = tizen.systeminfo.addPropertyValueArrayChangeListener("SIM", successCallback);
+var id = tizen.systeminfo.addPropertyValueArrayChangeListener("SIM", successCallback);
      @@ -362,7 +362,7 @@ var id = tizen.systeminfo.addPropertyValueArrayChangeListener("SIM", s SystemInfoNetProxyNetwork (in mobile, wearable, and TV applications) NET_PROXY_NETWORK Provides information about the proxy type network. With this property, you can, for example, retrieve the network details that allow your application to access the network. - + SystemInfoSIM (in mobile, wearable, and TV applications) SIM diff --git a/org.tizen.guides/html/web/device/system_setting_w.htm b/org.tizen.guides/html/web/device/system_setting_w.htm index 43d6c72..564b6fe 100644 --- a/org.tizen.guides/html/web/device/system_setting_w.htm +++ b/org.tizen.guides/html/web/device/system_setting_w.htm @@ -11,8 +11,8 @@ System Settings - - + + @@ -48,7 +48,7 @@

      You can access and modify some system settings properties, such as the home screen and lock screen wallpaper image, incoming call ringtone, and email notification tone.

      -

      This feature is supported in mobile and wearable applications only.

      +

      This feature is supported in mobile and wearable applications only.

      The main features of the System Setting API include:

      - +

      Prerequisites

      To use the System Setting API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the config.xml file:

      -<tizen:privilege name="http://tizen.org/privilege/setting"/>
+<tizen:privilege name="http://tizen.org/privilege/setting"/>

      Managing the Device Wallpapers

      You can change the home and lock screen images by using the setProperty() method of the SystemSettingManager interface (in mobile and wearable applications). Similarly, you can retrieve information about them by using the getProperty() method.

      -

      To set the device wallpaper and get information about it:

      -
        +

        To set the device wallpaper and get information about it:

        +

        • To set the specified image as the lock screen wallpaper, use the setProperty() method:

           function setLockscreenWallpaper()
 {
-   tizen.filesystem.resolve("images/Background.jpg", function(imageFile)
-      {
-         try
-         {
-            tizen.systemsetting.setProperty("LOCK_SCREEN",
-                                            imageFile.toURI().replace("file://", ""),
-                                            successCB, errorCB);
-         }
-         catch (error)
-         {
-            console.log("Error: " + error);
-         }
-   });
+   tizen.filesystem.resolve("images/Background.jpg", function(imageFile)
+      {
+         try
+         {
+            tizen.systemsetting.setProperty("LOCK_SCREEN",
+                                            imageFile.toURI().replace("file://", ""),
+                                            successCB, errorCB);
+         }
+         catch (error)
+         {
+            console.log("Error: " + error);
+         }
+   });
 }

        • To get the current system setting information for the home screen wallpaper, use the getProperty() method:

           function getHomescreenWallpaper()
 {
-   try
-   {
-      tizen.systemsetting.getProperty("HOME_SCREEN", successCB, errorCB);
-   }
-   catch (error)
-   {
-      console.log("Error: " + error);
-   }
+   try
+   {
+      tizen.systemsetting.getProperty("HOME_SCREEN", successCB, errorCB);
+   }
+   catch (error)
+   {
+      console.log("Error: " + error);
+   }
 }
          • -
        - +
      +

      Managing Ringtones and Notification Tones

      You can modify the incoming call ringtone and notification email tone sound by using the setProperty() method of the SystemSettingManager interface (in mobile and wearable applications). Similarly, you can retrieve information about them by using the getProperty() method.

      -

      To set ringtones and notification tones:

      -
        +

        To set ringtones and notification tones:

        +

        • To set the specified audio file as the notification tone for emails, use the setProperty() method of the SystemSettingManager interface:

           function onSet()
 {
-   console.log("It's set");
+   console.log("It's set");
 }
 
-tizen.filesystem.resolve("music/Favorite track.mp3", function(musicFile)
-   {
-      try
-      {
-         tizen.systemsetting.setProperty("NOTIFICATION_EMAIL",
-                                         musicFile.toURI().replace("file://", ""),
-                                         onSet);
-      }
-      catch (error)
-      {
-         console.log("Error: " + error);
-      }
-   });
+tizen.filesystem.resolve("music/Favorite track.mp3", function(musicFile)
+   {
+      try
+      {
+         tizen.systemsetting.setProperty("NOTIFICATION_EMAIL",
+                                         musicFile.toURI().replace("file://", ""),
+                                         onSet);
+      }
+      catch (error)
+      {
+         console.log("Error: " + error);
+      }
+   });

        • To get the current system setting information for the incoming call ringtone, use the getProperty() method:

           function onGet(value)
 {
-   console.log("Current setting option value is: " + value);
+   console.log("Current setting option value is: " + value);
 }
 
 try
 {
-   tizen.systemsetting.getProperty("INCOMING_CALL", onGet);
+   tizen.systemsetting.getProperty("INCOMING_CALL", onGet);
 }
 catch (error)
 {
-   console.log("Error: " + error);
+   console.log("Error: " + error);
 }
          • -
        +
      -

      System Settings Properties

      +

      System Settings Properties

      The following table lists the supported system settings properties.

      Table: Available properties

      diff --git a/org.tizen.guides/html/web/device/task_systeminfo_w.htm b/org.tizen.guides/html/web/device/task_systeminfo_w.htm index 638d5af..c981b08 100644 --- a/org.tizen.guides/html/web/device/task_systeminfo_w.htm +++ b/org.tizen.guides/html/web/device/task_systeminfo_w.htm @@ -5,13 +5,13 @@ - + - Task: System Information + Task: System Information @@ -20,7 +20,7 @@

      Mobile Web Wearable Web

      - + -
    +
    -

    Task: System Information

    -

    This task, based on the Systeminfo sample delivered with the Tizen Studio, demonstrates how you can use the System Information API (in mobile and wearable applications) to retrieve and display status and details of various device-specific items. For more information on the sample functionality and creating the sample with the full source code, see System Info.

    -

    This task consists of the following parts:

    - -

    This sample is a fully functional application for retrieving device-specific information and monitoring changes in the system property values.

    - -

    Defining the Application Layout

    -

    The Systeminfo sample application layout consists of 2 screens: the main screen and the information screen.

    - - -

    The following figure shows the main screens of the application.

    -

    Figure: Systeminfo screens

    -

    Systeminfo screens

    +

    Task: System Information

    +

    This task, based on the Systeminfo sample delivered with the Tizen Studio, demonstrates how you can use the System Information API (in mobile and wearable applications) to retrieve and display status and details of various device-specific items. For more information on the sample functionality and creating the sample with the full source code, see System Info.

    +

    This task consists of the following parts:

    + +

    This sample is a fully functional application for retrieving device-specific information and monitoring changes in the system property values.

    + +

    Defining the Application Layout

    +

    The Systeminfo sample application layout consists of 2 screens: the main screen and the information screen.

    + + +

    The following figure shows the main screens of the application.

    +

    Figure: Systeminfo screens

    +

    Systeminfo screens

    Defining the Main Screen

    -
      -
    1. index.html Source File -
        +
          +
        1. index.html Source File +

          1. The main screen of the application displays a list of system properties about which you can retrieve information. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

             <!--Main screen layout-->
-<div data-role="page" id="main">
-   <!--Header section-->
-   <div data-role="header" data-position="fixed">
-      <h1>System information</h1>
-   </div>
+<div data-role="page" id="main">
+   <!--Header section-->
+   <div data-role="header" data-position="fixed">
+      <h1>System information</h1>
+   </div>

          2. The actual content section of the screen is defined within a <div> element whose data-role attribute is set to content. The content section of the main screen contains a list component (in mobile or wearable applications) displaying the system properties.

            -   <!--Content section-->
-   <div data-role="content">
-      <ul data-role="listview">
-         <li id="storage-info">Storage</li>
-         <li id="battery-info">Battery</li>
-         <li id="cpu-info">CPU</li>
-         <li id="display-info">Display</li>
-         <li id="orientation-info">Device orientation</li>
-      </ul>
-   </div>
+   <!--Content section-->
+   <div data-role="content">
+      <ul data-role="listview">
+         <li id="storage-info">Storage</li>
+         <li id="battery-info">Battery</li>
+         <li id="cpu-info">CPU</li>
+         <li id="display-info">Display</li>
+         <li id="orientation-info">Device orientation</li>
+      </ul>
+   </div>
 </div>
            3. - -
          2. -
        + +
      2. +

    Defining the Information Screen

    -
      -
    1. index.html Source File -
        +
          +
        1. index.html Source File +

          1. The information screen of the application displays the details of a selected system property. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen, which varies depending on the list item the user clicks on the main screen.

             <!--Information screen layout-->
-<div data-role="page" id="info">
-   <!--Header section-->
-   <div data-role="header" data-position="fixed">
-      <h1 id="info-title"></h1>
-   </div>
+<div data-role="page" id="info">
+   <!--Header section-->
+   <div data-role="header" data-position="fixed">
+      <h1 id="info-title"></h1>
+   </div>

          2. The actual content section of the screen is defined within a <div> element whose data-role attribute is set to content. The content section of the information screen contains a list component displaying the details of the selected system property.

            -   <!--Content section-->
-   <div data-role="content">
-      <ul data-role="listview" id="info-list">
-      </ul>
-   </div>
+   <!--Content section-->
+   <div data-role="content">
+      <ul data-role="listview" id="info-list">
+      </ul>
+   </div>
 </div>
            3. -
          2. -
        - -

        Displaying Device-specific Information

        -

        This section builds upon the elements described in Retrieving the Current State of a Property.

        - - - +
      2. +
    + +

    Displaying Device-specific Information

    +

    This section builds upon the elements described in Retrieving the Current State of a Property.

    + + +

    Defining the List Item Types

    -
      +
      1. main.js Source File -

        When the user selects a property list item on the main screen, the information screen opens displaying a list of the details of the selected property.

        Different properties require different kind of layout and functionality in their list. User-defined methods are defined for creating the following list item types:

        -
          +

          When the user selects a property list item on the main screen, the information screen opens displaying a list of the details of the selected property.

          Different properties require different kind of layout and functionality in their list. User-defined methods are defined for creating the following list item types:

          +
          • List item with 1 line (contains the property value) 
             function make1lineListItem(value)
 {
-   return '<li>' + value + '</li>';
+   return '<li>' + value + '</li>';
 }
          • List item with 2 lines (contains both the property title and value) 
             function make2lineListItem(title, value)
 {
-   return '<li class="ui-li-has-multiline ui-li-text-ellipsis">'
-          + title
-          + '<span class="ui-li-text-sub">'
-          + value
-          + '</span></li>';
+   return '<li class="ui-li-has-multiline ui-li-text-ellipsis">'
+          + title
+          + '<span class="ui-li-text-sub">'
+          + value
+          + '</span></li>';
 }
          • Divider list item (contains a list divider title) 
             function makeDividerListItem(value)
 {
-   return '<li data-role="list-divider">' + value + '</li>';
+   return '<li data-role="list-divider">' + value + '</li>';
 }
            • -
          -
      + +

    Displaying System Property Details

    -

    The system property retrieval is implemented in the main.js file.

    -

    If the user clicks a system property on the main screen, the getSystemProperty() method is invoked to check the property support and retrieve the property details. If the method succeeds, the applicable event handler displays the property values on the screen. Since all the system properties are displayed similarly, only some of them are described below.

    -
      +

      The system property retrieval is implemented in the main.js file.

      +

      If the user clicks a system property on the main screen, the getSystemProperty() method is invoked to check the property support and retrieve the property details. If the method succeeds, the applicable event handler displays the property values on the screen. Since all the system properties are displayed similarly, only some of them are described below.

      +
      1. Displaying the Battery Property Values

        The onBatterySuccess() event handler determines the screen title for the BATTERY property information screen, and defines a list containing the battery level of the device, and information about whether the device is charging (both using list items with a 2-line format).

        The changePage() method moves the application from the main screen to the information screen containing the defined list.

         function onBatterySuccess(battery)
 {
-   /* Screen title */
-   gInfoTitle = "BATTERY";
+   /* Screen title */
+   gInfoTitle = "BATTERY";
 
-   /* Property value list */
-   gInfo = make2lineListItem("Level", battery.level)
-           + make2lineListItem("Charging", (battery.isCharging == true ? "Yes" : "No"));
+   /* Property value list */
+   gInfo = make2lineListItem("Level", battery.level)
+           + make2lineListItem("Charging", (battery.isCharging == true ? "Yes" : "No"));
 
-   /* Screen change */
-   $.mobile.changePage("#info");
+   /* Screen change */
+   $.mobile.changePage("#info");
 }
      2. Displaying the Storage Property Values @@ -176,22 +176,22 @@ function onBatterySuccess(battery) 
         function onStorageSuccess(storages)
 {
-   gInfoTitle = "STORAGE(" + storages.length + ")";
-   gInfo = "";
-   for (var i = 0; i < storages.length; i++)
-   {
-      gInfo += makeDividerListItem("Storage " + (i + 1))
-               + make2lineListItem("Type", storages.units[i].type)
-               + make2lineListItem("Capacity",
-                                   Math.floor(storages[i].capacity / 1000000) + " MB")
-               + make2lineListItem("Available capacity",
-                                   Math.floor(storages[i].availableCapacity / 1000000)
-                                   + " MB")
-               + make2lineListItem("Removable",
-                                   (storages[i].isRemoveable == true ? "Yes" : "No"));
-   }
-
-   $.mobile.changePage("#info");
+   gInfoTitle = "STORAGE(" + storages.length + ")";
+   gInfo = "";
+   for (var i = 0; i < storages.length; i++)
+   {
+      gInfo += makeDividerListItem("Storage " + (i + 1))
+               + make2lineListItem("Type", storages.units[i].type)
+               + make2lineListItem("Capacity",
+                                   Math.floor(storages[i].capacity / 1000000) + " MB")
+               + make2lineListItem("Available capacity",
+                                   Math.floor(storages[i].availableCapacity / 1000000)
+                                   + " MB")
+               + make2lineListItem("Removable",
+                                   (storages[i].isRemoveable == true ? "Yes" : "No"));
+   }
+
+   $.mobile.changePage("#info");
 }
      3. Displaying the Display Property Values @@ -199,23 +199,23 @@ function onStorageSuccess(storages) 
         function onDisplaySuccess(display)
 {
-   gInfoTitle = "DISPLAY";
-   gInfo = makeDividerListItem("Resolution")
-           + make2lineListItem("Width", display.resolutionWidth)
-           + make2lineListItem("Height", display.resolutionHeight)
-           + makeDividerListItem("Dots per inch")
-           + make2lineListItem("Horizontal", display.dotsPerInchWidth)
-           + make2lineListItem("Vertical", display.dotsPerInchHeight)
-           + makeDividerListItem("Physical size")
-           + make2lineListItem("Width", display.physicalWidth)
-           + make2lineListItem("Height", display.physicalHeight)
-           + makeDividerListItem("Brightness")
-           + make1lineListItem(display.brightness);
-
-   $.mobile.changePage("#info");
+   gInfoTitle = "DISPLAY";
+   gInfo = makeDividerListItem("Resolution")
+           + make2lineListItem("Width", display.resolutionWidth)
+           + make2lineListItem("Height", display.resolutionHeight)
+           + makeDividerListItem("Dots per inch")
+           + make2lineListItem("Horizontal", display.dotsPerInchWidth)
+           + make2lineListItem("Vertical", display.dotsPerInchHeight)
+           + makeDividerListItem("Physical size")
+           + make2lineListItem("Width", display.physicalWidth)
+           + make2lineListItem("Height", display.physicalHeight)
+           + makeDividerListItem("Brightness")
+           + make1lineListItem(display.brightness);
+
+   $.mobile.changePage("#info");
 }
        4. -
      +
    diff --git a/org.tizen.guides/html/web/device/time_w.htm b/org.tizen.guides/html/web/device/time_w.htm index 385ff7c..4126aff 100644 --- a/org.tizen.guides/html/web/device/time_w.htm +++ b/org.tizen.guides/html/web/device/time_w.htm @@ -5,20 +5,20 @@ - + - Time and Date Management - + Time and Date Management + - + +
    - +

    Time and Date Management

    Tizen enables you to use locale-specific calendar features by retrieving date and time information. You can also change the date, time, and time zone, and make some date- and time-related calculations. The Time API overcomes several limitations of the JavaScript Date object.

    - -

    The Time API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    + +

    The Time API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.

    Locale refers to the set of information that is specific to a language and a country. It affects the numeric formats (decimal and list separators), date formats, and the character sorting order. It determines how a locale-specific functionality behaves; for example, how numbers are displayed or strings converted to dates.

    - -

    The main features of the Time API include:

    -

    Retrieving Date and Time

    -

    With the TimeUtil interface (in mobile, wearable, and TV applications), you can retrieve the current date, time, and time zone, and the number of available time zones, and determine whether a year is a leap year.

    -

    You can also perform other date-and time-related tasks, such as getting the date of the next and previous daylight saving time transition, converting current time to UTC standard time, and getting the time zone abbreviation.

    +

    With the TimeUtil interface (in mobile, wearable, and TV applications), you can retrieve the current date, time, and time zone, and the number of available time zones, and determine whether a year is a leap year.

    +

    You can also perform other date-and time-related tasks, such as getting the date of the next and previous daylight saving time transition, converting current time to UTC standard time, and getting the time zone abbreviation.

    Note - UTC is the primary time standard used by the world to track time. Time zones are created for the world as a positive or negative offset of UTC. For example, the time zone for Iceland is UTC+00:00, and the time zone for India is UTC+05:30. + UTC is the primary time standard used by the world to track time. Time zones are created for the world as a positive or negative offset of UTC. For example, the time zone for Iceland is UTC+00:00, and the time zone for India is UTC+05:30.

    DST (or summer time) is the practice of clocks being advanced temporarily by a fixed time during the summer to take advantage of more daylight. Typically, this temporary adjustment is one hour. For example, one hour shift ahead in time will cause the last moment of 20:59 to jump to 22:00 instead of 21:00. In this case, the day will have 23 hours. In another scenario, one hour shift back in time will cause the day to have 25 hours.

    - -

    To handle date and time in your application:

    -
      + +

      To handle date and time in your application:

      +

      1. To get the current date and time, use the getCurrentDateTime() method, which returns a TZDate object:

         var current_dt = tizen.time.getCurrentDateTime();
-console.log("Current time / date is " + current_dt.toLocaleString());
+console.log("Current time / date is " + current_dt.toLocaleString());
        -
        2. -
      2. To handle time zone information: -
          + +
        1. To handle time zone information: +

          1. To retrieve the current time zone, use the getLocalTimezone() method:

            -console.log("The current time zone is " + tizen.time.getLocalTimezone());
+console.log("The current time zone is " + tizen.time.getLocalTimezone());
            -

            The general format of the time zones is "general descriptor/specific descriptor 1/specific descriptor 2/specific descriptor n". For example, "America/Argentina/Buenos_Aires".

            2. +

            The general format of the time zones is "general descriptor/specific descriptor 1/specific descriptor 2/specific descriptor n". For example, "America/Argentina/Buenos_Aires".

          2. To get the number of available time zones, use the getAvailableTimezones() method:

             var tzids = tizen.time.getAvailableTimezones();
-console.log("The device supports " + tzids.length + " time zones.");
+console.log("The device supports " + tzids.length + " time zones.");
            3. -
          -
          2. +
        +

      3. If you are creating a calendar-based application or accepting a date on an application form, you must validate user input for leap year date value. For example, 29/02/2011 is an invalid user input.

        To determine if the year is a leap year, use the isLeapYear() method:

         var current_dt = tizen.time.getCurrentDateTime();
 var is_leap = tizen.time.isLeapYear(current_dt.getFullYear());
 if (is_leap)
-   console.log("This year is a leap year.");
+   console.log("This year is a leap year.");
        -

        The getFullYear() method returns the year (4 digits) of the TZDate object.

        -
        4. +

        The getFullYear() method returns the year (4 digits) of the TZDate object.

        + + +
      -
    -

    Retrieving the Local Date and Time Format

    -

    The date and time can be expressed, for example, in a numerical format YYYY-MM-DD hh:mm:ss (for example, "1996-10-23 16:08:27") or in hybrid format (for example, "Wednesday, October 23, 1996, 04:08:27 PM").

    -

    To handle date and time formats in your application:

    -
      +

      The date and time can be expressed, for example, in a numerical format YYYY-MM-DD hh:mm:ss (for example, "1996-10-23 16:08:27") or in hybrid format (for example, "Wednesday, October 23, 1996, 04:08:27 PM").

      +

      To handle date and time formats in your application:

      +

      1. To check the date format, use the getDateFormat() method:

         var dateFormat = tizen.time.getDateFormat();
-console.log("Date format is " + dateFormat);
+console.log("Date format is " + dateFormat);

      2. To check the time format, use the getTimeFormat() method:

         var timeFormat = tizen.time.getTimeFormat();
-console.log("Time format is " + timeFormat);
+console.log("Time format is " + timeFormat);
        3. -
      - +
    +

    Calculating Date and Time Information

    Calculate and compare time and date information using the applicable methods of the TimeDuration interface (in mobile, wearable, and TV applications):

    -
      -

    1. To calculate the duration difference between 2 date or time events, use the difference() method of the TimeDuration object:

      +
        +

      1. To calculate the duration difference between 2 date or time events, use the difference() method of the TimeDuration object:

         var event1, event2; /* Assume that those are correct tizen.CalendarEvent objects */
 /* Calculate event1.duration - event2.duration */
 var diff = event1.duration.difference(event2.duration);
 if (diff.length < 0)
-   console.log("Event1 is longer than Event2.");
+   console.log("Event1 is longer than Event2.");
 else if (diff.length == 0)
-   console.log("Event1 is as long as Event2.");
+   console.log("Event1 is as long as Event2.");
 else
-   console.log("Event1 is shorter than Event2.");
-
        + console.log("Event1 is shorter than Event2."); +
        Note - The unit of the returned TimeDuration object is equivalent to the largest possible unit amongst the source parameter units while making sure that precision is not lost in the result. This implies that if, for example, a comparison is done between "1 hour" and "20 minutes", the result is displayed as 40 minutes, not 0.67 hour. Although the hour is a bigger unit than the minute, the result is more precise if presented in minutes. + The unit of the returned TimeDuration object is equivalent to the largest possible unit amongst the source parameter units while making sure that precision is not lost in the result. This implies that if, for example, a comparison is done between "1 hour" and "20 minutes", the result is displayed as 40 minutes, not 0.67 hour. Although the hour is a bigger unit than the minute, the result is more precise if presented in minutes.
        -
        2. +

      2. To compare 2 TimeDuration objects for equality, use the equalsTo() method: 

        -var d1 = new tizen.TimeDuration(60, "MINS");
-var d2 = new tizen.TimeDuration(1, "HOURS");
+var d1 = new tizen.TimeDuration(60, "MINS");
+var d2 = new tizen.TimeDuration(1, "HOURS");
 var ret = d1.equalsTo(d2); /* Returns true */

      3. To check whether 1 TimeDuration object is shorter than another, use the lessThan() method: 

         /* Check whether d1 is shorter than d2 */
-var d1 = new tizen.TimeDuration(1, "HOURS");
-var d2 = new tizen.TimeDuration(120, "MINS");
+var d1 = new tizen.TimeDuration(1, "HOURS");
+var d2 = new tizen.TimeDuration(120, "MINS");
 var ret = d1.lessThan(d2); /* Returns true */

      4. To check whether 1 TimeDuration object is longer than another, use the greaterThan() method: 

         /* Check whether d1 is longer than d2 */
-var d1 = new tizen.TimeDuration(2, "HOURS");
-var d2 = new tizen.TimeDuration(60, "MINS");
+var d1 = new tizen.TimeDuration(2, "HOURS");
+var d2 = new tizen.TimeDuration(60, "MINS");
 var ret = d1.greaterThan(d2); /* Returns true */

      5. To add a predefined time to the current date, use the addDuration() method:

         /* Convert the current date to the date of the next day, at the same time */
 var now = tizen.time.getCurrentDateTime();
-var tomorrow = now.addDuration(new tizen.TimeDuration(1,"DAYS");
+var tomorrow = now.addDuration(new tizen.TimeDuration(1,"DAYS");
        -

        If the number of added time is negative, date or time is set to an earlier moment of time.

        6. -
      - +

      If the number of added time is negative, date or time is set to an earlier moment of time.

      2. +
    +

    Retrieving Time Change Notifications

    Getting notifications when the user changes the time or time zone allows you to react to those changes in your application.

      @@ -191,27 +191,27 @@ var tomorrow = now.addDuration(new tizen.TimeDuration(1,"DAYS"); 
       function timeChangedCallback()
 {
-   try
-   {
-      var current_dt = tizen.time.getCurrentDateTime();
-      console.log("Clock has been set. Current date/time is "
-                  + current_dt.toLocaleString());
-   }
+   try
+   {
+      var current_dt = tizen.time.getCurrentDateTime();
+      console.log("Clock has been set. Current date/time is "
+                  + current_dt.toLocaleString());
+   }
 }

    1. The time zone change event handler is called when the user switches the time zone:

       function timezoneChangedCallback()
 {
-   try
-   {
-      /*
-         New time zone can be retrieved
-         through tizen.time.getLocalTimezone()
-      */
-      var zone = tizen.time.getLocalTimezone();
-      console.log("Time zone has been set to " + zone);
-   }
+   try
+   {
+      /*
+         New time zone can be retrieved
+         through tizen.time.getLocalTimezone()
+      */
+      var zone = tizen.time.getLocalTimezone();
+      console.log("Time zone has been set to " + zone);
+   }
 }
      2. @@ -243,7 +243,7 @@ tizen.time.unsetTimezoneChangeListener();
    - +
    diff --git a/org.tizen.guides/html/web/device/web_view_w.htm b/org.tizen.guides/html/web/device/web_view_w.htm index e4afbff..1e8a2f4 100644 --- a/org.tizen.guides/html/web/device/web_view_w.htm +++ b/org.tizen.guides/html/web/device/web_view_w.htm @@ -33,7 +33,7 @@

    Related Info

    @@ -43,7 +43,7 @@

    Tizen enables you to set Web view properties.

    - +

    This feature is supported in mobile and TV applications only.

    The main features of the Web Setting API include:

    @@ -53,27 +53,27 @@

    Setting a User Agent for a Running Application

    - -

    Use the setUserAgentString() method to set a Web view user agent string:

    + +

    Use the setUserAgentString() method to set a Web view user agent string:

     function successCallback()
 {
-   console.log("The requested user agent string has just been set successfully."
-               + navigator.userAgent);
+   console.log("The requested user agent string has just been set successfully."
+               + navigator.userAgent);
 }
 
 /* Set a user agent string */
-var userAgent = "CUSTOM_USER_AGENT_STRING";
+var userAgent = "CUSTOM_USER_AGENT_STRING";
 tizen.websetting.setUserAgentString(userAgent, successCallback);

    Deleting Web View Cookies

    - -

    Use the removeAllCookies() method to delete all the Web view cookies:

    + +

    Use the removeAllCookies() method to delete all the Web view cookies:

     function CookiesRemovedSuccessCallback()
 {
-   console.log("The cookies saved for your application have just been removed.");
+   console.log("The cookies saved for your application have just been removed.");
 }
 
 tizen.websetting.removeAllCookies(CookiesRemovedSuccessCallback);
diff --git a/org.tizen.guides/html/web/error/error_w.htm b/org.tizen.guides/html/web/error/error_w.htm
index e564db8..b720355 100644
--- a/org.tizen.guides/html/web/error/error_w.htm
+++ b/org.tizen.guides/html/web/error/error_w.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Error Handling 
-  
+  Error Handling
+ 
  
- 
+
  	
+
 
 
    
-  
    Error Handling
     
+  
    Error Handling
    
   
    You can handle generic error situations in your application.
    
-  
-
    The Tizen API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.
     
+
+
    The Tizen API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.
    
 
    The main error handling features of the Tizen API include:
    
 
-  
+
  
    Using the Generic Event Handlers
    
 
-
    Learning how to use generic, predefined event handlers allows you handle application operations and errors efficiently:
     
-  
       
+
      Learning how to use generic, predefined event handlers allows you handle application operations and errors efficiently:
      
+  
        
    
      1.  
        The generic onSuccess() event handler of the SuccessCallBack interface (in mobile, wearable, and TV applications) can be used with methods that do not require a return value when successful.
         
        In this example, the event handler is used to stop a running application with the kill() method of the Application interface (in mobile, wearable, and TV applications).
        
 
         function onSuccess()
 {
-   console.log("Application terminated successfully");
+   console.log("Application terminated successfully");
 }
 
 tizen.application.kill(ctxIDToKill, onSuccess);
@@ -75,12 +75,12 @@ tizen.application.kill(ctxIDToKill, onSuccess);
 
         function errorCallback(error)
 {
-   console.log("The following error occurred: " + error.name);
+   console.log("The following error occurred: " + error.name);
 }
 
-tizen.calendar.getCalendars("EVENT", calendarListCallback, errorCallback); 
+tizen.calendar.getCalendars("EVENT", calendarListCallback, errorCallback);
 
        2. 
-  
       
+  
    
 
 
 
diff --git a/org.tizen.guides/html/web/guides_w.htm b/org.tizen.guides/html/web/guides_w.htm
index b25c19a..b10271e 100644
--- a/org.tizen.guides/html/web/guides_w.htm
+++ b/org.tizen.guides/html/web/guides_w.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Tizen Web Guides  
+	Tizen Web Guides
 
 
 
@@ -29,10 +29,10 @@
 		
 		
    Related Info
    
 		
 	
    
-
    	
+
 
 
    
 
     Tizen
    
@@ -116,10 +116,10 @@
 
 
    The W3C, HTML5, and supplementary features cover various functionalities you can use in your application. You can use graphics, media, storage, and location features, as well as manage communication and security. These features also enable you to create an application UI using HTML and CSS.
    
 
-    
+
 
    
 	Note
-	In Tizen Web Device APIs, there are 2 types of APIs: mandatory and optional. 
+	In Tizen Web Device APIs, there are 2 types of APIs: mandatory and optional.
 
    The mandatory APIs are always available on all Tizen devices. The optional APIs provide functionality that depends on the available device hardware or software capabilities, and they may not be available in all Tizen devices. For example, the Bluetooth and NFC API hardware features are optional, and not supported on all devices.
    
 
    To determine the availability of optional APIs, use the tizen.systeminfo.getCapability() method of the System Information API (in mobile and wearable applications).
    
 
    Note that all mandatory APIs are supported on the Tizen Emulators, while the optional APIs may or may not be supported. For the details of each API, see Tizen Web Device API Reference.
    
diff --git a/org.tizen.guides/html/web/localization/localization_w.htm b/org.tizen.guides/html/web/localization/localization_w.htm
index 0388352..947e265 100644
--- a/org.tizen.guides/html/web/localization/localization_w.htm
+++ b/org.tizen.guides/html/web/localization/localization_w.htm
@@ -43,10 +43,10 @@
 
     ┬index.html
 └locales
-  â””en
-    â””language.js
-  â””ko
-    â””language.js
+  └en
+    └language.js
+  └ko
+    └language.js
 
    
 
  • Create a common JS object for language strings.
 
    Define a global JS object in the resource file. In the following example, the JS object is LANG_JSON_DATA. This object defines the key-value pairs for localized strings.
    
@@ -55,7 +55,7 @@
 
     LANG_JSON_DATA=
 {
-   "hello": "hello"
+   "hello": "hello"
 }
 
    • 
 
@@ -63,21 +63,21 @@ LANG_JSON_DATA=
 
     LANG_JSON_DATA=
 {
-   "hello": "안녕"
+   "hello": "안녕"
 }
 
    
 		
-        
    "hello" is the key for the localized string, to be replaced by the value from the appropriate language.
    
+        
    "hello" is the key for the localized string, to be replaced by the value from the appropriate language.
    
 
 
  • Load language resources.
  
    To load language resources, add the <script> element containing the language resource file in your index.html file:
    
 
    -<script src="language.js"></script>
+<script src="language.js"></script>
 
    
         
    
             The Web Runtime loads the language.js file for the current locale and  you can use the defined string element to display localized content. For example:
    
 
    -log("hello=" + LANG_JSON_DATA["hello"]);
+log("hello=" + LANG_JSON_DATA["hello"]);
 
    
 
 
    
@@ -86,7 +86,7 @@ log("hello=" + LANG_JSON_DATA["hello"]);
 
    If the Web Runtime still fails to find a file in a local folder, it retrieves the folders that match the parent subtag, and prioritizes the files in the subfolders over the files in the local folders closer to the root of the widget package. If after all this, the Web Runtime still cannot find the file, an unexpected problem can occur.
    
 
    To avoid problems, leave a default file in the root folder.
    
 
    
-		
+
 		
    The following table lists the acceptable locale folder names.
    
         
    Table: Locale folder names
    
             
@@ -177,7 +177,7 @@ log("hello=" + LANG_JSON_DATA["hello"]);
             
    Uzbekistanuz-uz
    
             
    Vietnamesevi-vn
    
                      
    • 
- 
+
 
 
 
diff --git a/org.tizen.guides/html/web/media/audio_w.htm b/org.tizen.guides/html/web/media/audio_w.htm
index 6e18d01..9005d56 100644
--- a/org.tizen.guides/html/web/media/audio_w.htm
+++ b/org.tizen.guides/html/web/media/audio_w.htm
@@ -47,7 +47,7 @@
   
    Audio Management
    
 
    
    Tizen enables you to control the volume level of several sound types and get information about the current sound mode and the state of the current sound devices. The available sound types include, for example, system, notifications, alarms, and media.
    
-   
+
  
    This feature is supported in mobile and wearable applications only.
    
 
    
    The main features of the Sound API include:
    
@@ -62,7 +62,7 @@
 
    Prerequisites
    
 
    To use the Sound API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the config.xml file:
    
 
    -<tizen:privilege name="http://tizen.org/privilege/volume.set"/>
+<tizen:privilege name="http://tizen.org/privilege/volume.set"/>
 
    
 
 
@@ -73,7 +73,7 @@
 
  • Get the current volume level using the getVolume() method:
 
 
    -var vol = tizen.sound.getVolume("RINGTONE");
+var vol = tizen.sound.getVolume("RINGTONE");
 
    
 
 
    • 
@@ -81,7 +81,7 @@ var vol = tizen.sound.getVolume("RINGTONE");
 
    The following example increases the ringtone volume by 10% of the maximum volume level:
    
 
 
    -tizen.sound.setVolume("RINGTONE", vol + 0.1);
+tizen.sound.setVolume("RINGTONE", vol + 0.1);
 
    
 
 
@@ -89,7 +89,7 @@ tizen.sound.setVolume("RINGTONE", vol + 0.1);
 
 
     var mode = tizen.sound.getSoundMode();
-console.log("Sound Mode is " + mode);
+console.log("Sound Mode is " + mode);
 
    
 
 
@@ -105,9 +105,9 @@ console.log("Sound Mode is " + mode);
 
     function onsuccessCB(type, volume)
 {
-   console.log("SoundType is " + type);
-   console.log("Volume is " + volume);
-   tizen.sound.unsetVolumeChangeListener();
+   console.log("SoundType is " + type);
+   console.log("Volume is " + volume);
+   tizen.sound.unsetVolumeChangeListener();
 }
 
 tizen.sound.setVolumeChangeListener(onsuccessCB);
@@ -119,8 +119,8 @@ tizen.sound.setVolumeChangeListener(onsuccessCB);
 
     function onsuccessCB(mode)
 {
-   console.log("Mode is " + mode);
-   tizen.sound.unsetSoundModeChangeListener();
+   console.log("Mode is " + mode);
+   tizen.sound.unsetSoundModeChangeListener();
 }
 
 tizen.sound.setSoundModeChangeListener(onsuccessCB);
@@ -138,7 +138,7 @@ var infoArr = tizen.sound.getConnectedDeviceList();
 
 for (var i = 0; i < infoArr.length; i++)
 {
-   console.log(infoArr[i].device);
+   console.log(infoArr[i].device);
 }
 
    
 
@@ -149,7 +149,7 @@ var infoArr = tizen.sound.getActivatedDeviceList();
 
 for (var i = 0; i < infoArr.length; i++)
 {
-   console.log(infoArr[i].device);
+   console.log(infoArr[i].device);
 }
 
    
 
@@ -164,23 +164,23 @@ for (var i = 0; i < infoArr.length; i++)
 
     function onchangedCB(info)
 {
-   if (info.isConnected)
-   {
-      console.log(info.device + " is connected");
-   }
-   else
-   {
-      console.log(info.device + " is not connected");
-   }
-
-   if (info.isActivated)
-   {
-      console.log(info.device + " is activated");
-   }
-   else
-   {
-      console.log(info.device + " is not activated");
-   }
+   if (info.isConnected)
+   {
+      console.log(info.device + " is connected");
+   }
+   else
+   {
+      console.log(info.device + " is not connected");
+   }
+
+   if (info.isActivated)
+   {
+      console.log(info.device + " is activated");
+   }
+   else
+   {
+      console.log(info.device + " is not activated");
+   }
 }
 
 var listenerId = tizen.sound.addDeviceStateChangeListener(onChangedCB);
diff --git a/org.tizen.guides/html/web/media/camera_w.htm b/org.tizen.guides/html/web/media/camera_w.htm
index 78a9e27..aa1ebc8 100644
--- a/org.tizen.guides/html/web/media/camera_w.htm
+++ b/org.tizen.guides/html/web/media/camera_w.htm
@@ -46,7 +46,7 @@
 
 
    You can use the camera features in the Tizen wearable Web applications.
    
 
-  
    This feature is supported in wearable applications only.
     
+  
    This feature is supported in wearable applications only.
    
 
 
    The main features of the Camera API (Tizen Extension) API include:
    
 
@@ -65,16 +65,16 @@
 
 
    Accessing the Camera Device
    
 
-  
    To take advantage of the camera features, you must learn to access the camera device:
     
+  
    To take advantage of the camera features, you must learn to access the camera device:
    
   
      
 
    1. Access the camera with the stream that you can receive from the getUserMedia() method. The second parameter for that method is an event handler that is triggered when the stream is successfully retrieved.
 
       var stream;
 navigator.webkitGetUserMedia({video: true, audio: false}, gotStreamCallback,
-                             noStreamCallback);
+                             noStreamCallback);
 function gotStream(rStream)
 {
-   stream = rStream;
+   stream = rStream;
 }
 
      
 
      2. 
@@ -92,7 +92,7 @@ function gotCameraCallback(cameraControl)
 
   
      Managing the Camera
      
 
-  
      To take advantage of the camera features, you must learn to manage the camera:
       
+  
      To take advantage of the camera features, you must learn to manage the camera:
      
   
        
    
      • You can record videos with the cameraControl object.
    
        Use the start() to start the recording, and the stop() method to stop the recording:
        
@@ -110,18 +110,18 @@ cameraControl.image.takePicture(takePictureSuccess, takePictureError);
 
         var recordingSetting =
 {
-   fileName: "sample.3gp";
+   fileName: "sample.3gp";
 }
 cameraControl.recorder.applySettings(recordingSetting,
-                                     recorderSettingSuccessCallback,
-                                     recorderSettingErrorCallback);
+                                     recorderSettingSuccessCallback,
+                                     recorderSettingErrorCallback);
 
        
 
 
        
 	Note
 	If a setting cannot be set, the error callback is called to resolve the issue.
 
        
-	
        •   
+	
 
      
 
   
      Deallocating the Camera Preview Stream
      
@@ -134,14 +134,14 @@ cameraControl.recorder.applySettings(recordingSetting,
 
       function initCameraPreview()
 {
-   navigator.webkitGetUserMedia({video: true, audio: false},
-                                onPreviewStream,
-                                onPreviewStreamError);
+   navigator.webkitGetUserMedia({video: true, audio: false},
+                                onPreviewStream,
+                                onPreviewStreamError);
 }
 
 function onPreviewStream(stream)
 {
-   cameraStream = stream;
+   cameraStream = stream;
 }
 
      
 
@@ -149,14 +149,14 @@ function onPreviewStream(stream)
 
       function onVisibilityChange()
 {
-   if (document.visibilityState !== 'visible')
-   {
-      cameraStream.stop();
-   }
-   else
-   {
-      initCameraPreview();
-   }
+   if (document.visibilityState !== 'visible')
+   {
+      cameraStream.stop();
+   }
+   else
+   {
+      initCameraPreview();
+   }
 }
 
      
 
diff --git a/org.tizen.guides/html/web/media/jpeg_exif_w.htm b/org.tizen.guides/html/web/media/jpeg_exif_w.htm
index 7fd100a..9e375de 100644
--- a/org.tizen.guides/html/web/media/jpeg_exif_w.htm
+++ b/org.tizen.guides/html/web/media/jpeg_exif_w.htm
@@ -49,8 +49,8 @@
 
 
      Tizen enables you to access and modify EXIF information in a JPEG file (with the common .jpg extension).
      
 
-
      The Exif API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.
       
-  
+
      The Exif API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices. All mandatory APIs are supported on the Tizen Emulators.
      
+
 
      The main features of the Exif API include:
      
 
        
  
      • Loading EXIF information
        You can retrieve EXIF information from a JPEG file. You can also retrieve the thumbnail image of the file.
           
        • 
@@ -66,20 +66,20 @@
 
      • To retrieve the EXIF data from specific file, you need the URI of an image file in an absolute URI format (for example file:///opt/usr/media/Images/tizen.jpg). The tizen.filesystem.resolve() and toURI() methods can be used to convert a virtual path to a URI.
        
 
 
        -var fileURI = "";
+var fileURI = "";
 function resolveSuccess(file)
 {
-   fileURI = file.toURI();
-   console.log("Successfully resolved file: " + fileURI);
+   fileURI = file.toURI();
+   console.log("Successfully resolved file: " + fileURI);
 }
 
 function resolveFail(error)
 {
-   console.log("resolve() error occurred: " + error.name
-               + " with message: " + error.message);
+   console.log("resolve() error occurred: " + error.name
+               + " with message: " + error.message);
 }
 
-tizen.filesystem.resolve("images/tizen.jpg", resolveSuccess, resolveFail);
+tizen.filesystem.resolve("images/tizen.jpg", resolveSuccess, resolveFail);
 
        • 
 
 
      • With a valid File object, use the getExifInfo() method of the ExifManager interface (in mobile, wearable, and TV applications) and pass the URI to the method.
        
@@ -87,12 +87,12 @@ tizen.filesystem.resolve("images/tizen.jpg", resolveSuccess, resolveFa
 
         function onSuccess(exifInfo)
 {
-   console.log("Successfully got EXIF information object");
+   console.log("Successfully got EXIF information object");
 }
 
 function onError(error)
 {
-   console.log("Error occurred: " + error.name + " with message:" + error.message);
+   console.log("Error occurred: " + error.name + " with message:" + error.message);
 }
 
 tizen.exif.getExifInfo(fileURI, onSuccess, onError);
@@ -104,9 +104,9 @@ tizen.exif.getExifInfo(fileURI, onSuccess, onError);
 
        1. Resolve the input JPEG file:
 
 
          -var fileURI = "";
+var fileURI = "";
 
-tizen.filesystem.resolve("images/tizen.jpg", resolveSuccess, resolveFail);
+tizen.filesystem.resolve("images/tizen.jpg", resolveSuccess, resolveFail);
 
          2. 
 
 
        2. Use the getThumbnail() method to retrieve the thumbnail:
@@ -114,26 +114,26 @@ tizen.filesystem.resolve("images/tizen.jpg", resolveSuccess, resolveFa
 
           function onSuccess(thumbData)
 {
-   console.log("Got thumbnail data from EXIF stored in JPEG file");
-   if (thumbData)
-   {
-      var img = new Image();
-      img.src = thumbData;
-      document.body.appendChild(img);
-   }
+   console.log("Got thumbnail data from EXIF stored in JPEG file");
+   if (thumbData)
+   {
+      var img = new Image();
+      img.src = thumbData;
+      document.body.appendChild(img);
+   }
 }
 
 function onError(error)
 {
-   console.log("Error occurred: " + error.name
-               + " with message: " + error.message);
+   console.log("Error occurred: " + error.name
+               + " with message: " + error.message);
 }
 
 function resolveSuccess(file)
 {
-   fileURI = file.toURI();
-   console.log("Successfully resolved file: " + file.toURI());
-   tizen.exif.getThumbnail(fileURI, onSuccess, onError);
+   fileURI = file.toURI();
+   console.log("Successfully resolved file: " + file.toURI());
+   tizen.exif.getThumbnail(fileURI, onSuccess, onError);
 }
 
        • 
 
@@ -148,7 +148,7 @@ function resolveSuccess(file)
 
 
         var myNewExif = new tizen.ExifInformation();
-myNewExif.userComment = "Photo taken on Charles Bridge in Prague";
+myNewExif.userComment = "Photo taken on Charles Bridge in Prague";
 myNewExif.gpsLocation = new tizen.SimpleCoordinates(50.086447, 14.411856);
 
        
 
@@ -157,19 +157,19 @@ myNewExif.gpsLocation = new tizen.SimpleCoordinates(50.086447, 14.411856);
 
      • Resolve the virtual path to the output JPEG file and get the URI:
        
 
 
        -var fileNoExifURI = "";
+var fileNoExifURI = "";
 function resolveSuccess(file)
 {
-   fileNoExifURI = file.toURI();
-   console.log("Successfully resolved file: " + fileNoExifURI);
+   fileNoExifURI = file.toURI();
+   console.log("Successfully resolved file: " + fileNoExifURI);
 }
 
 function resolveFail(error)
 {
-   console.log("Error occurred: " + error.name + " with message: " + error.message);
+   console.log("Error occurred: " + error.name + " with message: " + error.message);
 }
 
-tizen.filesystem.resolve("images/image_without_exif.jpg", resolveSuccess, resolveFail);
+tizen.filesystem.resolve("images/image_without_exif.jpg", resolveSuccess, resolveFail);
 
        
 
 
        • 
@@ -179,12 +179,12 @@ tizen.filesystem.resolve("images/image_without_exif.jpg", resolveSucce
 
         function onSaveSuccess()
 {
-   console.log("Successfully saved EXIF information to JPEG file");
+   console.log("Successfully saved EXIF information to JPEG file");
 }
 
 function onSaveError(error)
 {
-   console.log("Error occurred:" + error.name + " with message:" + error.message);
+   console.log("Error occurred:" + error.name + " with message:" + error.message);
 }
 
 myNewExif.uri = fileNoExifURI;
@@ -204,18 +204,18 @@ tizen.exif.saveExifInfo(myNewExif, onSaveSuccess, onSaveError);
 
         function getSuccess(exifInfo)
 {
-   exifInfo.orientation = "FLIP_HORIZONTAL";
-   exifInfo.userComment = "Great times!";
-   
-   /* Remove basic GPS information */
-   exifInfo.gpsLocation = null;
-   exifInfo.gpsAltitude = null;
+   exifInfo.orientation = "FLIP_HORIZONTAL";
+   exifInfo.userComment = "Great times!";
+
+   /* Remove basic GPS information */
+   exifInfo.gpsLocation = null;
+   exifInfo.gpsAltitude = null;
 }
 
-tizen.filesystem.resolve("images/photo.jpg", function(file)
-   {
-      tizen.exif.getExifInfo(file.toURI(), getSuccess);
-   });
+tizen.filesystem.resolve("images/photo.jpg", function(file)
+   {
+      tizen.exif.getExifInfo(file.toURI(), getSuccess);
+   });
 
        
 
 
      • After updating the property values, use the saveExifInfo() method of the ExifManager interface (in mobile, wearable, and TV applications) to save the changes to the file:
@@ -223,7 +223,7 @@ tizen.filesystem.resolve("images/photo.jpg", function(file)
 
         function saveSuccess(exifInfo)
 {
-   console.log("new EXIF saved");
+   console.log("new EXIF saved");
 }
 
 tizen.exif.saveExifInfo(exifInfo, saveSuccess);
@@ -242,21 +242,21 @@ var sourceExifInfo = null;
 
 function resolveOutSuccess(outFile)
 {
-   console.log("Successfully resolved file: " + outFile.toURI());
-   sourceExifInfo.uri = outFile.toURI();
+   console.log("Successfully resolved file: " + outFile.toURI());
+   sourceExifInfo.uri = outFile.toURI();
 }
 
 function resolveOutFail(error)
 {
-   console.log("Error occurred: " + error.name + " with message: " + error.message);
+   console.log("Error occurred: " + error.name + " with message: " + error.message);
 }
 
 function onSuccess(exifInfo)
 {
-   console.log("Successfully got EXIF information object");
-   sourceExifInfo = exifInfo;
-   tizen.filesystem.resolve("images/image_without_exif.jpg", resolveOutSuccess,
-                            resolveOutFail);
+   console.log("Successfully got EXIF information object");
+   sourceExifInfo = exifInfo;
+   tizen.filesystem.resolve("images/image_without_exif.jpg", resolveOutSuccess,
+                            resolveOutFail);
 }
 
 tizen.exif.getExifInfo(fileURI, onSuccess);
@@ -267,19 +267,19 @@ tizen.exif.getExifInfo(fileURI, onSuccess);
 
         function onSaveSuccess()
 {
-   console.log("Successfully saved EXIF information to JPEG file");
+   console.log("Successfully saved EXIF information to JPEG file");
 }
 
 function onSaveError(error)
 {
-   console.log("Error occurred:" + error.name + " with message:" + error.message);
+   console.log("Error occurred:" + error.name + " with message:" + error.message);
 }
 
 function resolveOutSuccess(outFile)
 {
-   console.log("Successfully resolved file: " + outFile.toURI());
-   sourceExifInfo.uri = outFile.toURI();
-   tizen.exif.saveExifInfo(sourceExifInfo, onSaveSuccess, onSaveError);
+   console.log("Successfully resolved file: " + outFile.toURI());
+   sourceExifInfo.uri = outFile.toURI();
+   tizen.exif.saveExifInfo(sourceExifInfo, onSaveSuccess, onSaveError);
 }
 
        • 
 
diff --git a/org.tizen.guides/html/web/media/media_controller_w.htm b/org.tizen.guides/html/web/media/media_controller_w.htm
index e7b49fd..f3f881b 100644
--- a/org.tizen.guides/html/web/media/media_controller_w.htm
+++ b/org.tizen.guides/html/web/media/media_controller_w.htm
@@ -47,10 +47,10 @@
    
        Tizen provides a functionality for you to communicate between the media controller server and client.
        
 
  
        This feature is supported in mobile and wearable applications only.
        
-   
+
 
        To manage the media using the Media Controller API, you have to develop 2 applications:
        
 
        • Client that sends requests to the server in order to change, for example, the playback state and position modes.
          • 
-
        • Server that directly manages the media on the device.
          
+
      • Server that directly manages the media on the device.
      
 
 
      The main features of the Media Controller API include:
      
    
        
@@ -74,8 +74,8 @@
 
 
        To use the Media Controller API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the config.xml file:
        
 
        -<tizen:privilege name="http://tizen.org/privilege/mediacontroller.client"/>
-<tizen:privilege name="http://tizen.org/privilege/mediacontroller.server"/>
+<tizen:privilege name="http://tizen.org/privilege/mediacontroller.client"/>
+<tizen:privilege name="http://tizen.org/privilege/mediacontroller.server"/>
 
        
 
 
@@ -103,16 +103,16 @@ var mcServerInfo;
 
 function findSuccessCallback(servers)
 {
-   console.log("Found " + servers.length + " servers");
-   if (servers.length > 0)
-   {
-      mcServerInfo = servers[0];
-   }
+   console.log("Found " + servers.length + " servers");
+   if (servers.length > 0)
+   {
+      mcServerInfo = servers[0];
+   }
 }
 
 function findErrorCallback(e)
 {
-   console.log("Error name: " + e.name + " Error message: " + e.message);
+   console.log("Error name: " + e.name + " Error message: " + e.message);
 }
 
    
 
@@ -137,28 +137,28 @@ mcClient.findServers(findSuccessCallback, findErrorCallback);
 
     var requestPlaybackInfoCb =
 {
-   onplaybackstaterequest: function(state)
-   {
-      console.log('Request to change the playback state to: ' + state);
-      mcServer.updatePlaybackState(state);
-   },
-   onplaybackpositionrequest: function(position)
-   {
-      console.log('Request to change the playback position to: ' + position);
-      mcServer.updatePlaybackPosition(position);
-   },
-   onshufflemoderequest: function(mode)
-   {
-      console.log('Request to change the playback shuffle mode to: '
-                  + (mode ? 'TRUE' : 'FALSE'));
-      mcServer.updateShuffleMode(mode);
-   },
-   onrepeatmoderequest: function(mode)
-   {
-      console.log('Request to change the playback repeat mode to: '
-                  + (mode ? 'TRUE' : 'FALSE'));
-      mcServer.updateRepeatMode(mode);
-   }
+   onplaybackstaterequest: function(state)
+   {
+      console.log('Request to change the playback state to: ' + state);
+      mcServer.updatePlaybackState(state);
+   },
+   onplaybackpositionrequest: function(position)
+   {
+      console.log('Request to change the playback position to: ' + position);
+      mcServer.updatePlaybackPosition(position);
+   },
+   onshufflemoderequest: function(mode)
+   {
+      console.log('Request to change the playback shuffle mode to: '
+                  + (mode ? 'TRUE' : 'FALSE'));
+      mcServer.updateShuffleMode(mode);
+   },
+   onrepeatmoderequest: function(mode)
+   {
+      console.log('Request to change the playback repeat mode to: '
+                  + (mode ? 'TRUE' : 'FALSE'));
+      mcServer.updateRepeatMode(mode);
+   }
 };
 
    
 
@@ -175,12 +175,12 @@ var watchId = mcServer.addChangeRequestPlaybackInfoListener(requestPlaybackInfoC
 
     function successCallback()
 {
-   console.log("Playback has been paused.");
+   console.log("Playback has been paused.");
 }
 
 function errorCallback(e)
 {
-   console.log("Error name: " + e.name + " Error message: " + e.message);
+   console.log("Error name: " + e.name + " Error message: " + e.message);
 }
 
    
 
@@ -190,7 +190,7 @@ function errorCallback(e)
 
    
 
 
    -mcServerInfo.sendPlaybackState("PAUSE", successCallback, errorCallback);
+mcServerInfo.sendPlaybackState("PAUSE", successCallback, errorCallback);
 
    
 
 
@@ -212,23 +212,23 @@ var watcherId;
 
     var playbackListener =
 {
-   onplaybackchanged: function(state, position)
-   {
-      console.log("Current playback state: " + state);
-      console.log("Current playback position: " + position);
-   },
-   onshufflemodechanged: function(mode)
-   {
-      console.log("Shuffle mode changed to: " + mode);
-   },
-   onrepeatmodechanged: function(mode)
-   {
-       console.log("Repeat mode changed to: " + mode);
-   },
-   onmetadatachanged: function(metadata)
-   {
-      console.log("Playback metadata changed: " + JSON.stringify(metadata));
-   }
+   onplaybackchanged: function(state, position)
+   {
+      console.log("Current playback state: " + state);
+      console.log("Current playback position: " + position);
+   },
+   onshufflemodechanged: function(mode)
+   {
+      console.log("Shuffle mode changed to: " + mode);
+   },
+   onrepeatmodechanged: function(mode)
+   {
+       console.log("Repeat mode changed to: " + mode);
+   },
+   onmetadatachanged: function(metadata)
+   {
+      console.log("Playback metadata changed: " + JSON.stringify(metadata));
+   }
 };
 
    
 
@@ -260,7 +260,7 @@ mcServerInfo.removePlaybackInfoChangeListener(watcherId);
 
     var exampleCustomCommandData =
 {
-   myFilter: "rock"
+   myFilter: "rock"
 };
 
    
 
@@ -270,12 +270,12 @@ var exampleCustomCommandData =
 
     function sendCommandSuccessCallback(response)
 {
-   console.log("Command executed with result: " + JSON.stringify(response));
+   console.log("Command executed with result: " + JSON.stringify(response));
 }
 
 function sendCommandErrorCallback(e)
 {
-   console.log("Error name: " + e.name + " Error message: " + e.message);
+   console.log("Error name: " + e.name + " Error message: " + e.message);
 }
 
    
 
@@ -283,8 +283,8 @@ function sendCommandErrorCallback(e)
 
  • Send the command to the server using the sendCommand() method:
 
 
    -mcServerInfo.sendCommand("myPlaylistFilter", sendCommandSuccessCallback,
-                         sendCommandErrorCallback);
+mcServerInfo.sendCommand("myPlaylistFilter", sendCommandSuccessCallback,
+                         sendCommandErrorCallback);
 
    
 
 
    • 
@@ -297,10 +297,10 @@ mcServerInfo.sendCommand("myPlaylistFilter", sendCommandSuccessCallbac
 
     var commandReceiveListener = function(client, command, data)
 {
-   console.log('command: ' + command + ' client: ' + client
-               + ' data: ' + JSON.stringify(data));
+   console.log('command: ' + command + ' client: ' + client
+               + ' data: ' + JSON.stringify(data));
 
-   return {reply: 'response from server'};
+   return {reply: 'response from server'};
 };
 
    
 
    The callback within the listener returns the object with the response to the client. The client can obtain this value as an argument of the success callback of the sendCommand() method that it used to send the command.
    
diff --git a/org.tizen.guides/html/web/media/media_cover_w.htm b/org.tizen.guides/html/web/media/media_cover_w.htm
index 1acf8a5..bc8318d 100644
--- a/org.tizen.guides/html/web/media/media_cover_w.htm
+++ b/org.tizen.guides/html/web/media/media_cover_w.htm
@@ -28,7 +28,7 @@
 			
  • Tizen 3.0 and Higher for TV
    • 
 		
 	
    
-
    	
+
    
 
 
    
 
    Media and Camera
    
diff --git a/org.tizen.guides/html/web/media/media_key_w.htm b/org.tizen.guides/html/web/media/media_key_w.htm
index 60a735e..d39ca8c 100644
--- a/org.tizen.guides/html/web/media/media_key_w.htm
+++ b/org.tizen.guides/html/web/media/media_key_w.htm
@@ -65,14 +65,14 @@
 
     var myMediaKeyChangeListener =
 {
-   onpressed: function(key)
-   {
-      console.log("Pressed key: " + key);
-   },
-   onreleased: function(key)
-   {
-      console.log("Released key: " + key);
-   }
+   onpressed: function(key)
+   {
+      console.log("Pressed key: " + key);
+   },
+   onreleased: function(key)
+   {
+      console.log("Released key: " + key);
+   }
 }
 
    
 
@@ -89,7 +89,7 @@ tizen.mediakey.setMediaKeyEventListener(myMediaKeyChangeListener);
 tizen.mediakey.unsetMediaKeyEventListener();
    - + diff --git a/org.tizen.guides/html/web/media/player_util_w.htm b/org.tizen.guides/html/web/media/player_util_w.htm index b2c7900..307f823 100644 --- a/org.tizen.guides/html/web/media/player_util_w.htm +++ b/org.tizen.guides/html/web/media/player_util_w.htm @@ -60,11 +60,11 @@ var latencyMode; try { -   latencyMode = tizen.playerutil.getLatencyMode(); + latencyMode = tizen.playerutil.getLatencyMode(); } catch (error) { -   console.log(error.name + ': ' + error.message); + console.log(error.name + ': ' + error.message); } @@ -76,11 +76,11 @@ catch (error) 
     try
 {
-   tizen.playerutil.setLatencyMode('HIGH');
+   tizen.playerutil.setLatencyMode('HIGH');
 }
 catch (error)
 {
-   console.log(error.name + ': ' + error.message);
+   console.log(error.name + ': ' + error.message);
 }
    diff --git a/org.tizen.guides/html/web/media/radio_w.htm b/org.tizen.guides/html/web/media/radio_w.htm index 7ad1c47..a93359b 100644 --- a/org.tizen.guides/html/web/media/radio_w.htm +++ b/org.tizen.guides/html/web/media/radio_w.htm @@ -44,7 +44,7 @@

    Tizen enables you to access and control the FM radio on the device.

    This feature is supported in mobile applications only.

    - +

    The main features of the FM Radio API include:

    - +

    Messaging

    @@ -44,7 +44,7 @@

    The application can receive push notifications from a push server. You can register your application and connect to the push service, to be ready to receive push notifications when they arrive.

    - +
    diff --git a/org.tizen.guides/html/web/messaging/push_w.htm b/org.tizen.guides/html/web/messaging/push_w.htm index 2d30904..34bc17b 100644 --- a/org.tizen.guides/html/web/messaging/push_w.htm +++ b/org.tizen.guides/html/web/messaging/push_w.htm @@ -75,7 +75,7 @@ Note Remember about security issues when sending notifications with sensitive information. For a list of strongly recommended rules, see Managing Security. - +

    Architecture

    The architecture of the Tizen Push service is described in detail in the mobile native Push guide.

    @@ -100,7 +100,7 @@

  • To use the Push API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the config.xml file:

    -<tizen:privilege name="http://tizen.org/privilege/push"/>
+<tizen:privilege name="http://tizen.org/privilege/push"/>
  • Make sure the following requirements are fulfilled: @@ -194,18 +194,18 @@ is launched by the notification service */ var service = -   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/push_test"); + new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/push_test"); /* Define the error callback */ function errorCallback(response) { -   console.log("The following error occurred: " + response.name); + console.log("The following error occurred: " + response.name); } /* Define the registration success callback */ function registerSuccessCallback(id) { -   console.log("Registration succeeded with id: " + id); + console.log("Registration succeeded with id: " + id); }
    • @@ -226,31 +226,31 @@ tizen.push.registerService(service, registerSuccessCallback, errorCallback); /* Define the error callback */ function errorCallback(response) { -   console.log("The following error occurred: " + response.name); + console.log("The following error occurred: " + response.name); } /* Define the registration success callback */ function registerSuccessCallback(id) { -   console.log("Registration succeeded with id: " + id); + console.log("Registration succeeded with id: " + id); } /* Define the state change callback */ function stateChangeCallback(state) { -   console.log("The state is changed to: " + state); + console.log("The state is changed to: " + state); -   if (state == "UNREGISTERED") -   { -      /* Request application registration */ -      tizen.push.register(registerSuccessCallback, errorCallback); -   } + if (state == "UNREGISTERED") + { + /* Request application registration */ + tizen.push.register(registerSuccessCallback, errorCallback); + } } /* Define the notification callback */ function notificationCallback(notification) { -   console.log("A notification arrives."); + console.log("A notification arrives."); } @@ -268,7 +268,7 @@ tizen.push.connect(stateChangeCallback, notificationCallback, errorCallback); var registrationId = tizen.push.getRegistrationId(); if (registrationId != null) { -   console.log("The registration id: " + registrationId); + console.log("The registration id: " + registrationId); }

    Since Tizen 3.0, you must connect to the push service before getting the registration ID.

    @@ -306,14 +306,14 @@ if (registrationId != null) 
     function errorCallback(response)
 {
-   console.log('The following error occurred: ' + response.name);
+   console.log('The following error occurred: ' + response.name);
 }
 
 function notificationCallback(message)
 {
-   console.log("New push message: " + message.alertMessage
-               + ", date: " + message.date
-               + ", data: " + message.appData);
+   console.log("New push message: " + message.alertMessage
+               + ", date: " + message.date
+               + ", data: " + message.appData);
 }
 
 /* Since Tizen 3.0, you must provide PushRegistrationStateChangeCallback */
@@ -321,7 +321,7 @@ function notificationCallback(message)
 
 function stateChangeCallback(state)
 {
-   console.log("The state is changed to: " + state);
+   console.log("The state is changed to: " + state);
 }

    The following table lists the fields available in the notification callback.

    @@ -349,7 +349,7 @@ function stateChangeCallback(state) message String Full push notification message. -

    For example: "badgeOption=INCREASE&badgeNumber=1&action=ALERT&alertMessage=Hi"

    +

    For example: "badgeOption=INCREASE&badgeNumber=1&action=ALERT&alertMessage=Hi"

    date @@ -422,9 +422,9 @@ tizen.push.disconnect(); /* Method to be called when the notification message arrives */ function notificationCallback(message) { -   console.log("New push message: " + message.alertMessage -               + ", date: " + message.date -               + ", data: " + message.appData); + console.log("New push message: " + message.alertMessage + + ", date: " + message.date + + ", data: " + message.appData); } tizen.push.connectService(notificationCallback); @@ -445,36 +445,36 @@ tizen.push.getUnreadNotifications(); /* Define the error callback */ function errorCallback(response) { -   console.log("The following error occurred: " + response.name); + console.log("The following error occurred: " + response.name); } /* Define the registration success callback */ function registerSuccessCallback(id) { -   console.log("Registration succeeded with id: " + id); + console.log("Registration succeeded with id: " + id); } /* Define the state change callback */ function stateChangeCallback(state) { -   console.log("The state is changed to: " + state); - -   if (state === "UNREGISTERED") -   { -      /* Request application registration */ -      tizen.push.register(registerSuccessCallback, errorCallback); -   } -   else if (state === "REGISTERED") -   { -      /* Gets unread push notifications */ -      tizen.push.getUnreadNotifications(); -   } + console.log("The state is changed to: " + state); + + if (state === "UNREGISTERED") + { + /* Request application registration */ + tizen.push.register(registerSuccessCallback, errorCallback); + } + else if (state === "REGISTERED") + { + /* Gets unread push notifications */ + tizen.push.getUnreadNotifications(); + } } /* Define the notification callback */ function notificationCallback(notification) { -   console.log("A notification arrives."); + console.log("A notification arrives."); } tizen.push.connect(stateChangeCallback, notificationCallback, errorCallback); @@ -491,37 +491,37 @@ tizen.push.connect(stateChangeCallback, notificationCallback, errorCallback);
  • Get the requested application control with the getRequestedAppControl() method: 
     var requestedAppControl =
-   tizen.application.getCurrentApplication().getRequestedAppControl().appControl;
+   tizen.application.getCurrentApplication().getRequestedAppControl().appControl;
  • Determine the reason for the application launch. If the reason for the launch is a notification, retrieve the latest push message. 
     for (var i = 0; i < requestedAppControl.data.length; ++i)
 {
-   if (requestedAppControl.data[i].key
-       === 'http://tizen.org/appcontrol/data/push/launch_type')
-   {
-      /* Launch type is 'registration_change' or 'notification' */
-      var appData = requestedAppControl.data[i].value[0];
-      console.log('launch_type: ' + appData);
-      if (appData === 'registration_change')
-      {
-         /* Launched due to change in the registration state */
-      }
-      else if (appData === 'notification')
-      {
-         /* Launched due to a notification */
-         try
-         {
-            /* Retrieve the latest message */
-            var pushMessage = tizen.push.getPushMessage();
-            /* Handle the retrieved message */
-         }
-         catch (error)
-         {
-            console.log(error.name + ': ' + error.message);
-         }
-      }
-   }
+   if (requestedAppControl.data[i].key
+       === 'http://tizen.org/appcontrol/data/push/launch_type')
+   {
+      /* Launch type is 'registration_change' or 'notification' */
+      var appData = requestedAppControl.data[i].value[0];
+      console.log('launch_type: ' + appData);
+      if (appData === 'registration_change')
+      {
+         /* Launched due to change in the registration state */
+      }
+      else if (appData === 'notification')
+      {
+         /* Launched due to a notification */
+         try
+         {
+            /* Retrieve the latest message */
+            var pushMessage = tizen.push.getPushMessage();
+            /* Handle the retrieved message */
+         }
+         catch (error)
+         {
+            console.log(error.name + ': ' + error.message);
+         }
+      }
+   }
 }
    • @@ -540,15 +540,15 @@ var pushMessage = tizen.push.getPushMessage(); 
     if (pushMessage)
 {
-   console.log('notification received on ' + pushMessage.date
-               + ' from: ' + pushMessage.sender);
-   console.log('Details:');
-   console.log(' - data: ' + pushMessage.appData);
-   console.log(' - alert message: ' + pushMessage.alertMessage);
-   console.log(' - message: ' + pushMessage.message);
-   console.log(' - session: ' + pushMessage.sessionInfo);
-   console.log(' - request ID: ' + pushMessage.requestId);
-   console.log(' - type: ' + pushMessage.type);
+   console.log('notification received on ' + pushMessage.date
+               + ' from: ' + pushMessage.sender);
+   console.log('Details:');
+   console.log(' - data: ' + pushMessage.appData);
+   console.log(' - alert message: ' + pushMessage.alertMessage);
+   console.log(' - message: ' + pushMessage.message);
+   console.log(' - session: ' + pushMessage.sessionInfo);
+   console.log(' - request ID: ' + pushMessage.requestId);
+   console.log(' - type: ' + pushMessage.type);
 }
    diff --git a/org.tizen.guides/html/web/messaging/task_chatter_w.htm b/org.tizen.guides/html/web/messaging/task_chatter_w.htm index db6a0b1..d503ff0 100644 --- a/org.tizen.guides/html/web/messaging/task_chatter_w.htm +++ b/org.tizen.guides/html/web/messaging/task_chatter_w.htm @@ -5,7 +5,7 @@ - + @@ -63,7 +63,7 @@

    Figure: Chatter screens

    Chatter screens

    - +

    Defining the Main Screen

      @@ -72,22 +72,22 @@

      The content section of the screen is added dynamically and displays a contact list. The footer section contains a tab bar with a button for starting a new chat.

       <!--Header section-->
-<div id="main-header" data-role="header" data-position="fixed">
-   <h1>Chatter</h1>
+<div id="main-header" data-role="header" data-position="fixed">
+   <h1>Chatter</h1>
 </div>
 
 <!--Content section-->
-<div id="main-content" data-role="content">
-   <ul data-role="listview"></ul>
+<div id="main-content" data-role="content">
+   <ul data-role="listview"></ul>
 </div>
 
 <!--Footer section-->
-<div id="main-footer" data-role="footer" data-position="fixed">
-   <div data-role="tabbar" data-style="toolbar">
-      <ul>
-         <li><a href="#" id="contactSelect-button">New chat</a></li>
-      </ul>
-   </div>
+<div id="main-footer" data-role="footer" data-position="fixed">
+   <div data-role="tabbar" data-style="toolbar">
+      <ul>
+         <li><a href="#" id="contactSelect-button">New chat</a></li>
+      </ul>
+   </div>
 </div>
      @@ -96,15 +96,15 @@
    1. app.ui.event.js Source File

      When the user taps the New chat button, an event is fired, and the contact list is loaded. The events are based on jQuery selectors.

      -$('#contactSelect-button').on('click', function(event)
-   {
-      event.preventDefault();
-      event.stopPropagation();
-      app.loadContacts();
-   });
+$('#contactSelect-button').on('click', function(event)
+   {
+      event.preventDefault();
+      event.stopPropagation();
+      app.loadContacts();
+   });
      2. -
    +

    Defining the Select Contact Screen

      @@ -112,31 +112,31 @@ $('#contactSelect-button').on('click', function(event)

      The content section of the Select contact screen displays a contact list. If the user taps the Enter number button, a pop-up opens allowing the user to enter a phone number for a contact not on the list. The popup component contains a form for number input.

       <!--Content section-->
-<div data-role="content">
-   <ul data-role="listview" id="contactSelect-list"></ul>
-   <a href="#" id="enterNumber" data-role="button">Enter number</a>
+<div data-role="content">
+   <ul data-role="listview" id="contactSelect-list"></ul>
+   <a href="#" id="enterNumber" data-role="button">Enter number</a>
 </div>
 
-<div data-role="popup" id="enterNumber-popup">
-   <div class="ui-popup-title">
-   <h1>Enter phone number<h1>
+<div data-role="popup" id="enterNumber-popup">
+   <div class="ui-popup-title">
+   <h1>Enter phone number<h1>
 </div>
-<div class="ui-popup-text">
-   <form id="numberForm">
-      <input type="tel" id="number" name="number" maxlength="20"/>
-   </form>
+<div class="ui-popup-text">
+   <form id="numberForm">
+      <input type="tel" id="number" name="number" maxlength="20"/>
+   </form>
 </div>
-<div class="ui-popup-button-bg">
-   <a data-role="button" id="enterNumberCreate" data-rel="back"
-      data-inline="true" class="ui-disabled">
-      Create Chat
-   </a>
+<div class="ui-popup-button-bg">
+   <a data-role="button" id="enterNumberCreate" data-rel="back"
+      data-inline="true" class="ui-disabled">
+      Create Chat
+   </a>
 </div>
    -

    Defining the Chat Screen

    +

    Defining the Chat Screen

    1. chat.tpl Source File

      When the user taps a list item on the main screen, the chat screen is displayed. The structure of the chat template is similar to main screen. The content section of the screen displays all messages from the selected contact, grouped into a conversation.

      @@ -145,29 +145,29 @@ $('#contactSelect-button').on('click', function(event) The template also contains a popup element used to show warning and exceptions information.

       <!--Content section-->
-<div id="chat-content" data-role="content">
-   <ul data-role="listview" id="message-chat"></ul>
+<div id="chat-content" data-role="content">
+   <ul data-role="listview" id="message-chat"></ul>
 </div>
 
 <!--Footer section-->
-<div id="chat-footer" data-role="footer" data-position="fixed">
-   <div class="ui-textArea">
-      <div class="ui-textArea-text">
-         <textarea id="text" class="ui-textArea-text-text"
-                   placeholder="Your message" data-role="none"></textarea>
-      </div>
-      <div class="ui-textArea-button">
-         <a data-role="button" id="send">Send</a>
-         <div data-role="none" id="counter" class="counter"><p></p></div>
-      </div>
-   </div>
+<div id="chat-footer" data-role="footer" data-position="fixed">
+   <div class="ui-textArea">
+      <div class="ui-textArea-text">
+         <textarea id="text" class="ui-textArea-text-text"
+                   placeholder="Your message" data-role="none"></textarea>
+      </div>
+      <div class="ui-textArea-button">
+         <a data-role="button" id="send">Send</a>
+         <div data-role="none" id="counter" class="counter"><p></p></div>
+      </div>
+   </div>
 </div>
 
-<div data-role="popup" id="alertPopup" class="ui-corner-all">
-   <p class="text"></p>
-   <div class="alertPopup-button">
-      <a href="#" data-role="button" data-inline="true" data-rel="back">OK</a>
-   </div>
+<div data-role="popup" id="alertPopup" class="ui-corner-all">
+   <p class="text"></p>
+   <div class="alertPopup-button">
+      <a href="#" data-role="button" data-inline="true" data-rel="back">OK</a>
+   </div>
 </div>
      2. @@ -180,20 +180,20 @@ The template also contains a popup element used to show warning and 
       <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-   <tizen:privilege name="http://tizen.org/privilege/contact.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/contact.write"/>
-   <tizen:privilege name="http://tizen.org/privilege/messaging.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/messaging.send"/>
-   <tizen:privilege name="http://tizen.org/privilege/messaging.write"/>
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+   <tizen:privilege name="http://tizen.org/privilege/contact.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/contact.write"/>
+   <tizen:privilege name="http://tizen.org/privilege/messaging.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/messaging.send"/>
+   <tizen:privilege name="http://tizen.org/privilege/messaging.write"/>
 </widget>
    -

    Managing Messages

    +

    Managing Messages

    This section builds upon the elements described in Managing Messages.

    @@ -206,16 +206,16 @@ The template also contains a popup element used to show warning and 
     initSmsService: function()
 {
-   var self = this;
-   try
-   {
-      tizen.messaging.getMessageServices("messaging.sms", function(s)
-         {
-            self.smsService = s[0];
-            self.prepareMessages(app.fillUpMessagePage.bind(self));
-            self.messagesChangeListener();
-         });
-   }
+   var self = this;
+   try
+   {
+      tizen.messaging.getMessageServices("messaging.sms", function(s)
+         {
+            self.smsService = s[0];
+            self.prepareMessages(app.fillUpMessagePage.bind(self));
+            self.messagesChangeListener();
+         });
+   }
 }
    @@ -225,34 +225,34 @@ initSmsService: function() 
     prepareMessages: function(callback)
 {
-   var self = this;
-   try
-   {
-      this.smsService.messageStorage
-         .findMessages(new tizen.AttributeFilter("type", "EXACTLY", "messaging.sms"),
-                       function(messages)
-         {
-            function compare(a, b)
-            {
-               if (a.timestamp > b.timestamp)
-               {
-                  return -1;
-               }
-               else if (a.timestamp < b.timestamp)
-               {
-                  return 1;
-               }
-               else
-               {
-                  return 0;
-               }
-            }
-            messages.sort(compare);
-            self.messagesList = self.groupMessages(messages);
-            app.ui.loadCallerList();
-            callback();
-         },
-   }
+   var self = this;
+   try
+   {
+      this.smsService.messageStorage
+         .findMessages(new tizen.AttributeFilter("type", "EXACTLY", "messaging.sms"),
+                       function(messages)
+         {
+            function compare(a, b)
+            {
+               if (a.timestamp > b.timestamp)
+               {
+                  return -1;
+               }
+               else if (a.timestamp < b.timestamp)
+               {
+                  return 1;
+               }
+               else
+               {
+                  return 0;
+               }
+            }
+            messages.sort(compare);
+            self.messagesList = self.groupMessages(messages);
+            app.ui.loadCallerList();
+            callback();
+         },
+   }
 }
    @@ -269,21 +269,21 @@ prepareMessages: function(callback) 
     groupMessages: function(messages)
 {
-   var i, obj = {}, folderId;
-   for (i in messages)
-   {
-      folderId = messages[i].folderId;
-      if ((folderId !== null && folderId !== this.DRAFTS_FOLDER)
-          || messages[i].messageStatus === 'DRAFT')
-      {
-         if (messages.hasOwnProperty(i))
-         {
-            obj = this.groupMessagesSingle(messages[i], obj);
-         }
-      }
-   }
-
-   return obj;
+   var i, obj = {}, folderId;
+   for (i in messages)
+   {
+      folderId = messages[i].folderId;
+      if ((folderId !== null && folderId !== this.DRAFTS_FOLDER)
+          || messages[i].messageStatus === 'DRAFT')
+      {
+         if (messages.hasOwnProperty(i))
+         {
+            obj = this.groupMessagesSingle(messages[i], obj);
+         }
+      }
+   }
+
+   return obj;
 }
    @@ -292,42 +292,42 @@ groupMessages: function(messages) 
     groupMessagesSingle: function(message, obj)
 {
-   var key, j;
-   if (message.from)
-   {
-      key = message.from;
-      obj[key] = this.pushData(message, obj[key]);
-   }
-   else
-   {
-      for (j in message.to)
-      {
-         if (message.to.hasOwnProperty(j))
-         {
-            key = message.to[j];
-            obj[key] = this.pushData(message, obj[key]);
-         }
-      }
-   }
-
-   return obj;
+   var key, j;
+   if (message.from)
+   {
+      key = message.from;
+      obj[key] = this.pushData(message, obj[key]);
+   }
+   else
+   {
+      for (j in message.to)
+      {
+         if (message.to.hasOwnProperty(j))
+         {
+            key = message.to[j];
+            obj[key] = this.pushData(message, obj[key]);
+         }
+      }
+   }
+
+   return obj;
 }
    - +
  • Pushing Data to the Conversation Array

    The pushData() method pushes the retrieved data into the recipient conversation array and sets the lastMessage object.

     pushData: function(message, obj)
 {
-   obj = obj || this.getGroupObject();
-   obj.messages.push(message);
-   if (app.helpers.objectLength(obj.lastMessage) === 0)
-   {
-      obj.lastMessage = message;
-   }
-
-   return obj;
+   obj = obj || this.getGroupObject();
+   obj.messages.push(message);
+   if (app.helpers.objectLength(obj.lastMessage) === 0)
+   {
+      obj.lastMessage = message;
+   }
+
+   return obj;
 }
    • @@ -337,26 +337,26 @@ pushData: function(message, obj) 
     getGroupObject: function()
 {
-   return
-   {
-      messages: [], lastMessage: {},
-      last:
-      {
-         body: {plainBody: null}, timestamp: new Date()
-      }
-   };
+   return
+   {
+      messages: [], lastMessage: {},
+      last:
+      {
+         body: {plainBody: null}, timestamp: new Date()
+      }
+   };
 }
    - -

    Creating and Sending Messages

    + +

    Creating and Sending Messages

    This section builds upon the elements described in Creating and Sending Messages.

    Getting the Contact List

    -
      +
      1. app.model.js Source File

        1. To get the contact list from the device memory, get the default address book using the getDefaultAddressBook() method.

          @@ -368,31 +368,31 @@ this.addressBook = tizen.contact.getDefaultAddressBook();
 
           loadContacts: function(callback)
 {
-   var contactsFoundCB, errorCB;
-
-   this.contactsLoaded = null;
-
-   contactsFoundCB = function(contacts)
-   {
-      var i;
-      this.contactsLoaded = [];
-      for (i in contacts)
-      {
-         if (contacts.hasOwnProperty(i)
-            && this.getNumberFromContact(contacts[i]))
-         {
-            contacts[i].primaryNumber =
-               this.getNumberFromContact(contacts[i])
-            this.contactsLoaded.push(contacts[i]);
-         }
-      }
-      if (callback instanceof Function)
-      {
-         callback();
-      }
-   };
-
-   this.addressBook.find(contactsFoundCB.bind(this), errorCB);
+   var contactsFoundCB, errorCB;
+
+   this.contactsLoaded = null;
+
+   contactsFoundCB = function(contacts)
+   {
+      var i;
+      this.contactsLoaded = [];
+      for (i in contacts)
+      {
+         if (contacts.hasOwnProperty(i)
+            && this.getNumberFromContact(contacts[i]))
+         {
+            contacts[i].primaryNumber =
+               this.getNumberFromContact(contacts[i])
+            this.contactsLoaded.push(contacts[i]);
+         }
+      }
+      if (callback instanceof Function)
+      {
+         callback();
+      }
+   };
+
+   this.addressBook.find(contactsFoundCB.bind(this), errorCB);
 }
          2. @@ -400,80 +400,80 @@ loadContacts: function(callback)

        Setting the Message Recipient

        The message recipient selection functionality is implemented in the app.js file.

        -
          +
          1. Displaying the Contacts

            Before the user write the message text, they select the message recipient. The recipient list stored in the contactsLoaded object in the device memory is retrieved and displayed for the selection.

             showContactsLoaded: function()
 {
-   var i, len, sortedContactList = [];
-
-   if (this.model.contactsLoaded !== null && this.model.contactsLoaded.length)
-   {
-      len = this.model.contactsLoaded.length;
-      for (i = 0; i < len; i += 1)
-      {
-         if (this.model.contactsLoaded[i].phoneNumbers.length)
-         {
-            sortedContactList.push(
-            {
-               caller: this.helpers.getCallerName(this.model.contactsLoaded[i],
-                                                  'no name'),
-               number: this.model.contactsLoaded[i].primaryNumber,
-               contact: this.model.contactsLoaded[i]
-            });
-         }
-      }
-
-      sortedContactList.sort(function(a, b)
-         {
-            if (a.caller < b.caller)
-            {
-               return -1;
-            }
-            else if (a.caller > b.caller)
-            {
-               return 1;
-            }
-
-            return 0;
-         });
-   }
-   this.ui.fillContactList(sortedContactList);
+   var i, len, sortedContactList = [];
+
+   if (this.model.contactsLoaded !== null && this.model.contactsLoaded.length)
+   {
+      len = this.model.contactsLoaded.length;
+      for (i = 0; i < len; i += 1)
+      {
+         if (this.model.contactsLoaded[i].phoneNumbers.length)
+         {
+            sortedContactList.push(
+            {
+               caller: this.helpers.getCallerName(this.model.contactsLoaded[i],
+                                                  'no name'),
+               number: this.model.contactsLoaded[i].primaryNumber,
+               contact: this.model.contactsLoaded[i]
+            });
+         }
+      }
+
+      sortedContactList.sort(function(a, b)
+         {
+            if (a.caller < b.caller)
+            {
+               return -1;
+            }
+            else if (a.caller > b.caller)
+            {
+               return 1;
+            }
+
+            return 0;
+         });
+   }
+   this.ui.fillContactList(sortedContactList);
 }
 
 fillContactList: function(sortedContactList)
 {
-   var i, ul = $("#contactSelect-list").empty(),
-      len, listElement, self = this;
-
-   len = sortedContactList.length;
-
-   for (i = 0; i < len; i += 1)
-   {
-      listElement = this.templateManager.get('contactRow',
-      {
-         'number': sortedContactList[i].number,
-         'callerName': sortedContactList[i].caller
-      });
-
-      if (app.helpers.validateNumberLength(sortedContactList[i].number))
-      {
-         ul.append(listElement);
-      }
-   }
+   var i, ul = $("#contactSelect-list").empty(),
+      len, listElement, self = this;
+
+   len = sortedContactList.length;
+
+   for (i = 0; i < len; i += 1)
+   {
+      listElement = this.templateManager.get('contactRow',
+      {
+         'number': sortedContactList[i].number,
+         'callerName': sortedContactList[i].caller
+      });
+
+      if (app.helpers.validateNumberLength(sortedContactList[i].number))
+      {
+         ul.append(listElement);
+      }
+   }
          2. Selecting the Contact

            When the user clicks the wanted recipient, the touch event that sets the current list item as the recipient is triggered, and the chat screen is displayed.

            -   $('li.ui-li-has-multiline', ul).on('click', function(event)
-      {
-         app.ui.onCallerListElementTap(event, $(this));
-      });
+   $('li.ui-li-has-multiline', ul).on('click', function(event)
+      {
+         app.ui.onCallerListElementTap(event, $(this));
+      });
 
-   ul.trigger('create');
-   ul.listview('refresh');
+   ul.trigger('create');
+   ul.listview('refresh');
 }
            3. @@ -486,17 +486,17 @@ fillContactList: function(sortedContactList) 
             sendMessage: function(number, text, callback, errorcallback)
 {
-   var message;
-   callback = callback || new Function();
-   errorcallback = errorcallback || new Function();
-   message = new tizen.Message("messaging.sms", {plainBody: text, to: [number]});
-   try
-   {
-      this.smsService.sendMessage(message, callback, function(e)
-      {
-         /* Error handling */
-      });
-   }
+   var message;
+   callback = callback || new Function();
+   errorcallback = errorcallback || new Function();
+   message = new tizen.Message("messaging.sms", {plainBody: text, to: [number]});
+   try
+   {
+      this.smsService.sendMessage(message, callback, function(e)
+      {
+         /* Error handling */
+      });
+   }
 },
            @@ -515,25 +515,25 @@ Receiving Notifications on Message Storage Changes.

             messagesChangeListener: function()
 {
-   var self = this, config, messageChangeCallback =
-   {
-      messagesupdated: function(messages)
-      {
-         if (messages[0].messageStatus !== 'SENDING')
-         {
-            app.ui.changeMessageStatus(messages[0]);
-         }
-      },
-      messagesadded: function(messages)
-      {
-         self.prepareMessages(app.ui.showMessageChat);
-      },
-      messagesremoved: function()
-      {
-         self.prepareMessages(app.ui.showMessageChat);
-      }
-   };
-   this.smsService.messageStorage.addMessagesChangeListener(messageChangeCallback);
+   var self = this, config, messageChangeCallback =
+   {
+      messagesupdated: function(messages)
+      {
+         if (messages[0].messageStatus !== 'SENDING')
+         {
+            app.ui.changeMessageStatus(messages[0]);
+         }
+      },
+      messagesadded: function(messages)
+      {
+         self.prepareMessages(app.ui.showMessageChat);
+      },
+      messagesremoved: function()
+      {
+         self.prepareMessages(app.ui.showMessageChat);
+      }
+   };
+   this.smsService.messageStorage.addMessagesChangeListener(messageChangeCallback);
 }
          @@ -545,31 +545,31 @@ messagesChangeListener: function() 
           changeMessageStatus: function(message, loop)
 {
-   var warning = $('#' + message.id + ' .warning'),
-       classes, i, self = this;
-   loop = loop + 1 || 0;
-   if (warning.length === 1)
-   {
-      classes = warning.attr('class').split(' ');
-      for (i in classes)
-      {
-         if (classes.hasOwnProperty(i))
-         {
-            if (/status([A-Z]*)/.test(classes[i]))
-            {
-               warning.removeClass(classes[i]);
-            }
-         }
-      }
-      warning.addClass('status' + message.messageStatus);
-   }
-   else if (loop < 3)
-   {
-      setTimeout(function()
-         {
-            self.changeMessageStatus(message, loop)
-         }, 1000);
-   }
+   var warning = $('#' + message.id + ' .warning'),
+       classes, i, self = this;
+   loop = loop + 1 || 0;
+   if (warning.length === 1)
+   {
+      classes = warning.attr('class').split(' ');
+      for (i in classes)
+      {
+         if (classes.hasOwnProperty(i))
+         {
+            if (/status([A-Z]*)/.test(classes[i]))
+            {
+               warning.removeClass(classes[i]);
+            }
+         }
+      }
+      warning.addClass('status' + message.messageStatus);
+   }
+   else if (loop < 3)
+   {
+      setTimeout(function()
+         {
+            self.changeMessageStatus(message, loop)
+         }, 1000);
+   }
 }
          diff --git a/org.tizen.guides/html/web/notification/notification_w.htm b/org.tizen.guides/html/web/notification/notification_w.htm index 2611e01..52b4c24 100644 --- a/org.tizen.guides/html/web/notification/notification_w.htm +++ b/org.tizen.guides/html/web/notification/notification_w.htm @@ -35,20 +35,20 @@

          Related Info

          - +
          -

          Notifications

          +

          Notifications

          Tizen enables you to provide notifications about application events.

          -

          This feature is supported in mobile and wearable applications only.

          +

          This feature is supported in mobile and wearable applications only.

          The main features of the Notification API include:

            @@ -72,7 +72,7 @@

            Prerequisites

            To use the Notification API (in mobile and wearable applications), the application has to request permission by adding the following privilege to the config.xml file:

            -<tizen:privilege name="http://tizen.org/privilege/notification"/>
+<tizen:privilege name="http://tizen.org/privilege/notification"/>
            @@ -84,28 +84,28 @@ 
             /* Application control */
 var appControl =
-   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/create_content",
-                                null, "image/jpg", null, null);
+   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/create_content",
+                                null, "image/jpg", null, null);
 
 var notificationDict =
 {
-   /* Notification content */
-   content: "This is a simple notification.",
-   /* Path to the notification icon */
-   iconPath: "images/image1.jpg",
-   /* Path to the sound file to be played when the notification is displayed */
-   soundPath: "music/Over the horizon.mp3",
-   /* Device vibrates when the notification is displayed */
-   vibration: true,
-   /* Application control to be launched when the user selects the notification */
-   appControl: appControl
+   /* Notification content */
+   content: "This is a simple notification.",
+   /* Path to the notification icon */
+   iconPath: "images/image1.jpg",
+   /* Path to the sound file to be played when the notification is displayed */
+   soundPath: "music/Over the horizon.mp3",
+   /* Device vibrates when the notification is displayed */
+   vibration: true,
+   /* Application control to be launched when the user selects the notification */
+   appControl: appControl
 };
            -

            The path in the iconPath and soundPath parameters means a relative file location defined in the Filesystem API (in mobile and wearable applications). The path is not an absolute file location, but instead uses a virtual root location (such as images in images/image1.jpg).

            +

            The path in the iconPath and soundPath parameters means a relative file location defined in the Filesystem API (in mobile and wearable applications). The path is not an absolute file location, but instead uses a virtual root location (such as images in images/image1.jpg).

          • To be able to display the notification, create a StatusNotification object (in mobile and wearable applications) with the status notification type, title, and the additional notification properties defined in the previous step.

            -var notification = new tizen.StatusNotification("SIMPLE", "Simple notification",
-                                                notificationDict);
+var notification = new tizen.StatusNotification("SIMPLE", "Simple notification",
+                                                notificationDict);

          • To post the notification, use the post() method of the NotificationManager interface (in mobile and wearable applications):

            @@ -121,42 +121,42 @@ tizen.notification.post(notification);
 
             /* Application control */
 var appControl =
-   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/create_content",
-                                null, "image/jpg", null, null);
+   new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/create_content",
+                                null, "image/jpg", null, null);
 
 var notificationDict =
 {
-   content: "This is a progress notification.",
-   iconPath: "images/image1.jpg",
-   vibration: false,
-   appControl: appControl,
-   progressType: "PERCENTAGE",
-   progressValue: 0
+   content: "This is a progress notification.",
+   iconPath: "images/image1.jpg",
+   vibration: false,
+   appControl: appControl,
+   progressType: "PERCENTAGE",
+   progressValue: 0
 };
 
            
 
            The path in the iconPath and soundPath parameters means a file location defined in the Filesystem API (in mobile and wearable applications). The path is not an absolute file location, but instead uses a virtual root location (such as images in images/image1.jpg).

          • To be able to display the notification, create a StatusNotification object (in mobile and wearable applications) with the status notification type, title, and the additional notification properties defined in the previous step:

             var notification =
-   new tizen.StatusNotification("PROGRESS", "Progress notification", notificationDict);
+   new tizen.StatusNotification("PROGRESS", "Progress notification", notificationDict);

          • Define a function which uses the update() method of the NotificationManager interface (in mobile and wearable applications) to update the posted notification every second:

             function updateProgressNotification(progress)
 {
-   if (progress <= 100)
-   {
-      notification.progressValue = progress;
-      tizen.notification.update(notification);
-      setTimeout(function()
-         {
-            updateProgressNotification(progress + 10);
-         }, 1000);
-   }
-   else
-   {
-      tizen.notification.remove(notification.id);
-   }
+   if (progress <= 100)
+   {
+      notification.progressValue = progress;
+      tizen.notification.update(notification);
+      setTimeout(function()
+         {
+            updateProgressNotification(progress + 10);
+         }, 1000);
+   }
+   else
+   {
+      tizen.notification.remove(notification.id);
+   }
 }

          • To post the notification, use the post() method of the NotificationManager interface. If the progress value is set, the progress bar is displayed in the notification. The progress value can change the amount of progress as it moves forward or backward.

            The application must keep the progress value for its job, because the saved value in the notification status tray can be different (rounded) from the exact progress value.

            @@ -184,18 +184,18 @@ var index = 0; /* For each notification, write the ID and title in the console log */ for (index = 0; index < notifications.length; index++) { -   console.log(notifications[index].id); -   console.log(notifications[index].title); + console.log(notifications[index].id); + console.log(notifications[index].title); }
            • -
        2. +

    1. To update a previously posted notification, use the update() method by specifying the updated notification object:

      -myNotification.content = "My notification";
+myNotification.content = "My notification";
 tizen.notification.update(myNotification);
      2. -
    2. To remove notifications: -
        +
      1. To remove notifications: +

        1. To remove a previously posted notification, use the remove() method with the notification ID as a parameter:

           tizen.notification.remove(myNotification.id);
@@ -221,20 +221,20 @@ var myNotification;
      
        2. To save the template, use saveNotificationAsTemplate() method of the NotificationManager interface (in mobile and wearable applications):
          
 
           try {
-   var templateName = "importantNoti";
-   tizen.notification.saveNotificationAsTemplate(templateName, myNotification);
+   var templateName = "importantNoti";
+   tizen.notification.saveNotificationAsTemplate(templateName, myNotification);
 } catch(e) {
-   console.log("Error " + e.message + " occured");
+   console.log("Error " + e.message + " occured");
 }
 
          3.

      2. To use the template for creation of new pre-set notification, use the createNotificationFromTemplate() method of the NotificationManager interface (in mobile and wearable applications):

         try {
-   var newTemplateNotification = tizen.notification.createNotificationFromTemplate(templateName);
-   console.log("Content of new notification: " + content);
+   var newTemplateNotification = tizen.notification.createNotificationFromTemplate(templateName);
+   console.log("Content of new notification: " + content);
 } catch (e) {
-   console.log("Error " + e.message + " occured");
+   console.log("Error " + e.message + " occured");
 }
      3. diff --git a/org.tizen.guides/html/web/personal/account_w.htm b/org.tizen.guides/html/web/personal/account_w.htm index b83064a..22054b7 100644 --- a/org.tizen.guides/html/web/personal/account_w.htm +++ b/org.tizen.guides/html/web/personal/account_w.htm @@ -31,7 +31,7 @@
    3. Retrieving Providers
    4. Managing Accounts
    5. Receiving Notifications on Account Changes
      6. -
    6. Managing Extended Account Data
      7. +
    7. Managing Extended Account Data

      8. Related Info

      - +

      Retrieving Providers

      To create accounts, you must learn how to get access to account providers:

      @@ -163,19 +163,19 @@ var provider = tizen.account.getProvider(appId); 
       function getProvidersSuccess(providers)
 {
-   /* Providers is an array whose members are providers with contact capability */
+   /* Providers is an array whose members are providers with contact capability */
 }
 function getProvidersError(error)
 {
-   console.log('Error: ' + error.message);
+   console.log('Error: ' + error.message);
 }
 
 tizen.account.getProviders(getProvidersSuccess, getProvidersError,
-                           "http://tizen.org/account/capability/contact");
+                           "http://tizen.org/account/capability/contact");
      - +

      Managing Accounts

      Creating, adding, updating, and deleting accounts is a basic account management skill:

      @@ -196,7 +196,7 @@ var accountProvider = tizen.account.getProvider(appId); 
       var account =
-   new tizen.Account(accountProvider, {userName: 'admin', iconUri: 'path/to/icon.jpg'});
+   new tizen.Account(accountProvider, {userName: 'admin', iconUri: 'path/to/icon.jpg'});
    8. Add the account to the account database: @@ -208,7 +208,7 @@ tizen.account.add(account);
    9. To update the account information, change the attributes of the Account object for the relevant account: 
      -account.userName = 'new username';
+account.userName = 'new username';
    10. To save the changed values, use the update() method of the AccountManager interface: @@ -225,7 +225,7 @@ tizen.account.remove(account.id);
    - +

    Receiving Notifications on Account Changes

    Learning how to register change listeners enables you to synchronize the view of your application with the changes in the account database:

    @@ -236,18 +236,18 @@ tizen.account.remove(account.id); 
     var accountChangeListener =
 {
-   onadded: function(account)
-   {
-      /* Called when an account is added */
-   },
-   onremoved: function(accountId)
-   {
-      /* Called when an account is removed */
-   },
-   onupdated: function(account)
-   {
-      /* Called when a registered account is changed */
-   }
+   onadded: function(account)
+   {
+      /* Called when an account is added */
+   },
+   onremoved: function(accountId)
+   {
+      /* Called when an account is removed */
+   },
+   onupdated: function(account)
+   {
+      /* Called when a registered account is changed */
+   }
 };
    @@ -275,15 +275,15 @@ tizen.account.removeAccountListener(watchId);

    Set the additional information with the setExtendedData() method:

    -var key = 'nickname';
-var value = 'nickname of anonymous user';
+var key = 'nickname';
+var value = 'nickname of anonymous user';
 account.setExtendedData(key, value);

    To overwrite the previous data value, set a new value with the same key:

    -account.setExtendedData(key, 'nickname updated');
+account.setExtendedData(key, 'nickname updated');
    @@ -291,7 +291,7 @@ account.setExtendedData(key, 'nickname updated'); diff --git a/org.tizen.guides/html/web/personal/bookmarks_w.htm b/org.tizen.guides/html/web/personal/bookmarks_w.htm index 4d437ef..6411265 100644 --- a/org.tizen.guides/html/web/personal/bookmarks_w.htm +++ b/org.tizen.guides/html/web/personal/bookmarks_w.htm @@ -43,68 +43,68 @@

    Bookmarks

    - +

    You can manage the Tizen Web browser bookmarks by retrieving the current bookmark list. You can create or delete both bookmark folders and items.

    - +

    This feature is supported in mobile applications only.

    - +

    The main features of the Bookmark API include:

    - +

    Prerequisites

    To use the Bookmark API, the application has to request permission by adding the following privileges to the config.xml file:

    -<tizen:privilege name="http://tizen.org/privilege/bookmark.read"/>
-<tizen:privilege name="http://tizen.org/privilege/bookmark.write"/>
+<tizen:privilege name="http://tizen.org/privilege/bookmark.read"/>
+<tizen:privilege name="http://tizen.org/privilege/bookmark.write"/>
    - +

    Creating Bookmark Folders and Items

    - -

    To create engaging applications with bookmark-related features, you must learn how to add bookmark folders and items to the root bookmark folder and subfolders:

    - + +

    Deleting Bookmarks

    - -

    To create engaging applications with bookmark-related features, you must learn how to delete bookmarks:

    -
      + +

      To create engaging applications with bookmark-related features, you must learn how to delete bookmarks:

      +

      1. To remove a bookmark item, use the remove() method of the BookmarkManager interface and specify the bookmark item:

         tizen.bookmark.remove(tizen);
@@ -117,14 +117,14 @@ tizen.bookmark.remove(folder2);
 
         tizen.bookmark.remove();
        2. -
      - - +
    + +

    Retrieving the Bookmark List

    - - -

    To create engaging applications with bookmark-related features, you must learn how to retrieve the bookmarks:

    -
      + + +

      To create engaging applications with bookmark-related features, you must learn how to retrieve the bookmarks:

      +

      1. To retrieve bookmarks only from the root bookmark folder, use the get() method of the BookmarkManager interface without specifying any parameter:

         tizen.bookmark.get();
diff --git a/org.tizen.guides/html/web/personal/calendar_w.htm b/org.tizen.guides/html/web/personal/calendar_w.htm
index 5089c35..5f10f22 100644
--- a/org.tizen.guides/html/web/personal/calendar_w.htm
+++ b/org.tizen.guides/html/web/personal/calendar_w.htm
@@ -34,8 +34,8 @@
      2. Events
        3. -
      3. Receiving Notifications on Calendar Changes
        4. +
      4. Receiving Notifications on Calendar Changes

        5. Related Info

          @@ -65,15 +65,15 @@

          Calendar

          Tizen enables you to manage your schedule and tasks in calendars. A calendar is a collection of events or tasks, depending upon the calendar type. Each event or task has a series of attributes, such as purpose, starting time, and duration.

          - +

          This feature is supported in mobile applications only.

          The main features of the Calendar API include:

            -
          • Calendar management +
          • Calendar management

            You can create a new calendar using the addCalendar() method of the CalendarManager interface (you also need the Account API).

            • -
          • Calendar item management -

            You can manage calendar items (add a new event or task to a calendar, or manage a single calendar event or task) by using the applicable methods of the Calendar interface. You can also delete or update a single instance of a recurring event.

            +
          • Calendar item management +

            You can manage calendar items (add a new event or task to a calendar, or manage a single calendar event or task) by using the applicable methods of the Calendar interface. You can also delete or update a single instance of a recurring event.

            When creating an important event or task, such as a monthly meeting or a task of paying a utility bill, you can set an alarm for it by using the CalendarAlarm interface. The alarm is triggered at a defined time to remind the user of the event or task.

            You can create multiple events or tasks, and manage multiple calendar events or tasks simultaneously by using the applicable batch methods. The batch mode provides faster, optimized processing of multiple calendar items.

            @@ -82,54 +82,54 @@ The batch mode does not provide progress information about operations. To ensure that you can view the progress, break the batch operation down into multiple smaller batch operations. For example, break down a batch of 100 update requests into 10 batch operations that update 10 records at a time. Breaking down a batch operation also helps you avoid blocking other database operations, such as add or remove.
            • -
          • iCalendar 2.0 format conversions +
          • iCalendar 2.0 format conversions

            You can convert a calendar event or task to the iCalendar format and back.

            • -
          • Calendar change notifications -

            You can keep the calendar in your application synchronized with user-specific calendars, such as a calendar on a social networking Web site, by receiving notifications in your application when calendar items change.

            +
          • Calendar change notifications +

            You can keep the calendar in your application synchronized with user-specific calendars, such as a calendar on a social networking Web site, by receiving notifications in your application when calendar items change.

          -

          The Calendar API uses the TZDate object of the Time API and not the standard JavaScript Date object to handle difficult issues related to the time zone, because the TZDate object handles exact time and provides various utility methods.

          +

          The Calendar API uses the TZDate object of the Time API and not the standard JavaScript Date object to handle difficult issues related to the time zone, because the TZDate object handles exact time and provides various utility methods.

          For a practical example of managing calendar events in your application, see the Event Manager sample task.

          - +

          Prerequisites

          To use the Calendar API, the application has to request permission by adding the following privileges to the config.xml file:

          -<tizen:privilege name="http://tizen.org/privilege/calendar.read"/>
-<tizen:privilege name="http://tizen.org/privilege/calendar.write"/>
+<tizen:privilege name="http://tizen.org/privilege/calendar.read"/>
+<tizen:privilege name="http://tizen.org/privilege/calendar.write"/>
          - +

          Creating a Calendar

          Note The created calendar is associated with a specified account. Therefore, you must retrieve the account before creating a new calendar.
          - +

          To create a new calendar:

          - -
            + +
            1. Declare a variable to store the created calendar: 
               var myCalendar = null;
              2. -
            2. Define a success callback for the getAccounts() method. The callback receives a list of Account objects. Use the first account ID to construct a new Calendar object. +
            3. Define a success callback for the getAccounts() method. The callback receives a list of Account objects. Use the first account ID to construct a new Calendar object.

              Add the new calendar to the system using the addCalendar() method of the CalendarManager interface:

               function getAccountsSuccess(accounts)
 {
-   var account = accounts[0];
-   if (account)
-   {
-      /* New calendar can be created and added */
-      myCalendar = new tizen.Calendar(account.id, "remote calendar", "TASK");
-      tizen.calendar.addCalendar(myCalendar);
-      console.log("New calendar created with ID=" + myCalendar.id);
-   }
+   var account = accounts[0];
+   if (account)
+   {
+      /* New calendar can be created and added */
+      myCalendar = new tizen.Calendar(account.id, "remote calendar", "TASK");
+      tizen.calendar.addCalendar(myCalendar);
+      console.log("New calendar created with ID=" + myCalendar.id);
+   }
 }
            4. To retrieve available accounts, use the getAccounts() method. The following method call invokes the getAccountsSuccess event handler defined above: @@ -146,64 +146,64 @@ tizen.account.getAccounts(getAccountsSuccess, function(err));
            5. To retrieve the default calendar, use the getDefaultCalendar() method of the CalendarManager interface.

              The following example retrieves the event-type default calendar:

              -tizen.calendar.getDefaultCalendar("EVENT");
+tizen.calendar.getDefaultCalendar("EVENT");
            6. To retrieve all the available calendars as an array, use the getCalendars() method.

              The following example retrieves all event-type calendars:

              -tizen.calendar.getCalendars("EVENT", calendarListCallback, errorCallback);
+tizen.calendar.getCalendars("EVENT", calendarListCallback, errorCallback);
            7. To retrieve a special calendar, which combines events (or tasks) from all calendars of the same type, use the getUnifiedCalendar() method of the CalendarManager interface.

              The following example retrieves a unified event-type calendar:

              -tizen.calendar.getUnifiedCalendar("EVENT");
+tizen.calendar.getUnifiedCalendar("EVENT");

        Events

        The events are identified using the CalendarEventId, which is a CalendarItemId typedef. In recurring events, the CalendarEventId contains a recurrence ID (rid) in addition to the actual event ID, to separately identify each occurrence of the recurring event.

        - +
        Note - Due to time zone and daylight saving time, an event for "today" can actually occur in the past or in the future. + Due to time zone and daylight saving time, an event for "today" can actually occur in the past or in the future.
        - +

        Using the CalendarEvent object, you can:

          -
        • Add events to a calendar one by one or in a batch mode.
          • +
        • Add events to a calendar one by one or in a batch mode.
        • Update or delete events one by one or in a batch mode.
        • Update recurring events.
        • Convert events to the iCalendar format and back.

        Adding Events to a Calendar

        - +

        To add events to a calendar:

        1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.

          With the parameter, specify the calendar type as an event.

          -var calendar = tizen.calendar.getDefaultCalendar("EVENT");
+var calendar = tizen.calendar.getDefaultCalendar("EVENT");

        2. Create a CalendarEvent object and define the event properties:

           var ev = new tizen.CalendarEvent
 ({
-   description:"HTML5 Introduction",
-   summary:"HTML5 Webinar",
-   startDate: new tizen.TZDate(2011, 3, 30, 10, 0),
-   duration: new tizen.TimeDuration(1, "HOURS"),
-   location:"Huesca",
+   description:"HTML5 Introduction",
+   summary:"HTML5 Webinar",
+   startDate: new tizen.TZDate(2011, 3, 30, 10, 0),
+   duration: new tizen.TimeDuration(1, "HOURS"),
+   location:"Huesca",

        3. To make a recurring event, define a recurrence rule.

          In this example, the event repeats once a day for 3 days.

          -   recurrenceRule: new tizen.CalendarRecurrenceRule("DAILY", {occurrenceCount: 3})
+   recurrenceRule: new tizen.CalendarRecurrenceRule("DAILY", {occurrenceCount: 3})
 });

        4. To set up an alarm to remind the user about the event, create an alarm with the CalendarAlarm interface, and add the alarm to the event:

           /* Alarm is triggered with sound 30 minutes before the event start time */
-var alarm = new tizen.CalendarAlarm(new tizen.TimeDuration(30, "MINS"), "SOUND");
+var alarm = new tizen.CalendarAlarm(new tizen.TimeDuration(30, "MINS"), "SOUND");
 
 ev.alarms = [alarm];
          5. @@ -212,24 +212,24 @@ ev.alarms = [alarm]; calendar.add(ev); /* ev.id attribute is generated */
        - +

        Adding Events to a Calendar in the Batch Mode

        -

        You can create multiple events simultaneously by using the addBatch() method.

        +

        You can create multiple events simultaneously by using the addBatch() method.

        To add events to a calendar in the batch mode:

        1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface:

          -var calendar = tizen.calendar.getDefaultCalendar("EVENT");
+var calendar = tizen.calendar.getDefaultCalendar("EVENT");

        2. Define the items to be added as an array:

           var ev = new tizen.CalendarEvent
 ({
-   description:"HTML5 Introduction",
-   summary:"HTML5 Webinar",
-   startDate: new tizen.TZDate(2011, 3, 30, 10, 0),
-   duration: new tizen.TimeDuration(1, "HOURS"),
-   location:"Huesca"
+   description:"HTML5 Introduction",
+   summary:"HTML5 Webinar",
+   startDate: new tizen.TZDate(2011, 3, 30, 10, 0),
+   duration: new tizen.TimeDuration(1, "HOURS"),
+   location:"Huesca"
 });
          @@ -249,14 +249,14 @@ calendar.addBatch([ev]);
        - +

        Managing a Single Event

        - +

        To manage a single event:

        1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.

          With the parameter, specify the calendar type as event.

          -var myCalendar = tizen.calendar.getDefaultCalendar("EVENT");
+var myCalendar = tizen.calendar.getDefaultCalendar("EVENT");

        2. Retrieve all events stored in the calendar by using the find() method of the Calendar object:

          @@ -269,16 +269,16 @@ myCalendar.find(eventSearchSuccessCallback);
 /* Define the event success callback */
 function eventSearchSuccessCallback(events)
 {
-   /* Update the first existing event */
-   events[0].description = "New Description";
-   myCalendar.update(events[0]);
+   /* Update the first existing event */
+   events[0].description = "New Description";
+   myCalendar.update(events[0]);
 
-   /* Delete the second existing event */
-   myCalendar.remove(events[1].id);
+   /* Delete the second existing event */
+   myCalendar.remove(events[1].id);
 }
        - +

        Updating Recurring Events

        If you need to delete or update a single instance of a recurring event, get the list of event instances first with the expandRecurrence() method of the CalendarEvent object. Then, delete the applicable event instance, or update it by calling the update() method with the updateAllInstances parameter set to false.

        To update recurring events:

        @@ -286,13 +286,13 @@ function eventSearchSuccessCallback(events)

      5. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.

        Retrieve the event using the get() method by specifying the event ID.

        -var calendar = tizen.calendar.getDefaultCalendar("EVENT");
+var calendar = tizen.calendar.getDefaultCalendar("EVENT");
 var event = calendar.get(evId);
      6. Expand the recurring event to get its instances by using the expandRecurrence() method of the CalendarEvent object: 
         event.expandRecurrence(new tizen.TZDate(2012, 2, 1), new tizen.TZDate(2012, 2, 15),
-                       eventExpandSuccessCB);
+                       eventExpandSuccessCB);

        The expanded event instances have their own id.uid and id.rid attributes, where the id.uid attribute is the same for all instances.

      7. Update a single instance of the expanded recurring event.

        In case of recurring events, you can use the second parameter of the update() method to determine whether a single instance or all occurrences of the event are updated. If the parameter is set to true, all instances are updated, while if it is set to false, only the indicated instance of the recurring event is updated (based on the id.rid attribute).

        In this example, the second instance of the event is updated.

        @@ -300,19 +300,19 @@ event.expandRecurrence(new tizen.TZDate(2012, 2, 1), new tizen.TZDate(2012, 2, 1 /* Success event handler */ function eventExpandSuccessCB(events) { -   events[1].summary = 'updated summary'; -   calendar.update(events[1], false); + events[1].summary = 'updated summary'; + calendar.update(events[1], false); }
      - +

      Managing Multiple Events in the Batch Mode

      You can manage multiple events simultaneously by using the applicable batch methods: updateBatch() and removeBatch().

      To manage multiple events in the batch mode:

      1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.

        With the parameter, specify the calendar type as event.

        -var myCalendar = tizen.calendar.getDefaultCalendar("EVENT");
+var myCalendar = tizen.calendar.getDefaultCalendar("EVENT");

      2. Retrieve all events stored in the calendar by using the find() method of the Calendar object:

        @@ -326,13 +326,13 @@ myCalendar.find(eventSearchSuccessCallback, errorCallback);
 
         function eventSearchSuccessCallback(events)
 {
-   events[0].description = "New Description 1";
-   events[1].description = "New Description 2";
+   events[0].description = "New Description 1";
+   events[1].description = "New Description 2";

      3. Use the updateBatch() method to update multiple calendar items asynchronously:

        -   /* Update the first 2 existing events */
-   myCalendar.updateBatch(events.slice(0, 2));
+   /* Update the first 2 existing events */
+   myCalendar.updateBatch(events.slice(0, 2));
 }
      @@ -340,16 +340,16 @@ function eventSearchSuccessCallback(events) 
       function eventSearchSuccessCallback(events)
 {
-   /* Delete the first 2 existing events */
-   myCalendar.removeBatch([events[0].id, events[1].id]);
+   /* Delete the first 2 existing events */
+   myCalendar.removeBatch([events[0].id, events[1].id]);
 }

    Converting Event Formats

    -

    You can make event exchange more efficient in your application by converting an event to the iCalendar format (or back) using the CalendarEvent object constructor and the convertToString() method of the CalendarItem interface.

    +

    You can make event exchange more efficient in your application by converting an event to the iCalendar format (or back) using the CalendarEvent object constructor and the convertToString() method of the CalendarItem interface.

    The conversion allows you to exchange calendar data between applications by sharing files with the .ics extension. The iCalendar format is independent of the underlying transport protocol, meaning that calendar items can be exchanged using a variety of transports, including HTTP, SMTP, and Infrared. The iCalendar format can be used to store calendar item information and exchange calendar data over the Internet.

    -

    The following example shows a sample event in the iCalendar format:

    +

    The following example shows a sample event in the iCalendar format:

     BEGIN:VCALENDAR
 BEGIN:VEVENT
@@ -366,40 +366,40 @@ END:VCALENDAR
     
      
      
    1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.
       
      With the parameter, specify the calendar type as event.
      
 
      -var calendar = tizen.calendar.getDefaultCalendar("EVENT");
+var calendar = tizen.calendar.getDefaultCalendar("EVENT");
 
      2. 
      
    2. Create a new CalendarEvent object from the iCalendar string and add it to the default calendar:
 
       try
 {
-   var ev = new tizen.CalendarEvent
-   (
-      "BEGIN:VCALENDAR\r\n" +
-      "BEGIN:VEVENT\r\n" +
-      "DTSTAMP:19970901T1300Z\r\n" +
-      "DTSTART:19970903T163000Z\r\n" +
-      "DTEND:19970903T190000Z\r\n" +
-      "SUMMARY:Tizen, Annual Employee Review\r\n" +
-      "CATEGORIES:BUSINESS,HUMAN RESOURCES\r\n" +
-      "END:VEVENT\r\n" +
-      "END:VCALENDAR", "ICALENDAR_20"
-   );
-
-   calendar.add(ev);
-   console.log('Event added with UID ' + ev.id.uid);
+   var ev = new tizen.CalendarEvent
+   (
+      "BEGIN:VCALENDAR\r\n" +
+      "BEGIN:VEVENT\r\n" +
+      "DTSTAMP:19970901T1300Z\r\n" +
+      "DTSTART:19970903T163000Z\r\n" +
+      "DTEND:19970903T190000Z\r\n" +
+      "SUMMARY:Tizen, Annual Employee Review\r\n" +
+      "CATEGORIES:BUSINESS,HUMAN RESOURCES\r\n" +
+      "END:VEVENT\r\n" +
+      "END:VCALENDAR", "ICALENDAR_20"
+   );
+
+   calendar.add(ev);
+   console.log('Event added with UID ' + ev.id.uid);
 }
 
      3. 
     
     
    To convert multiple strings and import them to a calendar, convert the strings one by one and then use the addBatch() method to add all the events at once in a batch mode.
     
    
  • To convert an event to the iCalendar format:
     
      
-     
    1. Get the default calendar and find all events which include the "Tizen" string in the Summary attribute:
+     
    2. Get the default calendar and find all events which include the "Tizen" string in the Summary attribute:
 
       var myCalendar;
 
-myCalendar = tizen.calendar.getDefaultCalendar("EVENT");
+myCalendar = tizen.calendar.getDefaultCalendar("EVENT");
 
 /* Define a filter */
-var filter = new tizen.AttributeFilter("summary", "CONTAINS", "Tizen");
+var filter = new tizen.AttributeFilter("summary", "CONTAINS", "Tizen");
 
 /* Search for the events */
 myCalendar.find(eventSearchSuccessCallback, errorCallback, filter);
@@ -408,8 +408,8 @@ myCalendar.find(eventSearchSuccessCallback, errorCallback, filter);
 
       function eventSearchSuccessCallback(events)
 {
-   /* Convert the first event */
-   var vevent = events[0].convertToString("ICALENDAR_20");
+   /* Convert the first event */
+   var vevent = events[0].convertToString("ICALENDAR_20");
 }
 
      3. 
     
    
@@ -417,40 +417,40 @@ function eventSearchSuccessCallback(events)
 
 
 
    Tasks
    
-  
+
 
    The tasks are identified using the CalendarTaskId, which is a CalendarItemId typedef.
    
-  
+
 
    Using the CalendarTask object, you can:
    
   
      
-	
    • Add tasks to a calendar one by one or in a batch mode.
      •  
+	
    • Add tasks to a calendar one by one or in a batch mode.
      • 
 	
    • Update or delete tasks one by one or in a batch mode.
      • 
 	
    • Convert tasks to the iCalendar format and back.
      • 
  
    
-  
+
 
    Adding Tasks to a Calendar
    
- 
+
 
    To add tasks to a calendar:
    
   
      
     
    1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.
       
      With the parameter, specify the calendar type as task.
      
 
      -var calendar = tizen.calendar.getDefaultCalendar("TASK");
+var calendar = tizen.calendar.getDefaultCalendar("TASK");
 
      2. 
      
    2. Create a CalendarTask object and define the task properties:
      
 
       var task = new tizen.CalendarTask
 ({
-   description:"HTML5 Introduction",
-   summary:"HTML5 Webinar",
-   startDate: new tizen.TZDate(2011, 3, 10, 10, 0),
-   dueDate: new tizen.TZDate(2011, 3, 30, 10, 0),
-   completedDate: new tizen.TZDate(2011, 3, 20, 10, 0),
-   location:"Huesca"
+   description:"HTML5 Introduction",
+   summary:"HTML5 Webinar",
+   startDate: new tizen.TZDate(2011, 3, 10, 10, 0),
+   dueDate: new tizen.TZDate(2011, 3, 30, 10, 0),
+   completedDate: new tizen.TZDate(2011, 3, 20, 10, 0),
+   location:"Huesca"
 });
 
      3. 
         
    3. To set up an alarm to remind the user about the task, create an alarm with the CalendarAlarm interface, and add the alarm to the task:
      
 
       /* Alarm is triggered with sound 30 minutes before the task start time */
-var alarm = new tizen.CalendarAlarm(new tizen.TimeDuration(30, "MINS"), "SOUND");
+var alarm = new tizen.CalendarAlarm(new tizen.TimeDuration(30, "MINS"), "SOUND");
 
 task.alarms = [alarm];
 
      4. 
@@ -459,25 +459,25 @@ task.alarms = [alarm];
 calendar.add(task); /* task.id attribute is generated */
    • - +

    Adding Tasks to a Calendar in the Batch Mode

    You can create multiple tasks simultaneously by using the addBatch() method.

    To add tasks to a calendar in the batch mode:

    1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface:

      -var calendar = tizen.calendar.getDefaultCalendar("TASK");
+var calendar = tizen.calendar.getDefaultCalendar("TASK");

    2. Define the items to be added as an array:

       var task = new tizen.CalendarTask
 ({
-   description:"HTML5 Introduction",
-   summary:"HTML5 Webinar",
-   startDate: new tizen.TZDate(2011, 3, 30, 10, 0),
-   dueDate: new tizen.TZDate(2011, 5, 30, 10, 0),
-   completedDate: new tizen.TZDate(2011, 4, 30, 10, 0),
-   location:"Huesca"
+   description:"HTML5 Introduction",
+   summary:"HTML5 Webinar",
+   startDate: new tizen.TZDate(2011, 3, 30, 10, 0),
+   dueDate: new tizen.TZDate(2011, 5, 30, 10, 0),
+   completedDate: new tizen.TZDate(2011, 4, 30, 10, 0),
+   location:"Huesca"
 });
      @@ -497,14 +497,14 @@ calendar.addBatch([task]);
    - +

    Managing a Single Task

    - +

    To manage a single task:

    1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.

      With the parameter, specify the calendar type as task.

      -var myCalendar = tizen.calendar.getDefaultCalendar("TASK");
+var myCalendar = tizen.calendar.getDefaultCalendar("TASK");

    2. Retrieve all tasks stored in the calendar by using the find() method of the Calendar object:

      @@ -516,23 +516,23 @@ myCalendar.find(taskSearchSuccessCallback);
 /* Define the event success callback */
 function taskSearchSuccessCallback(tasks)
 {
-   /* Update the first existing task */
-   tasks[0].description = "New Description";
-   myCalendar.update(tasks[0]);
+   /* Update the first existing task */
+   tasks[0].description = "New Description";
+   myCalendar.update(tasks[0]);
 
-   /* Delete the second existing task */
-   myCalendar.remove(tasks[1].id);
+   /* Delete the second existing task */
+   myCalendar.remove(tasks[1].id);
 }
    - +

    Managing Multiple Tasks in the Batch Mode

    You can manage multiple tasks simultaneously by using the applicable batch methods: updateBatch() and removeBatch().

    To manage multiple tasks in the batch mode:

    1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.

      With the parameter, specify the calendar type as task.

      -var myCalendar = tizen.calendar.getDefaultCalendar("TASK");
+var myCalendar = tizen.calendar.getDefaultCalendar("TASK");

    2. Retrieve all tasks stored in the calendar by using the find() method of the Calendar object:

      @@ -545,13 +545,13 @@ myCalendar.find(taskSearchSuccessCallback);
 
       function taskSearchSuccessCallback(tasks)
 {
-   tasks[0].description = "New Description 1";
-   tasks[1].description = "New Description 2";
+   tasks[0].description = "New Description 1";
+   tasks[1].description = "New Description 2";

    3. Use the updateBatch() method to update multiple calendar items asynchronously:

      -   /* Update the first 2 existing tasks */
-   myCalendar.updateBatch(tasks.slice(0, 2));
+   /* Update the first 2 existing tasks */
+   myCalendar.updateBatch(tasks.slice(0, 2));
 }
    @@ -559,16 +559,16 @@ function taskSearchSuccessCallback(tasks) 
     function taskSearchSuccessCallback(tasks)
 {
-   /* Delete the first 2 existing tasks */
-   myCalendar.removeBatch([tasks[0].id, tasks[1].id]);
+   /* Delete the first 2 existing tasks */
+   myCalendar.removeBatch([tasks[0].id, tasks[1].id]);
 }
    - - + +

    Converting Task Formats

    -

    You can make task exchange more efficient in your application by converting a task to the iCalendar format (or back) using the CalendarTask object constructor and the convertToString() method of the CalendarItem interface.

    +

    You can make task exchange more efficient in your application by converting a task to the iCalendar format (or back) using the CalendarTask object constructor and the convertToString() method of the CalendarItem interface.

    The conversion allows you to exchange calendar data between applications by sharing files with the .ics extension. The iCalendar format is independent of the underlying transport protocol, meaning that calendar items can be exchanged using a variety of transports, including HTTP, SMTP, and Infrared. The iCalendar format can be used to store calendar item information and exchange calendar data over the Internet.

    -

    The following example shows a sample task in the iCalendar format:

    +

    The following example shows a sample task in the iCalendar format:

     BEGIN:VCALENDAR
 BEGIN:VTODO
@@ -586,39 +586,39 @@ END:VCALENDAR
     
      
      
    1. Retrieve the default system calendar using the getDefaultCalendar() method of the CalendarManager interface.
       
      With the parameter, specify the calendar type as task.
      
 
      -var calendar = tizen.calendar.getDefaultCalendar("TASK");
+var calendar = tizen.calendar.getDefaultCalendar("TASK");
 
      2. 
      
    2. Create a new CalendarTask object from the iCalendar string and add it to the default calendar:
 
       var task = new tizen.CalendarTask
 (
-   "BEGIN:VCALENDAR\r\n" +
-   "VERSION:2.0\r\n" +
-   "BEGIN:VTODO\r\n" +
-   "DTSTAMP:TZID=CET:20110902T110000Z\r\n" +
-   "DTSTART;TZID=CET:20110906T140000Z\r\n" +
-   "DUE;TZID=CET:20110906T150000Z\r\n" +
-   "SUMMARY:Tizen, discuss the schedule\r\n" +
-   "DESCRIPTION:Find the feasible schedule\r\n" +
-   "CATEGORIES:HUMAN RESOURCES\r\n" +
-   "END:VTODO\r\n" +
-   "END:VCALENDAR", "ICALENDAR_20"
+   "BEGIN:VCALENDAR\r\n" +
+   "VERSION:2.0\r\n" +
+   "BEGIN:VTODO\r\n" +
+   "DTSTAMP:TZID=CET:20110902T110000Z\r\n" +
+   "DTSTART;TZID=CET:20110906T140000Z\r\n" +
+   "DUE;TZID=CET:20110906T150000Z\r\n" +
+   "SUMMARY:Tizen, discuss the schedule\r\n" +
+   "DESCRIPTION:Find the feasible schedule\r\n" +
+   "CATEGORIES:HUMAN RESOURCES\r\n" +
+   "END:VTODO\r\n" +
+   "END:VCALENDAR", "ICALENDAR_20"
 );
 
 calendar.add(task);
-console.log('Task added with id ' + task.id);
+console.log('Task added with id ' + task.id);
 
      3. 
     
     
    To convert multiple strings and import them to a calendar, convert the strings one by one and then use the addBatch() method to add all the tasks at once in a batch mode.
     
    
  • To convert a task to the iCalendar format:
     
      
-     
    1. Get the default calendar and find all calendar items which include the "Tizen" string in the Summary attribute:
+     
    2. Get the default calendar and find all calendar items which include the "Tizen" string in the Summary attribute:
 
       var myCalendar;
 
-myCalendar = tizen.calendar.getDefaultCalendar("TASK");
+myCalendar = tizen.calendar.getDefaultCalendar("TASK");
 
 /* Define a filter */
-var filter = new tizen.AttributeFilter("summary", "CONTAINS", "Tizen");
+var filter = new tizen.AttributeFilter("summary", "CONTAINS", "Tizen");
 
 /* Search for the tasks */
 myCalendar.find(taskSearchSuccessCallback, null, filter);
@@ -627,8 +627,8 @@ myCalendar.find(taskSearchSuccessCallback, null, filter);
 
       function taskSearchSuccessCallback(tasks)
 {
-   /* Convert the first task */
-   var vtodo = tasks[0].convertToString("ICALENDAR_20");
+   /* Convert the first task */
+   var vtodo = tasks[0].convertToString("ICALENDAR_20");
 }
 
      3. 
     
     
    To export and convert multiple tasks from a calendar, find the required tasks using the find() method with an applicable filter, and then convert the found tasks one by one.
     
    • 
@@ -637,7 +637,7 @@ function taskSearchSuccessCallback(tasks)
   
    Receiving Notifications on Calendar Changes
    
 
    You can keep the calendar in your application synchronized with user-specific calendars by receiving notifications in your application when calendar items are added, updated, or deleted. Every change made to the calendar database triggers an event for which you can define a notification. For batch mode operations, each operation generates only a single event. A recurring event is treated as one event.
    
 
-
    The addChangeListener() method of the Calendar interface registers an event listener, which starts asynchronously once the addChangeListener() method returns the subscription identifier for the listener. You can use the CalendarChangeCallback interface to define listener event handlers for receiving the notifications.
     
+
    The addChangeListener() method of the Calendar interface registers an event listener, which starts asynchronously once the addChangeListener() method returns the subscription identifier for the listener. You can use the CalendarChangeCallback interface to define listener event handlers for receiving the notifications.
    
 
   
    To receive notifications when calendar items are added, updated, or removed:
    
   
      
@@ -653,23 +653,23 @@ var calendar;
 
       var watcher =
 {
-   /* When new items are added */
-   onitemsadded: function(items)
-   {
-      console.log(items.length + " items were added");
-   },
-
-   /* When items are updated */
-   onitemsupdated: function(items)
-   {
-      console.log(items.length + " items were updated");
-   },
-
-   /* When items are deleted */
-   onitemsremoved: function(ids)
-   {
-      console.log(ids.length + " items were removed");
-   }
+   /* When new items are added */
+   onitemsadded: function(items)
+   {
+      console.log(items.length + " items were added");
+   },
+
+   /* When items are updated */
+   onitemsupdated: function(items)
+   {
+      console.log(items.length + " items were updated");
+   },
+
+   /* When items are deleted */
+   onitemsremoved: function(ids)
+   {
+      console.log(ids.length + " items were removed");
+   }
 };
 
      
    
    1. Register the listener to use the defined event handlers:
      
@@ -680,10 +680,10 @@ watcherId = calendar.addChangeListener(watcher);
 
       function cancelWatch()
 {
-   calendar.removeChangeListener(watcherId);
+   calendar.removeChangeListener(watcherId);
 }
 
      2. 
-  
     
+  
 
 
 
diff --git a/org.tizen.guides/html/web/personal/call_history_w.htm b/org.tizen.guides/html/web/personal/call_history_w.htm
index 16aad31..b7f802f 100644
--- a/org.tizen.guides/html/web/personal/call_history_w.htm
+++ b/org.tizen.guides/html/web/personal/call_history_w.htm
@@ -44,35 +44,35 @@
 
   
    Call History
    
 
- 
+
   
    You can access information about various telephony services for circuit-switched telephony and voice over IP (VoIP). You can browse the call history of a device, remove call history entries, and monitor changes.
    
-  
+
 
    This feature is supported in mobile applications only.
    
-  
+
   
    The main features of the Call History API include:
    
   
- 
-
    For a practical example of managing call logs in your application, see the Call Log sample task.
     
+
+
    For a practical example of managing call logs in your application, see the Call Log sample task.
    
 
 
    Prerequisites
    
 
    To use the Call History API, the application has to request permission by adding the following privileges to the config.xml file:
    
 
    -<tizen:privilege name="http://tizen.org/privilege/callhistory.read"/>
-<tizen:privilege name="http://tizen.org/privilege/callhistory.write"/>
+<tizen:privilege name="http://tizen.org/privilege/callhistory.read"/>
+<tizen:privilege name="http://tizen.org/privilege/callhistory.write"/>
 
    
 
 
   
    Searching for Call History Items
    
-			
-  
    Learning how to retrieve call history items using different parameters allows you to view specific items in a specific order, making call history monitoring easy and convenient.
     
-  
       
+
+  
      Learning how to retrieve call history items using different parameters allows you to view specific items in a specific order, making call history monitoring easy and convenient.
      
+  
        
    
      1. To retrieve call history items, use the find(successCallback, errorCallback, filter, sortMode, limit, offset) method of the CallHistory interface. 
        This method is asynchronous, and the result of the query is an array of CallHistoryEntry objects.
        
 
         tizen.callhistory.find(onSuccess, onError, ifilter, sortMode, 20, 10);
@@ -81,72 +81,72 @@ tizen.callhistory.find(onSuccess, onError, ifilter, sortMode, 20, 10);
 
         function onSuccess(results)
 {
-   console.log(results.length + " call history item(s) found!");
-   for (var i = 0; i < results.length; i++)
-   {
-      console.log(i + ". " + results[i].toString());
-      /* Process the CallHistoryEntry */
-   }
+   console.log(results.length + " call history item(s) found!");
+   for (var i = 0; i < results.length; i++)
+   {
+      console.log(i + ". " + results[i].toString());
+      /* Process the CallHistoryEntry */
+   }
 }
 
        2. 
    
      2.  
        Use the filter parameter of the find() method to define a filter for the query result set. A filter with the CallHistoryEntry attributes is used to limit the results of the call history search.
        
 
        When searching for call history items, you can create attribute filters, attribute range filters, and composite filters based on specific filter attributes.
        
-   
        You can define various filters:
         
-    
           
+   
          You can define various filters:
          
+    
            
      
          • The AttributeFilter type is used to search based on a single CallHistoryEntry attribute.
             
            For example, the following filters define that only cellular calls or calls where the remote party has the telephone number 123456789 are included in the query results:
            
 
             /* First filter example */
-var filter = new tizen.AttributeFilter("type", "EXACTLY", "TEL");
+var filter = new tizen.AttributeFilter("type", "EXACTLY", "TEL");
 
 /* Second filter example */
-var numberFilter = new tizen.AttributeFilter("remoteParties.remoteParty",
-                                             "EXACTLY", "123456789");
+var numberFilter = new tizen.AttributeFilter("remoteParties.remoteParty",
+                                             "EXACTLY", "123456789");
 
            • 
      
          •  
             The CompositeFilter type represents a set of filters. The UNION type composite filter matches any object that is matched by any of its filters; the INTERSECTION type composite filter matches all objects that are matched by all of its filters.
             
            For example, the following code snippet defines a set of filters that include in the query results only the video calls where the remote party has the telephone number 123456789 and the call has started during the year 2009 or 2011:
            
 
             /* Create the ranges for the time filter */
-var y2009Filter = new tizen.AttributeRangeFilter("startTime",
-                                                 new Date(2009, 0, 1),
-                                                 new Date(2010, 0, 1));
-var y2011Filter = new tizen.AttributeRangeFilter("startTime",
-                                                 new Date(2011, 0, 1),
-                                                 new Date(2012, 0, 1));
+var y2009Filter = new tizen.AttributeRangeFilter("startTime",
+                                                 new Date(2009, 0, 1),
+                                                 new Date(2010, 0, 1));
+var y2011Filter = new tizen.AttributeRangeFilter("startTime",
+                                                 new Date(2011, 0, 1),
+                                                 new Date(2012, 0, 1));
 
 /* Create a time filter */
-var dataFilter = new tizen.CompositeFilter("UNION",
-                                           [y2009Filter, y2011Filter]);
+var dataFilter = new tizen.CompositeFilter("UNION",
+                                           [y2009Filter, y2011Filter]);
 
 /* Create a video call filter */
-var tfilter = new tizen.AttributeFilter("features", "EXACTLY", "VIDEOCALL");
+var tfilter = new tizen.AttributeFilter("features", "EXACTLY", "VIDEOCALL");
 
 /* Combine the filters into a set */
-var ifilter = new tizen.CompositeFilter("INTERSECTION",
-                                        [numberFilter, dataFilter, tfilter]);
+var ifilter = new tizen.CompositeFilter("INTERSECTION",
+                                        [numberFilter, dataFilter, tfilter]);
 
            • 
-    
            
+    
         
        3. 
    
      3.  
        Use the sortMode parameter to order the query result set. If the parameter is undefined or set to null, the results are sorted by default in a descending order.
         
        In the following code snippet, the found call history items are sorted according to the start time, in descending order:
        
 
        -var sortMode = new tizen.SortMode("startTime", "DESC");
+var sortMode = new tizen.SortMode("startTime", "DESC");
 
        4. 
-   
      4.  
        Use the limit and offset parameters of the find() method to specify the starting point and upper limit of the results that are returned.
         
        The limit parameter specifies the maximum number of matching results that are returned (the value 0 makes the limit infinite), while the offset parameter skips that many matching results that are to be returned (the value 0 means nothing is skipped).
         
        For example, if your search results consist of 100 matching results and you have specified an offset of 10 and a limit of 20, you get the objects from 10-29. The matching results from 0-9 are skipped due to the offset, and the 20 results starting from the first result after the offset are returned.
         
        5.  
-  
       
+   
    1.  
      Use the limit and offset parameters of the find() method to specify the starting point and upper limit of the results that are returned.
       
      The limit parameter specifies the maximum number of matching results that are returned (the value 0 makes the limit infinite), while the offset parameter skips that many matching results that are to be returned (the value 0 means nothing is skipped).
       
      For example, if your search results consist of 100 matching results and you have specified an offset of 10 and a limit of 20, you get the objects from 10-29. The matching results from 0-9 are skipped due to the offset, and the 20 results starting from the first result after the offset are returned.
       
      2. 
+  
    
+
 
-  
   
    Removing Call History Items
    
-			
-  
    Learning how to remove call history items allows you to keep the call history list organized and save storage space on the device:
     
-  
       
+
+  
      Learning how to remove call history items allows you to keep the call history list organized and save storage space on the device:
      
+  
        
    
      1.  Use the remove() method of the CallHistory interface to remove a specific item from the call history. First, search for the entry to be removed with the find() method, and then handle the removal in the event handler that is called when the find() method is successful.
        
 
         /* Remove the found call history item */
 function onSuccess(results)
 {
-   if (results.length > 0)
-      tizen.callhistory.remove(results[0]);
+   if (results.length > 0)
+      tizen.callhistory.remove(results[0]);
 }
 
-var numberFilter = new tizen.AttributeFilter("remoteParties.remoteParty",
-                                             "EXACTLY", "123456789");
+var numberFilter = new tizen.AttributeFilter("remoteParties.remoteParty",
+                                             "EXACTLY", "123456789");
 /* Search for the item to be removed */
 tizen.callhistory.find(onSuccess, onError, numberFilter, null, 1);
 
        2. 
@@ -155,60 +155,60 @@ tizen.callhistory.find(onSuccess, onError, numberFilter, null, 1);
 /* Define success callback */
 function onSuccess(results)
 {
-   tizen.callhistory.removeBatch(results);
+   tizen.callhistory.removeBatch(results);
 }
 
-var numberFilter = new tizen.AttributeFilter("remoteParties.remoteParty",
-                                             "EXACTLY", "123456789");
+var numberFilter = new tizen.AttributeFilter("remoteParties.remoteParty",
+                                             "EXACTLY", "123456789");
 tizen.callhistory.find(onSuccess, onError, numberFilter);
-
    +

  • To remove all call history items, use the removeAll() method:

     tizen.callhistory.removeAll();
    • - - - - + + + +

    Monitoring the Call History

    - -

    Learning how to register change listeners allows you to synchronize the view of your application to changes in the call history database.

    -
      + +

      Learning how to register change listeners allows you to synchronize the view of your application to changes in the call history database.

      +

      1. Define the onadded event handler of the CallHistoryChangeCallback listener interface, which tracks all new incoming and outgoing calls that are added to the call history.

         var onHistoryChange =
 {
-   onadded: function(newItems)
-   {
-      for (var i in newItems)
-      {
-         console.log("Item " + i + " is newly added. Its startTime: "
-                     + newItems[i].startTime);
-      }
-   },
+   onadded: function(newItems)
+   {
+      for (var i in newItems)
+      {
+         console.log("Item " + i + " is newly added. Its startTime: "
+                     + newItems[i].startTime);
+      }
+   },

      2. Define the onchanged event handler, which tracks all changes in the call history.

        The event handler receives as an argument an array of CallHistoryEntry instances, which represent the changed items in the call history.

        -   onchanged: function(changedItems)
-   {
-      for (var i in changedItems)
-      {
-         console.log("Item " + i + " is updated. Its direction: "
-                     + changedItems[i].direction);
-      }
-   },
+   onchanged: function(changedItems)
+   {
+      for (var i in changedItems)
+      {
+         console.log("Item " + i + " is updated. Its direction: "
+                     + changedItems[i].direction);
+      }
+   },

      3. Define the onremoved event handler, which tracks all items that are removed from the call history:

        -   onremoved: function(removedItems)
-   {
-      for (var i in removedItems)
-      {
-         console.log("Item " + i + " is removed. The removed item's UID: "
-                     + removedItems[i]);
-      }
-   }
+   onremoved: function(removedItems)
+   {
+      for (var i in removedItems)
+      {
+         console.log("Item " + i + " is removed. The removed item's UID: "
+                     + removedItems[i]);
+      }
+   }
 };
        4. diff --git a/org.tizen.guides/html/web/personal/contacts_w.htm b/org.tizen.guides/html/web/personal/contacts_w.htm index 5f431f1..b3e81cf 100644 --- a/org.tizen.guides/html/web/personal/contacts_w.htm +++ b/org.tizen.guides/html/web/personal/contacts_w.htm @@ -74,19 +74,19 @@

        Tizen enables you to manage the contacts and persons listed in your address books. A Contact object is always associated with a specific address book. A Person object is an aggregation of one or more contacts associated with the same person.

        - +

        This feature is supported in mobile applications only.

        - +

        The main features of the Contact API include:

          -
        • Address book management +
        • Address book management

          You can create a new address book, or access the device address books to access existing contacts.

          • -
        • Contact management +
        • Contact management

          You can add and manage a single contact at a time using synchronous operations.

          -

          You can also keep the address book in your application synchronized with an external contact manager by receiving notifications in your application when contact information changes. Every change made to the address book triggers an event for which you can define a notification.

          +

          You can also keep the address book in your application synchronized with an external contact manager by receiving notifications in your application when contact information changes. Every change made to the address book triggers an event for which you can define a notification.

          • -
        • Group and multiple contact management +
        • Group and multiple contact management

          You can manage contact groups, including getting, updating, and deleting them, using the applicable methods of the AddressBook interface.

          You can also create and manage multiple contacts simultaneously using the batch mode. The batch mode provides faster, optimized processing of multiple contacts.

          @@ -98,20 +98,20 @@

          If you want to receive notifications for batch mode operations, note that each requested batch operation generates only a single event.

          • -
        • Person management +
        • Person management

          You can manage persons using the applicable methods of the ContactManager interface.

          Persons are automatically added or modified when contacts are added to or unlinked from existing persons. You cannot add persons directly.

          -
          • -
        • vCard format conversions -

          You can convert the contacts to vCard format or back to import and export contacts.

          +
          • +
        • vCard format conversions +

          You can convert the contacts to vCard format or back to import and export contacts.

          The vCard (RFC 2426) file format (.vcf or .vcard) is a standard for electronic business cards, which contain contact information, such as name, address, phone numbers, email addresses, URLs, logos, photographs, and audio clips.

          The Contact API supports vCard version 3.0.

        Prerequisites

        To use the Contact API, the application has to request permission by adding the following privileges to the config.xml file:

        -<tizen:privilege name="http://tizen.org/privilege/contact.read"/>
-<tizen:privilege name="http://tizen.org/privilege/contact.write"/>
+<tizen:privilege name="http://tizen.org/privilege/contact.read"/>
+<tizen:privilege name="http://tizen.org/privilege/contact.write"/>

        Creating an Address Book

        @@ -120,28 +120,28 @@ Note The created address book is associated with a specified account. Therefore, you must retrieve the account before creating a new address book. - +

        To create a new address book:

        -
          +
          1. Declare a variable to store the created address book: 
             var myAddressBook = null;
          2. Define a success callback for the getAccounts() method. The callback receives a list of Account objects. Use the first account ID to construct a new AddressBook object. - +

            Add the new address book to the system using the addAddressBook() method of the ContactManager interface:

             function getAccountsSuccess(accounts)
 {
-   var account = accounts[0];
-   if (account)
-   {
-      /* New address book can be created and added */
-      myAddressBook = new tizen.AddressBook(account.id, "remote address book");
-      tizen.contact.addAddressBook(myAddressBook);
-      console.log("New address book created with ID=" + myAddressBook.id);
-   }
+   var account = accounts[0];
+   if (account)
+   {
+      /* New address book can be created and added */
+      myAddressBook = new tizen.AddressBook(account.id, "remote address book");
+      tizen.contact.addAddressBook(myAddressBook);
+      console.log("New address book created with ID=" + myAddressBook.id);
+   }
 }
          3. To retrieve available accounts, use the getAccounts() method. The following method call invokes the getAccountsSuccess event handler defined above. @@ -166,11 +166,11 @@ var addressBook; function addressBooksCB(addressBooks) { -   if (addressBooks.length > 0) -   { -      addressBook = addressBooks[0]; -      console.log("The addressbook name is " + addressBook.name); -   } + if (addressBooks.length > 0) + { + addressBook = addressBooks[0]; + console.log("The addressbook name is " + addressBook.name); + } } /* Get the list of available address books */ @@ -180,7 +180,7 @@ tizen.contact.getAddressBooks(addressBooksCB);
            4. - +

            Adding a Contact

            You can add a contact using the applicable methods of the AddressBook interface.

            To add a contact to an address book:

            @@ -193,8 +193,8 @@ var addressbook = tizen.contact.getDefaultAddressBook(); 
             var contact = new tizen.Contact
 ({
-   name: new tizen.ContactName({firstName: "Jeffrey", lastName: "Hyman"}),
-   emails: [new tizen.ContactEmailAddress("user@example.com")]
+   name: new tizen.ContactName({firstName: "Jeffrey", lastName: "Hyman"}),
+   emails: [new tizen.ContactEmailAddress("user@example.com")]
 });

          4. Add the Contact object to the default address book with the add() method of the AddressBook interface:

            @@ -202,9 +202,9 @@ var contact = new tizen.Contact addressbook.add(contact);
          - +

          Managing a Contact

          -

          You can manage a contact by using the applicable methods of the AddressBook interface. When managing a single contact at a time, the operations are handled in a synchronous mode.

          +

          You can manage a contact by using the applicable methods of the AddressBook interface. When managing a single contact at a time, the operations are handled in a synchronous mode.

          To manage a contact in your address book:

          1. To retrieve a single contact, use the get() method of the AddressBook interface with the ContactID as a parameter: @@ -214,9 +214,9 @@ addressbook.add(contact); var contactRef; try { -   /* Retrieve the contact corresponding to the given reference */ -   var addressBook = tizen.contact.getAddressBook(contactRef.addressBookId); -   var contact = addressBook.get(contactRef.contactId); + /* Retrieve the contact corresponding to the given reference */ + var addressBook = tizen.contact.getAddressBook(contactRef.addressBookId); + var contact = addressBook.get(contactRef.contactId); }
          2. To manage a single contact: @@ -227,38 +227,38 @@ var addressbook = tizen.contact.getDefaultAddressBook();

          3. Retrieve contacts stored in the address book by using the find() method of the AddressBook interface:

            -var filter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris");
-var sortMode = new tizen.SortMode("name.lastName", "ASC");
+var filter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris");
+var sortMode = new tizen.SortMode("name.lastName", "ASC");
 
 try
 {
-   addressbook.find(contactsFoundCB, null, filter, sortMode);
+   addressbook.find(contactsFoundCB, null, filter, sortMode);
 }
            -

            When searching for contacts, you can create attribute filters, attribute range filters, and composite filters based on specific filter attributes. You can also sort the search results. In this example, contacts whose first name contains "Chris" are retrieved and sorted in the ascending order based on their last name. The filter includes the standard English characters in the uppercase and lowercase. The entire list consists of ASCII characters from 32 to 126, and from 160 to 255.

            +

            When searching for contacts, you can create attribute filters, attribute range filters, and composite filters based on specific filter attributes. You can also sort the search results. In this example, contacts whose first name contains "Chris" are retrieved and sorted in the ascending order based on their last name. The filter includes the standard English characters in the uppercase and lowercase. The entire list consists of ASCII characters from 32 to 126, and from 160 to 255.

            The contacts that match the filter are passed as an array to the registered success event handler in the selected sorting order.

          4. Update or delete the found contact inside the contactsFoundCB event handler.

            In this example, the first name of the first contact is changed and the contact is updated in the address book using the update() method. The second contact is deleted using the remove() method.

             /* Define the event success callback */
 function contactsFoundCB(contacts)
 {
-   contacts[0].name.firstName = "Christopher";
-   try
-   {
-      /* Update the first found contact */
-      addressbook.update(contacts[0]);
-
-      /* Delete the second found contact */
-      addressbook.remove(contacts[1].id);
-   }
+   contacts[0].name.firstName = "Christopher";
+   try
+   {
+      /* Update the first found contact */
+      addressbook.update(contacts[0]);
+
+      /* Delete the second found contact */
+      addressbook.remove(contacts[1].id);
+   }
 }
        - +

        Receiving Notifications on Contact Changes

        -

        You can keep the address book in your application synchronized with the external contact manager by receiving notifications in your application when contact information is added, updated, or deleted.

        +

        You can keep the address book in your application synchronized with the external contact manager by receiving notifications in your application when contact information is added, updated, or deleted.

        The addChangeListener() method of the AddressBook interface registers an event listener, which starts asynchronously once the addChangeListener() method returns the subscription identifier for the listener. You can use the AddressBookChangeCallback interface to define listener event handlers for receiving the notifications.

        To receive notifications when contact information changes:

        @@ -275,23 +275,23 @@ var addressbook; 
         var watcher =
 {
-   /* When contacts are added */
-   oncontactsadded: function(contacts)
-   {
-      console.log(contacts.length + " contacts were added");
-   },
-
-   /* When contacts are updated */
-   oncontactsupdated: function(contacts)
-   {
-      console.log(contacts.length + " contacts were updated");
-   },
-
-   /* When contacts are deleted */
-   oncontactsremoved: function(ids)
-   {
-      console.log(ids.length + " contacts were deleted");
-   }
+   /* When contacts are added */
+   oncontactsadded: function(contacts)
+   {
+      console.log(contacts.length + " contacts were added");
+   },
+
+   /* When contacts are updated */
+   oncontactsupdated: function(contacts)
+   {
+      console.log(contacts.length + " contacts were updated");
+   },
+
+   /* When contacts are deleted */
+   oncontactsremoved: function(ids)
+   {
+      console.log(ids.length + " contacts were deleted");
+   }
 };

      4. Register the listener to use the defined event handlers:

        @@ -309,10 +309,10 @@ watcherId = addressbook.addChangeListener(watcher); addressbook.removeChangeListener(watcherId);
      - - + +

      Adding Multiple Contacts in the Batch Mode

      -

      You can create multiple contacts simultaneously using the addBatch() method.

      +

      You can create multiple contacts simultaneously using the addBatch() method.

      To add multiple contacts to an address book in the batch mode:

      1. Retrieve the default system address book using the getDefaultAddressBook() method of the ContactManager interface:

        @@ -323,14 +323,14 @@ addressbook = tizen.contact.getDefaultAddressBook(); 
         var c1 = new tizen.Contact(
 {
-   name: new tizen.ContactName({firstName:"Jeffrey", lastName:"Hyman"}),
-   emails: [new tizen.ContactEmailAddress("user1@example.com")]
+   name: new tizen.ContactName({firstName:"Jeffrey", lastName:"Hyman"}),
+   emails: [new tizen.ContactEmailAddress("user1@example.com")]
 });
 
 var c2 = new tizen.Contact(
 {
-   name: new tizen.ContactName({firstName:"Elton", lastName:"John"}),
-   emails: [new tizen.ContactEmailAddress("user2@example.com")]
+   name: new tizen.ContactName({firstName:"Elton", lastName:"John"}),
+   emails: [new tizen.ContactEmailAddress("user2@example.com")]
 });

      2. Use the addBatch() method of the AddressBook interface to add the contacts in the array to the address book:

        @@ -344,7 +344,7 @@ addressbook.addBatch([c1, c2]);
      - +

      Managing Multiple Contacts in the Batch Mode

      You can manage multiple contacts simultaneously using the applicable batch methods: updateBatch() and removeBatch().

      To manage multiple contacts in your address books in the batch mode:

      @@ -355,15 +355,15 @@ var addressbook = tizen.contact.getDefaultAddressBook();

    1. Retrieve contacts stored in the address book by using the find() method of the AddressBook interface:

      -var filter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris"};
-var sortMode = new tizen.SortMode("name.lastName", "ASC");
+var filter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris"};
+var sortMode = new tizen.SortMode("name.lastName", "ASC");
 
 try
 {
-   addressbook.find(contactsFoundCB, null, filter, sortMode);
+   addressbook.find(contactsFoundCB, null, filter, sortMode);
 }
      -

      When searching for contacts, you can create attribute filters, attribute range filters, and composite filters based on specific filter attributes. You can also sort the search results. In this example, contacts whose first name contains "Chris" are retrieved and sorted in the ascending order based on their last name.

      +

      When searching for contacts, you can create attribute filters, attribute range filters, and composite filters based on specific filter attributes. You can also sort the search results. In this example, contacts whose first name contains "Chris" are retrieved and sorted in the ascending order based on their last name.

    2. To update contacts:
        @@ -371,16 +371,16 @@ try 
         function contactsFoundCB(contacts)
 {
-   /* Change the first names of all the found contacts */
-   for (var i = 0; i < contacts.length; i++)
-   {
-      contacts[i].name.firstName = "Christopher";
-   }
+   /* Change the first names of all the found contacts */
+   for (var i = 0; i < contacts.length; i++)
+   {
+      contacts[i].name.firstName = "Christopher";
+   }

      1. Use the updateBatch() method to update multiple contacts asynchronously:

        -   /* Update all found contacts */
-   addressbook.updateBatch(contacts);
+   /* Update all found contacts */
+   addressbook.updateBatch(contacts);
 }
      3. @@ -388,8 +388,8 @@ function contactsFoundCB(contacts) 
       function contactsFoundCB(contacts)
 {
-   /* Delete the first 2 found contacts */
-   addressbook.removeBatch([contacts[0].id, contacts[1].id]);
+   /* Delete the first 2 found contacts */
+   addressbook.removeBatch([contacts[0].id, contacts[1].id]);
 }
    @@ -398,9 +398,9 @@ function contactsFoundCB(contacts) Note The updateBatch() and removeBatch() methods are asynchronous. Make sure you provide success and error callbacks with them. - +

    Managing Contact Groups

    - +

    To create engaging applications with various contact features, learn to manage contact groups:

    1. Retrieve the default system address book using the getDefaultAddressBook() method of the ContactManager interface:

      @@ -412,9 +412,9 @@ var addressbook = tizen.contact.getDefaultAddressBook(); var group; try { -   group = new tizen.ContactGroup("Company"); -   addressbook.addGroup(group) -   console.log("Group added with ID " + group.id); + group = new tizen.ContactGroup("Company"); + addressbook.addGroup(group) + console.log("Group added with ID " + group.id); }
      2. @@ -426,7 +426,7 @@ try var groups; try { -   groups = addressbook.getGroups(); + groups = addressbook.getGroups(); }

    2. To change the name of the group, assign the name property a new value and use the updateGroup() @@ -434,9 +434,9 @@ try 

       try
 {
-   groups[0].name = "Friends";
-   addressbook.updateGroup(groups[0]);
-   console.log("First group updated");
+   groups[0].name = "Friends";
+   addressbook.updateGroup(groups[0]);
+   console.log("First group updated");
 }

    3. To retrieve a specific group, use the getGroup() method of @@ -444,7 +444,7 @@ try 

       try
 {
-   group = addressbook.getGroup(group.id);
+   group = addressbook.getGroup(group.id);
 }

    4. To remove a group from the address book, use the removeGroup() method of @@ -452,15 +452,15 @@ try 

       try
 {
-   addressbook.removeGroup(group.id);
-   console.log("Group was removed");
+   addressbook.removeGroup(group.id);
+   console.log("Group was removed");
 }
    - +

    Managing Persons

    - -

    You can manage persons, including searching, updating, and deleting, using the applicable methods of the ContactManager interface.

    + +

    You can manage persons, including searching, updating, and deleting, using the applicable methods of the ContactManager interface.

    To manage persons in your contact database:

    - +

    Importing Contacts

    - +

    To create engaging applications with various contacts features, import contacts with the help of the vCard format:

      @@ -578,35 +578,35 @@ var contact = null; try { -   contact = new tizen.Contact("BEGIN:VCARD\n"+ -                               "VERSION:3.0\n"+ -                               "N:Gump;Forrest\n"+ -                               "FN:Forrest Gump\n"+ -                               "ORG:Bubba Gump Shrimp Co.\n"+ -                               "TITLE:Shrimp Man\n"+ -                               "TEL;WORK:(111) 555-1212\n"+ -                               "TEL;HOME:(404) 555-1212\n"+ -                               "EMAIL;WORK;PREF:forrestgump@example.com\n"+ -                               "END:VCARD"); - -   addressbook.add(contact); -   console.log("Contact was added with ID " + contact.id); + contact = new tizen.Contact("BEGIN:VCARD\n"+ + "VERSION:3.0\n"+ + "N:Gump;Forrest\n"+ + "FN:Forrest Gump\n"+ + "ORG:Bubba Gump Shrimp Co.\n"+ + "TITLE:Shrimp Man\n"+ + "TEL;WORK:(111) 555-1212\n"+ + "TEL;HOME:(404) 555-1212\n"+ + "EMAIL;WORK;PREF:forrestgump@example.com\n"+ + "END:VCARD"); + + addressbook.add(contact); + console.log("Contact was added with ID " + contact.id); }

    To convert multiple strings and import them to an address book, convert the strings one by one and then use the addBatch() method of the AddressBook interface to add all the contacts at once in the batch mode.

    - +

    Exporting Contacts

    - +

    To create engaging applications with various contacts features, export contacts with the help of the vCard format:

      -

    1. Retrieve the default system address book using the getDefaultAddressBook() method of the ContactManager interface and find all contacts with "Chris" in the first name:

      +

    2. Retrieve the default system address book using the getDefaultAddressBook() method of the ContactManager interface and find all contacts with "Chris" in the first name:

       var addressbook;
 
 var addressbook = tizen.contact.getDefaultAddressBook();
 
 /* Define a filter */
-var filter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris");
+var filter = new tizen.AttributeFilter("name.firstName", "CONTAINS", "Chris");
 
 /* Search for the contacts */
 addressbook.find(contactsFoundCB, errorCB, filter);
@@ -615,12 +615,12 @@ addressbook.find(contactsFoundCB, errorCB, filter);
 
       function contactsFoundCB(contacts)
 {
-   /* Convert the first contact */
-   var vcard = contacts[0].convertToString("VCARD_30");
+   /* Convert the first contact */
+   var vcard = contacts[0].convertToString("VCARD_30");
 }
    - + diff --git a/org.tizen.guides/html/web/personal/personal_cover_w.htm b/org.tizen.guides/html/web/personal/personal_cover_w.htm index 81a5c68..f095088 100644 --- a/org.tizen.guides/html/web/personal/personal_cover_w.htm +++ b/org.tizen.guides/html/web/personal/personal_cover_w.htm @@ -5,13 +5,13 @@ - + - Personal Data + Personal Data @@ -26,7 +26,7 @@
  • Tizen 2.4 and Higher for Mobile
    • - +

    Personal Data

    @@ -60,7 +60,7 @@

    You can synchronize device data, such as contacts and calendar events, using the OMA DS server.

    - +
    diff --git a/org.tizen.guides/html/web/personal/sync_w.htm b/org.tizen.guides/html/web/personal/sync_w.htm index 90986d7..ed8f836 100644 --- a/org.tizen.guides/html/web/personal/sync_w.htm +++ b/org.tizen.guides/html/web/personal/sync_w.htm @@ -28,7 +28,7 @@

    Related Info

    - +

    Data Access Control

    With the key manager, you can control various security aspects of your application:

    @@ -84,18 +84,18 @@ -

    Figure: Key manager process

    +

    Figure: Key manager process

    Key manager process

    Saving Data

    To save data in a repository:

    -
      +

      1. Save the data using the saveData() method:

        -var data_name = "data1", raw_data = "my data";
+var data_name = "data1", raw_data = "my data";
 
 tizen.keymanager.saveData(data_name, raw_data, null, onSave);
        2. @@ -106,17 +106,17 @@ tizen.keymanager.saveData(data_name, raw_data, null, onSave); 
         function onPermissionSet()
 {
-   console.log("Successfully set permission");
+   console.log("Successfully set permission");
 }
 
 function onSave()
 {
-   /*
-      Dictionary does not require a package ID because an
-      application can only set permission for data which it saved
-   */
-   tizen.keymanager.setPermission({"name": data_name}, "9PdoiICQ4c",
-                                  "READ_REMOVE", onPermissionSet);
+   /*
+      Dictionary does not require a package ID because an
+      application can only set permission for data which it saved
+   */
+   tizen.keymanager.setPermission({"name": data_name}, "9PdoiICQ4c",
+                                  "READ_REMOVE", onPermissionSet);
 }
        @@ -130,16 +130,16 @@ function onSave()

        • Retrieve data which your application has added:

          -var data_name = "data1", raw_data = "my data";
+var data_name = "data1", raw_data = "my data";
 
 function onSave()
 {
-   /*
-      Dictionary does not require a package ID because the
-      application calling getData() saved "data1"
-   */
-   var app_data = tizen.keymanager.getData({"name": data_name});
-   console.log("App data: " + app_data + " was retrieved");
+   /*
+      Dictionary does not require a package ID because the
+      application calling getData() saved "data1"
+   */
+   var app_data = tizen.keymanager.getData({"name": data_name});
+   console.log("App data: " + app_data + " was retrieved");
 }
 
 tizen.keymanager.saveData(data_name, raw_data, null, onSave);
@@ -154,12 +154,12 @@ var aliases = tizen.keymanager.getDataAliasList();
 
 if (aliases.length != 0)
 {
-   /*
-      Assuming that the application calling getData()
-      has permission to read aliases[0]
-   */
-   var app_data = tizen.keymanager.getData(aliases[0]);
-   console.log("App data: " + app_data + " was retrieved");
+   /*
+      Assuming that the application calling getData()
+      has permission to read aliases[0]
+   */
+   var app_data = tizen.keymanager.getData(aliases[0]);
+   console.log("App data: " + app_data + " was retrieved");
 }
          • @@ -173,41 +173,41 @@ if (aliases.length != 0)

        • Remove data which your application has added:

          -var data_name = "data1", raw_data = "my data";
+var data_name = "data1", raw_data = "my data";
 
 function onSave()
 {
-   /* Do something */
+   /* Do something */
 
-   /*
-      Dictionary does not require a package ID because the
-      application calling removeData() saved "data1"
-   */
-   tizen.keymanager.removeData({"name": data_name});
+   /*
+      Dictionary does not require a package ID because the
+      application calling removeData() saved "data1"
+   */
+   tizen.keymanager.removeData({"name": data_name});
 }
 
 tizen.keymanager.saveData(data_name, raw_data, null, onSave);
          • - +

        • Remove data which another application has saved, and granted permission for you to remove.

          The following example assumes that the application that created aliases[0] also gave your application permission to remove it:

          - + 
           var aliases = tizen.keymanager.getDataAliasList();
 
 if (aliases.length != 0)
 {
-   /*
-      Assuming that the application calling removeData()
-      has permission to remove aliases[0]
-   */
-   var app_data = tizen.keymanager.removeData(aliases[0]);
+   /*
+      Assuming that the application calling removeData()
+      has permission to remove aliases[0]
+   */
+   var app_data = tizen.keymanager.removeData(aliases[0]);
 }
      - + diff --git a/org.tizen.guides/html/web/security/security_cover_w.htm b/org.tizen.guides/html/web/security/security_cover_w.htm index b6c3cda..3fae815 100644 --- a/org.tizen.guides/html/web/security/security_cover_w.htm +++ b/org.tizen.guides/html/web/security/security_cover_w.htm @@ -5,13 +5,13 @@ - + - Security + Security @@ -28,7 +28,7 @@
    1. Tizen 3.0 and Higher for TV
      2. - +

      Security

      @@ -41,7 +41,7 @@

      You can provide a secure repository for keys, certificates, and sensitive data related to users and their password-protected applications. You can also use secure cryptographic operations for non-exportable keys without revealing the key values to clients.

      - +
      diff --git a/org.tizen.guides/html/web/sensors/device_sensors_w.htm b/org.tizen.guides/html/web/sensors/device_sensors_w.htm index 14d5e5e..9f0cfac 100644 --- a/org.tizen.guides/html/web/sensors/device_sensors_w.htm +++ b/org.tizen.guides/html/web/sensors/device_sensors_w.htm @@ -42,7 +42,7 @@
    2. Metal Detector Sample Description
    3. Sensor Ball (Mobile) Sample Description
    4. Sensor Ball (Wearable) Sample Description
      5. -
    5. Sunburn Monitor Sample Description
      6. +
    6. Sunburn Monitor Sample Description
      7. @@ -53,14 +53,14 @@

      Tizen provides interfaces and methods to manage sensor data from various sensors on the device. The main purpose of a sensor is to provide a value for the relevant environment parameter.

      This feature is supported in mobile and wearable applications only.

      - +

      The main features of the Sensor API include:

      @@ -75,12 +75,12 @@ 
       var proximityCapability =
-   tizen.systeminfo.getCapability("http://tizen.org/feature/sensor.proximity");
+   tizen.systeminfo.getCapability("http://tizen.org/feature/sensor.proximity");
 
 if (proximityCapability === true)
 {
-   /* Device supports the proximity sensor */
-   var proximitySensor = tizen.sensorservice.getDefaultSensor("PROXIMITY");
+   /* Device supports the proximity sensor */
+   var proximitySensor = tizen.sensorservice.getDefaultSensor("PROXIMITY");
 }
      @@ -89,18 +89,18 @@ if (proximityCapability === true) 
       var sensors = tizen.sensorservice.getAvailableSensors();
-console.log("Available sensor: " + sensors.toString());
+console.log("Available sensor: " + sensors.toString());

    7. Obtain the Sensor object (in mobile and wearable applications) using the getDefaultSensor() method of the SensorService interface (in mobile and wearable applications). Enable the sensor using the start() method:

      -var proximitySensor = tizen.sensorservice.getDefaultSensor("PROXIMITY");
+var proximitySensor = tizen.sensorservice.getDefaultSensor("PROXIMITY");
 
 function onsuccessCB()
 {
-   console.log("The proximity sensor started successfully.");
+   console.log("The proximity sensor started successfully.");
 }
 
 proximitySensor.start(onsuccessCB);
@@ -110,18 +110,18 @@ proximitySensor.start(onsuccessCB);
 
    8. To get data from the sensor, use the appropriate method of the sensor object. For example, for the LightSensor (in mobile and wearable applications), use the getLightSensorData() method:
      
 
 
      -var lightSensor = tizen.sensorservice.getDefaultSensor("LIGHT");
+var lightSensor = tizen.sensorservice.getDefaultSensor("LIGHT");
 
 function onGetSuccessCB(sensorData)
 {
-   console.log("light level: " + sensorData.lightLevel);
+   console.log("light level: " + sensorData.lightLevel);
 }
 
 function onsuccessCB()
 {
-   console.log("sensor started");
-   lightSensor.getLightSensorData(onGetSuccessCB);
-   lightSensor.stop();
+   console.log("sensor started");
+   lightSensor.getLightSensorData(onGetSuccessCB);
+   lightSensor.stop();
 }
 
 lightSensor.start(onsuccessCB);
@@ -134,7 +134,7 @@ proximitySensor.stop();
 
      
 
      9.
    - +

    Receiving Notifications on Sensor Data Changes

    Learning how to register a change event handler for sensor data enables your application to react to changes without the need to check current values constantly:

    @@ -145,7 +145,7 @@ proximitySensor.stop(); 
     function onchangedCB(sensorData)
 {
-   console.log("Light sensor data: " + sensorData.lightLevel);
+   console.log("Light sensor data: " + sensorData.lightLevel);
 }
    @@ -162,16 +162,16 @@ function onchangedCB(sensorData) 
    -var lightSensor = tizen.sensorservice.getDefaultSensor("LIGHT");
+var lightSensor = tizen.sensorservice.getDefaultSensor("LIGHT");
 
 function onsuccessCB()
 {
-   console.log("Light sensor service has started successfully.");
+   console.log("Light sensor service has started successfully.");
 }
 
 function onchangedCB(sensorData)
 {
-   console.log("Light sensor data: " + sensorData.lightLevel);
+   console.log("Light sensor data: " + sensorData.lightLevel);
 }
 
 lightSensor.setChangeListener(onchangedCB, 500, 2000);
@@ -180,16 +180,16 @@ lightSensor.start(onsuccessCB);
 
 
    The default value of the second parameter is 100 and for the third parameter 0. If you do not pass a value, the default is used:
    
 
    -var lightSensor = tizen.sensorservice.getDefaultSensor("LIGHT");
+var lightSensor = tizen.sensorservice.getDefaultSensor("LIGHT");
 
 function onsuccessCB()
 {
-   console.log("Light sensor service has started successfully.");
+   console.log("Light sensor service has started successfully.");
 }
 
 function onchangedCB(sensorData)
 {
-   console.log("Light sensor data: " + sensorData.lightLevel);
+   console.log("Light sensor data: " + sensorData.lightLevel);
 }
 
 /* Use the default interval value (100 ms) */
@@ -205,10 +205,10 @@ lightSensor.unsetChangeListener();
 
    
 
 
-  
+
 
    Obtaining Sensor Hardware Information
    
 
-
    Learning how to retrieve information about the sensor hardware enables your application to know the sensor's technical limits:
    
+
    Learning how to retrieve information about the sensor hardware enables your application to know the sensor's technical limits:
    
 
 
      
 
@@ -216,26 +216,26 @@ lightSensor.unsetChangeListener();
 
       function onsuccessCB(hwInfo)
 {
-   console.log("name: " + hwInfo.name);
-   console.log("type: " + hwInfo.type);
-   console.log("vendor: " + hwInfo.vendor);
-   console.log("minValue: " + hwInfo.minValue);
-   console.log("maxValue: " + hwInfo.maxValue);
-   console.log("resolution: " + hwInfo.resolution);
-   console.log("minInterval: " + hwInfo.minInterval);
-   console.log("maxBatchCount: " + hwInfo.maxBatchCount);
+   console.log("name: " + hwInfo.name);
+   console.log("type: " + hwInfo.type);
+   console.log("vendor: " + hwInfo.vendor);
+   console.log("minValue: " + hwInfo.minValue);
+   console.log("maxValue: " + hwInfo.maxValue);
+   console.log("resolution: " + hwInfo.resolution);
+   console.log("minInterval: " + hwInfo.minInterval);
+   console.log("maxBatchCount: " + hwInfo.maxBatchCount);
 }
 
 function onerrorCB(error)
 {
-   console.log("An error occurred: " + error.message);
+   console.log("An error occurred: " + error.message);
 }
 
      
 
 
 
    1. Call the getSensorHardwareInfo() method of an existing Sensor object to obtain its hardware information as the SensorHardwareInfo object:
 
      -var proximitySensor = tizen.sensorservice.getDefaultSensor("PROXIMITY");
+var proximitySensor = tizen.sensorservice.getDefaultSensor("PROXIMITY");
 
 proximitySensor.getSensorHardwareInfo(onsuccessCB, onerrorCB);
 
      
@@ -292,10 +292,10 @@ proximitySensor.getSensorHardwareInfo(onsuccessCB, onerrorCB);
     
         Linear acceleration sensor
         http://tizen.org/feature/sensor.linear_acceleration
-    	
+    
    
   
-  
+
 
 
 
diff --git a/org.tizen.guides/html/web/sensors/ham_w.htm b/org.tizen.guides/html/web/sensors/ham_w.htm
index 2bd86c3..5f58689 100644
--- a/org.tizen.guides/html/web/sensors/ham_w.htm
+++ b/org.tizen.guides/html/web/sensors/ham_w.htm
@@ -40,7 +40,7 @@
         
      Related Info
      
         
     
 
@@ -51,7 +51,7 @@
 
      Tizen enables you to access and record human activity data from various sensors and recorders on the device.
      
 
  
      This feature is supported in mobile and wearable applications only.
      
-  
+
 
      The main features of the Human Activity Monitor API include:
      
 
        
 
      • Retrieving data
@@ -70,8 +70,8 @@
 
 
        To use the Human Activity Monitor API (in mobile and wearable applications), the application has to request permission by adding the following privileges to the config.xml file:
        
 
        -<tizen:privilege name="http://tizen.org/privilege/healthinfo"/>
-<tizen:privilege name="http://tizen.org/privilege/location"/>
+<tizen:privilege name="http://tizen.org/privilege/healthinfo"/>
+<tizen:privilege name="http://tizen.org/privilege/location"/>
 
        
 
 
@@ -88,18 +88,18 @@ var counter = 0;
 
 function onchangedCB(hrmInfo)
 {
-   console.log("Heart Rate: " + hrmInfo.heartRate);
-   console.log("Peak-to-peak interval: " + hrmInfo.rRInterval + " milliseconds");
-
-   counter++;
-   if (counter > 10)
-   {
-      /* Stop the sensor after detecting a few changes */
-      tizen.humanactivitymonitor.stop("HRM");
-   }
+   console.log("Heart Rate: " + hrmInfo.heartRate);
+   console.log("Peak-to-peak interval: " + hrmInfo.rRInterval + " milliseconds");
+
+   counter++;
+   if (counter > 10)
+   {
+      /* Stop the sensor after detecting a few changes */
+      tizen.humanactivitymonitor.stop("HRM");
+   }
 }
 
-tizen.humanactivitymonitor.start("HRM", onchangedCB);
+tizen.humanactivitymonitor.start("HRM", onchangedCB);

    You can also detect the wrist up gesture using the start() method:

    @@ -107,10 +107,10 @@ tizen.humanactivitymonitor.start("HRM", onchangedCB); 
     function onchangedCB()
 {
-   console.log("You are looking at your smartwatch");
+   console.log("You are looking at your smartwatch");
 }
 
-tizen.humanactivitymonitor.start("WRIST_UP", onchangedCB)
+tizen.humanactivitymonitor.start("WRIST_UP", onchangedCB)
    @@ -118,21 +118,21 @@ tizen.humanactivitymonitor.start("WRIST_UP", onchangedCB) 
     function onsuccessCB(hrmInfo)
 {
-   console.log("Heart rate: " + hrmInfo.heartRate);
+   console.log("Heart rate: " + hrmInfo.heartRate);
 }
 
 function onerrorCB(error)
 {
-   console.log("Error occurred: " + error.message);
+   console.log("Error occurred: " + error.message);
 }
 
-tizen.humanactivitymonitor.getHumanActivityData("HRM", onsuccessCB, onerrorCB);
+tizen.humanactivitymonitor.getHumanActivityData("HRM", onsuccessCB, onerrorCB);
  • To disable HAM when it is no longer required, use the stop() method of the HumanActivityMonitorManager interface: 
    -tizen.humanactivitymonitor.stop("HRM");
+tizen.humanactivitymonitor.stop("HRM");
    • @@ -144,43 +144,43 @@ tizen.humanactivitymonitor.stop("HRM");
    1. To check whether a sensor is supported, use the getCapability() method of the SystemInfo interface (in mobile and wearable applications): 
      -if (tizen.systeminfo.getCapability("http://tizen.org/feature/sensor.barometer")
-    === false)
+if (tizen.systeminfo.getCapability("http://tizen.org/feature/sensor.barometer")
+    === false)
 {
-   console.log("PRESSURE is not supported on this device.");
+   console.log("PRESSURE is not supported on this device.");
 
-   return;
+   return;
 }
    2. To enable data recording, use the startRecorder() method of the HumanActivityMonitorManager interface (in mobile and wearable applications). Optionally, you can also define an interval and period for the data recording. 
      -var type = 'PRESSURE';
+var type = 'PRESSURE';
 
 var options =
 {
-   retentionPeriod: 1 /* 1 hour */
+   retentionPeriod: 1 /* 1 hour */
 }
 
 try
 {
-   tizen.humanactivitymonitor.startRecorder(type, options);
+   tizen.humanactivitymonitor.startRecorder(type, options);
 }
 catch (err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }

      To stop recording sensor data, use the stopRecorder() method of the HumanActivityMonitorManager interface:

       try
 {
-   tizen.humanactivitymonitor.stopRecorder('PRESSURE');
+   tizen.humanactivitymonitor.stopRecorder('PRESSURE');
 }
 catch (err)
 {
-   console.log(err.name + ': ' + err.message);
+   console.log(err.name + ': ' + err.message);
 }
      3. @@ -188,8 +188,8 @@ catch (err) 
       /* To retrieve data from July 1, 2016 to July 31, 2016 */
 var query = {};
-query['startTime'] = (new Date(2016, 7, 1)).getTime() / 1000;
-query['endTime'] = (new Date(2016, 7, 31)).getTime() / 1000;
+query['startTime'] = (new Date(2016, 7, 1)).getTime() / 1000;
+query['endTime'] = (new Date(2016, 7, 31)).getTime() / 1000;
    3. To get the data sliced by an interval, you can use a combination of the anchorTime and interval options in the HumanActivityRecorderQuery interface. @@ -197,8 +197,8 @@ query['endTime'] = (new Date(2016, 7, 31)).getTime() / 1000; 
       /* To retrieve data everyday at midnight */
 /* Time is 0:00 internally */
-query['anchorTime'] = (new Date(2016, 7, 1, 0, 0)).getTime() / 1000;
-query['interval'] = 1440; /* Day */
+query['anchorTime'] = (new Date(2016, 7, 1, 0, 0)).getTime() / 1000;
+query['interval'] = 1440; /* Day */
    4. To read the human activity recorder data from the database, use the readRecorderData() method of the HumanActivityMonitorManager interface with the query. @@ -207,26 +207,26 @@ query['interval'] = 1440; /* Day */ 
       function onerror(error)
 {
-   console.log(error.name + ': ' + error.message);
+   console.log(error.name + ': ' + error.message);
 }
 
 function onread(data)
 {
-   for (var idx = 0; idx < data.length; ++idx)
-   {
-      console.log('average pressure: ' + data[idx].average);
-   }
+   for (var idx = 0; idx < data.length; ++idx)
+   {
+      console.log('average pressure: ' + data[idx].average);
+   }
 }
 
-var type = 'PRESSURE';
+var type = 'PRESSURE';
 
 try
 {
-   tizen.humanactivitymonitor.readRecorderData(type, query, onread, onerror);
+   tizen.humanactivitymonitor.readRecorderData(type, query, onread, onerror);
 }
 catch (error)
 {
-   console.log(error.name + ': ' + error.message);
+   console.log(error.name + ': ' + error.message);
 }
      5. @@ -243,20 +243,20 @@ var mySampleInterval = 10000; function onchangedCB(gpsInfo) { -   console.log("this callback is called every " + myCallbackInterval + " milliseconds"); -   console.log("the gpsInfo includes the information of the GPS that is collected every " -               + mySampleInterval + " milliseconds"); + console.log("this callback is called every " + myCallbackInterval + " milliseconds"); + console.log("the gpsInfo includes the information of the GPS that is collected every " + + mySampleInterval + " milliseconds"); } function onerrorCB(error) { -   console.log("Error occurred. Name:" + error.name + ", message: " + error.message); + console.log("Error occurred. Name:" + error.name + ", message: " + error.message); } -var option = {"callbackInterval": myCallbackInterval, -              "sampleInterval": mySampleInterval}; +var option = {"callbackInterval": myCallbackInterval, + "sampleInterval": mySampleInterval}; -tizen.humanactivitymonitor.start("GPS", onchangedCB, onerrorCB, option); +tizen.humanactivitymonitor.start("GPS", onchangedCB, onerrorCB, option); @@ -264,23 +264,23 @@ tizen.humanactivitymonitor.start("GPS", onchangedCB, onerrorCB, option 
       function onsuccessCB(hrmInfo)
 {
-   console.log("Heart rate: " + hrmInfo.heartRate);
+   console.log("Heart rate: " + hrmInfo.heartRate);
 }
 function onerrorCB(error)
 {
-   console.log("Error occurred: " + error.message);
+   console.log("Error occurred: " + error.message);
 }
-tizen.humanactivitymonitor.getHumanActivityData("HRM", onsuccessCB, onerrorCB);
+tizen.humanactivitymonitor.getHumanActivityData("HRM", onsuccessCB, onerrorCB);
    5. To disable HAM when it is no longer required, use the stop() method of the HumanActivityMonitorManager interface: 
      -tizen.humanactivitymonitor.stop("HRM");
+tizen.humanactivitymonitor.stop("HRM");
    - +

    Receiving Notifications on Pedometer Data Changes

    Learning how to register a listener for accumulative allows you to monitor the step count maintained by the system without enabling the Pedometer sensor and the PEDOMETER monitor is a basic Human Activity Monitor (HAM) management skill:

    @@ -289,11 +289,11 @@ tizen.humanactivitymonitor.stop("HRM"); 
     function onchangedCB(pedometerInfo)
 {
-   console.log("Step status: " + pedometerInfo.stepStatus);
-   console.log("Speed: " + pedometerInfo.speed);
-   console.log("Walking frequency: " + pedometerInfo.walkingFrequency);
-   /* Deregisters a previously registered listener */
-   tizen.humanactivitymonitor.unsetAccumulativePedometerListener();
+   console.log("Step status: " + pedometerInfo.stepStatus);
+   console.log("Speed: " + pedometerInfo.speed);
+   console.log("Walking frequency: " + pedometerInfo.walkingFrequency);
+   /* Deregisters a previously registered listener */
+   tizen.humanactivitymonitor.unsetAccumulativePedometerListener();
 }
 
 tizen.humanactivitymonitor.setAccumulativePedometerListener(onchangedCB);
@@ -317,25 +317,25 @@ tizen.humanactivitymonitor.unsetAccumulativePedometerListener();
 
     function errorCallback(error)
 {
-   console.log(error.name +": " + error.message);
+   console.log(error.name +": " + error.message);
 }
 
 function listener(info)
 {
-   console.log("type: " + info.type);
-   console.log("timestamp: " + info.timestamp);
-   console.log("accuracy: " + info.accuracy);
+   console.log("type: " + info.type);
+   console.log("timestamp: " + info.timestamp);
+   console.log("accuracy: " + info.accuracy);
 }
 
 try
 {
-   var listenerId =
-      tizen.humanactivitymonitor.addActivityRecognitionListener("WALKING", listener,
-                                                                errorCallback);
+   var listenerId =
+      tizen.humanactivitymonitor.addActivityRecognitionListener("WALKING", listener,
+                                                                errorCallback);
 }
 catch (error)
 {
-   console.log(error.name +": " + error.message);
+   console.log(error.name +": " + error.message);
 }
 
    
 
@@ -346,51 +346,51 @@ var listenerId;
 
 function errorCallback(error)
 {
-   console.log(error.name + ": " + error.message);
+   console.log(error.name + ": " + error.message);
 }
 
 function listener(info)
 {
-   console.log("type: " + info.type);
-   console.log("timestamp: " + info.timestamp);
-   console.log("accuracy: " + info.accuracy);
+   console.log("type: " + info.type);
+   console.log("timestamp: " + info.timestamp);
+   console.log("accuracy: " + info.accuracy);
 
-   tizen.humanactivitymonitor.removeActivityRecognitionListener(listenerId,
-                                                                errorCallback);
+   tizen.humanactivitymonitor.removeActivityRecognitionListener(listenerId,
+                                                                errorCallback);
 }
 
 try
 {
-   listenerId =
-      tizen.humanactivitymonitor.addActivityRecognitionListener("WALKING", listener,
-                                                                errorCallback);
+   listenerId =
+      tizen.humanactivitymonitor.addActivityRecognitionListener("WALKING", listener,
+                                                                errorCallback);
 }
 catch (error)
 {
-   console.log(error.name +": " + error.message);
+   console.log(error.name +": " + error.message);
 }

    Monitoring Sleep

    - +

    Learning how to detect whether the user is asleep is a basic Human Activity Monitor (HAM) management skill:

    1. To enable the monitor and start collecting data, use the start() method of the HumanActivityMonitorManager interface (in mobile and wearable applications): 
       function onchangedCB(sleepInfo)
 {
-   console.log("Sleep status: " + sleepInfo.status);
-   console.log("Timestamp: " + sleepInfo.timestamp + " milliseconds");
+   console.log("Sleep status: " + sleepInfo.status);
+   console.log("Timestamp: " + sleepInfo.timestamp + " milliseconds");
 }
 
-tizen.humanactivitymonitor.start("SLEEP_MONITOR", onchangedCB);
+tizen.humanactivitymonitor.start("SLEEP_MONITOR", onchangedCB);
    2. To disable the monitor when it is no longer required, use the stop() method of the HumanActivityMonitorManager interface: 
      -tizen.humanactivitymonitor.stop("SLEEP_MONITOR");
+tizen.humanactivitymonitor.stop("SLEEP_MONITOR");
    @@ -405,7 +405,7 @@ tizen.humanactivitymonitor.stop("SLEEP_MONITOR"); Monitor Capability - Notes + Notes Pedometer and accumulative pedometer @@ -433,7 +433,7 @@ tizen.humanactivitymonitor.stop("SLEEP_MONITOR"); Sleep monitor http://tizen.org/feature/sensor.sleep_monitor When the sleep sensor is started, a change callback is invoked when data changes. Use the getHumanActivityData() method to get the current data. - + Activity recognition http://tizen.org/feature/sensor.activity_recognition @@ -444,10 +444,10 @@ tizen.humanactivitymonitor.stop("SLEEP_MONITOR");
  • RUNNING
  • IN_VEHICLE
    • - + - +

    Supported Recorders in Wearable Applications

    The following table introduces the available recorder types and lists the capabilities you can use to determine whether a specific recorder is supported on a device.

    @@ -466,7 +466,7 @@ tizen.humanactivitymonitor.stop("SLEEP_MONITOR"); Use the startRecorder() and stopRecorder() methods to record the pressure sensor data for the specific period of time. Use the readRecorderData() method to read the recorded pressure sensor data. - + diff --git a/org.tizen.guides/html/web/sensors/sensors_cover_w.htm b/org.tizen.guides/html/web/sensors/sensors_cover_w.htm index dc3a89e..f42328e 100644 --- a/org.tizen.guides/html/web/sensors/sensors_cover_w.htm +++ b/org.tizen.guides/html/web/sensors/sensors_cover_w.htm @@ -5,13 +5,13 @@ - + - Sensors + Sensors @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • - +

    Sensors

    @@ -44,7 +44,7 @@

    You can read and manage data from various sensors on the device, and also receive notifications when the sensor data changes. You can access information from various environmental sensors, such as the light and magnetic sensors, and from user-related sensors, such as the heart rate monitor.

    - +
    diff --git a/org.tizen.guides/html/web/sensors/task_sensorball_w.htm b/org.tizen.guides/html/web/sensors/task_sensorball_w.htm index 8cce58e..cfd01e1 100644 --- a/org.tizen.guides/html/web/sensors/task_sensorball_w.htm +++ b/org.tizen.guides/html/web/sensors/task_sensorball_w.htm @@ -5,7 +5,7 @@ - + @@ -20,7 +20,7 @@

    Mobile Web

    - +

    Dependencies

    - +
    -

    Task: Sensor Ball

    -

    This task, based on the SensorBall sample delivered with the Tizen Studio, demonstrates how you can use the Sensor API to read and process gyro sensor data. For more information on the sample functionality and creating the sample with the full source code, see Sensor Ball.

    -

    This task consists of the following parts:

    -
      +

      Task: Sensor Ball

      +

      This task, based on the SensorBall sample delivered with the Tizen Studio, demonstrates how you can use the Sensor API to read and process gyro sensor data. For more information on the sample functionality and creating the sample with the full source code, see Sensor Ball.

      +

      This task consists of the following parts:

      + - -

      This sample is a fully functional application which uses the gyro sensor to create a game where the game elements move on the screen based on the sensor data.

      - -

      Defining the Application Layout

      -

      The SensorBall sample application layout contains only 1 screen: the main screen that displays the game.

      - -

      The following figure shows the main screen of the application.

      -

      Figure: SensorBall screen

      -

      SensorBall screen

      - +
    + +

    This sample is a fully functional application which uses the gyro sensor to create a game where the game elements move on the screen based on the sensor data.

    + +

    Defining the Application Layout

    +

    The SensorBall sample application layout contains only 1 screen: the main screen that displays the game.

    + +

    The following figure shows the main screen of the application.

    +

    Figure: SensorBall screen

    +

    SensorBall screen

    +

    Defining the Main Screen

    -
      +
      1. index.html Source File -

        1. The main screen displays the game screen. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

          +

          1. The main screen displays the game screen. The header section of the screen is defined within a <div> element whose data-role attribute is set to header. The header section determines the title of the screen.

             <body>
-   <div data-role="page" id="mainPage">
-      <!--Header section-->
-      <div data-role="header" data-position="fixed">
-         <h1>Sensor ball</h1>
-      </div>
+   <div data-role="page" id="mainPage">
+      <!--Header section-->
+      <div data-role="header" data-position="fixed">
+         <h1>Sensor ball</h1>
+      </div>

          2. The actual content section of the screen is defined within a <div> element whose data-role attribute is set to content. The content section of the main screen contains a background image (defined in the style.css file based on the background class), and the image of the game ball. -

            +

            -      <!--Content section-->
-      <div data-role="content" class="background background1" data-scroll="none">
-         <div id="main">
-            <img id="image1" class="ball" src="./images/ball1.png"/>
-         </div>
-      </div>
+      <!--Content section-->
+      <div data-role="content" class="background background1" data-scroll="none">
+         <div id="main">
+            <img id="image1" class="ball" src="./images/ball1.png"/>
+         </div>
+      </div>
            3. -

          3. The footer section of the screen is defined within a <div> element whose data-role attribute is set to footer. The footer section contains a tab bar with buttons for switching between the animation modes of the game.

            +

          4. The footer section of the screen is defined within a <div> element whose data-role attribute is set to footer. The footer section contains a tab bar with buttons for switching between the animation modes of the game.

            -      <!--Footer section-->
-      <div data-role="footer" data-position="fixed">
-         <div data-role="tabbar" data-style="toolbar" id="footerControls">
-            <ul>
-               <li><a href="#" id="btnBall" class="ui-btn-active">BALL</a></li>
-               <li><a href="#" id="btnSky">SKY</a></li>
-               <li><a href="#" id="btnSpace">SPACE</a></li>
-            </ul>
-         </div>
-      </div>
-   </div>
+      <!--Footer section-->
+      <div data-role="footer" data-position="fixed">
+         <div data-role="tabbar" data-style="toolbar" id="footerControls">
+            <ul>
+               <li><a href="#" id="btnBall" class="ui-btn-active">BALL</a></li>
+               <li><a href="#" id="btnSky">SKY</a></li>
+               <li><a href="#" id="btnSpace">SPACE</a></li>
+            </ul>
+         </div>
+      </div>
+   </div>
 </body>
          @@ -105,152 +105,152 @@ style.css file defines the background image for each animation mode and t 
           .background1
 {
-   background-image: url('../images/background1.jpg');
+   background-image: url('../images/background1.jpg');
 }
 
 .background2
 {
-   background-image: url('../images/background2.jpg');
+   background-image: url('../images/background2.jpg');
 }
 
 .background3
 {
-   background-image: url('../images/background3.jpg');
-   background-color: #000;
-   overflow: hidden;
+   background-image: url('../images/background3.jpg');
+   background-color: #000;
+   overflow: hidden;
 }
 
 .ball
 {
-   position: absolute;
-   left: 0px;
-   top: 0px;
-   width: 86px;
-   height: 86px;
+   position: absolute;
+   left: 0px;
+   top: 0px;
+   width: 86px;
+   height: 86px;
 }

        Initializing the Application

        -
          +
          1. config.xml Source File

            The required privileges are declared in the config.xml file. 

             <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
 </widget>
            -
            2. +
          -

          Managing the Gyro Sensor Data

          +

          Managing the Gyro Sensor Data

          This section builds upon the elements described in Detecting Device Acceleration.

          - +

          Managing the Application and Window Objects

          The object management functionality is implemented in the main.js file.

          -
            +
            1. Creating the Application Object

              The application object is initialized when the document ready() event is fired. All the application events are bound during the initialization.

               $(document).ready(function()
 {
-   "use strict";
-   var img,
-       contentHeight = screen.availHeight - $('div[data-role="header"]').outerHeight()
-                       - $('div[data-role="footer"]').outerHeight();
-
-   $('div[data-role="content"]').css('height', contentHeight - 33);
-   app.gameWidth = screen.availWidth;
-   app.ballWidth = parseInt($('.ball').css('width'), 10);
-   app.ballHeight = parseInt($('.ball').css('height'), 10);
-
-   window.addEventListener('devicemotion', app.saveSensorData.bind(app), false);
-
-   app.fun();
-
-   /* Hardware Back key event */
-   $(window).on('tizenhwkey', function(e)
-      {
-         if (e.originalEvent.keyName === "back")
-         {
-            tizen.application.getCurrentApplication().exit();
-         }
-      });
-
-   /* Button events */
-   $('#btnBall').bind('click', function(event)
-      {
-         $('#sun').remove();
-         app.startBall();
-      });
-
-   $('#btnSky').bind('click', function(event)
-      {
-         $('#sun').remove();
-         app.startSky();
-      });
-
-   $('#btnSpace').bind('click', function(event)
-      {
-         $('#sun').remove();
-         app.startSpace();
-      });
-
-   /* Screen show event */
-   $('#mainPage').on('pageshow', function()
-      {
-         app.startBall();
-      });
-
-   document.addEventListener('webkitvisibilitychange', function(event)
-      {
-         if (document.webkitVisibilityState === 'visible')
-         {
-            app.fun();
-         }
-      });
-
-   /* Preload backgrounds */
-   img = $('<img>').hide();
-   img.attr('src', 'images/background1.png');
+   "use strict";
+   var img,
+       contentHeight = screen.availHeight - $('div[data-role="header"]').outerHeight()
+                       - $('div[data-role="footer"]').outerHeight();
+
+   $('div[data-role="content"]').css('height', contentHeight - 33);
+   app.gameWidth = screen.availWidth;
+   app.ballWidth = parseInt($('.ball').css('width'), 10);
+   app.ballHeight = parseInt($('.ball').css('height'), 10);
+
+   window.addEventListener('devicemotion', app.saveSensorData.bind(app), false);
+
+   app.fun();
+
+   /* Hardware Back key event */
+   $(window).on('tizenhwkey', function(e)
+      {
+         if (e.originalEvent.keyName === "back")
+         {
+            tizen.application.getCurrentApplication().exit();
+         }
+      });
+
+   /* Button events */
+   $('#btnBall').bind('click', function(event)
+      {
+         $('#sun').remove();
+         app.startBall();
+      });
+
+   $('#btnSky').bind('click', function(event)
+      {
+         $('#sun').remove();
+         app.startSky();
+      });
+
+   $('#btnSpace').bind('click', function(event)
+      {
+         $('#sun').remove();
+         app.startSpace();
+      });
+
+   /* Screen show event */
+   $('#mainPage').on('pageshow', function()
+      {
+         app.startBall();
+      });
+
+   document.addEventListener('webkitvisibilitychange', function(event)
+      {
+         if (document.webkitVisibilityState === 'visible')
+         {
+            app.fun();
+         }
+      });
+
+   /* Preload backgrounds */
+   img = $('<img>').hide();
+   img.attr('src', 'images/background1.png');
 });
            2. Resizing the Window

              The application handles the window resize events and sets the display accordingly.

               $(window).resize(function()
-   {
-      'use strict';
-      app.gameWidth = screen.availWidth;
-      app.gameHeight = $('.background').outerHeight();
-   });
+   {
+      'use strict';
+      app.gameWidth = screen.availWidth;
+      app.gameHeight = $('.background').outerHeight();
+   });
            - - + +

            Accessing Gyro Sensor Data

            -
              -
            1. main.js Source File +
                +
              1. main.js Source File
                1. The devicemotion event listener calls the saveSensorData() method each time the event takes place. The event allows the application to access information about sensor data changes. 
                  -window.addEventListener('devicemotion', app.saveSensorData.bind(app), false);
+window.addEventListener('devicemotion', app.saveSensorData.bind(app), false);
                2. The saveSensorData() methods stores the event (containing the gyro sensor data) for later processing. 
                   saveSensorData: function saveSensorData(event)
 {
-   "use strict";
-   this.event = event;
+   "use strict";
+   this.event = event;
 }
                3. The stored event is used by the diff --git a/org.tizen.guides/html/web/text_input/input_device_w.htm b/org.tizen.guides/html/web/text_input/input_device_w.htm index 83a446f..55233ed 100644 --- a/org.tizen.guides/html/web/text_input/input_device_w.htm +++ b/org.tizen.guides/html/web/text_input/input_device_w.htm @@ -42,7 +42,7 @@

                  Input Device

                  Tizen enables you to manage input device keys.

                  - +

                  This feature is supported in mobile and wearable applications only.

                  The main features of the Input Device API include:

                  @@ -66,11 +66,11 @@ var keyCodes = {}; var supportedKeys = tizen.inputdevice.getSupportedKeys(); -console.log("Supported keys list"); +console.log("Supported keys list"); for (var i = 0; i < supportedKeys.length; ++i) { -   keyCodes[supportedKeys[i].name] = supportedKeys[i].code; -   console.log(i + ": " + supportedKeys[i].name + " - " + supportedKeys[i].code); + keyCodes[supportedKeys[i].name] = supportedKeys[i].code; + console.log(i + ": " + supportedKeys[i].name + " - " + supportedKeys[i].code); }
                  4. @@ -86,7 +86,7 @@ for (var i = 0; i < supportedKeys.length; ++i)

                  If you do not want to gather information about all supported keys, create a separate list of keys for information gathering. If you want information about all supported keys, use the list retrieved in the previous use case.

                  -var keys = ["VolumeUp", "VolumeDown"];
+var keys = ["VolumeUp", "VolumeDown"];
 var keyCodes = {};
                  @@ -97,24 +97,24 @@ var keyCodes = {}; 
                   for (var i = 0; i < keys.length; i++)
 {
-   try
-   {
-      var key = tizen.inputdevice.getKey(keys[i]);
-      if (key == null)
-      {
-         console.log("key: " + keys[i] + " is not supported");
-      }
-      else
-      {
-         keyCodes[key.name] = key.code;
-         console.log("key: " + key.name + " has code: " + key.code);
-      }
-   }
-   catch (e)
-   {
-      console.log("error: " + e.name + ":" + e.message
-                  + ", when getting key with name " + keys[i]);
-   }
+   try
+   {
+      var key = tizen.inputdevice.getKey(keys[i]);
+      if (key == null)
+      {
+         console.log("key: " + keys[i] + " is not supported");
+      }
+      else
+      {
+         keyCodes[key.name] = key.code;
+         console.log("key: " + key.name + " has code: " + key.code);
+      }
+   }
+   catch (e)
+   {
+      console.log("error: " + e.name + ":" + e.message
+                  + ", when getting key with name " + keys[i]);
+   }
 }
                  @@ -144,32 +144,32 @@ var supportedKeys = tizen.inputdevice.getSupportedKeys(); for (var i = 0; i < supportedKeys.length; ++i) { -   try -   { -      tizen.inputdevice.registerKey(supportedKeys[i].name); -      codeNamesMap[supportedKeys[i].code] = supportedKeys[i].name; -      console.log("key: " + supportedKeys[i].name -                  + " was registered for event handling"); -   } -   catch (error) -   { -      console.log("failed to register " + supportedKeys[i].name + ": " + error); -   } + try + { + tizen.inputdevice.registerKey(supportedKeys[i].name); + codeNamesMap[supportedKeys[i].code] = supportedKeys[i].name; + console.log("key: " + supportedKeys[i].name + + " was registered for event handling"); + } + catch (error) + { + console.log("failed to register " + supportedKeys[i].name + ": " + error); + } }

                  If you know the exact list of keys you want to register, the registration can also be done with the asynchronous registerKeyBatch() method:

                  -var keys = ["VolumeUp", "VolumeDown"];
+var keys = ["VolumeUp", "VolumeDown"];
 
 function errorCB(err)
 {
-   console.log('The following error occurred: ' + err.name);
+   console.log('The following error occurred: ' + err.name);
 }
 
 function successCB()
 {
-   console.log('All keys registered successfully');
+   console.log('All keys registered successfully');
 }
 
 tizen.inputdevice.registerKeyBatch(keys, successCB, errorCB);
@@ -180,31 +180,31 @@ tizen.inputdevice.registerKeyBatch(keys, successCB, errorCB);
 
                4. 
 
                  To handle events for registered keys:
                  
 
                  -window.addEventListener("keydown", function(keyEvent)
-   {
-      if (codeNamesMap.hasOwnProperty(keyEvent.keyCode))
-      {
-         console.log("Registered key was pressed");
-         /* Define some custom action */
-      }
-      else
-      {
-         console.log("Some other key was pressed");
-      }
-   });
-
-window.addEventListener("keyup", function(keyEvent)
-   {
-      if (codeNamesMap.hasOwnProperty(keyEvent.keyCode))
-      {
-         console.log("Registered key was released");
-         /* Define some custom action */
-      }
-      else
-      {
-         console.log("Some other key was released");
-      }
-   });
+window.addEventListener("keydown", function(keyEvent)
+   {
+      if (codeNamesMap.hasOwnProperty(keyEvent.keyCode))
+      {
+         console.log("Registered key was pressed");
+         /* Define some custom action */
+      }
+      else
+      {
+         console.log("Some other key was pressed");
+      }
+   });
+
+window.addEventListener("keyup", function(keyEvent)
+   {
+      if (codeNamesMap.hasOwnProperty(keyEvent.keyCode))
+      {
+         console.log("Registered key was released");
+         /* Define some custom action */
+      }
+      else
+      {
+         console.log("Some other key was released");
+      }
+   });
 
                  
 
                  5. 
 
@@ -213,24 +213,24 @@ window.addEventListener("keyup", function(keyEvent)
 
                   for (var i = 0; i < supportedKeys.length; ++i)
 {
-   tizen.inputdevice.unregisterKey(supportedKeys[i].name);
-   console.log("key: " + supportedKeys[i].name
-               + " was unregistered for event handling");
+   tizen.inputdevice.unregisterKey(supportedKeys[i].name);
+   console.log("key: " + supportedKeys[i].name
+               + " was unregistered for event handling");
 }
 
                  
 
 
                  The deregistration can also be done with the unregisterKeyBatch() method:
                  
 
                  -var keys = ["VolumeUp", "VolumeDown"];
+var keys = ["VolumeUp", "VolumeDown"];
 
 function errorCB(err)
 {
-   console.log('The following error occurred: ' + err.name);
+   console.log('The following error occurred: ' + err.name);
 }
 
 function successCB()
 {
-   console.log('Unregistered successfully');
+   console.log('Unregistered successfully');
 }
 
 tizen.inputdevice.unregisterKeyBatch(keys, successCB, errorCB);
diff --git a/org.tizen.guides/html/web/text_input/input_method_w.htm b/org.tizen.guides/html/web/text_input/input_method_w.htm
index dcd1d34..118d7b3 100644
--- a/org.tizen.guides/html/web/text_input/input_method_w.htm
+++ b/org.tizen.guides/html/web/text_input/input_method_w.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  IME Application 
-  
+  IME Application
+ 
  
- 
+
  
                  
 	
                  
 		
                  Wearable Web
                  
 	
                  
-	
+
 	
                  
 		
                  Dependencies
                  
 		
 	
                  
-
                  	
+

    IME Application

    -

    Tizen Web IME (Input Method Editor) applications are written in HTML5 for Tizen, combining HTML, JavaScript, and CSS into a package that can be installed on a Tizen device, such as Samsung Gear, or the Tizen emulator. Both the Tizen device and the emulator must run Tizen version 2.3 or later to run Web IME applications.

    +

    Tizen Web IME (Input Method Editor) applications are written in HTML5 for Tizen, combining HTML, JavaScript, and CSS into a package that can be installed on a Tizen device, such as Samsung Gear, or the Tizen emulator. Both the Tizen device and the emulator must run Tizen version 2.3 or later to run Web IME applications.

    This feature is supported in wearable applications only.

    Architecture

    - -

    IME applications differ from other applications in that they do not follow the normal application life-cycle management and they need a mechanism to interact with the client application requesting the IME.

    -

    Tizen provides a special architecture to guarantee that Web IME applications work just like native IME applications (however, there are some restrictions due to the capability limitations of the Web applications in general). A Web IME application can be run within the core Input Service Engine process, which is also used to run native IME applications.

    -

    The following figure shows the overall architecture of the Tizen Web IME support.

    -

    Figure: Tizen Web IME support architecture

    -

    Tizen Web IME support architecture

    -

    When a Web IME is executed, the Input Service framework launches the Input Service Engine process, just like with native IME applications. The Input Service Engine process loads a special bridge IME module, ise-web-helper-agent, which executes a Web IME within its Web container and communicates with the executed Web IME.

    -

    The communication between the Web IME and the ise-web-helper-agent module is accomplished by 2 utility modules, web-helper-agent on the Web helper agent side and web-helper-client on the Web IME side. Therefore, a Web IME application must contain the web-helper-client.js, which is created automatically when you create a Web IME project using the Tizen Studio.

    -

    Since the Web IME runs within a Web container and communicates with it, as a Web IME application developer you do not need knowledge of the platform architecture or details of the native API. You can develop Web IME applications as if they were normal Web applications, as long as the web-helper-client.js file is included and properly used.

    - + +

    IME applications differ from other applications in that they do not follow the normal application life-cycle management and they need a mechanism to interact with the client application requesting the IME.

    +

    Tizen provides a special architecture to guarantee that Web IME applications work just like native IME applications (however, there are some restrictions due to the capability limitations of the Web applications in general). A Web IME application can be run within the core Input Service Engine process, which is also used to run native IME applications.

    +

    The following figure shows the overall architecture of the Tizen Web IME support.

    +

    Figure: Tizen Web IME support architecture

    +

    Tizen Web IME support architecture

    +

    When a Web IME is executed, the Input Service framework launches the Input Service Engine process, just like with native IME applications. The Input Service Engine process loads a special bridge IME module, ise-web-helper-agent, which executes a Web IME within its Web container and communicates with the executed Web IME.

    +

    The communication between the Web IME and the ise-web-helper-agent module is accomplished by 2 utility modules, web-helper-agent on the Web helper agent side and web-helper-client on the Web IME side. Therefore, a Web IME application must contain the web-helper-client.js, which is created automatically when you create a Web IME project using the Tizen Studio.

    +

    Since the Web IME runs within a Web container and communicates with it, as a Web IME application developer you do not need knowledge of the platform architecture or details of the native API. You can develop Web IME applications as if they were normal Web applications, as long as the web-helper-client.js file is included and properly used.

    +

    Supported Application Types

    -

    Tizen Web IME can interact with 2 types of Tizen applications:

    +

    Tizen Web IME can interact with 2 types of Tizen applications:

    -
      -
    • In-house (native) application
      • +
        +
      • In-house (native) application
      • Downloaded (Web) application
      - +

      The Web container is executed by the core Input Service Engine process, allowing the Web IME to provide text input services to both Web applications and in-house native applications.

      - +

      Supported APIs

      All the APIs you can use for your Web IME are provided by the WebHelperClient object, which is accessible when you include the web-helper-client.js file in your Web IME project:

      -<script type="text/javascript" src="js/web-helper-client.js"></script>
+<script type="text/javascript" src="js/web-helper-client.js"></script>

      The following table lists the WebHelperClient methods that you can invoke in your Web IME.

      - - -

      Table: WebHelperClient methods

      + + +

      Table: WebHelperClient methods

      - - - - - - - + + + + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + + - - + + + - - + + + - - + + + - - + + +
      MethodDescription
      initialize(handler)
      MethodDescription
      initialize(handler) Initializes the WebHelperClient object by registering a handler object. Before using the WebHelperClient functionalities, make sure to call this method passing the handler object as its parameter, which implements the event handlers that must be handled by the IME.

      handler parameter: Handler object implementing the on* event handlers.

      The following example shows how to initialize the WebHelperClient by passing a customized handler object.

       var WebHelperClientHandler =
 {
-   onInit: function()
-   {
-      /* Do what you want when your IME gets the INIT message */
-   }
+   onInit: function()
+   {
+      /* Do what you want when your IME gets the INIT message */
+   }
 };
 WebHelperClient.initialize(WebHelperClientHandler);
      -
      log(str)
      log(str) Leaves a dlog message.

      str parameter: Log message to display.

      -
      commitString(str)
      commitString(str) Commits a UTF-8 string to the client application directly.

      str parameter: Byte array of the UTF-8 string to be committed.

      -
      updatePreeditString(str)
      updatePreeditString(str) Updates a new UTF-8 string for pre-edit.

      str parameter: Byte array of the UTF-8 string to be updated.

      -
      sendKeyEvent(code)
      sendKeyEvent(code) Sends a key event to a client application.

      code parameter: Key event to be sent.

      -
      setKeyboardSizes(portraitWidth, portraitHeight, landscapeWidth, landscapeHeight)
      setKeyboardSizes(portraitWidth, portraitHeight, landscapeWidth, landscapeHeight) Updates the keyboard window geometry information. -

      You must specify the portrait and landscape sizes of the Web IME using this method, or the Web IME cannot be displayed correctly as the Input Service Engine process cannot resize the IME window to the desired size.

      +

      You must specify the portrait and landscape sizes of the Web IME using this method, or the Web IME cannot be displayed correctly as the Input Service Engine process cannot resize the IME window to the desired size.

      portraitWidth parameter: Width of the keyboard, when in portrait mode.
      portraitHeight parameter: Height of the keyboard, when in portrait mode.
      landscapeWidth parameter: Width of the keyboard, when in landscape mode.
      landscapeHeight parameter: Height of the keyboard, when in landscape mode.

      -
      setSelection(start_index, end_index)
      setSelection(start_index, end_index) Selects text.

      start_index parameter: Text start position.
      end_index parameter: Text end position.

      -
      getSelection()
      getSelection() Gets the selected text. -
      getSurroundingText(maxlen_before, maxlen_after)
      getSurroundingText(maxlen_before, maxlen_after) Selects the surrounding text.

      maxlen_before parameter: Max length before.
      maxlen_after parameter: Max length after.

      -
      deleteSurroundingText(offset, len)
      deleteSurroundingText(offset, len) Deletes the surrounding text.

      offset parameter: Cursor position offset.
      len parameter: Length of the text deletion.

      -
      - +

      The following table lists the WebHelperClient enumerations that you can use when invoking the sendKeyEvent() and forwardKeyEvent() methods of the WebHelperClient object.

      - - -

      Table: WebHelperClient enumerations

      - - - - - - - - - - + diff --git a/org.tizen.guides/html/web/ui/tau/creating_animation_w.htm b/org.tizen.guides/html/web/ui/tau/creating_animation_w.htm index e95b74c..dcd644c 100644 --- a/org.tizen.guides/html/web/ui/tau/creating_animation_w.htm +++ b/org.tizen.guides/html/web/ui/tau/creating_animation_w.htm @@ -47,15 +47,15 @@

      You can import the TAU Animation with HTML:

       <head>
-   <title>TAU Animation Sample</title>
-   <script src="lib/tau/animation/tau.animation.min.js" type="text/javascript"></script>
+   <title>TAU Animation Sample</title>
+   <script src="lib/tau/animation/tau.animation.min.js" type="text/javascript"></script>
 </head>

      tau.animation is the namespace of the TAU Animation. You can call TAU Animation methods through this namespace.

      Note - To get the tau.animation.min.js library, create a new project from the UIComponent sample. The library is included in the sample's lib/tau/animation directory. + To get the tau.animation.min.js library, create a new project from the UIComponent sample. The library is included in the sample's lib/tau/animation directory.

      Creating TAU Animations

      @@ -63,23 +63,23 @@

      The following code snippet shows how to create a TAU Animation:

      -<div id="redBox"
-     style="background-color: 'red'; position:absolute; width:100px; height:100px;"></div>
-<div id="blueBox"
-     style="background-color: 'blue'; position:absolute;
-            width:100px; height:100px; left: 200px;"></div>
+<div id="redBox"
+     style="background-color: 'red'; position:absolute; width:100px; height:100px;"></div>
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute;
+            width:100px; height:100px; left: 200px;"></div>
 
       var t = tau.animation.target;
-t('#redBox').tween('swing', 1000);
-t('#blueBox').tween({rotateZ: 120}, 1000).tween({translateX: 400}, 1000);
+t('#redBox').tween('swing', 1000);
+t('#blueBox').tween({rotateZ: 120}, 1000).tween({translateX: 400}, 1000);
      -

      If you want to animate the HTML element directly, you can use mixin. You can animate any effect, transform, or CSS property. You can use the 'target' method. Like a CSS selector, '.' means class selector, '#' means ID selector. Also, a pure HTML element can be a parameter of the target method.

      +

      If you want to animate the HTML element directly, you can use mixin. You can animate any effect, transform, or CSS property. You can use the 'target' method. Like a CSS selector, '.' means class selector, '#' means ID selector. Also, a pure HTML element can be a parameter of the target method.

      Available animation methods:

      • Predefined effects -

        When the first parameter of the tween() method indicates a string (such as 'swing' above) instead of an object, it is a predefined effect animation. Various predefined effects are available.

        • +

        When the first parameter of the tween() method indicates a string (such as 'swing' above) instead of an object, it is a predefined effect animation. Various predefined effects are available.

      • Chaining

        The blueBox animation above is a type of a connected animation. If animations are connected to the same target object, it is added to the queue. And if the play() method is invoked, all animations in the queue are called in the sequence order.

        • @@ -94,61 +94,61 @@ tween({animation}, {option})
      • transform options:

        translateX, translateY, translateZ, rotateX, rotateY, rotateZ, scaleX, scaleY, skewX, skewY

        • -
      • css options: +
      • css options:

        left, top, width, height, background-color, color, border, border-width, border-color, margin, marginTop, marginRight, marginBottom, marginLeft, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, font-size, line-height, clip-path, background-position, background-size, box-shadow

      -<div id="redBox"
-     style="background-color: 'red'; position:absolute; width:100px; height:100px;">
+<div id="redBox"
+     style="background-color: 'red'; position:absolute; width:100px; height:100px;">
 </div>
 
       var t = tau.animation.target;
-t('#redBox').tween({rotateZ: 120}, 1000); /* Transform */
+t('#redBox').tween({rotateZ: 120}, 1000); /* Transform */
 /* CSS property */
-t('#redBox').tween({backgroundColor: 'red', border: '10px 10px 10px 3px white'}, 1000);
-t('#redBox').tween('swing', 1000).tween('tada', 1000); /* Predefined effect */
+t('#redBox').tween({backgroundColor: 'red', border: '10px 10px 10px 3px white'}, 1000);
+t('#redBox').tween('swing', 1000).tween('tada', 1000); /* Predefined effect */
    • Option

      An option consists of a duration, ease, delay, callback, and stagger. In order to provide better usage, if you want to use only duration, you can set the duration as a number value like in the previous examples. If any other options are needed, you must make an {option} object and insert the duration: value into the object. 

      -<div id="redBox"
-     style="background-color: 'red'; position:absolute; width:100px; height:100px;">
+<div id="redBox"
+     style="background-color: 'red'; position:absolute; width:100px; height:100px;">
 </div>
-<div id="blueBox"
-     style="background-color: 'blue'; position:absolute;
-            width:100px; height:100px; left: 200px;"></div>
-<div class="box"></div>
-<div class="box"></div>
-<div class="box"></div>
-<div class="box"></div>
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute;
+            width:100px; height:100px; left: 200px;"></div>
+<div class="box"></div>
+<div class="box"></div>
+<div class="box"></div>
+<div class="box"></div>
 
       var t = tau.animation.target;
-t('#redBox').tween({rotateZ: 120}, 1000);
-t('#redBox').tween({rotateZ: 120}, {duration: 1000});
+t('#redBox').tween({rotateZ: 120}, 1000);
+t('#redBox').tween({rotateZ: 120}, {duration: 1000});
 /* Result of this tween method is identical with the above method */
-t('#blueBox').tween({rotateZ: 120}, {duration: 1000, ease: 'bounceInOut'});
+t('#blueBox').tween({rotateZ: 120}, {duration: 1000, ease: 'bounceInOut'});
 /* After 500ms, blueBox is rotated */
-t('#blueBox').tween({rotateZ: 120}, {duration: 1000, delay: 500});
-t('#blueBox').tween({rotateZ: 120}, {duration: 1000, onStart: function()
-   {
-      /* Before animation, the text is inserted into blueBox */
-      t('#blueBox').style.innerText = 'start';
-   }, onComplete: function()
-   {
-      /* After animation, blueBox is animated with a predefined effect */
-      t('#blueBox').tween('swing', 1000);
-   }
+t('#blueBox').tween({rotateZ: 120}, {duration: 1000, delay: 500});
+t('#blueBox').tween({rotateZ: 120}, {duration: 1000, onStart: function()
+   {
+      /* Before animation, the text is inserted into blueBox */
+      t('#blueBox').style.innerText = 'start';
+   }, onComplete: function()
+   {
+      /* After animation, blueBox is animated with a predefined effect */
+      t('#blueBox').tween('swing', 1000);
+   }
 });
 /*
-   All boxes that include the className 'box' are
+   All boxes that include the className 'box' are
    rotated sequentially with a 200ms time difference
 */
-t('.box').tween({rotateZ: 120}, {duration: 1000, stagger: 200});
+t('.box').tween({rotateZ: 120}, {duration: 1000, stagger: 200});
      • @@ -157,42 +157,42 @@ t('.box').tween({rotateZ: 120}, {duration: 1000, stagger: 200}); <!DOCTYPE html> <html> <head> -   <style> -      .box -      { -         position: absolute; -         width: 100px; -         height: 100px; -         background-color: red; -         left: 100px; -         top: 100px; -      } -   </style> - -   <title>TAU Animation Sample</title> - -   <!--Load TAU Animation--> -   <script src="lib/tau/animation/tau.animation.min.js" type="text/javascript"></script> + <style> + .box + { + position: absolute; + width: 100px; + height: 100px; + background-color: red; + left: 100px; + top: 100px; + } + </style> + + <title>TAU Animation Sample</title> + + <!--Load TAU Animation--> + <script src="lib/tau/animation/tau.animation.min.js" type="text/javascript"></script> </head> <body> -   <div id="redBox" -        style="background-color: 'red'; position:absolute; width:100px; height:100px;"></div> -   <div id="blueBox" -        style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div> -   <div class="box"></div> -   <div class="box"></div> -   <div class="box"></div> -   <div class="box"></div> - -   <script> -      var t = tau.animation.target; -      /* Single animation */ -      t('#redBox').tween('swing', 1000); -      /* Single animation */ -      t('#blueBox').tween({rotateZ: 120}, 1000).tween({translateX: 400}, 1000); -      /* Group animation */ -      t('.box').tween({translateY: 500}, {duration: 1000, stagger: 200}); -   </script> + <div id="redBox" + style="background-color: 'red'; position:absolute; width:100px; height:100px;"></div> + <div id="blueBox" + style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div> + <div class="box"></div> + <div class="box"></div> + <div class="box"></div> + <div class="box"></div> + + <script> + var t = tau.animation.target; + /* Single animation */ + t('#redBox').tween('swing', 1000); + /* Single animation */ + t('#blueBox').tween({rotateZ: 120}, 1000).tween({translateX: 400}, 1000); + /* Group animation */ + t('.box').tween({translateY: 500}, {duration: 1000, stagger: 200}); + </script> </body> </html> diff --git a/org.tizen.guides/html/web/ui/tau/event_handling_w.htm b/org.tizen.guides/html/web/ui/tau/event_handling_w.htm index d16af52..1b4ab19 100644 --- a/org.tizen.guides/html/web/ui/tau/event_handling_w.htm +++ b/org.tizen.guides/html/web/ui/tau/event_handling_w.htm @@ -76,15 +76,15 @@
      EnumerationDescription
      KeycodeEnumeration values used when invoking the sendKeyEvent() and forwardKeyEvent() methods. + + +

      Table: WebHelperClient enumerations

      + + + + + + + + + - + +
      EnumerationDescription
      KeycodeEnumeration values used when invoking the sendKeyEvent() and forwardKeyEvent() methods.

      Keycode example:

       Keycode:
 {
-   BACKSPACE:0xff08,
-   TAB:0xff09,
-   RETURN:0xff0d,
+   BACKSPACE:0xff08,
+   TAB:0xff09,
+   RETURN:0xff0d,
 
-   ASCIITILDE:0x07e
+   ASCIITILDE:0x07e
 },
      -
      - +

      You can display event notifications, such as client application requesting the IME, on the screen. In these cases, implement the event handlers in your handler object, which you pass as a parameter of the WebHelperClient object initialize() method.

      - +

      The following table lists the events that you can implement in your handler object.

      - -

      Table: Handler events

      - - - - - - - - + +

      Table: Handler events

      +
      EventDescription
      onInit()
      + + + + + + + - + + - + - + + - + - + + - + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + + - - + + - - - + + + + + - - + + - - - + + + + + - - + + - - - + + + + + - - + + + - - + + + - +
      EventDescription
      onInit() Handler for the initialization signal, used when the Web IME framework initialization is finished. -
      onExit()onExit() Handler for the exit signal, used when this Web IME is about to be terminated. -
      onFocusIn(inputContext)onFocusIn(inputContext) Handler for the focus in signal, used to do something when the input context is focused in.

      inputContext parameter: Handle of the client input context that sent this event.

      -
      onFocusOut(inputContext)onFocusOut(inputContext) Handler for the focus out signal, used to do something when the input context is focused out.

      inputContext parameter: Handle of the client input context that sent this event.

      -
      onShow(inputContext)
      onShow(inputContext) Handler for the show signal, used to show the keyboard.

      inputContext parameter: Handle of the client input context that sent this event.

      -
      onHide(inputContext)
      onHide(inputContext) Handler for the hide signal, used to hide the keyboard.

      inputContext parameter: Handle of the client input context that sent this event.

      -
      onSetRotation(degree)
      onSetRotation(degree) Handler for the rotation signal, used to notify that the keyboard is being rotated.

      degree parameter: Angle that this keyboard is being rotated to.

      -
      onUpdateCursorPosition(inputContext, position)
      onUpdateCursorPosition(inputContext, position) Handler for the update cursor position signal, used to let the keyboard get the cursor position information.

      inputContext parameter: Handle of the client input context that sent this event.

      -
      onSetLanguage(language)
      onSetLanguage(language) Handler for the set language signal, used to set the input language.

      language parameter: Language to be set.

      -
      onSetImdata(imdata)
      onSetImdata(imdata) Handler for the set IM data signal, used to send IM data to the keyboard.

      imdata parameter: IM data to be set.

      -
      onGetImdata()
      onGetImdata() Handler for the get IM data signal, used to get IM data from the keyboard.

      This method returns the current IM data value.

      -
      onSetReturnKeyType(type)
      onSetReturnKeyType(type) Handler for the set return key type signal, used to set the return key type to the keyboard. -

      type parameter: Type of the return key to be set; the following values are acceptable:

      +

      type parameter: Type of the return key to be set; the following values are acceptable:

      -"default"
-"done"
-"go"
-"join"
-"login"
-"next"
-"search"
-"send"
-"signin"
+"default"
+"done"
+"go"
+"join"
+"login"
+"next"
+"search"
+"send"
+"signin"
      -
      onGetReturnKeyType()
      onGetReturnKeyType() Handler for the get return key type signal, used to get the return key type from the keyboard.

      This method returns the current return key type value, which is one of the values introduced in the onSetReturnKeyType() event.

      -
      onSetReturnKeyDisable(disabled)
      onSetReturnKeyDisable(disabled) Handler for the set return key disable signal, used to set the return key disabled state to the keyboard.

      disabled parameter: Value that indicates whether the return key must be disabled.

      -
      onGetReturnKeyDisable()
      onGetReturnKeyDisable() Handler for the get return key disable signal, used to get the return key disabled state from the keyboard.

      This method returns the current return key disabled state value.

      -
      onSetLayout(layout)
      onSetLayout(layout) Handler for the set virtual keyboard layout signal, used to set the virtual keyboard layout. -

      layout parameter: Virtual keyboard layout value to be set; the following values are acceptable:

      +

      layout parameter: Virtual keyboard layout value to be set; the following values are acceptable:

      -"normal"
-"number"
-"email"
-"url"
-"phonenumber"
-"ip"
-"month"
-"numberonly"
-"password"
-"datetime"
+"normal"
+"number"
+"email"
+"url"
+"phonenumber"
+"ip"
+"month"
+"numberonly"
+"password"
+"datetime"
      -
      onGetLayout()
      onGetLayout() Handler for the get virtual keyboard layout signal, used to get the virtual keyboard layout.

      This method returns the current virtual keyboard layout value, which is one of the values introduced in onSetLayout() event.

      -
      onResetInputContext(inputContext)
      onResetInputContext(inputContext) Handler for the reset input context signal, used to reset the keyboard input context.

      inputContext parameter: Handle of the client input context that sent this event.

      -
      onProcessKeyEvent(code, mask, layout)
      onProcessKeyEvent(code, mask, layout) Handler for the process key event signal. - +

      code parameter: Key code of the current key event.
      mask parameter: Modifier mask of the current key event.
      layout parameter: Hardware keyboard layout identifier.

      This method returns true if the event is processed; otherwise it is forwarded to the client application.

      -
      onUpdateSurroundingText(cursor, text)
      onUpdateSurroundingText(cursor, text) Handler for the surrounding text signal update. - +

      cursor parameter: Cursor position.
      text parameter: Surrounding text near the cursor.

      -
      onUpdateSelection(text)
      onUpdateSelection(text) Handler for the selection signal update. - +

      text parameter: Currently selected text.

      -
      @@ -380,16 +380,16 @@ Keycode:

      Web IME Configuration

      - -

      The Web IME configuration follows the Tizen packaging policy with certain extensions. Tizen applications are packaged according to the Widget packaging guidelines. For more information about Tizen extensions to configuration elements, see Configuration Elements and Extending Configuration Elements.

      -

      Internally, the application package manager is responsible for installing, uninstalling, and updating packages and storing their information.

      -

      Tizen has the following additional configuration elements:

      -
        + +

        The Web IME configuration follows the Tizen packaging policy with certain extensions. Tizen applications are packaged according to the Widget packaging guidelines. For more information about Tizen extensions to configuration elements, see Configuration Elements and Extending Configuration Elements.

        +

        Internally, the application package manager is responsible for installing, uninstalling, and updating packages and storing their information.

        +

        Tizen has the following additional configuration elements:

        +
        • tizen:category -

          To identify with other IMEs, the Web IME application must contain the UUID information.

          +

          To identify with other IMEs, the Web IME application must contain the UUID information.

          -<tizen:category name="http://tizen.org/category/ime"/>
+<tizen:category name="http://tizen.org/category/ime"/>
        • @@ -407,16 +407,16 @@ Keycode:
        • tizen:languages - -

          The locale string in the <tizen:language> element can be used to display the input language the specific Input Method Editor supports. The <tizen:languages> parent element can have more than 1 <tizen:language> child element.

          + +

          The locale string in the <tizen:language> element can be used to display the input language the specific Input Method Editor supports. The <tizen:languages> parent element can have more than 1 <tizen:language> child element.

           <tizen:languages>
-   <tizen:language>en-us</tizen:language>
-   <tizen:language>en-gb</tizen:language>
+   <tizen:language>en-us</tizen:language>
+   <tizen:language>en-gb</tizen:language>
 </tizen:languages>
          • -
        +
      Note @@ -426,11 +426,11 @@ Keycode:

      Hardware Key Events

      -

      The Web IME is capable of not only showing a soft keyboard and emitting key events to client application, but also handling hardware key events and translating them to a specific language. This is very common when typing texts in CJK (Chinese, Japanese, and Korean) languages, where each key event must be composed to produce a final result string.

      -

      When a hardware key is pressed, the client application receives the key event and requests the Input Service framework to translate the key event. The request is then delivered to the currently selected Web IME through the event handler.

      +

      The Web IME is capable of not only showing a soft keyboard and emitting key events to client application, but also handling hardware key events and translating them to a specific language. This is very common when typing texts in CJK (Chinese, Japanese, and Korean) languages, where each key event must be composed to produce a final result string.

      +

      When a hardware key is pressed, the client application receives the key event and requests the Input Service framework to translate the key event. The request is then delivered to the currently selected Web IME through the event handler.

      -

      When creating the handler object for WebHelperClient, implement the onProcessKeyEvent() method in case you want to translate each hardware key event.

      -

      The following example translates the key event to a string "ㅁ", which is a Korean character mapped to the a key event.

      +

      When creating the handler object for WebHelperClient, implement the onProcessKeyEvent() method in case you want to translate each hardware key event.

      +

      The following example translates the key event to a string "ㅁ", which is a Korean character mapped to the a key event.

      Note @@ -440,98 +440,98 @@ Keycode: 
       var WebHelperClientHandler =
 {
-   onProcessKeyEvent: function(code, mask, layout)
-   {
-      if (code == WebHelperClient.Keycode.a)
-      {
-         WebHelperClient.commitString("ㅁ");
-
-         return true;
-      }
-      else
-      {
-         return false;
-      }
-   }
+   onProcessKeyEvent: function(code, mask, layout)
+   {
+      if (code == WebHelperClient.Keycode.a)
+      {
+         WebHelperClient.commitString("ㅁ");
+
+         return true;
+      }
+      else
+      {
+         return false;
+      }
+   }
 };
 WebHelperClient.initialize(WebHelperClientHandler);
      -

      When the processing of a hardware key event is completed, the onProcessKeyEvent event handler must return true. Otherwise, the client application considers the Web IME as not reacting to the key event, and tries to invoke its fallback handler, which appends an additional a to the committed "ㅁ" string.

      - +

      When the processing of a hardware key event is completed, the onProcessKeyEvent event handler must return true. Otherwise, the client application considers the Web IME as not reacting to the key event, and tries to invoke its fallback handler, which appends an additional a to the committed "ㅁ" string.

      +

      Key Events, Commit Strings, and Pre-edit Strings

      -

      Key events, commit strings and pre-edit strings are needed to send appropriate messages to the client application.

      -

      Key events, when sent to the client application, use the same process as when a hardware key is pressed. Therefore, sending a key event to the client application using the sendKeyEvent() method calls the Web IME onProcessKeyEvent() event handler.

      -

      To prevent the key event from being sent back to the Web IME (as there is no need to translate that key event again), use the forwardKeyEvent() method that invokes the client application's fallback key event handler.

      +

      Key events, commit strings and pre-edit strings are needed to send appropriate messages to the client application.

      +

      Key events, when sent to the client application, use the same process as when a hardware key is pressed. Therefore, sending a key event to the client application using the sendKeyEvent() method calls the Web IME onProcessKeyEvent() event handler.

      +

      To prevent the key event from being sent back to the Web IME (as there is no need to translate that key event again), use the forwardKeyEvent() method that invokes the client application's fallback key event handler.

      -<script type="text/javascript">
-   /* Trigger the Web IME onProcessKeyEvent() event handler */
-   WebHelperClient.sendKeyEvent(WebHelperClient.Keycode.a);
-   /* Do NOT trigger the Web IME onProcessKeyEvent() event handler */
-   WebHelperClient.forwardKeyEvent(WebHelperClient.Keycode.SEMICOLON);
+<script type="text/javascript">
+   /* Trigger the Web IME onProcessKeyEvent() event handler */
+   WebHelperClient.sendKeyEvent(WebHelperClient.Keycode.a);
+   /* Do NOT trigger the Web IME onProcessKeyEvent() event handler */
+   WebHelperClient.forwardKeyEvent(WebHelperClient.Keycode.SEMICOLON);
 </script>
      -

      To send a batch of strings simultaneously, without generating key events for each of the component of a specific string, use the commitString() method:

      +

      To send a batch of strings simultaneously, without generating key events for each of the component of a specific string, use the commitString() method:

       /*
-   Generate the "a" key event in the client application
-   "a" is appended to the client application's editable widget
+   Generate the "a" key event in the client application
+   "a" is appended to the client application's editable widget
 */
 WebHelperClient.forwardKeyEvent(WebHelperClient.Keycode.a);
 /*
-   Append the string "www." to the client application's editable widget,
+   Append the string "www." to the client application's editable widget,
    without generating key events
 */
-WebHelperClient.commitString("www.");
+WebHelperClient.commitString("www.");
      -

      To display a pre-edit string (a string that has not been finalized and can be substituted with another string), use the updatePreeditString() method:

      +

      To display a pre-edit string (a string that has not been finalized and can be substituted with another string), use the updatePreeditString() method:

       /*
-   Show the pre-edit string "abc", usually marked with an underline or highlight,
-   such as "abc" or "abc"
+   Show the pre-edit string "abc", usually marked with an underline or highlight,
+   such as "abc" or "abc"
 */
-WebHelperClient.updatePreeditString("abc");
+WebHelperClient.updatePreeditString("abc");
 /*
-   Substitute the "abc" pre-edit string with a new pre-edit string "def",
-   erasing the existing "abc" pre-edit string and displaying "def"
-   or "def" string on the editable widget
+   Substitute the "abc" pre-edit string with a new pre-edit string "def",
+   erasing the existing "abc" pre-edit string and displaying "def"
+   or "def" string on the editable widget
 */
-WebHelperClient.updatePreeditString("def");
+WebHelperClient.updatePreeditString("def");
      - +

      Web IME Life-cycle

      -

      The Web IME applications have exactly the same life-cycle as the native IME applications. They have 4 states: unloaded, invisible, visible, and terminated.

      -

      A Web IME in the unloaded state is loaded and transferred to the invisible state when:

      -
        -
      • The system starts.
        • +

        The Web IME applications have exactly the same life-cycle as the native IME applications. They have 4 states: unloaded, invisible, visible, and terminated.

        +

        A Web IME in the unloaded state is loaded and transferred to the invisible state when:

        +
          +
        • The system starts.
        • The Web IME is selected in setting the application keyboard selection menu.
        - +

        The invisible state changes to the visible state when the Web IME receives a request from a client application to show the IME, and decides to show itself according to the request. This process is usually initiated by the user touching the editable widget area. In contrast, the visible state changes back to the invisible state when the Web IME receives a hide request message due to the loss of focus in the client application and decides to hide itself. On occasion, the Web IME can hide itself without a request from client application, for example, when the Web IME provides a Hide keyboard button within the soft keyboard, and hides itself when the button is pressed.

        A Web IME in the visible or invisible state can move on to the terminated state when:

        -
          -
        • The system is shut down.
          • +
            +
          • The system is shut down.
          • A different Web IME is selected in setting the application keyboard selection menu.
          - +

          Sample IME Application

          - +

          To create an IME application:

          - -
            + +
            1. To create the Web IME project, launch the Tizen Studio and go to File > New > Tizen Project.
            2. In the Project Wizard, select Template as the project type, WEARABLE profile and applicable version, Web Application type, and Web Input Method Editor template.
            3. Enter the project name and click Finish. -

              Create a Web IME project

              4. +

              Create a Web IME project

            4. Modify the source code in, for example, the index.html and style.css files, as needed.
              5. -
            5. Install the Web IME package on the emulator. To run the application, go to Run As > Tizen Web Application.
              6. +
            6. Install the Web IME package on the emulator. To run the application, go to Run As > Tizen Web Application.
            7. In the emulator, change the default keyboard with the Web IME you developed in Setting > Text input. -

              Setting mainSetting text input

              8. +

              Setting mainSetting text input

            - +
      diff --git a/org.tizen.guides/html/web/text_input/text_input_cover_w.htm b/org.tizen.guides/html/web/text_input/text_input_cover_w.htm index a64510f..e782692 100644 --- a/org.tizen.guides/html/web/text_input/text_input_cover_w.htm +++ b/org.tizen.guides/html/web/text_input/text_input_cover_w.htm @@ -5,13 +5,13 @@ - + - Text Input + Text Input @@ -27,7 +27,7 @@
    • Tizen 2.3.1 and Higher for Wearable
      • - +

      Text Input

      @@ -45,7 +45,7 @@

      You can manage input keys in the application. You can retrieve information about the available keys, and add custom actions to be performed when specific input keys are pressed.

      - +
      diff --git a/org.tizen.guides/html/web/ui/tau/accessibility_w.htm b/org.tizen.guides/html/web/ui/tau/accessibility_w.htm index c43c80d..e3626b9 100644 --- a/org.tizen.guides/html/web/ui/tau/accessibility_w.htm +++ b/org.tizen.guides/html/web/ui/tau/accessibility_w.htm @@ -58,38 +58,38 @@
      • Result: checkbox checked, double tap to uncheck 
        -<div role="checkbox" aria-checked="true" aria-label="double tap to uncheck"></div>
+<div role="checkbox" aria-checked="true" aria-label="double tap to uncheck"></div>
      • Result: test button, double tap to click 
        -<div role="button" aria-label="double tap to click">test</div>
+<div role="button" aria-label="double tap to click">test</div>

      When creating applications that use the Tizen screen reader, keep in mind the following exceptions:

      • If the aria-hidden attribute of an element is set to true, the screen reader does not read the content of the element or its child elements. -

        In the following snippet, the screen reader reads "on", but not "off" or "child".

        +

        In the following snippet, the screen reader reads "on", but not "off" or "child".

        -<div tabindex="0">
-   <div>on</div>
-   <div aria-hidden="true">
-      off
-      <div>child</div>
-   </div>
+<div tabindex="0">
+   <div>on</div>
+   <div aria-hidden="true">
+      off
+      <div>child</div>
+   </div>
 </div>
      • If the role attribute is not defined, it is not read. -

        In the following snippet, the screen reader reads "test", but not "link".

        +

        In the following snippet, the screen reader reads "test", but not "link".

        -<a role="" href="test.html">test</a>
+<a role="" href="test.html">test</a>
      • The screen reader does not read elements that are hidden, for example, if the display property is set to none.

      The <img> element supports the image alt text through the alt attribute:

      -<img src="icon.jpg" alt="icon">
+<img src="icon.jpg" alt="icon">
      diff --git a/org.tizen.guides/html/web/ui/tau/animation_w.htm b/org.tizen.guides/html/web/ui/tau/animation_w.htm index f2fc488..28b3d6c 100644 --- a/org.tizen.guides/html/web/ui/tau/animation_w.htm +++ b/org.tizen.guides/html/web/ui/tau/animation_w.htm @@ -29,7 +29,7 @@

      Related Info

        @@ -92,14 +92,14 @@

        Figure: Target object

        Target object

        -<div id="blueBox" 
-     style="background-color: 'blue'; position:absolute; width:100px; height:100px;">
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute; width:100px; height:100px;">
 </div>
 
         var t = tau.animation.target,
-    blueBox = document.getElementById('blueBox');
-t('#blueBox');
+    blueBox = document.getElementById('blueBox');
+t('#blueBox');
 /* Pure HTML element can be a target */
 t(blueBox);
        @@ -107,16 +107,16 @@ t(blueBox);
      • Create an animation with transform, CSS properties, effects, and ease.

        Once the target object is made, you can create an animation. The animation consists of an animation value including transform, CSS properties, and effect. Basically, an animation option is inserted with the duration of 1 s (1000 ms) only as a default. If you want to add an ease function, delay, loop, or callback, create an object for an animation option.

        -<div id="blueBox"
-     style="background-color: 'blue'; position:absolute; width:100px; height:100px;">
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute; width:100px; height:100px;">
 </div>
 
         var t = tau.animation.target;
-t('#blueBox').tween({translateX: 1000}, {duration: 1000, delay: 500})
-             .tween({scaleX: 1.2, scaleY: 1.2}, {duration: 1000})
-             .tween({rotateZ: 30}, {duration: 1000})
-             .tween({skewX: 30}, {duration: 1000});
+t('#blueBox').tween({translateX: 1000}, {duration: 1000, delay: 500})
+             .tween({scaleX: 1.2, scaleY: 1.2}, {duration: 1000})
+             .tween({rotateZ: 30}, {duration: 1000})
+             .tween({skewX: 30}, {duration: 1000});
      • Put the animations into an animation queue. @@ -130,9 +130,9 @@ t('#blueBox').tween({translateX: 1000}, {duration: 1000, delay: 500})

        In the above queue, there are 4 animations in queue. When all animations are inserted, the animations are popped and animated sequentially by the TweenAnimator.

      • The Ticker calls the requestAnimationFrame() method. -

        The TweenAnimator invokes the play and tick methods in the Ticker. The Ticker calls the on() method, and the on() method includes the requestAnimationFrame() method. The RAF() method is invoked until the TweenAnimator's tick time reaches the end of the duration.

        +

        The TweenAnimator invokes the play and tick methods in the Ticker. The Ticker calls the on() method, and the on() method includes the requestAnimationFrame() method. The RAF() method is invoked until the TweenAnimator's tick time reaches the end of the duration.

        • -
      • During the requestAnimationFrame() method call, the AnimationObject renders the target object and the TweenAnimator's time logic is operating. +
      • During the requestAnimationFrame() method call, the AnimationObject renders the target object and the TweenAnimator's time logic is operating.

        The AnimationObject can get the time value using the calculating animation. The AnimationObject renders the target object based on the time value. If the duration is 1000 (ms), the TweenAnimator gives time 0 through 1000.

        Figure: TweenAnimator

        TweenAnimator

        @@ -151,30 +151,30 @@ tween({animation}, {option});

        {animation} can be various animations, such as transform, CSS property, or predefined effect. Basically, {animation} indicates the destination of the animation. For example, {rotateZ: 90} indicates a rotation from the current value to 90 degrees. To do this, you must set the starting point of the animation, and for this, an additional animation form is provided. {rotateZ: [30, 90]} indicates the changing rotation value of the transform from 30 to 90.

        -<div id="redBox"
-     style="background-color: 'red'; position:absolute; width:100px; height:100px;"></div>
-<div id="blueBox"
-     style="background-color: 'blue'; position:absolute;
-            width:100px; height:100px; left: 200px;"></div>
+<div id="redBox"
+     style="background-color: 'red'; position:absolute; width:100px; height:100px;"></div>
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute;
+            width:100px; height:100px; left: 200px;"></div>
 
         var t = tau.animation.target;
-t('#redBox').tween({translateX: 1000}, 1000); /* Translate from current position to 1000 */
+t('#redBox').tween({translateX: 1000}, 1000); /* Translate from current position to 1000 */
 /* Add left property from current to 200, add top property from 100 to 300 */
-t('#blueBox').tween({left: 200, top: [100, 300]}, 1000);
+t('#blueBox').tween({left: 200, top: [100, 300]}, 1000);

        Chaining

        The animation is inserted to the animation queue automatically before playing. At first, this feature does not seem important for making an animation, but if this method is supported, the LOC (Line Of Code) is decreased significantly.

        -<div id="blueBox"
-     style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div>
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div>
 
         var t = tau.animation.target;
-t('#blueBox').tween({translateX: [500, 1000]}, 1000).tween({translateY: 500}, 1000)
-             .tween({rotateZ: 120}, 1000).tween({skewX: [0, 30]}, 1000)
-             .tween({opacity: [1, 0]}, 1000).tween({opacity: 0.5}, 1000);
+t('#blueBox').tween({translateX: [500, 1000]}, 1000).tween({translateY: 500}, 1000)
+             .tween({rotateZ: 120}, 1000).tween({skewX: [0, 30]}, 1000)
+             .tween({opacity: [1, 0]}, 1000).tween({opacity: 0.5}, 1000);

        Figure: Animation queue and chaining

        @@ -193,82 +193,82 @@ t('#blueBox').tween({translateX: [500, 1000]}, 1000).tween({translateY:

        To make an identical effect, you can make many single animations. The following example shows the shake effect:

        -<div id="blueBox"
-     style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div>
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div>
 
         var t = tau.animation.target;
-t('#blueBox').tween({translateX: -10}, 100);
-t('#blueBox').tween({translateX: 10}, 100);
-t('#blueBox').tween({translateX: -10}, 100);
-t('#blueBox').tween({translateX: 10}, 100);
-t('#blueBox').tween({translateX: -10}, 100);
-t('#blueBox').tween({translateX: 10}, 100);
-t('#blueBox').tween({translateX: -10}, 100);
-t('#blueBox').tween({translateX: 10}, 100);
-t('#blueBox').tween({translateX: -10}, 100);
-t('#blueBox').tween({translateX: 0}, 100);
+t('#blueBox').tween({translateX: -10}, 100);
+t('#blueBox').tween({translateX: 10}, 100);
+t('#blueBox').tween({translateX: -10}, 100);
+t('#blueBox').tween({translateX: 10}, 100);
+t('#blueBox').tween({translateX: -10}, 100);
+t('#blueBox').tween({translateX: 10}, 100);
+t('#blueBox').tween({translateX: -10}, 100);
+t('#blueBox').tween({translateX: 10}, 100);
+t('#blueBox').tween({translateX: -10}, 100);
+t('#blueBox').tween({translateX: 0}, 100);

        Or instead, you can use a predefined animation:

        -<div id="blueBox"
-     style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div>
+<div id="blueBox"
+     style="background-color: 'blue'; position:absolute; width:100px; height:100px;"></div>
 
         var t = tau.animation.target;
-t('#blueBox').tween('shake', 1000);
+t('#blueBox').tween('shake', 1000);

        Group

        -

        Sometimes, you need to animate all objects with the same animation. To make an animation group for this purpose, the target() method is provided. If all classes of DOM are box, you can create a box group. Like a CSS selector, '.' means a class selector and '#' means an ID selector. Also, a pure HTML element can be a parameter of the target() method.

        +

        Sometimes, you need to animate all objects with the same animation. To make an animation group for this purpose, the target() method is provided. If all classes of DOM are box, you can create a box group. Like a CSS selector, '.' means a class selector and '#' means an ID selector. Also, a pure HTML element can be a parameter of the target() method.

        -<div class="box"></div>
-<div class="box"></div>
-<div class="box"></div>
-<div class="box"></div>
+<div class="box"></div>
+<div class="box"></div>
+<div class="box"></div>
+<div class="box"></div>
 
         var t = tau.animation.target;
-t('.box').tween({rotateZ: 120}, 1000);
+t('.box').tween({rotateZ: 120}, 1000);
 /* All DOM are rotated */

        Stagger

        In case of handling an animation group, you can apply a different delay value to a group. The following example shows a delay with the zoomIn effect:

        -<div class='box'></div>
-<div class='box'></div>
-<div class='box'></div>
-<div class='box'></div>
-<div class='box'></div>
+<div class='box'></div>
+<div class='box'></div>
+<div class='box'></div>
+<div class='box'></div>
+<div class='box'></div>
 
         var t = tau.animation.target;
-t('.box').tween('zoomIn', {duration: 1000, stagger: 200});
+t('.box').tween('zoomIn', {duration: 1000, stagger: 200});
 /* Each box is animated with 200 ms time difference */

        Callback

        You can add some actions before and after an animation. If you add the onStart callback, it is invoked before the animation. The onComplete callback is invoked after the animation.

        -<div id='blueBox'></div>
+<div id='blueBox'></div>
 
        var t = tau.animation.target;
-t('#blueBox').tween({translateY: [0, 150], rotateZ: [0, 180]},
+t('#blueBox').tween({translateY: [0, 150], rotateZ: [0, 180]},
 {
-   duration: 1000,
-   onStart: function()
-   {
-      t('#blueBox').innerText = 'start';
-   },
-   onComplete: function()
-   {
-      t('#blueBox').tween({backgroundColor: 'navy'}, {duration: 1000});
-   }
+   duration: 1000,
+   onStart: function()
+   {
+      t('#blueBox').innerText = 'start';
+   },
+   onComplete: function()
+   {
+      t('#blueBox').tween({backgroundColor: 'navy'}, {duration: 1000});
+   }
 });
        -

        In the above animation, the box is translated by Y axis from 0 to 150 and rotated from 0 to 180. Before translating and rotating, the start text is inserted into the box. After translating and rotating, the box's background color is changed to navy.

        +

        In the above animation, the box is translated by Y axis from 0 to 150 and rotated from 0 to 180. Before translating and rotating, the start text is inserted into the box. After translating and rotating, the box's background color is changed to navy.

        diff --git a/org.tizen.guides/html/web/ui/tau/circle_progressbar_ww.htm b/org.tizen.guides/html/web/ui/tau/circle_progressbar_ww.htm index b3f0567..5f9187b 100644 --- a/org.tizen.guides/html/web/ui/tau/circle_progressbar_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/circle_progressbar_ww.htm @@ -49,20 +49,20 @@
      • Edit the HTML code to add the component to your application screen: 
        -<div class="ui-page ui-page-active" id="pageCircleProgressBar"
-     data-enable-page-scroll="false">
-   <header class="ui-header">
-      <h2 class="ui-title">Circle Progress</h2>
-   </header>
-   <div class="ui-content content-padding">
-      <div class="result" id="result"></div>
-   </div>
-   <footer class="ui-footer ui-grid-col-2">
-      <a href="#" class="ui-btn" id="minus">-10%</a>
-      <a href="#" class="ui-btn" id="plus">+10%</a>
-   </footer>
-   <progress class="ui-circle-progress" id="circleprogress"
-             max="100" value="20"></progress>
+<div class="ui-page ui-page-active" id="pageCircleProgressBar"
+     data-enable-page-scroll="false">
+   <header class="ui-header">
+      <h2 class="ui-title">Circle Progress</h2>
+   </header>
+   <div class="ui-content content-padding">
+      <div class="result" id="result"></div>
+   </div>
+   <footer class="ui-footer ui-grid-col-2">
+      <a href="#" class="ui-btn" id="minus">-10%</a>
+      <a href="#" class="ui-btn" id="plus">+10%</a>
+   </footer>
+   <progress class="ui-circle-progress" id="circleprogress"
+             max="100" value="20"></progress>
 </div>
        • @@ -72,32 +72,32 @@ 
         .ui-progressbar-large
 {
-   position: absolute;
-   top: 50%;
-   left: 50%;
-   -webkit-transform: translate3d(-50%, -50%, 0);
+   position: absolute;
+   top: 50%;
+   left: 50%;
+   -webkit-transform: translate3d(-50%, -50%, 0);
 }
 .result
 {
-   font-size: 35px;
-   text-align: center;
-   top: 33%;
-   left: 50%;
-   -webkit-transform: translate3d(-50%, -50%, 0);
-   position: absolute;
+   font-size: 35px;
+   text-align: center;
+   top: 33%;
+   left: 50%;
+   -webkit-transform: translate3d(-50%, -50%, 0);
+   position: absolute;
 }
 
 @media all and (-tizen-geometric-shape: circle)
 {
-   .result
-   {
-      top: 50%;
-      margin: 0;
-   }
-   .ui-footer
-   {
-      display: none;
-   }
+   .result
+   {
+      top: 50%;
+      margin: 0;
+   }
+   .ui-footer
+   {
+      display: none;
+   }
 }
        @@ -107,134 +107,134 @@ 
         (function()
 {
-   var page = document.getElementById("pageCircleProgressBar"),
-       progressBar = document.getElementById("circleprogress"),
-       minusBtn = document.getElementById("minus"),
-       plusBtn = document.getElementById("plus"),
-       resultDiv = document.getElementById("result"),
-       isCircle = tau.support.shape.circle,
-       progressBarWidget,
-       resultText,
-       i;
-
-   function printResult()
-   {
-      resultText = progressBarWidget.value();
-      resultDiv.innerHTML = resultText + "%";
-   };
-
-   function clearVariables()
-   {
-      page = null;
-      progressBar = null;
-      minusBtn = null;
-      plusBtn = null;
-      resultDiv = null;
-   };
-
-   function unbindEvents()
-   {
-      page.removeEventListener("pageshow", pageBeforeShowHandler);
-      page.removeEventListener("pagehide", pageHideHandler);
-      if (isCircle)
-      {
-         document.removeEventListener("rotarydetent", rotaryDetentHandler);
-      }
-      else
-      {
-         minusBtn.removeEventListener("click", minusBtnClickHandler);
-         plusBtn.removeEventListener("click", plusBtnClickHandler);
-      }
-   };
-
-   function minusBtnClickHandler()
-   {
-      i = i - 10;
-      if (i < 0)
-      {
-         i = 0;
-      }
-      progressBarWidget.value(i);
-      printResult();
-   };
-
-   function plusBtnClickHandler()
-   {
-      i = i + 10;
-      if (i > 100)
-      {
-         i = 100;
-      }
-      progressBarWidget.value(i);
-      printResult();
-   };
-
-   function rotaryDetentHandler()
-   {
-      /* Get the rotary direction */
-      var direction = event.detail.direction,
-          value = parseInt(progressBarWidget.value());
-
-      if (direction === "CW")
-      {
-         /* Right direction */
-         if (value < 100)
-         {
-            value++;
-         }
-         else
-         {
-            value = 100;
-         }
-      }
-      else if (direction === "CCW")
-      {
-         /* Left direction */
-         if (value > 0)
-         {
-            value--;
-         }
-         else
-         {
-            value = 0;
-         }
-      }
-
-      progressBarWidget.value(value);
-      printResult();
-   }
-
-   function pageBeforeShowHandler()
-   {
-      if (isCircle)
-      {
-         /* Make the circular progressbar object */
-         progressBarWidget = new tau.widget.CircleProgressBar(progressBar,
-                                                              {size: "full"});
-         document.addEventListener("rotarydetent", rotaryDetentHandler);
-      }
-      else
-      {
-         progressBarWidget = new tau.widget.CircleProgressBar(progressBar,
-                                                              {size: "large"});
-         minusBtn.addEventListener("click", minusBtnClickHandler);
-         plusBtn.addEventListener("click", plusBtnClickHandler);
-      }
-
-      i = parseInt(progressBarWidget.value());
-      resultDiv.innerHTML = i + "%";
-   };
-
-   function pageHideHandler()
-   {
-      unbindEvents();
-      clearVariables();
-      /* Release the object */
-      progressBarWidget.destroy();
-   };
-
-   page.addEventListener("pagebeforeshow", pageBeforeShowHandler);
-   page.addEventListener("pagehide", pageHideHandler);
+   var page = document.getElementById("pageCircleProgressBar"),
+       progressBar = document.getElementById("circleprogress"),
+       minusBtn = document.getElementById("minus"),
+       plusBtn = document.getElementById("plus"),
+       resultDiv = document.getElementById("result"),
+       isCircle = tau.support.shape.circle,
+       progressBarWidget,
+       resultText,
+       i;
+
+   function printResult()
+   {
+      resultText = progressBarWidget.value();
+      resultDiv.innerHTML = resultText + "%";
+   };
+
+   function clearVariables()
+   {
+      page = null;
+      progressBar = null;
+      minusBtn = null;
+      plusBtn = null;
+      resultDiv = null;
+   };
+
+   function unbindEvents()
+   {
+      page.removeEventListener("pageshow", pageBeforeShowHandler);
+      page.removeEventListener("pagehide", pageHideHandler);
+      if (isCircle)
+      {
+         document.removeEventListener("rotarydetent", rotaryDetentHandler);
+      }
+      else
+      {
+         minusBtn.removeEventListener("click", minusBtnClickHandler);
+         plusBtn.removeEventListener("click", plusBtnClickHandler);
+      }
+   };
+
+   function minusBtnClickHandler()
+   {
+      i = i - 10;
+      if (i < 0)
+      {
+         i = 0;
+      }
+      progressBarWidget.value(i);
+      printResult();
+   };
+
+   function plusBtnClickHandler()
+   {
+      i = i + 10;
+      if (i > 100)
+      {
+         i = 100;
+      }
+      progressBarWidget.value(i);
+      printResult();
+   };
+
+   function rotaryDetentHandler()
+   {
+      /* Get the rotary direction */
+      var direction = event.detail.direction,
+          value = parseInt(progressBarWidget.value());
+
+      if (direction === "CW")
+      {
+         /* Right direction */
+         if (value < 100)
+         {
+            value++;
+         }
+         else
+         {
+            value = 100;
+         }
+      }
+      else if (direction === "CCW")
+      {
+         /* Left direction */
+         if (value > 0)
+         {
+            value--;
+         }
+         else
+         {
+            value = 0;
+         }
+      }
+
+      progressBarWidget.value(value);
+      printResult();
+   }
+
+   function pageBeforeShowHandler()
+   {
+      if (isCircle)
+      {
+         /* Make the circular progressbar object */
+         progressBarWidget = new tau.widget.CircleProgressBar(progressBar,
+                                                              {size: "full"});
+         document.addEventListener("rotarydetent", rotaryDetentHandler);
+      }
+      else
+      {
+         progressBarWidget = new tau.widget.CircleProgressBar(progressBar,
+                                                              {size: "large"});
+         minusBtn.addEventListener("click", minusBtnClickHandler);
+         plusBtn.addEventListener("click", plusBtnClickHandler);
+      }
+
+      i = parseInt(progressBarWidget.value());
+      resultDiv.innerHTML = i + "%";
+   };
+
+   function pageHideHandler()
+   {
+      unbindEvents();
+      clearVariables();
+      /* Release the object */
+      progressBarWidget.destroy();
+   };
+
+   page.addEventListener("pagebeforeshow", pageBeforeShowHandler);
+   page.addEventListener("pagehide", pageHideHandler);
 }());
        diff --git a/org.tizen.guides/html/web/ui/tau/circular_ui_ww.htm b/org.tizen.guides/html/web/ui/tau/circular_ui_ww.htm index afd3537..a4bb041 100644 --- a/org.tizen.guides/html/web/ui/tau/circular_ui_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/circular_ui_ww.htm @@ -61,27 +61,27 @@ 
        -<head name="viewport" content="width=device-width, user-scalable=no">
-   <title>Support for Circular UI</title>
-   <link rel="stylesheet" href="tau.css">
-   <!--CSS media query on a link element-->
-   <link rel="stylesheet"
-         media="all and (-tizen-geometric-shape: circle)"
-         href="tau.circle.css">
-   <link rel="stylesheet" href="css/style.css">
+<head name="viewport" content="width=device-width, user-scalable=no">
+   <title>Support for Circular UI</title>
+   <link rel="stylesheet" href="tau.css">
+   <!--CSS media query on a link element-->
+   <link rel="stylesheet"
+         media="all and (-tizen-geometric-shape: circle)"
+         href="tau.circle.css">
+   <link rel="stylesheet" href="css/style.css">
 </head>
 <body>
-   <script type="text/javascript" src="tau.js"></script>
-   <script>
-      if (tau.support.shape.circle)
-      {
-         /* Implement your code for circular UI */
-      }
-      else
-      {
-         /* Implement your code for rectangular UI */
-      }
-   </script>
+   <script type="text/javascript" src="tau.js"></script>
+   <script>
+      if (tau.support.shape.circle)
+      {
+         /* Implement your code for circular UI */
+      }
+      else
+      {
+         /* Implement your code for rectangular UI */
+      }
+   </script>
 </body>
        @@ -120,15 +120,15 @@ 
         .className
 {
-   /* Implement the basic CSS style for all types of devices (rectangular and circular) */
+   /* Implement the basic CSS style for all types of devices (rectangular and circular) */
 }
 
 @media screen and (-tizen-geometric-shape: circle)
 {
-   .className
-   {
-      /* Implement the CSS style to be overridden in circular */
-   }
+   .className
+   {
+      /* Implement the CSS style to be overridden in circular */
+   }
 }
        @@ -138,11 +138,11 @@ 
         if (tau.support.shape.circle)
 {
-   /* Implement your code for circular UI */
+   /* Implement your code for circular UI */
 }
 else
 {
-   /* Implement your code for rectangular UI */
+   /* Implement your code for rectangular UI */
 }
        @@ -158,7 +158,7 @@ else
      Rotary EventsShows how to support the "rotarydetent" event.Shows how to support the "rotarydetent" event.
      Helper Script

      To bind an event callback on the tizenhwkey events, use the following code:

      -window.addEventListener("tizenhwkey", function(ev)
-   {
-      if (ev.keyName == "back")
-      {
-         /* Call window.history.back() to go to previous browser window */
-         /* Call tizen.application.getCurrentApplication().exit() to exit application */
-         /* Add script to add another behavior */
-      }
-   });
+window.addEventListener("tizenhwkey", function(ev)
+   {
+      if (ev.keyName == "back")
+      {
+         /* Call window.history.back() to go to previous browser window */
+         /* Call tizen.application.getCurrentApplication().exit() to exit application */
+         /* Add script to add another behavior */
+      }
+   });

      Exiting the Application with the Back Key

      @@ -94,28 +94,28 @@ window.addEventListener("tizenhwkey", function(ev) 
       (function()
 {
-   window.addEventListener("tizenhwkey", function(ev);
-      {
-         if (ev.keyName === "back")
-         {
-            var page = document.getElementsByClassName("ui-page-active")[0],
-                pageid = page ? page.id: "";
-            if (pageid === "main")
-            {
-               try
-               {
-                  tizen.application.getCurrentApplication().exit();
-               }
-               catch (ignore)
-               {
-               }
-            }
-            else
-            {
-               window.history.back();
-            }
-         }
-      });
+   window.addEventListener("tizenhwkey", function(ev);
+      {
+         if (ev.keyName === "back")
+         {
+            var page = document.getElementsByClassName("ui-page-active")[0],
+                pageid = page ? page.id: "";
+            if (pageid === "main")
+            {
+               try
+               {
+                  tizen.application.getCurrentApplication().exit();
+               }
+               catch (ignore)
+               {
+               }
+            }
+            else
+            {
+               window.history.back();
+            }
+         }
+      });
 }());
      @@ -147,11 +147,11 @@ window.addEventListener("tizenhwkey", function(ev)

      To bind an event callback on rotary events, use the following code:

      -document.addEventListener("rotarydetent", function(ev)
-   {
-      var direction = ev.detail.direction;
-      /* Add behavior for detent detected event with a direction value */
-   });
+document.addEventListener("rotarydetent", function(ev)
+   {
+      var direction = ev.detail.direction;
+      /* Add behavior for detent detected event with a direction value */
+   });
      diff --git a/org.tizen.guides/html/web/ui/tau/footerbutton_ww.htm b/org.tizen.guides/html/web/ui/tau/footerbutton_ww.htm index a11e772..27f77b8 100644 --- a/org.tizen.guides/html/web/ui/tau/footerbutton_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/footerbutton_ww.htm @@ -41,7 +41,7 @@

      The following figures show the layout of the footer button component in a rectangular and circular UI.

      Figure: Footer button component in rectangular and circular devices

      Footer button in a rectangular device Footer button in a circular device

      - +

      Figure: Multiple footer buttons in rectangular and circular devices

      Multiple footer buttons in a rectangular device Multiple footer buttons in a circular device

      The footer button on the circular UI has the ui-bottom-button class. When there are multiple buttons, the other buttons except for the first button use the drawer component in the circular UI.

      @@ -54,17 +54,17 @@

      Edit the HTML code to add the footer button component to your application screen.

      -<div class="ui-page ui-page-active" id="bottomButtonPage">
-   <header class="ui-header">
-      <h2 class="ui-title">Bottom Button</h2>
-   </header>
-   <div class="ui-content content-padding">
-      It was a real pleasure for me to finally get to meet you. My colleagues join me
-      in sending you our holiday greetings.
-   </div>
-   <footer class="ui-footer ui-bottom-button">
-      <a href="#" class="ui-btn">Button</a>
-   </footer>
+<div class="ui-page ui-page-active" id="bottomButtonPage">
+   <header class="ui-header">
+      <h2 class="ui-title">Bottom Button</h2>
+   </header>
+   <div class="ui-content content-padding">
+      It was a real pleasure for me to finally get to meet you. My colleagues join me
+      in sending you our holiday greetings.
+   </div>
+   <footer class="ui-footer ui-bottom-button">
+      <a href="#" class="ui-btn">Button</a>
+   </footer>
 </div>
      @@ -76,32 +76,32 @@

      When there are multiple buttons, the buttons (except for the first button) use the drawer in the circular UI.

      -<div class="ui-page ui-page-active" id="bottomButtonWithMorePage">
-   <header class="ui-header">
-      <h2 class="ui-title">Multiple Buttons</h2>
-   </header>
-   <div class="ui-content content-padding">
-      It was a real pleasure for me to finally get to meet you.
-      My colleagues join me in sending you our holiday greetings.
-   </div>
-
-   <a class="drawer-handler"></a>
-
-   <!--Circle profile-->
-   <div id="moreoptionsDrawer" class="ui-drawer drawer-elem"
-        data-drawer-target="#bottomButtonWithMorePage" data-position="right"
-        data-enable="true" data-drag-edge="1">
-      <div id="selector" class="ui-selector">
-         <div class="ui-item show-icon" data-title="2"></div>
-         <div class="ui-item human-icon" data-title="3"></div>
-      </div>
-   </div>
-
-   <footer class="ui-footer ui-grid-col-3 ui-bottom-button">
-      <a href="#" class="ui-btn">1</a>
-      <a href="#" class="ui-btn">2</a>
-      <a href="#" class="ui-btn">3</a>
-   </footer>
+<div class="ui-page ui-page-active" id="bottomButtonWithMorePage">
+   <header class="ui-header">
+      <h2 class="ui-title">Multiple Buttons</h2>
+   </header>
+   <div class="ui-content content-padding">
+      It was a real pleasure for me to finally get to meet you.
+      My colleagues join me in sending you our holiday greetings.
+   </div>
+
+   <a class="drawer-handler"></a>
+
+   <!--Circle profile-->
+   <div id="moreoptionsDrawer" class="ui-drawer drawer-elem"
+        data-drawer-target="#bottomButtonWithMorePage" data-position="right"
+        data-enable="true" data-drag-edge="1">
+      <div id="selector" class="ui-selector">
+         <div class="ui-item show-icon" data-title="2"></div>
+         <div class="ui-item human-icon" data-title="3"></div>
+      </div>
+   </div>
+
+   <footer class="ui-footer ui-grid-col-3 ui-bottom-button">
+      <a href="#" class="ui-btn">1</a>
+      <a href="#" class="ui-btn">2</a>
+      <a href="#" class="ui-btn">3</a>
+   </footer>
 </div>
      @@ -111,29 +111,29 @@ 
       .drawer-elem
 {
-   display: none;
+   display: none;
 }
 
 @media all and (-tizen-geometric-shape: circle)
 {
-   .drawer-handler
-   {
-      width: 24px;
-      height: 115px;
-      position: fixed;
-      top: 122px;
-      right: 0;
-      color: transparent;
-      background-color: #a4a4a4;
-      -webkit-mask-image: url(/* Image path */);
-      -webkit-mask-size: 18px 36px;
-      -webkit-mask-repeat: no-repeat;
-      -webkit-mask-position: 0 40px;
-   }
-   .ui-bottom-button a + a 
-   {
-       display: none;
-   }
+   .drawer-handler
+   {
+      width: 24px;
+      height: 115px;
+      position: fixed;
+      top: 122px;
+      right: 0;
+      color: transparent;
+      background-color: #a4a4a4;
+      -webkit-mask-image: url(/* Image path */);
+      -webkit-mask-size: 18px 36px;
+      -webkit-mask-repeat: no-repeat;
+      -webkit-mask-position: 0 40px;
+   }
+   .ui-bottom-button a + a
+   {
+       display: none;
+   }
 }
      @@ -142,20 +142,20 @@ 
       (function()
 {
-   var page = document.querySelector("#bottomButtonWithMorePage"),
-       drawer = page.querySelector("#moreoptionsDrawer"),
-       handler = page.querySelector(".ui-more");
-
-   page.addEventListener("pagebeforeshow", function()
-      {
-         if (tau.support.shape.circle)
-         {
-            tau.helper.DrawerMoreStyle.create(drawer,
-            {
-               handler: ".drawer-handler",
-            });
-         }
-      });
+   var page = document.querySelector("#bottomButtonWithMorePage"),
+       drawer = page.querySelector("#moreoptionsDrawer"),
+       handler = page.querySelector(".ui-more");
+
+   page.addEventListener("pagebeforeshow", function()
+      {
+         if (tau.support.shape.circle)
+         {
+            tau.helper.DrawerMoreStyle.create(drawer,
+            {
+               handler: ".drawer-handler",
+            });
+         }
+      });
 })();
      diff --git a/org.tizen.guides/html/web/ui/tau/globalization_w.htm b/org.tizen.guides/html/web/ui/tau/globalization_w.htm index 0fd27ae..e4921c3 100644 --- a/org.tizen.guides/html/web/ui/tau/globalization_w.htm +++ b/org.tizen.guides/html/web/ui/tau/globalization_w.htm @@ -47,7 +47,7 @@

      The TAU Globalize utility supports internationalization and localization. It wraps the Globalize functionality for easy access from Tizen Web applications, and it is extended to support the right-to-left (RTL) languages.

      This feature is supported in mobile and wearable applications only.

      - +

      jQuery and Globalize

      Globalize is a jQuery JavaScript library for internationalization and localization that leverages the official Unicode CLDR JSON data. The library works both for the browser and as a Node.js module. jQuery and Globalize have dependencies with cldr.js, which is a CLDR low-level manipulation tool.

      @@ -64,7 +64,7 @@

      CLDR Data

      -

      The Unicode CLDR provides the key building blocks for software to support the world's languages. It includes:

      +

      The Unicode CLDR provides the key building blocks for software to support the world's languages. It includes:

      • Locale-specific patterns for formatting and parsing dates, times, time zones, numbers, and currency values
      • Translations of names: languages, scripts, countries and regions, currencies, eras, months, weekdays, day periods, time zones, cities, and time units
        • @@ -134,25 +134,25 @@
      • Set the locale using the following example code: 
         var globalize = tau.util.globalize,
-    localeId = "ko-KR";
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ko)
-      {
-         /* "ko" is the Globalize utility instance */
-         console.log(ko.getLocale()); /* "ko" */
-      })
-   })
+    localeId = "ko-KR";
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ko)
+      {
+         /* "ko" is the Globalize utility instance */
+         console.log(ko.getLocale()); /* "ko" */
+      })
+   })

        The setLocale() method is not synchronous, and it returns the deferred object with the methods then(), done(), and fail(). Use these methods to receive the Globalize utility instance.

        You can specify locales in 2 ways using IETF language tags, such as en, pt-BR, or zh-Hant-TW:

          -
        • Specify the locale ID in the lang attribute of the body element, such as <body lang="ko-KR">.
          • -
        • Use a string variable as an input argument of the setLocale() method (for example ko.setLocale("en")) to overwrite the body element setting.
          • +
        • Specify the locale ID in the lang attribute of the body element, such as <body lang="ko-KR">.
          • +
        • Use a string variable as an input argument of the setLocale() method (for example ko.setLocale("en")) to overwrite the body element setting.
        -

        If no lang attribute or setLocale() input argument is defined, the Globalize utility finds the locale by checking the window.navigator.language property. If the check result is false, the utility uses the default locale "en".

        +

        If no lang attribute or setLocale() input argument is defined, the Globalize utility finds the locale by checking the window.navigator.language property. If the check result is false, the utility uses the default locale "en".

        The following table illustrates the locale setting method order.

        Table: Locale setting methods

        @@ -168,7 +168,7 @@ document.addEventListener('pageshow', function() 2 - <body lang="ko-KR"> + <body lang="ko-KR"> 3 @@ -176,7 +176,7 @@ document.addEventListener('pageshow', function() 4 - Default locale "en" + Default locale "en" @@ -239,16 +239,16 @@ document.addEventListener('pageshow', function()
      • formatCurrency(): 
         var globalize = tau.util.globalize,
-    localeId = "ko-KR",
-    currency_unit = "KRW"; /* ISO 4217 */
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ko)
-      {
-         console.log(ko.formatCurrency(69000, currency_unit)); /* ₩69,900 */
-      })
-   })
+    localeId = "ko-KR",
+    currency_unit = "KRW"; /* ISO 4217 */
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ko)
+      {
+         console.log(ko.formatCurrency(69000, currency_unit)); /* ₩69,900 */
+      })
+   })

        For more information, see the currency unit standard in ISO 4217.

        • @@ -256,16 +256,16 @@ document.addEventListener('pageshow', function()
      • formatDate(): 
         var globalize = tau.util.globalize,
-    localeId = "ko-KR",
-    currency_unit = "KRW"; /* ISO 4217 */
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ko)
-         {
-            console.log(ko.formatDate(new Date(), {datetime:"medium"});
-         })
-   })
+    localeId = "ko-KR",
+    currency_unit = "KRW"; /* ISO 4217 */
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ko)
+         {
+            console.log(ko.formatDate(new Date(), {datetime:"medium"});
+         })
+   })

        For more information, see date-formatter.

        • @@ -273,15 +273,15 @@ document.addEventListener('pageshow', function()
      • getCalendar(): 
         var globalize = tau.util.globalize,
-    localeId = "ko-KR";
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ko)
-      {
-         console.log(ko.getCalendar().months.format.wide, undefined, 4));
-      })
-   })
+    localeId = "ko-KR";
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ko)
+      {
+         console.log(ko.getCalendar().months.format.wide, undefined, 4));
+      })
+   })

        The calendar format is specified in the gregorian.json file in the CLDR data.

        • @@ -293,37 +293,37 @@ document.addEventListener('pageshow', function() 
         index.html
 locale
-   en.json
-   ko.json
+   en.json
+   ko.json
      • Create a JSON file for the formatMessage strings (custom locale strings) in locales paths: 
         {
-   "en":
-   {
-      "like":
-      [
-         "{0, plural, offset:1",
-         "=0 {Be the first to like this}",
-         "=1 {You liked this}",
-         "one {You and someone else liked this}",
-         "other {You and # others liked this}",
-         "}"
-      ],
-      "greeting":
-      {
-         "hello":"hello",
-         "bye":"bye"
-      },
-      "longText":
-      [
-         "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi non",
-         "quis exercitationem culpa nesciunt nihil aut nostrum explicabo",
-         "reprehenderit optio amet ab temporibus asperiores quasi cupiditate.",
-         "Voluptatum ducimus voluptates voluptas?"
-      ]
-   }
+   "en":
+   {
+      "like":
+      [
+         "{0, plural, offset:1",
+         "=0 {Be the first to like this}",
+         "=1 {You liked this}",
+         "one {You and someone else liked this}",
+         "other {You and # others liked this}",
+         "}"
+      ],
+      "greeting":
+      {
+         "hello":"hello",
+         "bye":"bye"
+      },
+      "longText":
+      [
+         "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi non",
+         "quis exercitationem culpa nesciunt nihil aut nostrum explicabo",
+         "reprehenderit optio amet ab temporibus asperiores quasi cupiditate.",
+         "Voluptatum ducimus voluptates voluptas?"
+      ]
+   }
 }
        • @@ -331,17 +331,17 @@ locale
      • Call the setLocale() method to load the custom locale files automatically: 
         var globalize = tau.util.globalize,
-    localeId = "ko-KR";
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ko)
-      {
-         console.log(ko.formatMessage("greeting/hello"));
-         console.log(ko.formatMessage("greeting/bye"));
-         console.log(ko.formatMessage("longText"));
-      })
-   })
+    localeId = "ko-KR";
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ko)
+      {
+         console.log(ko.formatMessage("greeting/hello"));
+         console.log(ko.formatMessage("greeting/bye"));
+         console.log(ko.formatMessage("longText"));
+      })
+   })
        • @@ -353,14 +353,14 @@ document.addEventListener('pageshow', function()
      • Create a locale resource in the locales path: 
         {
-   "en":
-   {
-      "formatter":
-      {
-         "welcome":"Hello Mr. {0}",
-         "thankyou":"Bye Mr. {custom}."
-      }
-   }
+   "en":
+   {
+      "formatter":
+      {
+         "welcome":"Hello Mr. {0}",
+         "thankyou":"Bye Mr. {custom}."
+      }
+   }
 }
        • @@ -368,21 +368,21 @@ document.addEventListener('pageshow', function()
      • Use the messageFormatter() method: 
         var globalize = tau.util.globalize,
-    localeId = "en-US";
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(en)
-      {
-         var welcomeFormatter = en.messageFormatter('formatter/welcome'),
-             thankyouFormatter = en.messageFormatter('formatter/thankyou'),
-             welcomeMessageList = ["Tom"],
-             thankyouMessageList = {custom:"Tom"};
-
-         console.log(welcomeFormatter(welcomeMessageList));
-         console.log(thankyouFormatter(thankyouMessageList));
-      })
-   })
+    localeId = "en-US";
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(en)
+      {
+         var welcomeFormatter = en.messageFormatter('formatter/welcome'),
+             thankyouFormatter = en.messageFormatter('formatter/thankyou'),
+             welcomeMessageList = ["Tom"],
+             thankyouMessageList = {custom:"Tom"};
+
+         console.log(welcomeFormatter(welcomeMessageList));
+         console.log(thankyouFormatter(thankyouMessageList));
+      })
+   })
        • @@ -403,21 +403,21 @@ document.addEventListener('pageshow', function()
      • The following example has ar-EG as the given locale, and the language has an RTL direction: 
         var globalize = tau.util.globalize,
-    localeId = "ar-EG";
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ar)
-      {
-         /* Do something */
-      })
-   })
+    localeId = "ar-EG";
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ar)
+      {
+         /* Do something */
+      })
+   })
      • The following example has a DOM of body with a locale-specific CSS named ui-script-direction-rtl: 
        -<body class="ui-script-direction-rtl">
+<body class="ui-script-direction-rtl">
        • @@ -425,12 +425,12 @@ document.addEventListener('pageshow', function() 
         .ui-script-direction-rtl .ui-listview
 {
-   direction: rtl;
+   direction: rtl;
 }
 .ui-script-direction-rtl .ui-li.ui-li-static
 {
-   text-align: right;
-   unicode-bidi: bidi-override;
+   text-align: right;
+   unicode-bidi: bidi-override;
 }
        @@ -439,15 +439,15 @@ document.addEventListener('pageshow', function()

        The following example shows how to use the RTL property in a locale object (the rtl variable). If a given locale has an RTL direction, the variable is true.

         var globalize = tau.util.globalize,
-    localeId = "ar-EG";
-
-document.addEventListener('pageshow', function()
-   {
-      globalize.setLocale(localeId).done(function(ar)
-      {
-         console.log(ar.rtl); /* true */
-      })
-   })
+    localeId = "ar-EG";
+
+document.addEventListener('pageshow', function()
+   {
+      globalize.setLocale(localeId).done(function(ar)
+      {
+         console.log(ar.rtl); /* true */
+      })
+   })
        diff --git a/org.tizen.guides/html/web/ui/tau/header_ww.htm b/org.tizen.guides/html/web/ui/tau/header_ww.htm index 0a83a50..c2d0832 100644 --- a/org.tizen.guides/html/web/ui/tau/header_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/header_ww.htm @@ -44,13 +44,13 @@

        To implement the header component, edit the HTML code to add the header component to your application screen:

        -<div class="ui-page ui-page-active" id="headerPage">
-   <header class="ui-header" id="myHeader">
-      <h2 class="ui-title">Long title with ExpandableHeader</h2>
-   </header>
-   <div class="ui-content content-padding">
-      Header is expandable in Circular UI.
-   </div>
+<div class="ui-page ui-page-active" id="headerPage">
+   <header class="ui-header" id="myHeader">
+      <h2 class="ui-title">Long title with ExpandableHeader</h2>
+   </header>
+   <div class="ui-content content-padding">
+      Header is expandable in Circular UI.
+   </div>
 </div>
        @@ -83,29 +83,29 @@

        The following examples show header events with Marquee.

        -var page = document.querySelector("#myPage");
-
-page.addEventListener("pagebeforeshow", function()
-   {
-      var textElement = page.querySelector(".ui-title"),
-          marquee = new tau.widget.Marquee(textElement);
-   }, false);
-
-page.addEventListener("headercollapse", function()
-   {
-      if (marquee)
-      {
-         marquee.reset();
-      }
-   }, false);
-
-page.addEventListener("headerexpandcomplete", function()
-   {
-      if (marquee)
-      {
-         marquee.start();
-      }
-   }, false);
+var page = document.querySelector("#myPage");
+
+page.addEventListener("pagebeforeshow", function()
+   {
+      var textElement = page.querySelector(".ui-title"),
+          marquee = new tau.widget.Marquee(textElement);
+   }, false);
+
+page.addEventListener("headercollapse", function()
+   {
+      if (marquee)
+      {
+         marquee.reset();
+      }
+   }, false);
+
+page.addEventListener("headerexpandcomplete", function()
+   {
+      if (marquee)
+      {
+         marquee.start();
+      }
+   }, false);
        diff --git a/org.tizen.guides/html/web/ui/tau/helloworld_w.htm b/org.tizen.guides/html/web/ui/tau/helloworld_w.htm index 0175d1a..37a7d94 100644 --- a/org.tizen.guides/html/web/ui/tau/helloworld_w.htm +++ b/org.tizen.guides/html/web/ui/tau/helloworld_w.htm @@ -50,17 +50,17 @@ 
         <!DOCTYPE html>
 <html>
-   <head>
-      <meta name="viewport" content="width=device-width, user-scalable=no"/>
-      <link rel="stylesheet" href="./lib/tau/mobile/theme/default/tau.css"/>
-      <link rel="stylesheet" href="myapp.css"/>
-      <title>Hello TAU</title>
-   </head>
-   <body>
-      <!--HTML BODY CONTENT-->
-      <script type="text/javascript" src="./lib/tau/mobile/js/tau.js"></script>
-      <script src="myapp.js"></script>
-   </body>
+   <head>
+      <meta name="viewport" content="width=device-width, user-scalable=no"/>
+      <link rel="stylesheet" href="./lib/tau/mobile/theme/default/tau.css"/>
+      <link rel="stylesheet" href="myapp.css"/>
+      <title>Hello TAU</title>
+   </head>
+   <body>
+      <!--HTML BODY CONTENT-->
+      <script type="text/javascript" src="./lib/tau/mobile/js/tau.js"></script>
+      <script src="myapp.js"></script>
+   </body>
 </html>
        @@ -68,38 +68,38 @@

        Scaling the UI

        The Tizen Advanced UI (TAU)-based template provides 2 scaling methods: device-width and fixed-width.

          -
        • Device-width scaling +
        • Device-width scaling

          This scaling mode is suited for most mobile devices, such as Tizen, iPhone® and Android®. In this mode, the viewport width is set to device-width, enabling rem scaling using the Rem and Em units. These units calculate the size of a source element automatically based on the container font size (Em) or the base font size (Rem). In Tizen Web applications, a 320 px screen width is assumed.

          -<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
          • -
        • Fixed-width scaling +
        • Fixed-width scaling

          This scaling mode is best suited for Tizen devices, since the entire screen can be scaled on the viewport level. In the viewport scaling mode, set the size of all resources to fit the 360 px screen width.

          You can also use fixed-width scaling if you do not want to scale your application or if you want to set your own scale. In this case, declare a viewport but note that the default viewport scaling is overridden by the declared viewport. In the Tizen Web UI components, viewport scaling is set automatically to device-width:

          -<meta name="viewport"
-      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+<meta name="viewport"
+      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
          -

          To enable fixed-width scaling, the header must contain the <meta name="viewport"> element:

          +

          To enable fixed-width scaling, the header must contain the <meta name="viewport"> element:

          -<meta name="viewport" content="width=360, initial-scale=1, user-scalable=no">
+<meta name="viewport" content="width=360, initial-scale=1, user-scalable=no">

        Importing TAU

        -

        You can import TAU with HTML. For better performance, all CSS files must be included in the header and all script elements must be put before the body element's close tag:

        +

        You can import TAU with HTML. For better performance, all CSS files must be included in the header and all script elements must be put before the body element's close tag:

         <!DOCTYPE html>
 <html>
-   <head>
-      <link rel="stylesheet" href="./lib/tau/mobile/theme/default/tau.css"/>
-   </head>
-   <body>
-      <!--HTML BODY CONTENT-->
-      <script type="text/javascript" src="./lib/tau/mobile/js/tau.js"></script>
-   </body>
+   <head>
+      <link rel="stylesheet" href="./lib/tau/mobile/theme/default/tau.css"/>
+   </head>
+   <body>
+      <!--HTML BODY CONTENT-->
+      <script type="text/javascript" src="./lib/tau/mobile/js/tau.js"></script>
+   </body>
 </html>

        In HTML, use the <script> and <link> elements. These default elements are used to load the basic Tizen Advanced UI (TAU) libraries that must be included in Tizen Web applications. The loaded libraries are:

        @@ -109,37 +109,37 @@

      Running Custom JavaScript and CSS

      -

      You can add an additional <script src="<CUSTOM_LIBRARY>"> or <link rel="stylesheet" src="<CUSTOM_CSS>"> element to include your own scripts and style sheets. However, place them after the default <script> elements, as you can use any TAU APIs provided by the default libraries.

      +

      You can add an additional <script src="<CUSTOM_LIBRARY>"> or <link rel="stylesheet" src="<CUSTOM_CSS>"> element to include your own scripts and style sheets. However, place them after the default <script> elements, as you can use any TAU APIs provided by the default libraries.

      To load your JavaScript file, include the file in the <script> element in the HTML header. Since the TAU files are already loaded, you can use any APIs from these libraries as well.

      -<script src="{YOUR_SCRIPT_PATH}"></script>
+<script src="{YOUR_SCRIPT_PATH}"></script>

      Creating a Page in the Body

      The body section of the HTML file contains 1 or more pages.

      -

      To create a page in <body>, you can use the "ui-page" class with the <div> element:

      +

      To create a page in <body>, you can use the "ui-page" class with the <div> element:

       <body>
-   <div class="ui-page" id="main">
-   </div>
+   <div class="ui-page" id="main">
+   </div>
 </body>

      Each page has a header, mandatory content, and a footer: 

       <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header">
-         <h1>Hello World</h1>
-      </div>
-      <div class="ui-content">
-         <p>Hello TAU!</p>
-      </div>
-      <div class="ui-footer">
-         <button>OK</button>
-      </div>
-   </div>
+   <div class="ui-page" id="main">
+      <div class="ui-header">
+         <h1>Hello World</h1>
+      </div>
+      <div class="ui-content">
+         <p>Hello TAU!</p>
+      </div>
+      <div class="ui-footer">
+         <button>OK</button>
+      </div>
+   </div>
 </body>
      @@ -147,27 +147,27 @@ 
       <!DOCTYPE html>
 <html>
-   <head>
-      <meta name="viewport" content="width=device-width, user-scalable=no"/>
-      <link rel="stylesheet" href="./lib/tau/mobile/theme/default/tau.css"/>
-      <link rel="stylesheet" href="myapp.css"/>
-      <title>Hello TAU</title>
-   </head>
-   <body>
-      <div class="ui-page" id="main">
-         <div class="ui-header">
-            <h1>Hello World</h1>
-         </div>
-         <div class="ui-content">
-            <p>Hello TAU!</p>
-         </div>
-         <div class="ui-footer">
-            <button>OK</button>
-         </div>
-      </div>
-      <script type="text/javascript" src="./lib/tau/mobile/js/tau.js"></script>
-      <script src="myapp.js"></script>
-   </body>
+   <head>
+      <meta name="viewport" content="width=device-width, user-scalable=no"/>
+      <link rel="stylesheet" href="./lib/tau/mobile/theme/default/tau.css"/>
+      <link rel="stylesheet" href="myapp.css"/>
+      <title>Hello TAU</title>
+   </head>
+   <body>
+      <div class="ui-page" id="main">
+         <div class="ui-header">
+            <h1>Hello World</h1>
+         </div>
+         <div class="ui-content">
+            <p>Hello TAU!</p>
+         </div>
+         <div class="ui-footer">
+            <button>OK</button>
+         </div>
+      </div>
+      <script type="text/javascript" src="./lib/tau/mobile/js/tau.js"></script>
+      <script src="myapp.js"></script>
+   </body>
 </html>
      diff --git a/org.tizen.guides/html/web/ui/tau/helper_ww.htm b/org.tizen.guides/html/web/ui/tau/helper_ww.htm index d996a4f..d098bb2 100644 --- a/org.tizen.guides/html/web/ui/tau/helper_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/helper_ww.htm @@ -42,7 +42,7 @@ 
       <script>
-   var helperInstance = tau.helper.<NameSpace>
+   var helperInstance = tau.helper.<NameSpace>
 </script>
      @@ -56,44 +56,44 @@

      The following example shows how to create your own listview style with SnapListMarqueeStyle. In the example, the list item text scrolls horizontally and the sub text appears if the list item is placed in the middle of the screen.

      To create a SnapListMarqueeStyle:

      - +
      1. Edit the HTML code to add the SnapListMarqueeStyle component to your application screen.

        You can add a multiline style listview as follows.

        -<div class="ui-page ui-page-active" id="snaplistTest">
-   <header class="ui-header">
-      <h2 class="ui-title">Bottom Button</h2>
-   </header>
-   <div class="ui-content">
-      <ul class="ui-listview ui-snap-listview expand-list" id="snapList">
-         <li class="li-has-2line">
-            <div class="ui-marquee ui-marquee-gradient">
-               1.SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-2line">
-            <div class="ui-marquee ui-marquee-gradient">
-               2.SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-2line">
-            <div class="ui-marquee ui-marquee-gradient">
-               3.SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-2line">
-            <div class="ui-marquee ui-marquee-gradient">
-               4.SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-      </ul>
-   </div>
+<div class="ui-page ui-page-active" id="snaplistTest">
+   <header class="ui-header">
+      <h2 class="ui-title">Bottom Button</h2>
+   </header>
+   <div class="ui-content">
+      <ul class="ui-listview ui-snap-listview expand-list" id="snapList">
+         <li class="li-has-2line">
+            <div class="ui-marquee ui-marquee-gradient">
+               1.SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-2line">
+            <div class="ui-marquee ui-marquee-gradient">
+               2.SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-2line">
+            <div class="ui-marquee ui-marquee-gradient">
+               3.SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-2line">
+            <div class="ui-marquee ui-marquee-gradient">
+               4.SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+      </ul>
+   </div>
 </div>
        2. @@ -102,26 +102,26 @@ 
         .ui-listview.expand-list li.li-has-2line .ui-marquee
 {
-   -webkit-transform: translate3d(0, 16px, 0);
-   -webkit-transition: all ease .5s;
+   -webkit-transform: translate3d(0, 16px, 0);
+   -webkit-transition: all ease .5s;
 }
 .ui-listview.expand-list li.li-has-2line.ui-snap-listview-selected .ui-marquee
 {
-   -webkit-transform: translate3d(0, 0, 0);
-   -webkit-transition: all ease 1s;
+   -webkit-transform: translate3d(0, 0, 0);
+   -webkit-transition: all ease 1s;
 }
 
 .ui-listview.expand-list li.li-has-2line .ui-li-sub-text
 {
-   -webkit-transform: translate3d(0, -20px, 0);
-   opacity: 0;
-   -webkit-transition: all ease .5s;
+   -webkit-transform: translate3d(0, -20px, 0);
+   opacity: 0;
+   -webkit-transition: all ease .5s;
 }
 .ui-listview.expand-list li.li-has-2line.ui-snap-listview-selected .ui-li-sub-text
 {
-   -webkit-transform: translate3d(0, 0, 0);
-   opacity: 1;
-   -webkit-transition: all ease 1s;
+   -webkit-transform: translate3d(0, 0, 0);
+   opacity: 1;
+   -webkit-transition: all ease 1s;
 }
        @@ -129,19 +129,19 @@
      2. Edit the JavaScript code to make your list into a SnapListMarqueeStyle component and manage the list events: 
         <script>
-var page = document.getElementById("snaplistTest"),
-    list = document.getElementById("snapList"),
-    listHelper;
-
-page.addEventListener("pageshow", function()
-   {
-      listHelper = tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
-   });
-
-page.addEventListener("pagehide", function()
-   {
-      listHelper.destroy();
-   });
+var page = document.getElementById("snaplistTest"),
+    list = document.getElementById("snapList"),
+    listHelper;
+
+page.addEventListener("pageshow", function()
+   {
+      listHelper = tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
+   });
+
+page.addEventListener("pagehide", function()
+   {
+      listHelper.destroy();
+   });
 </script>
        3. @@ -149,7 +149,7 @@ page.addEventListener("pagehide", function()

        The following table shows the options you have in creating your SnapListMarqueeStyle component.

        -

        Table: SnapListMarqueeStyle component options

        +

        Table: SnapListMarqueeStyle component options

        @@ -177,16 +177,16 @@ page.addEventListener("pagehide", function()

        This method is supported since Tizen 2.3.

        The following code example shows the use of the method:

        -<ul class="ui-listview ui-snap-listview" id="snapList">
-   <li>some element or text</li>
+<ul class="ui-listview ui-snap-listview" id="snapList">
+   <li>some element or text</li>
 </ul>
 
 <script>
-   var list = document.getElementById("snapList"),
-       listHelper;
+   var list = document.getElementById("snapList"),
+       listHelper;
 
-   /* Create the helper */
-   listHelper = tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
+   /* Create the helper */
+   listHelper = tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
 </script>
        @@ -195,19 +195,19 @@ page.addEventListener("pagehide", function()

        This method is supported since Tizen 2.3. It has no return value.

        The following code example shows the use of the method:

        -<ul class="ui-listview ui-snap-listview" id="snapList">
-   <li>some element or text</li>
+<ul class="ui-listview ui-snap-listview" id="snapList">
+   <li>some element or text</li>
 </ul>
 
 <script>
-   var list = document.getElementById("snapList"),
-       listHelper;
+   var list = document.getElementById("snapList"),
+       listHelper;
 
-   /* Create the helper */
-   listHelper = tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
+   /* Create the helper */
+   listHelper = tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
 
-   /* Destroy the helper */
-   listHelper.destroy();
+   /* Destroy the helper */
+   listHelper.destroy();
 </script>
        diff --git a/org.tizen.guides/html/web/ui/tau/indexscrollbar_ww.htm b/org.tizen.guides/html/web/ui/tau/indexscrollbar_ww.htm index 3468510..1a8749f 100644 --- a/org.tizen.guides/html/web/ui/tau/indexscrollbar_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/indexscrollbar_ww.htm @@ -50,30 +50,30 @@
        1. Edit the HTML code to add the component to your application screen: 
          -<div class="ui-page ui-page-active" id="pageIndexScrollbar">
-   <header class="ui-header ui-header-small">
-      <h2 class="ui-title ui-title-text-fadeout">Index Scroll Bar</h2>
-   </header>
-   <div id="indexscrollbar"></div>
-   <section class="ui-content">
-      <ul class="ui-listview ui-snap-listview" id="list1">
-         <li class="ui-listview-divider">A</li>
-         <li>Anton</li>
-         <li class="ui-listview-divider">B</li>
-         <li>Barry</li>
-         <li>Bob</li>
-         <li class="ui-listview-divider">C</li>
-         <li>Carry</li>
-         <li class="ui-listview-divider">D</li>
-         <li>Daisy</li>
-         <li class="ui-listview-divider">E</li>
-         <li>Eric</li>
-         <li class="ui-listview-divider">F</li>
-         <li>Fay</li>
-         <li class="ui-listview-divider">G</li>
-         <li>Garry</li>
-       </ul>
-   </section>
+<div class="ui-page ui-page-active" id="pageIndexScrollbar">
+   <header class="ui-header ui-header-small">
+      <h2 class="ui-title ui-title-text-fadeout">Index Scroll Bar</h2>
+   </header>
+   <div id="indexscrollbar"></div>
+   <section class="ui-content">
+      <ul class="ui-listview ui-snap-listview" id="list1">
+         <li class="ui-listview-divider">A</li>
+         <li>Anton</li>
+         <li class="ui-listview-divider">B</li>
+         <li>Barry</li>
+         <li>Bob</li>
+         <li class="ui-listview-divider">C</li>
+         <li>Carry</li>
+         <li class="ui-listview-divider">D</li>
+         <li>Daisy</li>
+         <li class="ui-listview-divider">E</li>
+         <li>Eric</li>
+         <li class="ui-listview-divider">F</li>
+         <li>Fay</li>
+         <li class="ui-listview-divider">G</li>
+         <li>Garry</li>
+       </ul>
+   </section>
 </div>
          2. @@ -81,28 +81,28 @@
        2. Edit the JavaScript code to manage the index scroll bar events and other functionality:

          To create a component selectively:

          -var indexScrollbarElement = document.getElementById("indexscrollbar");
+var indexScrollbarElement = document.getElementById("indexscrollbar");
 
 if (!tau.support.shape.circle)
 {
-   /* Create IndexScrollbar */
-   indexScrollbar = new tau.widget.IndexScrollbar(indexScrollbarElement);
+   /* Create IndexScrollbar */
+   indexScrollbar = new tau.widget.IndexScrollbar(indexScrollbarElement);
 }
 else
 {
-   /* Create CircularIndexScrollbar */
-   indexScrollbar = new tau.widget.CircularIndexScrollbar(indexScrollbarElement);
+   /* Create CircularIndexScrollbar */
+   indexScrollbar = new tau.widget.CircularIndexScrollbar(indexScrollbarElement);
 }

          To use the callback:

          -indexScrollbarElement.addEventListener("select", function(event)
-   {
-      var index = event.detail.index;
-      /* Do something using the index */
-      console.log(index);
-   });
+indexScrollbarElement.addEventListener("select", function(event)
+   {
+      var index = event.detail.index;
+      /* Do something using the index */
+      console.log(index);
+   });

          In the following example, the list scrolls to the position of the list item defined using the ui-listview-divider class, selected by the index scroll bar.

          @@ -111,76 +111,76 @@ indexScrollbarElement.addEventListener("select", function(event) 
           (function()
 {
-   var page = document.getElementById("pageIndexScrollbar"),
-       listviewElement = document.getElementById("list1"),
-       isCircle = tau.support.shape.circle,
-       scroller,
-       indexScrollbar;
-
-   page.addEventListener("pageshow", function(ev)
-      {
-         var indexScrollbarElement = document.getElementById("indexscrollbar"),
-             /* List dividers */
-             listDividers =
-                listviewElement.getElementsByClassName("ui-listview-divider"),
-             dividers = {}, /* Collection of list dividers */
-             indices = [], /* Index list */
-             divider,
-             i, idx;
-
-         /* For all list dividers */
-         for (i = 0; i < listDividers.length; i++)
-         {
-            /* Add the list divider elements to the collection */
-            divider = listDividers[i];
-            idx = divider.innerText;
-            dividers[idx] = divider;
-
-            /* Add the index to the index list */
-            indices.push(idx);
-         }
-
-         scroller = tau.util.selectors.getScrollableParent(listviewElement);
-
-         if (!isCircle)
-         {
-            indexScrollbar = new tau.widget.IndexScrollbar(indexScrollbarElement,
-                                                           {index: indices,
-                                                            container: scroller});
-         }
-         else
-         {
-            /* Create IndexScrollbar */
-            indexScrollbar = new tau.widget.CircularIndexScrollbar(indexScrollbarElement,
-                                                                   {index: indices});
-
-            /* Add SnapListview item "selected" event handler */
-            listviewElement.addEventListener("selected", function(ev)
-            {
-               var indexValue = ev.target.textContent[0];
-               indexScrollbar.value(indexValue);
-            });
-         }
-
-         /* Add IndexScrollbar index "select" event handler */
-         indexScrollbarElement.addEventListener("select", function(ev)
-         {
-            var divider,
-                idx = ev.detail.index;
-
-            divider = dividers[idx];
-            if (divider && scroller)
-            {
-               /* Scroll to the ui-listview-divider element */
-               scroller.scrollTop = divider.offsetTop - scroller.offsetTop;
-            }
-         });
-      });
-
-   page.addEventListener("pagehide", function(ev)
-      {
-         indexScrollbar.destroy();
-      });
+   var page = document.getElementById("pageIndexScrollbar"),
+       listviewElement = document.getElementById("list1"),
+       isCircle = tau.support.shape.circle,
+       scroller,
+       indexScrollbar;
+
+   page.addEventListener("pageshow", function(ev)
+      {
+         var indexScrollbarElement = document.getElementById("indexscrollbar"),
+             /* List dividers */
+             listDividers =
+                listviewElement.getElementsByClassName("ui-listview-divider"),
+             dividers = {}, /* Collection of list dividers */
+             indices = [], /* Index list */
+             divider,
+             i, idx;
+
+         /* For all list dividers */
+         for (i = 0; i < listDividers.length; i++)
+         {
+            /* Add the list divider elements to the collection */
+            divider = listDividers[i];
+            idx = divider.innerText;
+            dividers[idx] = divider;
+
+            /* Add the index to the index list */
+            indices.push(idx);
+         }
+
+         scroller = tau.util.selectors.getScrollableParent(listviewElement);
+
+         if (!isCircle)
+         {
+            indexScrollbar = new tau.widget.IndexScrollbar(indexScrollbarElement,
+                                                           {index: indices,
+                                                            container: scroller});
+         }
+         else
+         {
+            /* Create IndexScrollbar */
+            indexScrollbar = new tau.widget.CircularIndexScrollbar(indexScrollbarElement,
+                                                                   {index: indices});
+
+            /* Add SnapListview item "selected" event handler */
+            listviewElement.addEventListener("selected", function(ev)
+            {
+               var indexValue = ev.target.textContent[0];
+               indexScrollbar.value(indexValue);
+            });
+         }
+
+         /* Add IndexScrollbar index "select" event handler */
+         indexScrollbarElement.addEventListener("select", function(ev)
+         {
+            var divider,
+                idx = ev.detail.index;
+
+            divider = dividers[idx];
+            if (divider && scroller)
+            {
+               /* Scroll to the ui-listview-divider element */
+               scroller.scrollTop = divider.offsetTop - scroller.offsetTop;
+            }
+         });
+      });
+
+   page.addEventListener("pagehide", function(ev)
+      {
+         indexScrollbar.destroy();
+      });
 }());
          3. diff --git a/org.tizen.guides/html/web/ui/tau/list_ww.htm b/org.tizen.guides/html/web/ui/tau/list_ww.htm index 1d56124..25c37a7 100644 --- a/org.tizen.guides/html/web/ui/tau/list_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/list_ww.htm @@ -47,49 +47,49 @@
          1. Edit the HTML code to add the list component to your application screen: 
            -<div class="ui-page ui-page-active" id="snapListPage">
-   <header class="ui-header">
-      <h2 class="ui-title">Snap List</h2>
-   </header>
-   <div class="ui-content">
-      <ul class="ui-listview ui-snap-listview expand-list" id="snapList">
-         <li class="li-has-3line">
-            <div class="ui-marquee ui-marquee-gradient">
-               1.3line SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-3line">
-            <div class="ui-marquee ui-marquee-gradient">
-               2.3line SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-3line">
-            <div class="ui-marquee ui-marquee-gradient">
-               3.3line SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-3line">
-            <div class="ui-marquee ui-marquee-gradient">
-               4.3line SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-         <li class="li-has-3line">
-            <div class="ui-marquee ui-marquee-gradient">
-               5.3line SnapListview with Marquee SnapListview with Marquee
-            </div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-            <div class="li-text-sub ui-li-sub-text">sub-text</div>
-         </li>
-      </ul>
-   </div>
+<div class="ui-page ui-page-active" id="snapListPage">
+   <header class="ui-header">
+      <h2 class="ui-title">Snap List</h2>
+   </header>
+   <div class="ui-content">
+      <ul class="ui-listview ui-snap-listview expand-list" id="snapList">
+         <li class="li-has-3line">
+            <div class="ui-marquee ui-marquee-gradient">
+               1.3line SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-3line">
+            <div class="ui-marquee ui-marquee-gradient">
+               2.3line SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-3line">
+            <div class="ui-marquee ui-marquee-gradient">
+               3.3line SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-3line">
+            <div class="ui-marquee ui-marquee-gradient">
+               4.3line SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+         <li class="li-has-3line">
+            <div class="ui-marquee ui-marquee-gradient">
+               5.3line SnapListview with Marquee SnapListview with Marquee
+            </div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+            <div class="li-text-sub ui-li-sub-text">sub-text</div>
+         </li>
+      </ul>
+   </div>
 </div>
            2. @@ -98,87 +98,87 @@ 
             .ui-listview li .li-text-sub
 {
-   display: block;
-   text-overflow: ellipsis;
-   overflow: hidden;
-   line-height: 32px;
-   color: rgb(51, 51, 51);
+   display: block;
+   text-overflow: ellipsis;
+   overflow: hidden;
+   line-height: 32px;
+   color: rgb(51, 51, 51);
 }
 
 .ui-listview li.li-has-3line
 {
-   padding-top: 0;
-   padding-bottom: 0;
-   height: 115px;
+   padding-top: 0;
+   padding-bottom: 0;
+   height: 115px;
 }
 
 .ui-listview.expand-list li.li-has-3line .ui-marquee
 {
-   -webkit-transform: translate3d(0, 30px, 0);
+   -webkit-transform: translate3d(0, 30px, 0);
 }
 
 .ui-listview.expand-list li.li-has-3line.ui-snap-listview-selected .ui-marquee
 {
-   -webkit-transform: translate3d(0, 0, 0);
-   -webkit-transition: all ease 1s;
+   -webkit-transform: translate3d(0, 0, 0);
+   -webkit-transition: all ease 1s;
 }
 
 .ui-listview.expand-list li.li-has-3line .ui-li-sub-text:nth-child(2)
 {
-   -webkit-transform: translate3d(0, -10px, 0);
-   opacity: 0;
+   -webkit-transform: translate3d(0, -10px, 0);
+   opacity: 0;
 }
 
 .ui-listview.expand-list
 li.li-has-3line.ui-snap-listview-selected .ui-li-sub-text:nth-child(2)
 {
-   -webkit-transform: translate3d(0, 0, 0);
-   opacity: 1;
-   -webkit-transition: all ease 1s;
+   -webkit-transform: translate3d(0, 0, 0);
+   opacity: 1;
+   -webkit-transition: all ease 1s;
 }
 
 .ui-listview.expand-list li.li-has-3line .ui-li-sub-text:last-child
 {
-   -webkit-transform: translate3d(0, -42px, 0);
-   opacity: 0;
+   -webkit-transform: translate3d(0, -42px, 0);
+   opacity: 0;
 }
 
 .ui-listview.expand-list
 li.li-has-3line.ui-snap-listview-selected .ui-li-sub-text:last-child
 {
-   -webkit-transform: translate3d(0, 0, 0);
-   opacity: 1;
-   -webkit-transition: all ease 1s;
+   -webkit-transform: translate3d(0, 0, 0);
+   opacity: 1;
+   -webkit-transition: all ease 1s;
 }
          2. Edit the JavaScript code to manage the list events and other functionality: 
            -var page = document.querySelector("#snapListPage"),
-    listHelper;
-
-page.addEventListener("pagebeforeshow", function()
-   {
-      var list = document.getElementById("snapList");
-
-      if (tau.support.shape.circle)
-      {
-         listHelper =
-            tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
-      }
-   });
-
-page.addEventListener("pagehide", function()
-   {
-      if (tau.support.shape.circle)
-      {
-         if (listHelper)
-         {
-            listHelper.destroy();
-         }
-      }
-   });
+var page = document.querySelector("#snapListPage"),
+    listHelper;
+
+page.addEventListener("pagebeforeshow", function()
+   {
+      var list = document.getElementById("snapList");
+
+      if (tau.support.shape.circle)
+      {
+         listHelper =
+            tau.helper.SnapListMarqueeStyle.create(list, {marqueeDelay: 1000});
+      }
+   });
+
+page.addEventListener("pagehide", function()
+   {
+      if (tau.support.shape.circle)
+      {
+         if (listHelper)
+         {
+            listHelper.destroy();
+         }
+      }
+   });
          diff --git a/org.tizen.guides/html/web/ui/tau/managing_page_w.htm b/org.tizen.guides/html/web/ui/tau/managing_page_w.htm index 182fb9b..95ae77f 100644 --- a/org.tizen.guides/html/web/ui/tau/managing_page_w.htm +++ b/org.tizen.guides/html/web/ui/tau/managing_page_w.htm @@ -78,34 +78,34 @@

          1. Create a single page with the following code:

            -<div class="ui-page">
-   Simple page
+<div class="ui-page">
+   Simple page
 </div>

            To create a page for your application, use the class attribute with the ui-page value. TAU uses that information to properly acquire the div element and bind the DOM element to its JavaScript component implementation.

            2. -

          2. Create a header area by using the class="ui-header" attribute:

            +

          3. Create a header area by using the class="ui-header" attribute:

            -<div class="ui-page">
-   <div class="ui-header">This is a header</div>
+<div class="ui-page">
+   <div class="ui-header">This is a header</div>
 </div>
            4. -

          4. Create a footer area by using the class="ui-footer" attribute:

            +

          5. Create a footer area by using the class="ui-footer" attribute:

            -<div class="ui-page">
-   <div class="ui-footer">This is a footer</div>
+<div class="ui-page">
+   <div class="ui-footer">This is a footer</div>
 </div>
            6. -

          6. Create the main content area by using the class="ui-content" attribute:

            +

          7. Create the main content area by using the class="ui-content" attribute:

            -<div class="ui-page">
-   <div class="ui-header">MyApplication header</div>
-   <div class="ui-content">
-      Hello world!
-   </div>
-   <div class="ui-footer">Application status line</div>
+<div class="ui-page">
+   <div class="ui-header">MyApplication header</div>
+   <div class="ui-content">
+      Hello world!
+   </div>
+   <div class="ui-footer">Application status line</div>
 </div>

            The previous example shows a full page structure. The header and footer areas can contain multiple UI components, such as buttons or images.

            @@ -113,16 +113,16 @@

          8. You can also create a popup for your page:

            -<div class="ui-page">
-   <div class="ui-header">Popup Open Page</div>
-   <div class="ui-content">
-      <a href="#popup" class="ui-btn" data-rel="popup">Popup Open</a>
-   </div>
-
-   <div id="popup" class="ui-popup">
-      <div class="ui-popup-header">Popup Page</div>
-      <div class="ui-popup-content">Popup Content</div>
-   </div>
+<div class="ui-page">
+   <div class="ui-header">Popup Open Page</div>
+   <div class="ui-content">
+      <a href="#popup" class="ui-btn" data-rel="popup">Popup Open</a>
+   </div>
+
+   <div id="popup" class="ui-popup">
+      <div class="ui-popup-header">Popup Page</div>
+      <div class="ui-popup-content">Popup Content</div>
+   </div>
 </div>

            The popup works because TAU opens (makes visible) the page whose id attribute corresponds to the #hashtag page. This is basic page routing; for more information, see Page Routing.

            @@ -132,21 +132,21 @@

            Creating Multiple Pages in One HTML Code

            -

            You can implement a template containing multiple page containers in the application's index.html file.

            +

            You can implement a template containing multiple page containers in the application's index.html file.

            In a multi-page layout, the main page is defined with the ui-page-active class. If no page has the ui-page-active class, the framework automatically sets up the first page in the source order as the main page. You can improve the launch performance by explicitly defining the main page to be displayed first. If the application has to wait for the framework to set up the main page, the page is displayed with some delay only after the framework is fully loaded.

             <body>
-   <div class="ui-page ui-page-active" id="first">
-      <div class="ui-content">
-         <!--CONTENT-->
-      </div>
-   </div>
-
-   <div class="ui-page" id="two">
-      <div class="ui-content">
-         <!--CONTENT-->
-      </div>
-   </div>
+   <div class="ui-page ui-page-active" id="first">
+      <div class="ui-content">
+         <!--CONTENT-->
+      </div>
+   </div>
+
+   <div class="ui-page" id="two">
+      <div class="ui-content">
+         <!--CONTENT-->
+      </div>
+   </div>
 </body>
            @@ -162,31 +162,31 @@

            TAU uses every <a> element in the page and binds routing methods for them. In addition, all button instances that are based on that tag and have a proper href attribute work with the framework router. The active page has a ui-page-active class assigned. Set that class yourself to be sure the correct page is displayed.

             <!--pageOne.html-->
-<div class="ui-page ui-page-active" id="first">
-   <div class="ui-content">
-      <a href="pageTwo.html">Go to page two</a>
-   </div>
+<div class="ui-page ui-page-active" id="first">
+   <div class="ui-content">
+      <a href="pageTwo.html">Go to page two</a>
+   </div>
 </div>
 
 <!--pageTwo.html-->
-<div class="ui-page" id="two">
-   <div class="ui-content">
-      <a href="pageOne.html">Go to page one</a>
-   </div>
+<div class="ui-page" id="two">
+   <div class="ui-content">
+      <a href="pageOne.html">Go to page one</a>
+   </div>
 </div>

            With multiple pages in one HTML code, you can use only the ID of the page in the href attribute:

            -<div class="ui-page ui-page-active" id="first">
-   <div class="ui-content">
-      <a href="#two">Go to page two</a>
-   </div>
+<div class="ui-page ui-page-active" id="first">
+   <div class="ui-content">
+      <a href="#two">Go to page two</a>
+   </div>
 </div>
 
-<div class="ui-page" id="two">
-   <div class="ui-content">
-      <a href="#first">Go to page one</a>
-   </div>
+<div class="ui-page" id="two">
+   <div class="ui-content">
+      <a href="#first">Go to page one</a>
+   </div>
 </div>
            9. @@ -194,53 +194,53 @@

            You can change pages through the TAU API by using the tau.changePage() method:

             <!--pageOne.html-->
-<div class="ui-page ui-page-active" id="first">
-   <div class="ui-content">
-      You are viewing the first page of the example.
-      <button id="first-button">Click here to change to page two</button>
-   </div>
-   <script>
-      var el1 = document.getElementById("first-button");
-      el1.addEventListener("click", function()
-         {
-            tau.changePage("pageTwo.html");
-         });
-   </script>
+<div class="ui-page ui-page-active" id="first">
+   <div class="ui-content">
+      You are viewing the first page of the example.
+      <button id="first-button">Click here to change to page two</button>
+   </div>
+   <script>
+      var el1 = document.getElementById("first-button");
+      el1.addEventListener("click", function()
+         {
+            tau.changePage("pageTwo.html");
+         });
+   </script>
 </div>
 
 <!--pageTwo.html-->
-<div class="ui-page" id="second">
-   <div class="ui-content">
-      This is the second page of the example.
-      <button id="second-button">Click here to change to page one</button>
-   </div>
-   <script>
-      var el2 = document.getElementById("second-button");
-      el2.addEventListener("click", function()
-         {
-            tau.changePage("pageOne.html");
-         });
-   </script>
+<div class="ui-page" id="second">
+   <div class="ui-content">
+      This is the second page of the example.
+      <button id="second-button">Click here to change to page one</button>
+   </div>
+   <script>
+      var el2 = document.getElementById("second-button");
+      el2.addEventListener("click", function()
+         {
+            tau.changePage("pageOne.html");
+         });
+   </script>
 </div>
          9. To load pages from external resources: -

            When an external page is supplied to the routing engine, TAU fetches that page and appends it to the current document, while changing the base element's href attribute to that page path. This ensures that all other resources, such as CSS, JS, or images, are loaded from the correct path without no real page reloads. Instead, TAU simply switches the current page to the new page.

            +

            When an external page is supplied to the routing engine, TAU fetches that page and appends it to the current document, while changing the base element's href attribute to that page path. This ensures that all other resources, such as CSS, JS, or images, are loaded from the correct path without no real page reloads. Instead, TAU simply switches the current page to the new page.

            To load pages from external resources, define the proper local address in the href attribute of the link:

            -<div class="ui-page">
-   <div class="ui-content">
-      <a href="external_text.html">Change to external</a>
-   </div>
+<div class="ui-page">
+   <div class="ui-content">
+      <a href="external_text.html">Change to external</a>
+   </div>
 </div>
            -

            To create an external link that is not supposed to be handled by the TAU router, use the rel="external", data-ajax="false", or target="_self" attribute:

            +

            To create an external link that is not supposed to be handled by the TAU router, use the rel="external", data-ajax="false", or target="_self" attribute:

            -<div class="ui-page">
-   <div class="ui-content">
-      <a href="external_text.html" target="_self">Change to external</a>
-   </div>
+<div class="ui-page">
+   <div class="ui-content">
+      <a href="external_text.html" target="_self">Change to external</a>
+   </div>
 </div>
            10. diff --git a/org.tizen.guides/html/web/ui/tau/moreoptions_ww.htm b/org.tizen.guides/html/web/ui/tau/moreoptions_ww.htm index 5fd6008..c3af15e 100644 --- a/org.tizen.guides/html/web/ui/tau/moreoptions_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/moreoptions_ww.htm @@ -48,49 +48,49 @@
          10. Edit the HTML code to add the more options component to your application screen: 
            -<div id="moreoptionsPage" class="ui-page">
-   <link rel="stylesheet" href="./moreoptions.css">
-   <header class="ui-header ui-has-more">
-      <h2 class="ui-title">More Options</h2>
-      <button type="button" class="ui-more ui-icon-overflow">More Options</button>
-   </header>
-   <div class="ui-content content-padding">
-      It was a real pleasure for me to finally get to meet you. My colleagues join me
-      in sending you our holiday greetings.
-   </div>
-
-   <!--Rectangular profile-->
-   <div id="moreoptionsPopup" class="ui-popup" data-transition="slideup">
-      <div class="ui-popup-header">Options</div>
-      <div class="ui-popup-content">
-         <ul class="ui-listview">
-            <li><a href="#">1</a></li>
-            <li><a href="#">2</a></li>
-            <li><a href="#">3</a></li>
-         </ul>
-      </div>
-   </div>
-
-   <!--Circular profile-->
-   <div id="moreoptionsDrawer" class="ui-drawer"
-        data-drawer-target="#moreoptionsPage" data-position="right"
-        data-enable="true" data-drag-edge="1">
-      <div id="selector" class="ui-selector">
-         <div class="ui-item show-icon" data-title="Show"></div>
-         <div class="ui-item human-icon" data-title="Human"></div>
-         <div class="ui-item delete-icon" data-title="Delete"></div>
-         <div class="ui-item show-icon" data-title="Show"></div>
-         <div class="ui-item human-icon" data-title="Human"></div>
-         <div class="ui-item delete-icon" data-title="Delete"></div>
-         <div class="ui-item x-icon" data-title="X Icon"></div>
-         <div class="ui-item fail-icon" data-title="Fail"></div>
-         <div class="ui-item show-icon" data-title="Show"></div>
-         <div class="ui-item human-icon" data-title="Human"></div>
-         <div class="ui-item delete-icon" data-title="Delete"></div>
-         <div class="ui-item show-icon" data-title="Show"></div>
-         <div class="ui-item human-icon" data-title="Human"></div>
-      </div>
-   </div>
+<div id="moreoptionsPage" class="ui-page">
+   <link rel="stylesheet" href="./moreoptions.css">
+   <header class="ui-header ui-has-more">
+      <h2 class="ui-title">More Options</h2>
+      <button type="button" class="ui-more ui-icon-overflow">More Options</button>
+   </header>
+   <div class="ui-content content-padding">
+      It was a real pleasure for me to finally get to meet you. My colleagues join me
+      in sending you our holiday greetings.
+   </div>
+
+   <!--Rectangular profile-->
+   <div id="moreoptionsPopup" class="ui-popup" data-transition="slideup">
+      <div class="ui-popup-header">Options</div>
+      <div class="ui-popup-content">
+         <ul class="ui-listview">
+            <li><a href="#">1</a></li>
+            <li><a href="#">2</a></li>
+            <li><a href="#">3</a></li>
+         </ul>
+      </div>
+   </div>
+
+   <!--Circular profile-->
+   <div id="moreoptionsDrawer" class="ui-drawer"
+        data-drawer-target="#moreoptionsPage" data-position="right"
+        data-enable="true" data-drag-edge="1">
+      <div id="selector" class="ui-selector">
+         <div class="ui-item show-icon" data-title="Show"></div>
+         <div class="ui-item human-icon" data-title="Human"></div>
+         <div class="ui-item delete-icon" data-title="Delete"></div>
+         <div class="ui-item show-icon" data-title="Show"></div>
+         <div class="ui-item human-icon" data-title="Human"></div>
+         <div class="ui-item delete-icon" data-title="Delete"></div>
+         <div class="ui-item x-icon" data-title="X Icon"></div>
+         <div class="ui-item fail-icon" data-title="Fail"></div>
+         <div class="ui-item show-icon" data-title="Show"></div>
+         <div class="ui-item human-icon" data-title="Human"></div>
+         <div class="ui-item delete-icon" data-title="Delete"></div>
+         <div class="ui-item show-icon" data-title="Show"></div>
+         <div class="ui-item human-icon" data-title="Human"></div>
+      </div>
+   </div>
 </div>
            11. @@ -100,21 +100,21 @@ 
             #moreoptionsDrawer
 {
-   display: none;
+   display: none;
 }
 
 @media all and (-tizen-geometric-shape: circle)
 {
-   #moreoptionsDrawer
-   {
-      display: block;
-      background-color: rgba(255, 255, 255, 0.1);
-      border-radius: 100%;
-   }
-   #moreoptionsPopup
-   {
-      display: none;
-   }
+   #moreoptionsDrawer
+   {
+      display: block;
+      background-color: rgba(255, 255, 255, 0.1);
+      border-radius: 100%;
+   }
+   #moreoptionsPopup
+   {
+      display: none;
+   }
 }
            @@ -124,44 +124,44 @@ 
             (function()
 {
-   var page = document.querySelector("#moreoptionsPage"),
-       popup = page.querySelector("#moreoptionsPopup"),
-       handler = page.querySelector(".ui-more"),
-       drawer = page.querySelector("#moreoptionsDrawer"),
-       selector = page.querySelector("#selector"),
-       helper,
-       clickHandlerBound;
-
-   function clickHandler(event)
-   {
-      tau.openPopup(popup);
-   }
-
-   page.addEventListener("pagebeforeshow", function()
-      {
-         if (tau.support.shape.circle)
-         {
-            helper = tau.helper.DrawerMoreStyle.create(drawer,
-            {
-               handler: ".drawer-handler"
-            });
-         }
-         else
-         {
-            /* Shape is square */
-            clickHandlerBound = clickHandler.bind(null);
-            handler.addEventListener("click", clickHandlerBound);
-         }
-      });
-
-   page.addEventListener("pagebeforehide", function() 
-      {
-         if (tau.support.shape.circle)
-         {
-            handler.removeEventListener("click", clickHandlerBound);
-            helper.destroy();
-         }
-      });
+   var page = document.querySelector("#moreoptionsPage"),
+       popup = page.querySelector("#moreoptionsPopup"),
+       handler = page.querySelector(".ui-more"),
+       drawer = page.querySelector("#moreoptionsDrawer"),
+       selector = page.querySelector("#selector"),
+       helper,
+       clickHandlerBound;
+
+   function clickHandler(event)
+   {
+      tau.openPopup(popup);
+   }
+
+   page.addEventListener("pagebeforeshow", function()
+      {
+         if (tau.support.shape.circle)
+         {
+            helper = tau.helper.DrawerMoreStyle.create(drawer,
+            {
+               handler: ".drawer-handler"
+            });
+         }
+         else
+         {
+            /* Shape is square */
+            clickHandlerBound = clickHandler.bind(null);
+            handler.addEventListener("click", clickHandlerBound);
+         }
+      });
+
+   page.addEventListener("pagebeforehide", function()
+      {
+         if (tau.support.shape.circle)
+         {
+            handler.removeEventListener("click", clickHandlerBound);
+            helper.destroy();
+         }
+      });
 })();
            diff --git a/org.tizen.guides/html/web/ui/tau/notepad_w.htm b/org.tizen.guides/html/web/ui/tau/notepad_w.htm index c9c71a6..8356402 100644 --- a/org.tizen.guides/html/web/ui/tau/notepad_w.htm +++ b/org.tizen.guides/html/web/ui/tau/notepad_w.htm @@ -53,33 +53,33 @@

            Because the application runs on mobile or wearable devices, make sure that you have the correct tau.css styles for the corresponding profile:

            • Mobile: 
              -<link rel="stylesheet" type="text/css"
-      href="lib/tau/mobile/theme/default/tau.min.css"/>
+<link rel="stylesheet" type="text/css"
+      href="lib/tau/mobile/theme/default/tau.min.css"/>
            • Wearable: 
              -<link rel="stylesheet" type="text/css"
-      href="lib/tau/wearable/theme/default/tau.min.css"/>
+<link rel="stylesheet" type="text/css"
+      href="lib/tau/wearable/theme/default/tau.min.css"/>

            Add also your own styles for the application:

            -<link rel="stylesheet" type="text/css" href="css/style.css"/>
+<link rel="stylesheet" type="text/css" href="css/style.css"/>

            The following example shows how the section header looks after editing:

             <head>
-   <meta charset="utf-8"/>
-   <meta name="viewport"
-         content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
-   <meta name="description" content="Tizen basic template generated by Tizen Web IDE"/>
+   <meta charset="utf-8"/>
+   <meta name="viewport"
+         content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+   <meta name="description" content="Tizen basic template generated by Tizen Web IDE"/>
 
-   <title>Notepad</title>
+   <title>Notepad</title>
 
-   <!--Use 'mobile' or 'wearable' to choose the device TAU profile-->
-   <link rel="stylesheet" type="text/css" href="lib/tau/mobile/theme/default/tau.css"/>
-   <link rel="stylesheet" type="text/css" href="css/style.css"/>
+   <!--Use 'mobile' or 'wearable' to choose the device TAU profile-->
+   <link rel="stylesheet" type="text/css" href="lib/tau/mobile/theme/default/tau.css"/>
+   <link rel="stylesheet" type="text/css" href="css/style.css"/>
 </head>
            @@ -88,40 +88,40 @@
          11. The main page is the first page, defined with the div block with the ui-page class and main id.
            1. Add the title header (Notes) for the page: 
              -<div id="main" class="ui-page">
-   <header class="ui-header">
-      <h1>Notes</h1>
-   </header>
+<div id="main" class="ui-page">
+   <header class="ui-header">
+      <h1>Notes</h1>
+   </header>
 </div>
            2. Add content for the main page by adding a div element with the _ui-content class. Add to this a ul element, which creates the list of notes. -

              Set the data-scroll="y" and data-handler="true" attributes.

              +

              Set the data-scroll="y" and data-handler="true" attributes.

              The item in the list is represented as a li element. When a note on the main page is clicked, the application triggers the changepage event to the editor page and shows the item.

              -<div class="ui-content" data-scroll="y" data-handler="true">
-   <ul class="ui-listview" id="notesList"></ul>
+<div class="ui-content" data-scroll="y" data-handler="true">
+   <ul class="ui-listview" id="notesList"></ul>
 </div>
            3. Add a navigation button to the application to change to the editor page. The button is placed in the footer, and it is created from an a element, - which has the id="newBtn" attribute. + which has the id="newBtn" attribute. 
              -<div class="ui-footer">
-   <a class="ui-btn" href="javascript:void()" id="newBtn">New note</a>
+<div class="ui-footer">
+   <a class="ui-btn" href="javascript:void()" id="newBtn">New note</a>
 </div>

            The above examples apply to a wearable application. The following example shows the full code for the main page in a mobile application:

            -<div class="ui-page" id="main">
-   <div class"ui-header" data-position="fixed">
-      <h1>Notes</h1>
-   </div>
-   <div class="ui-content" data-scroll="y" data-handler="true">
-      <ul class="ui-listview" id="notesList"></ul>
-   </div>
-   <div class="ui-footer">
-      <a class="ui-btn" href="javascript:void()" id="newBtn">New note</a>
-   </div>
+<div class="ui-page" id="main">
+   <div class"ui-header" data-position="fixed">
+      <h1>Notes</h1>
+   </div>
+   <div class="ui-content" data-scroll="y" data-handler="true">
+      <ul class="ui-listview" id="notesList"></ul>
+   </div>
+   <div class="ui-footer">
+      <a class="ui-btn" href="javascript:void()" id="newBtn">New note</a>
+   </div>
 </div>
            @@ -132,30 +132,30 @@
          12. On the editing page, the header and footer are similar to the main page. -

            The only difference is that the action triggered after pressing the button adds an item to the items array and adds the item to the top of the visible list. The editing page is defined with a div block with the id="editor" and class="ui-page" attributes.

            +

            The only difference is that the action triggered after pressing the button adds an item to the items array and adds the item to the top of the visible list. The editing page is defined with a div block with the id="editor" and class="ui-page" attributes.

            The editing page is needed for adding or editing a selected note. It has a textarea element to allow the user to edit the selected note.

             <!--This code applies to wearable applications-->
-<div class="ui-page" id="editor">
-   <div class="ui-header">
-      <h1>Editor</h1>
-   </div>
-   <div class="ui-content">
-      <textarea id="editorField" placeholder="enter note"></textarea>
-   </div>
-   <div class="ui-footer">
-      <a href="javascript:void()" id="saveBtn">Save</a>
-   </div>
+<div class="ui-page" id="editor">
+   <div class="ui-header">
+      <h1>Editor</h1>
+   </div>
+   <div class="ui-content">
+      <textarea id="editorField" placeholder="enter note"></textarea>
+   </div>
+   <div class="ui-footer">
+      <a href="javascript:void()" id="saveBtn">Save</a>
+   </div>
 </div>
        3. Link to the TAU library sources and add the script to the application: 
          -<script src="lib/jquery.js"></script>
-<script type="text/javascript" src="lib/tau/mobile/js/tau.js"
-        data-build-remove="false"></script>
-<script src="js/main.js"></script>
+<script src="lib/jquery.js"></script>
+<script type="text/javascript" src="lib/tau/mobile/js/tau.js"
+        data-build-remove="false"></script>
+<script src="js/main.js"></script>

          The index.html file is now ready.

          @@ -165,271 +165,271 @@ 
           a
 {
-   color: #FFF;
+   color: #FFF;
 }
 
 #notesList.ui-listview
 {
-   width: 100%;
+   width: 100%;
 }
 
 #notesList.ui-listview li
 {
-   margin: 0;
-   white-space: nowrap;
+   margin: 0;
+   white-space: nowrap;
 }
 
 #notesList.ui-listview li .ui-inline
 {
-   position: absolute;
-   right: 5px;
-   top: 5px;
+   position: absolute;
+   right: 5px;
+   top: 5px;
 }
 
 #notesList.ui-listview li .ui-swipe-item-cover-inner
 {
-   text-overflow: ellipsis;
-   overflow: hidden;
+   text-overflow: ellipsis;
+   overflow: hidden;
 }
 
 #editor .ui-scrollview-view
 {
-   height: 100%;
+   height: 100%;
 }
 
 #editor textarea
 {
-   height: 95%;
-   width: 100%;
+   height: 95%;
+   width: 100%;
 }
        4. Create the main.js file and create a function to close the application.

          The application is started when the HTML content is ready.

          -document.addEventListener("DOMContentLoaded", function()
-   {
-      'use strict';
-
-      var newBtn = document.getElementById('newBtn'),
-          saveBtn = document.getElementById('saveBtn'),
-          editorField = document.getElementById('editorField'),
-          notesList = document.getElementById('notesList'),
-          editorPage = document.getElementById('editor'),
-
-          mainPageId = '#main',
-          editorPageId = '#editor',
-
-          currentIndex = null,
-
-          EMPTY_CONTENT = '(empty)',
-          STORAGE_KEY = 'notepad';
-
-      /*
-         Get data from local storage
-         @return {Array}
-      */
-      function getStorage(key)
-      {
-         return JSON.parse(window.localStorage.getItem(key)) || false;
-      }
-
-      /*
-         Add data to local storage
-         @param {Array} data
-      */
-      function addStorage(data)
-      {
-         window.localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
-      }
-
-      /*
-         Return current page ID
-         @returns
-      */
-      function getCurrentPageId()
-      {
-         return $('.ui-page:visible')[0].id;
-      }
-
-      /* Refresh current page */
-      function refreshCurrentPage()
-      {
-         $('#' + getCurrentPageId()).trigger('create');
-      }
-
-      /*
-         Get notes from storage
-         @return {Array}
-      */
-      function getNotes()
-      {
-         return getStorage(STORAGE_KEY) || [];
-      }
-
-      /* Clear list with notes */
-      function clearNotesList()
-      {
-         notesList.innerHTML = '';
-      }
-
-      /* Delete note from storage */
-      function deleteNote(index)
-      {
-         var notes = getNotes();
-
-         if (notes[index] !== undefined)
-         {
-            notes.splice(index, 1);
-            addStorage(notes);
-         }
-         else
-         {
-            console.error('deleteNote: note not found');
-         }
-
-         showNotes();
-         refreshCurrentPage();
-         event.stopPropagation();
-      }
-
-      /*
-         Edit note using array index
-         @param index
-      */
-      function editNote(index)
-      {
-         var notes = getNotes();
-
-         if (notes[index] !== undefined)
-         {
-            currentIndex = index;
-            editorField.value = getNotes()[index];
-            tau.changePage(editorPageId);
-         }
-         else
-         {
-            console.error('editNote: note not found');
-            showNotes();
-            refreshCurrentPage();
-         }
-      }
-
-      /* Show all notes extracted from local storage */
-      function showNotes()
-      {
-         var notes = getNotes(),
-             notesLen = notes.length,
-             li = {},
-             swipeCover = {},
-             swipeItem = {},
-             deleteBtn = {},
-             i = 0,
-             notesListInst;
-
-         clearNotesList();
-
-         for (i; i < notesLen; i += 1)
-         {
-            li = document.createElement('li');
-            li.addEventListener('click', editNote.bind(this, i), false);
-
-            deleteBtn = document.createElement('button');
-            deleteBtn.className('ui-btn');
-            deleteBtn.setAttribute('data-inline', 'true');
-            deleteBtn.innerText = 'Delete';
-
-            deleteBtn.addEventListener('click', deleteNote.bind(this, i), false);
-
-            li.innerText = notes[i].replace(/\n/g, ' ') || EMPTY_CONTENT;
-            li.appendChild(deleteBtn);
-            notesList.appendChild(li);
-            notesListInst = tau.widget.getInstance(notesList);
-            tau.widget.Button(deleteBtn);
-            notesListInst.refresh();
-         }
-      }
-
-      /* Clear editor textarea */
-      function clearEditor()
-      {
-         editorField.value = '';
-      }
-
-      /* Save note to storage */
-      function saveNote()
-      {
-         var notes = getNotes();
-
-         if (currentIndex !== null)
-         {
-            notes[currentIndex] = editorField.value;
-         }
-         else
-         {
-            notes.push(editorField.value);
-         }
-
-         addStorage(notes);
-
-         clearEditor();
-         showNotes();
-         tau.changePage(mainPageId);
-      }
-
-      /* New note button handler */
-      function newNote()
-      {
-         currentIndex = null;
-         clearEditor();
-
-         tau.changePage(editorPageId);
-      }
-
-      /* On editor page show handler */
-      function onEditorPageShow()
-      {
-         editorField.focus();
-      }
-
-      /* Attach events */
-      function events()
-      {
-         newBtn.addEventListener('click', newNote);
-         saveBtn.addEventListener('click', saveNote);
-
-         editorPage.addEventListener('pageshow', onEditorPageShow);
-
-         window.addEventListener('tizenhwkey', function(e)
-            {
-               if (e.keyName === "back"
-                  && window.tizen
-                  && window.tizen.application)
-               {
-                  switch (getCurrentPageId())
-                  {
-                     case 'main':
-                        window.tizen.application.getCurrentApplication().exit();
-                        break;
-                     default:
-                        window.history.back();
-                        break;
-                  }
-
-                  return false;
-               }
-            }, false);
-      }
-
-      /* Initialize */
-      function init()
-      {
-         showNotes();
-         events();
-      }
-
-      init();
-   }, false);
+document.addEventListener("DOMContentLoaded", function()
+   {
+      'use strict';
+
+      var newBtn = document.getElementById('newBtn'),
+          saveBtn = document.getElementById('saveBtn'),
+          editorField = document.getElementById('editorField'),
+          notesList = document.getElementById('notesList'),
+          editorPage = document.getElementById('editor'),
+
+          mainPageId = '#main',
+          editorPageId = '#editor',
+
+          currentIndex = null,
+
+          EMPTY_CONTENT = '(empty)',
+          STORAGE_KEY = 'notepad';
+
+      /*
+         Get data from local storage
+         @return {Array}
+      */
+      function getStorage(key)
+      {
+         return JSON.parse(window.localStorage.getItem(key)) || false;
+      }
+
+      /*
+         Add data to local storage
+         @param {Array} data
+      */
+      function addStorage(data)
+      {
+         window.localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
+      }
+
+      /*
+         Return current page ID
+         @returns
+      */
+      function getCurrentPageId()
+      {
+         return $('.ui-page:visible')[0].id;
+      }
+
+      /* Refresh current page */
+      function refreshCurrentPage()
+      {
+         $('#' + getCurrentPageId()).trigger('create');
+      }
+
+      /*
+         Get notes from storage
+         @return {Array}
+      */
+      function getNotes()
+      {
+         return getStorage(STORAGE_KEY) || [];
+      }
+
+      /* Clear list with notes */
+      function clearNotesList()
+      {
+         notesList.innerHTML = '';
+      }
+
+      /* Delete note from storage */
+      function deleteNote(index)
+      {
+         var notes = getNotes();
+
+         if (notes[index] !== undefined)
+         {
+            notes.splice(index, 1);
+            addStorage(notes);
+         }
+         else
+         {
+            console.error('deleteNote: note not found');
+         }
+
+         showNotes();
+         refreshCurrentPage();
+         event.stopPropagation();
+      }
+
+      /*
+         Edit note using array index
+         @param index
+      */
+      function editNote(index)
+      {
+         var notes = getNotes();
+
+         if (notes[index] !== undefined)
+         {
+            currentIndex = index;
+            editorField.value = getNotes()[index];
+            tau.changePage(editorPageId);
+         }
+         else
+         {
+            console.error('editNote: note not found');
+            showNotes();
+            refreshCurrentPage();
+         }
+      }
+
+      /* Show all notes extracted from local storage */
+      function showNotes()
+      {
+         var notes = getNotes(),
+             notesLen = notes.length,
+             li = {},
+             swipeCover = {},
+             swipeItem = {},
+             deleteBtn = {},
+             i = 0,
+             notesListInst;
+
+         clearNotesList();
+
+         for (i; i < notesLen; i += 1)
+         {
+            li = document.createElement('li');
+            li.addEventListener('click', editNote.bind(this, i), false);
+
+            deleteBtn = document.createElement('button');
+            deleteBtn.className('ui-btn');
+            deleteBtn.setAttribute('data-inline', 'true');
+            deleteBtn.innerText = 'Delete';
+
+            deleteBtn.addEventListener('click', deleteNote.bind(this, i), false);
+
+            li.innerText = notes[i].replace(/\n/g, ' ') || EMPTY_CONTENT;
+            li.appendChild(deleteBtn);
+            notesList.appendChild(li);
+            notesListInst = tau.widget.getInstance(notesList);
+            tau.widget.Button(deleteBtn);
+            notesListInst.refresh();
+         }
+      }
+
+      /* Clear editor textarea */
+      function clearEditor()
+      {
+         editorField.value = '';
+      }
+
+      /* Save note to storage */
+      function saveNote()
+      {
+         var notes = getNotes();
+
+         if (currentIndex !== null)
+         {
+            notes[currentIndex] = editorField.value;
+         }
+         else
+         {
+            notes.push(editorField.value);
+         }
+
+         addStorage(notes);
+
+         clearEditor();
+         showNotes();
+         tau.changePage(mainPageId);
+      }
+
+      /* New note button handler */
+      function newNote()
+      {
+         currentIndex = null;
+         clearEditor();
+
+         tau.changePage(editorPageId);
+      }
+
+      /* On editor page show handler */
+      function onEditorPageShow()
+      {
+         editorField.focus();
+      }
+
+      /* Attach events */
+      function events()
+      {
+         newBtn.addEventListener('click', newNote);
+         saveBtn.addEventListener('click', saveNote);
+
+         editorPage.addEventListener('pageshow', onEditorPageShow);
+
+         window.addEventListener('tizenhwkey', function(e)
+            {
+               if (e.keyName === "back"
+                  && window.tizen
+                  && window.tizen.application)
+               {
+                  switch (getCurrentPageId())
+                  {
+                     case 'main':
+                        window.tizen.application.getCurrentApplication().exit();
+                        break;
+                     default:
+                        window.history.back();
+                        break;
+                  }
+
+                  return false;
+               }
+            }, false);
+      }
+
+      /* Initialize */
+      function init()
+      {
+         showNotes();
+         events();
+      }
+
+      init();
+   }, false);

          Now the application is ready and you can deploy it to a device or emulator.

          5. diff --git a/org.tizen.guides/html/web/ui/tau/popup_ww.htm b/org.tizen.guides/html/web/ui/tau/popup_ww.htm index 69bce4f..dcf8991 100644 --- a/org.tizen.guides/html/web/ui/tau/popup_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/popup_ww.htm @@ -5,7 +5,7 @@ - + @@ -55,38 +55,38 @@

          Edit the HTML code to add the bottom popup button component to your application screen. To add the bottom button to the circular UI, you must add the ui-bottom-button class to the popup footer. The popup can have only 1 bottom button.

          -<div id="bottomBtnPopup" class="ui-popup">
-   <div class="ui-popup-content">
-      Turning on Power
-      saving mode will
-      limit the maximum
-      power
-   </div>
-   <div class="ui-popup-footer ui-bottom-button">
-      <button id="bottomBtn" class="ui-btn">Check</button>
-   </div>
+<div id="bottomBtnPopup" class="ui-popup">
+   <div class="ui-popup-content">
+      Turning on Power
+      saving mode will
+      limit the maximum
+      power
+   </div>
+   <div class="ui-popup-footer ui-bottom-button">
+      <button id="bottomBtn" class="ui-btn">Check</button>
+   </div>
 </div>
          -
        5. To implement a side popup button component: +
        6. To implement a side popup button component:

          Edit the HTML code to add the side popup button component to your application screen. To add side buttons for the circular UI, you must add the ui-side-button class to the popup footer. The popup can have only 2 side buttons.

           <style>
-   .btn-icon-cancel::before {-webkit-mask-image: url(./cancel.png)}
-   .btn-icon-ok::before {-webkit-mask-image: url(./ok.png)}
+   .btn-icon-cancel::before {-webkit-mask-image: url(./cancel.png)}
+   .btn-icon-ok::before {-webkit-mask-image: url(./ok.png)}
 </style>
-<div id="sideBtnPopup" class="ui-popup">
-   <div class="ui-popup-content">
-      Turning on Power
-      saving mode will
-      limit the maximum
-      power
-   </div>
-   <div class="ui-popup-footer ui-grid-col-2 ui-side-button">
-      <button id="sideBtn-1" class="ui-btn btn-icon-cancel">Cancel</button>
-      <button id="sideBtn-2" class="ui-btn btn-icon-ok">OK</button>
-   </div>
+<div id="sideBtnPopup" class="ui-popup">
+   <div class="ui-popup-content">
+      Turning on Power
+      saving mode will
+      limit the maximum
+      power
+   </div>
+   <div class="ui-popup-footer ui-grid-col-2 ui-side-button">
+      <button id="sideBtn-1" class="ui-btn btn-icon-cancel">Cancel</button>
+      <button id="sideBtn-2" class="ui-btn btn-icon-ok">OK</button>
+   </div>
 </div>
          7. diff --git a/org.tizen.guides/html/web/ui/tau/processing_ww.htm b/org.tizen.guides/html/web/ui/tau/processing_ww.htm index 22cb9d7..6c10379 100644 --- a/org.tizen.guides/html/web/ui/tau/processing_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/processing_ww.htm @@ -47,17 +47,17 @@
          1. Edit the HTML code to add the processing component to your application screen: 
            -<div class="ui-page ui-page-active" id="pageProcessing" data-enable-page-scroll="false">
-   <header class="ui-header">
-      <h2 class="ui-title">Processing</h2>
-   </header>
-   <div class="ui-content content-padding">
-      <div class="ui-processing"></div>
-      <div class="ui-processing-text">
-         Description about progress
-      </div>
-   </div>
-   <div class="ui-processing ui-processing-full-size"></div>
+<div class="ui-page ui-page-active" id="pageProcessing" data-enable-page-scroll="false">
+   <header class="ui-header">
+      <h2 class="ui-title">Processing</h2>
+   </header>
+   <div class="ui-content content-padding">
+      <div class="ui-processing"></div>
+      <div class="ui-processing-text">
+         Description about progress
+      </div>
+   </div>
+   <div class="ui-processing ui-processing-full-size"></div>
 </div>
            2. @@ -66,19 +66,19 @@ 
             .ui-processing-full-size
 {
-   display: none;
+   display: none;
 }
 
 @media all and (-tizen-geometric-shape: circle)
 {
-   .ui-processing
-   {
-      display: none;
-   }
-   .ui-processing.ui-processing-full-size
-   {
-      display: block;
-   }
+   .ui-processing
+   {
+      display: none;
+   }
+   .ui-processing.ui-processing-full-size
+   {
+      display: block;
+   }
 }
            diff --git a/org.tizen.guides/html/web/ui/tau/tau_porting_w.htm b/org.tizen.guides/html/web/ui/tau/tau_porting_w.htm index 4ce2ee8..a067218 100644 --- a/org.tizen.guides/html/web/ui/tau/tau_porting_w.htm +++ b/org.tizen.guides/html/web/ui/tau/tau_porting_w.htm @@ -35,7 +35,7 @@

            Related Info

            @@ -61,13 +61,13 @@ 
             <html>
-   <head>
-      <script type="text/javascript" src="../lib/tau/mobile/js/tau.js"></script>
-      <script type="text/javascript" src="../lib/tau/mobile/js/tau.support-2.3.js"></script>
-      <link rel="stylesheet" href="../lib/tau/mobile/theme/default/tau.css">
-      <link rel="stylesheet" href="../lib/tau/mobile/theme/default/tau.support-2.3.css">
-      <link rel="stylesheet" href="css/custom.css">
-   </head>
+   <head>
+      <script type="text/javascript" src="../lib/tau/mobile/js/tau.js"></script>
+      <script type="text/javascript" src="../lib/tau/mobile/js/tau.support-2.3.js"></script>
+      <link rel="stylesheet" href="../lib/tau/mobile/theme/default/tau.css">
+      <link rel="stylesheet" href="../lib/tau/mobile/theme/default/tau.support-2.3.css">
+      <link rel="stylesheet" href="css/custom.css">
+   </head>
 </html>
            @@ -78,33 +78,33 @@

            Component Definitions

            -

            Since Tizen 2.4, it is strongly recommended to use the class selector to define the components in HTML files. The "data-role" selector has been deprecated and is no longer supported.

            +

            Since Tizen 2.4, it is strongly recommended to use the class selector to define the components in HTML files. The "data-role" selector has been deprecated and is no longer supported.

            -

            The class selectors in TAU are composed with the "ui-" prefix and followed by the <COMPONENT_NAME>. For more information, see UI Component API Reference.

            +

            The class selectors in TAU are composed with the "ui-" prefix and followed by the <COMPONENT_NAME>. For more information, see UI Component API Reference.

            The following example shows how to define the UI components before and after:

            • Before: 
               <!--Create Expandable component-->
-<div data-role="expandable">
-   <h1>Expandable head</h1>
-   <div>Content</div>
+<div data-role="expandable">
+   <h1>Expandable head</h1>
+   <div>Content</div>
 </div>
 
 <!--Create ToggleSwitch component-->
-<select data-role="toggleswitch">
-   <option value="off"></option>
-   <option value="on"></option>
+<select data-role="toggleswitch">
+   <option value="off"></option>
+   <option value="on"></option>
 </select>
 
 <!--Create SectionChanger component-->
-<div data-role="section-changer">
-   <div>
-      <section>
-         <h3>LEFT1 PAGE</h3>
-      </section>
-   </div>
+<div data-role="section-changer">
+   <div>
+      <section>
+         <h3>LEFT1 PAGE</h3>
+      </section>
+   </div>
 </div>
              @@ -116,24 +116,24 @@
            • After: 
               <!--Create Expandable component-->
-<div class="ui-expandable">
-   <h1>Expandable head</h1>
-   <div>Content</div>
+<div class="ui-expandable">
+   <h1>Expandable head</h1>
+   <div>Content</div>
 </div>
 
 <!--Create ToggleSwitch component-->
-<select class="ui-toggleswitch">
-   <option value="off"></option>
-   <option value="on"></option>
+<select class="ui-toggleswitch">
+   <option value="off"></option>
+   <option value="on"></option>
 </select>
 
 <!--Create SectionChanger component-->
-<div class="ui-section-changer">
-   <div>
-      <section>
-         <h3>LEFT1 PAGE</h3>
-      </section>
-   </div>
+<div class="ui-section-changer">
+   <div>
+      <section>
+         <h3>LEFT1 PAGE</h3>
+      </section>
+   </div>
 </div>
              • @@ -259,7 +259,7 @@
        - + @@ -293,111 +293,111 @@
      3. CheckboxRadio

        Before:

        -<input type="checkbox" name="checkbox-1" id="checkbox-1"/>
-<input type="radio" name="radio-1" id="radio-1"/>
+<input type="checkbox" name="checkbox-1" id="checkbox-1"/>
+<input type="radio" name="radio-1" id="radio-1"/>
 
 <script>
-   var element1 = document.getElementById("checkbox-1"),
-       element2 = document.getElementById("radio-1"),
-       checkboxWidget = tau.widget.Checkboxradio(element1),
-       radioWidget = tau.widget.Checkboxradio(element2);
+   var element1 = document.getElementById("checkbox-1"),
+       element2 = document.getElementById("radio-1"),
+       checkboxWidget = tau.widget.Checkboxradio(element1),
+       radioWidget = tau.widget.Checkboxradio(element2);
 
-   checkboxWidget.enable();
-   radioWidget.disable();
+   checkboxWidget.enable();
+   radioWidget.disable();
 </script>

        After:

        -<input type="checkbox" name="checkbox-1" id="checkbox-1"/>
-<input type="radio" name="radio-1" id="radio-1"/>
+<input type="checkbox" name="checkbox-1" id="checkbox-1"/>
+<input type="radio" name="radio-1" id="radio-1"/>
 
 <script>
-   var element1 = document.getElementById("checkbox-1"),
-       element2 = document.getElementById("radio-1"),
-       checkboxWidget = tau.widget.Checkbox(element1),
-       radioWidget = tau.widget.Radio(element2);
+   var element1 = document.getElementById("checkbox-1"),
+       element2 = document.getElementById("radio-1"),
+       checkboxWidget = tau.widget.Checkbox(element1),
+       radioWidget = tau.widget.Radio(element2);
 
-   checkboxWidget.enable();
-   radioWidget.disable();
+   checkboxWidget.enable();
+   radioWidget.disable();
 </script>
      4. Collapsible

        Before:

        -<ul data-role="listview">
-   <li id="collapsible" data-role="collapsible" data-inset="false">
-      <h2>Collapsible head</h2>
-      <!--Sub list in collapsible li-->
-      <ul data-role="listview">
-         <li>sub list item1</li>
-         <li>sub list item2</li>
-      </ul>
-   </li>
-   <!--List item in 1st depth-->
-   <li>other list item</li>
-   <li>other list item</li>
+<ul data-role="listview">
+   <li id="collapsible" data-role="collapsible" data-inset="false">
+      <h2>Collapsible head</h2>
+      <!--Sub list in collapsible li-->
+      <ul data-role="listview">
+         <li>sub list item1</li>
+         <li>sub list item2</li>
+      </ul>
+   </li>
+   <!--List item in 1st depth-->
+   <li>other list item</li>
+   <li>other list item</li>
 </ul>
 
 <script>
-   var collapsibleElement = document.getElementById("collapsible"),
-       collapsible = tau.widget.Collapsible(collapsibleElement);
+   var collapsibleElement = document.getElementById("collapsible"),
+       collapsible = tau.widget.Collapsible(collapsibleElement);
 </script>

        After:

        -<div id="expandable" class="ui-expandable" data-collapsed="false">
-   <h1>Expandable head</h1>
-   <div>Content</div>
+<div id="expandable" class="ui-expandable" data-collapsed="false">
+   <h1>Expandable head</h1>
+   <div>Content</div>
 </div>
 
 <script>
-   var expandableEl = document.getElementById("expandable"),
-       expandableWidget = tau.widget.Expandable(expandableEl);
+   var expandableEl = document.getElementById("expandable"),
+       expandableWidget = tau.widget.Expandable(expandableEl);
 </script>
      5. Fast Scroll

        Before:

        -<div data-role="page" id="main">
-   <div data-role="content">
-      <ul id="list" data-role="listview" data-fastscroll="true">
-         <li data-role="list-divider">A</li>
-         <li>Anton</li>
-         <li>Arabella</li>
-         <li data-role="list-divider">B</li>
-         <li>Barry</li>
-         <li>Bily</li>
-      </ul>
-   </div>
+<div data-role="page" id="main">
+   <div data-role="content">
+      <ul id="list" data-role="listview" data-fastscroll="true">
+         <li data-role="list-divider">A</li>
+         <li>Anton</li>
+         <li>Arabella</li>
+         <li data-role="list-divider">B</li>
+         <li>Barry</li>
+         <li>Bily</li>
+      </ul>
+   </div>
 </div>
 
 <script>
-   var fastscroll = tau.widget.FastScroll(document.getElementById("list"));
+   var fastscroll = tau.widget.FastScroll(document.getElementById("list"));
 </script>

        After:

        -<div class="ui-page" id="indexscrollbarPage">
-   <div class="ui-indexscrollbar" id="indexscrollbar"></div>
-   <div class="ui-content">
-      <ul class="ui-listview" id="isbList">
-         <li class="ui-group-index">A</li>
-         <li class="ui-li-static">Anton</li>
-         <li class="ui-li-static">Arabella</li>
-         <li class="ui-group-index">B</li>
-         <li class="ui-li-static">Barry</li>
-         <li class="ui-li-static">Bibi</li>
-      </ul>
-   </div>
+<div class="ui-page" id="indexscrollbarPage">
+   <div class="ui-indexscrollbar" id="indexscrollbar"></div>
+   <div class="ui-content">
+      <ul class="ui-listview" id="isbList">
+         <li class="ui-group-index">A</li>
+         <li class="ui-li-static">Anton</li>
+         <li class="ui-li-static">Arabella</li>
+         <li class="ui-group-index">B</li>
+         <li class="ui-li-static">Barry</li>
+         <li class="ui-li-static">Bibi</li>
+      </ul>
+   </div>
 </div>
 
 <script>
-   var isb = tau.widget.IndexScrollbar(document.getElementById("indexscrollbar"));
+   var isb = tau.widget.IndexScrollbar(document.getElementById("indexscrollbar"));
 </script>
        6. @@ -405,42 +405,42 @@
      6. Gallery

        Before:

        -<div data-role="content" data-scroll="none">
-   <div data-role="gallery" id="gallery" data-vertical-align="middle"></div>
+<div data-role="content" data-scroll="none">
+   <div data-role="gallery" id="gallery" data-vertical-align="middle"></div>
 </div>
 
 <script>
-   var galleryWidget = tau.widget.Gallery(document.getElementById("gallery"));
+   var galleryWidget = tau.widget.Gallery(document.getElementById("gallery"));
 
-   galleryWidget.add("./images/01.jpg");
-   galleryWidget.add("./images/02.jpg");
-   galleryWidget.add("./images/03.jpg");
-   galleryWidget.refresh(1);
+   galleryWidget.add("./images/01.jpg");
+   galleryWidget.add("./images/02.jpg");
+   galleryWidget.add("./images/03.jpg");
+   galleryWidget.refresh(1);
 </script>

        After:

        -<div id="gallerySection" class="ui-content ui-section-changer" data-orientation="horizontal">
-   <div>
-      <section class="gallery-section">
-         <img src="images/01.jpg"/>
-      </section>
-      <section class="gallery-section">
-         <img src="images/02.jpg"/>
-      </section>
-   </div>
+<div id="gallerySection" class="ui-content ui-section-changer" data-orientation="horizontal">
+   <div>
+      <section class="gallery-section">
+         <img src="images/01.jpg"/>
+      </section>
+      <section class="gallery-section">
+         <img src="images/02.jpg"/>
+      </section>
+   </div>
 </div>
 
 <script>
-   var sectionChangerElement = document.getElementById("gallerySection"),
-       sectionChangerWidget = tau.widget.SectionChanger(sectionChangerElement),
-       newSectionElement = document.createElement("section");
-
-   newSectionElement.innerHTML = "<img src='images/03.jpg'>";
-   sectionsParentNode.appendChild(newSectionElement);
-   sectionChangerWidget.refresh();
-   sectionChangerWidget.setActiveSection(1);
+   var sectionChangerElement = document.getElementById("gallerySection"),
+       sectionChangerWidget = tau.widget.SectionChanger(sectionChangerElement),
+       newSectionElement = document.createElement("section");
+
+   newSectionElement.innerHTML = "<img src='images/03.jpg'>";
+   sectionsParentNode.appendChild(newSectionElement);
+   sectionChangerWidget.refresh();
+   sectionChangerWidget.setActiveSection(1);
 </script>
        7. @@ -448,21 +448,21 @@
      7. List Divider

        Before:

        -<ul data-role="listview">
-   <li data-role="list-divider">Item styles</li>
-   <li><a href="#">Normal lists</a></li>
-   <li><a href="#">Normal lists</a></li>
-   <li><a href="#">Normal lists</a></li>
+<ul data-role="listview">
+   <li data-role="list-divider">Item styles</li>
+   <li><a href="#">Normal lists</a></li>
+   <li><a href="#">Normal lists</a></li>
+   <li><a href="#">Normal lists</a></li>
 </ul>

        After:

        -<ul class="ui-listview">
-   <li class="ui-group-index">Item styles</li>
-   <li class="ui-li-anchor"><a href="#">Normal lists</a></li>
-   <li class="ui-li-anchor"><a href="#">Normal lists</a></li>
-   <li class="ui-li-anchor"><a href="#">Normal lists</a></li>
+<ul class="ui-listview">
+   <li class="ui-group-index">Item styles</li>
+   <li class="ui-li-anchor"><a href="#">Normal lists</a></li>
+   <li class="ui-li-anchor"><a href="#">Normal lists</a></li>
+   <li class="ui-li-anchor"><a href="#">Normal lists</a></li>
 </ul>
        8. @@ -470,47 +470,47 @@
      8. Notification

        Before:

        -<div data-role="page" id="demo">
-   <div data-role="notification" id="notification" data-type="popup">
-      <p>Notification Demo TEST</p>
-   </div>
-   <div data-role="header" data-position="fixed">
-      <h1>Notification</h1>
-   </div>
-   <div data-role="content">
-      <div data-role="button" id="noti-demo">Show small popup</div>
-   </div>
+<div data-role="page" id="demo">
+   <div data-role="notification" id="notification" data-type="popup">
+      <p>Notification Demo TEST</p>
+   </div>
+   <div data-role="header" data-position="fixed">
+      <h1>Notification</h1>
+   </div>
+   <div data-role="content">
+      <div data-role="button" id="noti-demo">Show small popup</div>
+   </div>
 </div>
 
 <script>
-   var notification = tau.widget.Notification(document.getElementById("notification")),
-       buttonEl = document.getElementById("noti-demo");
+   var notification = tau.widget.Notification(document.getElementById("notification")),
+       buttonEl = document.getElementById("noti-demo");
 
-   buttonEl.addEventListener("vclick", function()
-   {
-      notification.open();
-   });
+   buttonEl.addEventListener("vclick", function()
+   {
+      notification.open();
+   });
 </script>

        After:

        -<div data-role="content">
-   <a class="ui-btn" id="open" data-inline="true">Button</a>
-   <div id="popup_toast" data-role="popup" class="ui-popup ui-popup-toast">
-      <div class="ui-popup-content">
-         Toast popup text Toast popup text
-      </div>
-   </div>
+<div data-role="content">
+   <a class="ui-btn" id="open" data-inline="true">Button</a>
+   <div id="popup_toast" data-role="popup" class="ui-popup ui-popup-toast">
+      <div class="ui-popup-content">
+         Toast popup text Toast popup text
+      </div>
+   </div>
 </div>
 
 <script>
-   var btn = document.getElementById("open");
+   var btn = document.getElementById("open");
 
-   btn.addEventListener("vclick", function()
-   {
-      tau.openPopup("#popup_toast");
-   });
+   btn.addEventListener("vclick", function()
+   {
+      tau.openPopup("#popup_toast");
+   });
 </script>
        9. @@ -518,24 +518,24 @@
      9. Progress Bar

        Before:

        -<div data-role="progressbar" id="progressbar"></div>
+<div data-role="progressbar" id="progressbar"></div>
 
 <script>
-   var progressbarWidget =
-      tau.widget.ProgressBar(document.getElementById("progressbar"));
+   var progressbarWidget =
+      tau.widget.ProgressBar(document.getElementById("progressbar"));
 
-   progressbarWidget.value(30);
+   progressbarWidget.value(30);
 </script>

        After:

        -<div class="ui-progress" data-type="bar" id="progressbar"></div>
+<div class="ui-progress" data-type="bar" id="progressbar"></div>
 
 <script>
-   var progressWidget = tau.widget.Progress(document.getElementById("progressbar"));
+   var progressWidget = tau.widget.Progress(document.getElementById("progressbar"));
 
-   progressWidget.value(30);
+   progressWidget.value(30);
 </script>
        10. @@ -543,25 +543,25 @@
      10. Search Bar

        Before:

        -<input type="search" name="search" id="search-bar"/>
+<input type="search" name="search" id="search-bar"/>
 
 <script>
-   var searchBarElement = document.getElementById("searchbar"),
-       searchBarWidget = tau.widget.SearchBar(searchBarElement);
+   var searchBarElement = document.getElementById("searchbar"),
+       searchBarWidget = tau.widget.SearchBar(searchBarElement);
 
-   value = searchBarWidget.disable();
+   value = searchBarWidget.disable();
 </script>

        After:

        -<input type="search" id="search-test"/>
+<input type="search" id="search-test"/>
 
 <script>
-   var searchEl = document.getElementById("search-test"),
-       searchWidget = tau.widget.SearchInput(searchEl);
+   var searchEl = document.getElementById("search-test"),
+       searchWidget = tau.widget.SearchInput(searchEl);
 
-   searchInputWidget.disable();
+   searchInputWidget.disable();
 </script>
        11. @@ -569,35 +569,35 @@
      11. Select Menu

        Before:

        -<select id="selectmenu" data-native-menu="false">
-   <option value="1">Item1</option>
-   <option value="2">Item2</option>
-   <option value="3">Item3</option>
-   <option value="4">Item4</option>
+<select id="selectmenu" data-native-menu="false">
+   <option value="1">Item1</option>
+   <option value="2">Item2</option>
+   <option value="3">Item3</option>
+   <option value="4">Item4</option>
 </select>
 
 <script>
-   var element = document.getElementById("selectmenu"),
-       widget = tau.widget.SelectMenu(element);
+   var element = document.getElementById("selectmenu"),
+       widget = tau.widget.SelectMenu(element);
 
-   widget.open();
+   widget.open();
 </script>

        After:

        -<select id="dropdownmenu" data-native-menu="false">
-   <option value="1">Item1</option>
-   <option value="2">Item2</option>
-   <option value="3">Item3</option>
-   <option value="4">Item4</option>
+<select id="dropdownmenu" data-native-menu="false">
+   <option value="1">Item1</option>
+   <option value="2">Item2</option>
+   <option value="3">Item3</option>
+   <option value="4">Item4</option>
 </select>
 
 <script>
-   var element = document.getElementById("dropdownmenu"),
-       widget = tau.widget.DropdownMenu(element);
+   var element = document.getElementById("dropdownmenu"),
+       widget = tau.widget.DropdownMenu(element);
 
-   widget.open();
+   widget.open();
 </script>
        12. @@ -605,52 +605,52 @@
      12. Tab Bar

        Before:

        -<div data-role="header">
-   <div data-role="tabbar" id="tab-bar">
-      <ul>
-         <li><a href="#">Tabbar1</a></li>
-         <li><a href="#">Tabbar2</a></li>
-         <li><a href="#">Tabbar3</a></li>
-      </ul>
-   </div>
+<div data-role="header">
+   <div data-role="tabbar" id="tab-bar">
+      <ul>
+         <li><a href="#">Tabbar1</a></li>
+         <li><a href="#">Tabbar2</a></li>
+         <li><a href="#">Tabbar3</a></li>
+      </ul>
+   </div>
 </div>
 
 <script>
-   var tabBar = tau.widget.TabBar(document.getElementById("tab-bar"));
+   var tabBar = tau.widget.TabBar(document.getElementById("tab-bar"));
 </script>

        After:

         <!--Tabs component is composed with Tabbar and SectionChanger-->
-<div id="tabs" class="ui-tabs">
-   <div class="ui-tabbar">
-      <ul>
-         <li><a href="#" class="ui-btn-active">Tab1</a></li>
-         <li><a href="#">Tab2</a></li>
-         <li><a href="#">Tab3</a></li>
-      </ul>
-   </div>
-   <div class="ui-section-changer">
-      <div>
-         <section class="ui-section-active">
-            <p>Tab1</p>
-         </section>
-         <section>
-            <p>Tab2</p>
-         </section>
-         <section>
-            <p>Tab3</p>        
-         </section>
-      </div>
-   </div>
+<div id="tabs" class="ui-tabs">
+   <div class="ui-tabbar">
+      <ul>
+         <li><a href="#" class="ui-btn-active">Tab1</a></li>
+         <li><a href="#">Tab2</a></li>
+         <li><a href="#">Tab3</a></li>
+      </ul>
+   </div>
+   <div class="ui-section-changer">
+      <div>
+         <section class="ui-section-active">
+            <p>Tab1</p>
+         </section>
+         <section>
+            <p>Tab2</p>
+         </section>
+         <section>
+            <p>Tab3</p>
+         </section>
+      </div>
+   </div>
 </div>
 
 <script>
-   var tabsElement = document.getElementById("tabs"),
-       tabs = tau.widget.Tabs(tabsElement);
+   var tabsElement = document.getElementById("tabs"),
+       tabs = tau.widget.Tabs(tabsElement);
 
-   tabs.setIndex(1);
+   tabs.setIndex(1);
 </script>
        13. @@ -658,24 +658,24 @@
      13. Token Text Area

        Before:

        -<div data-role="tokentextarea" id="tokentext"></div>
+<div data-role="tokentextarea" id="tokentext"></div>
 
 <script>
-   var tokenWidget = tau.widget.TokenTextarea(document.getElementById("tokentext"));
+   var tokenWidget = tau.widget.TokenTextarea(document.getElementById("tokentext"));
 
-   tokenWidget.add("foobar");
+   tokenWidget.add("foobar");
 </script>

        After:

        -<div class="ui-text-enveloper"></div>
+<div class="ui-text-enveloper"></div>
 
 <script>
-   var textEnveloperElement = document.getElementById("textenveloper"),
-       textEnveloper = tau.component.TextEnveloper(textEnveloperElement);
+   var textEnveloperElement = document.getElementById("textenveloper"),
+       textEnveloper = tau.component.TextEnveloper(textEnveloperElement);
 
-   textEnveloper.add("hello");
+   textEnveloper.add("hello");
 </script>
        14. @@ -691,37 +691,37 @@

        To enable the swipe event, use the enableGesture() method. The following example shows how to enable the swipe event on the content area:

         <!--HTML code-->
-<div class="ui-page ui-page-active" id="pageSwipe">
-   <header class="ui-header">
-      <h2 class="ui-title">Swipe Event</h2>
-   </header>
-   <div id="content" class="ui-content></div>
+<div class="ui-page ui-page-active" id="pageSwipe">
+   <header class="ui-header">
+      <h2 class="ui-title">Swipe Event</h2>
+   </header>
+   <div id="content" class="ui-content></div>
 </div>
 
         (function()
 {
-   var page = document.getElementById("pageSwipe");
-   page.addEventListener("pagebeforeshow", function()
-      {
-         var content = document.getElementById("content");
-         tau.event.enableGesture(content, new tau.event.gesture.Swipe(
-         {
-            orientation: "horizontal"
-         }));
-      });
+   var page = document.getElementById("pageSwipe");
+   page.addEventListener("pagebeforeshow", function()
+      {
+         var content = document.getElementById("content");
+         tau.event.enableGesture(content, new tau.event.gesture.Swipe(
+         {
+            orientation: "horizontal"
+         }));
+      });
 }());

        When the swipe event is enabled, the application can handle this event with some event detail data:

         (function()
 {
-   var content = document.getElementById("content");
+   var content = document.getElementById("content");
 
-   content.addEventListener("swipe", function(e)
-      {
-         console.log("swipe direction = " + e.detail.direction);
-      });
+   content.addEventListener("swipe", function(e)
+      {
+         console.log("swipe direction = " + e.detail.direction);
+      });
 }());
        @@ -733,22 +733,22 @@

        Since 2.4, the tap event has been deprecated. Use the click event instead.

        If the application has one button in the content area:

        -<div class="ui-content">
-   <a id="btn" href="#" class="ui-btn">Click me</a>
+<div class="ui-content">
+   <a id="btn" href="#" class="ui-btn">Click me</a>
 </div>

        Before:

        -var button = document.getElementById("btn");
+var button = document.getElementById("btn");
 
-button.addEventListener("tap", eventHandler);
+button.addEventListener("tap", eventHandler);

        After:

        -var button = document.getElementById("btn");
+var button = document.getElementById("btn");
 
-button.addEventListener("click", eventHandler);
+button.addEventListener("click", eventHandler);
        diff --git a/org.tizen.guides/html/web/ui/tau/tau_rotary_ww.htm b/org.tizen.guides/html/web/ui/tau/tau_rotary_ww.htm index 1107fb5..8329ca1 100644 --- a/org.tizen.guides/html/web/ui/tau/tau_rotary_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/tau_rotary_ww.htm @@ -34,11 +34,11 @@

        Related Info

        @@ -80,96 +80,96 @@ 
         <!--HTML-->
-<div class="ui-page ui-page-active" id="main">
-   <header class="ui-header">
-      <h2 class="ui-title">TAU Basic</h2>
-   </header>
-   <div class="ui-content">
-      <a href="#popup" data-rel="popup">Open Popup</a>
-      <!--Fill content-->
-   </div>
-   <!--Popup-->
-   <div id="popup" class="ui-popup">
-      <div class="ui-popup-content">
-         <!--Fill content-->
-      </div>
-      <div class="ui-popup-footer ui-bottom-button">
-         <a id="1btnPopup-cancel" href="#" class="ui-btn" data-rel="back">Check</a>
-      </div>
-   </div>
+<div class="ui-page ui-page-active" id="main">
+   <header class="ui-header">
+      <h2 class="ui-title">TAU Basic</h2>
+   </header>
+   <div class="ui-content">
+      <a href="#popup" data-rel="popup">Open Popup</a>
+      <!--Fill content-->
+   </div>
+   <!--Popup-->
+   <div id="popup" class="ui-popup">
+      <div class="ui-popup-content">
+         <!--Fill content-->
+      </div>
+      <div class="ui-popup-footer ui-bottom-button">
+         <a id="1btnPopup-cancel" href="#" class="ui-btn" data-rel="back">Check</a>
+      </div>
+   </div>
 </div>
 
 <!--Script-->
 <script>
-   (function()
-   {
-      var SCROLL_STEP = 50, /* Distance of moving scroll for each rotary event */
-          page = document.getElementById("main"); /* Query with page ID */
-
-      page.addEventListener("popupshow", function popupOpenHandler(e)
-         {
-            var popup = e.target, /* Popup element */
-                /* Element that has scroll */
-                scroller = popup.querySelector(".ui-popup-wrapper"),
-
-                /* Rotary event handler */
-                rotaryEventHandler = function(e)
-                {
-                   if (e.detail.direction === "CW")
-                   /* Right direction */
-                   {
-                      scroller.scrollTop += SCROLL_STEP;
-                   }
-                   else if (e.detail.direction === "CCW")
-                   /* Left direction */
-                   {
-                      scroller.scrollTop -= SCROLL_STEP;
-                   }
-                };
-
-            /* Register the rotary event */
-            document.addEventListener("rotarydetent", rotaryEventHandler, false);
-
-            /* Deregister the rotary event */
-            popup.addEventListener("popuphide", function popupHideHandler()
-               {
-                  popup.removeEventListener("popuphide", popupHideHandler, false);
-                  document.removeEventListener("rotarydetent", rotaryEventHandler, false);
-               }, false);
-         }, false);
-
-      page.addEventListener("pagebeforeshow", function pageScrollHandler(e)
-         {
-            var page = e.target;
-            elScroller = page.querySelector(".ui-scroller");
-
-            /* Rotary event handler */
-            rotaryEventHandler = function(e)
-            {
-               if (e.detail.direction === "CW")
-               /* Right direction */
-               {
-                  elScroller.scrollTop += SCROLL_STEP;
-               }
-               else if (e.detail.direction === "CCW")
-               /* Left direction */
-               {
-                  elScroller.scrollTop -= SCROLL_STEP;
-               }
-            };
-
-            /* Register the rotary event */
-            document.addEventListener("rotarydetent", rotaryEventHandler, false);
-
-            /* Deregister the rotary event */
-            page.addEventListener("pagebeforehide", function pageHideHandler()
-               {
-                  page.removeEventListener("pagebeforehide", pageHideHandler, false);
-                  document.removeEventListener("rotarydetent", rotaryEventHandler, false);
-               }, false);
-
-         }, false);
-   }());
+   (function()
+   {
+      var SCROLL_STEP = 50, /* Distance of moving scroll for each rotary event */
+          page = document.getElementById("main"); /* Query with page ID */
+
+      page.addEventListener("popupshow", function popupOpenHandler(e)
+         {
+            var popup = e.target, /* Popup element */
+                /* Element that has scroll */
+                scroller = popup.querySelector(".ui-popup-wrapper"),
+
+                /* Rotary event handler */
+                rotaryEventHandler = function(e)
+                {
+                   if (e.detail.direction === "CW")
+                   /* Right direction */
+                   {
+                      scroller.scrollTop += SCROLL_STEP;
+                   }
+                   else if (e.detail.direction === "CCW")
+                   /* Left direction */
+                   {
+                      scroller.scrollTop -= SCROLL_STEP;
+                   }
+                };
+
+            /* Register the rotary event */
+            document.addEventListener("rotarydetent", rotaryEventHandler, false);
+
+            /* Deregister the rotary event */
+            popup.addEventListener("popuphide", function popupHideHandler()
+               {
+                  popup.removeEventListener("popuphide", popupHideHandler, false);
+                  document.removeEventListener("rotarydetent", rotaryEventHandler, false);
+               }, false);
+         }, false);
+
+      page.addEventListener("pagebeforeshow", function pageScrollHandler(e)
+         {
+            var page = e.target;
+            elScroller = page.querySelector(".ui-scroller");
+
+            /* Rotary event handler */
+            rotaryEventHandler = function(e)
+            {
+               if (e.detail.direction === "CW")
+               /* Right direction */
+               {
+                  elScroller.scrollTop += SCROLL_STEP;
+               }
+               else if (e.detail.direction === "CCW")
+               /* Left direction */
+               {
+                  elScroller.scrollTop -= SCROLL_STEP;
+               }
+            };
+
+            /* Register the rotary event */
+            document.addEventListener("rotarydetent", rotaryEventHandler, false);
+
+            /* Deregister the rotary event */
+            page.addEventListener("pagebeforehide", function pageHideHandler()
+               {
+                  page.removeEventListener("pagebeforehide", pageHideHandler, false);
+                  document.removeEventListener("rotarydetent", rotaryEventHandler, false);
+               }, false);
+
+         }, false);
+   }());
 </script>

        Controlling a Snap List

        @@ -177,63 +177,63 @@ 
         <!--HTML-->
-<div class="ui-page ui-page-active" id="main">
-   <div class="ui-content">
-      <ul class="ui-listview">
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-         <li>SnapListview</li>
-      </ul>
-   </div>
+<div class="ui-page ui-page-active" id="main">
+   <div class="ui-content">
+      <ul class="ui-listview">
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+         <li>SnapListview</li>
+      </ul>
+   </div>
 </div>
 
 <!--Script-->
 <script>
-   (function(tau)
-   {
-      var list,
-          snapListviewWidget,
-          rotarydetentHandler = function(e)
-          {
-             var selectedIndex = snapListviewWidget.getSelectedIndex(),
-                 direction = e.detail.direction;
-
-             if (direction === "CW" && selectedIndex !== null)
-             {
-                snapListviewWidget.scrollToPosition(++selectedIndex);
-             }
-             else if (direction === "CCW" && selectedIndex !== null)
-             {
-                snapListviewWidget.scrollToPosition(--selectedIndex);
-             }
-          };
-
-      if (tau.support.shape.circle)
-      {
-         document.addEventListener("pagebeforeshow", function()
-            {
-               list = document.getElementById("snapList");
-               snapListviewWidget = tau.widget.SnapListview(list);
-               window.addEventListener("rotarydetent", rotarydetentHandler);
-            });
-
-         document.addEventListener("pagebeforehide", function(e)
-            {
-               if (list)
-               {
-                  snapListviewWidget.destroy();
-                  window.removeEventListener("rotarydetent", rotarydetentHandler);
-               }
-            });
-      }
-   }(tau));
+   (function(tau)
+   {
+      var list,
+          snapListviewWidget,
+          rotarydetentHandler = function(e)
+          {
+             var selectedIndex = snapListviewWidget.getSelectedIndex(),
+                 direction = e.detail.direction;
+
+             if (direction === "CW" && selectedIndex !== null)
+             {
+                snapListviewWidget.scrollToPosition(++selectedIndex);
+             }
+             else if (direction === "CCW" && selectedIndex !== null)
+             {
+                snapListviewWidget.scrollToPosition(--selectedIndex);
+             }
+          };
+
+      if (tau.support.shape.circle)
+      {
+         document.addEventListener("pagebeforeshow", function()
+            {
+               list = document.getElementById("snapList");
+               snapListviewWidget = tau.widget.SnapListview(list);
+               window.addEventListener("rotarydetent", rotarydetentHandler);
+            });
+
+         document.addEventListener("pagebeforehide", function(e)
+            {
+               if (list)
+               {
+                  snapListviewWidget.destroy();
+                  window.removeEventListener("rotarydetent", rotarydetentHandler);
+               }
+            });
+      }
+   }(tau));
 </script>

        Changing the Section Changer Index

        @@ -241,90 +241,90 @@ 
         <!--HTML-->
-<div id="main" class="ui-page">
-   <header class="ui-header">
-      <h2 class="ui-title">SectionChanger</h2>
-   </header>
-   <div id="hsectionchanger" class="ui-content">
-      <!--Section changer has only one child-->
-      <div>
-         <section class="section" style="text-align:center">
-            <h3>LEFT2 PAGE</h3>
-         </section>
-         <section class="section" style="text-align:center">
-            <h3>LEFT1 PAGE</h3>
-         </section>
-         <section class="section" class="ui-section-active" style="text-align:center">
-            <h3>MAIN PAGE</h3>
-         </section>
-         <section class="section" style="text-align:center">
-            <h3>RIGHT1 PAGE</h3>
-         </section>
-         <section class="section" style="text-align:center">
-            <h3>RIGHT2 PAGE</h3>
-         </section>
-      </div>
-   </div>
+<div id="main" class="ui-page">
+   <header class="ui-header">
+      <h2 class="ui-title">SectionChanger</h2>
+   </header>
+   <div id="hsectionchanger" class="ui-content">
+      <!--Section changer has only one child-->
+      <div>
+         <section class="section" style="text-align:center">
+            <h3>LEFT2 PAGE</h3>
+         </section>
+         <section class="section" style="text-align:center">
+            <h3>LEFT1 PAGE</h3>
+         </section>
+         <section class="section" class="ui-section-active" style="text-align:center">
+            <h3>MAIN PAGE</h3>
+         </section>
+         <section class="section" style="text-align:center">
+            <h3>RIGHT1 PAGE</h3>
+         </section>
+         <section class="section" style="text-align:center">
+            <h3>RIGHT2 PAGE</h3>
+         </section>
+      </div>
+   </div>
 </div>
 
 <!--Script-->
 <script>
-   (function(tau)
-   {
-      var changer,
-          sectionChangerWidget,
-          sections,
-          sectionsLength;
-
-          rotarydetentHandler = function(event)
-          {
-             var direction = event.detail.direction,
-                 activeSection;
-
-             activeSection = sectionChangerWidget.getActiveSectionIndex();
-
-             if (direction === "CW")
-             /* Right direction */
-             {
-                if (activeSection < sectionsLength - 1)
-                {
-                   sectionChangerWidget.setActiveSection(activeSection + 1, 30);
-                }
-             }
-             else if (direction === "CCW")
-             /* Left direction */
-             {
-                if (activeSection > 0)
-                {
-                   sectionChangerWidget.setActiveSection(activeSection - 1, 30);
-                }
-             }
-          };
-
-      if (tau.support.shape.circle)
-      {
-         document.addEventListener("pagebeforeshow", function()
-            {
-               changer = document.getElementById("hsectionchanger");
-               sectionChangerWidget = tau.widget.SectionChanger(changer, 
-               {
-                  circular: false,
-                  orientation: "horizontal",
-                  useBouncingEffect: false
-               });
-               sections = changer.querySelectorAll(".section");
-               sectionsLength = sections.length;
-
-               document.addEventListener("rotarydetent", rotarydetentHandler);
-            });
-
-         document.addEventListener("pagebeforehide", function(e)
-            {
-               sectionChangerWidget.destroy();
-               document.removeEventListener("rotarydetent", rotarydetentHandler);
-            });
-      }
-   }(tau));
+   (function(tau)
+   {
+      var changer,
+          sectionChangerWidget,
+          sections,
+          sectionsLength;
+
+          rotarydetentHandler = function(event)
+          {
+             var direction = event.detail.direction,
+                 activeSection;
+
+             activeSection = sectionChangerWidget.getActiveSectionIndex();
+
+             if (direction === "CW")
+             /* Right direction */
+             {
+                if (activeSection < sectionsLength - 1)
+                {
+                   sectionChangerWidget.setActiveSection(activeSection + 1, 30);
+                }
+             }
+             else if (direction === "CCW")
+             /* Left direction */
+             {
+                if (activeSection > 0)
+                {
+                   sectionChangerWidget.setActiveSection(activeSection - 1, 30);
+                }
+             }
+          };
+
+      if (tau.support.shape.circle)
+      {
+         document.addEventListener("pagebeforeshow", function()
+            {
+               changer = document.getElementById("hsectionchanger");
+               sectionChangerWidget = tau.widget.SectionChanger(changer,
+               {
+                  circular: false,
+                  orientation: "horizontal",
+                  useBouncingEffect: false
+               });
+               sections = changer.querySelectorAll(".section");
+               sectionsLength = sections.length;
+
+               document.addEventListener("rotarydetent", rotarydetentHandler);
+            });
+
+         document.addEventListener("pagebeforehide", function(e)
+            {
+               sectionChangerWidget.destroy();
+               document.removeEventListener("rotarydetent", rotarydetentHandler);
+            });
+      }
+   }(tau));
 </script>

        Changing the Circle-shaped Progress Bar Value

        @@ -332,77 +332,77 @@ 
         <!--HTML-->
-<div class="ui-page" id="pageRotaryEvent" data-enable-page-scroll="false">
-   <header class="ui-header">
-      <h2 class="ui-title">Rotary Event</h2>
-   </header>
-   <div class="ui-content">
-      <div id="result"></div>
-   </div>
-   <progress class="ui-circle-progress" id="circleprogress" max="100" value="20"></progress>
+<div class="ui-page" id="pageRotaryEvent" data-enable-page-scroll="false">
+   <header class="ui-header">
+      <h2 class="ui-title">Rotary Event</h2>
+   </header>
+   <div class="ui-content">
+      <div id="result"></div>
+   </div>
+   <progress class="ui-circle-progress" id="circleprogress" max="100" value="20"></progress>
 </div>
 
 <!--Script-->
 <script>
-   (function()
-   {
-      var progressBar,
-          progressBarWidget,
-          resultDiv,
-          value,
-          direction,
-          rotaryDetentHandler = function(e)
-          {
-             /* Get rotary direction */
-             direction = e.detail.direction;
-
-             if (direction === "CW")
-             {
-                /* Right direction */
-                if (parseInt(progressBarWidget.value(), 10) < 100)
-                {
-                   value = parseInt(progressBarWidget.value(), 10) + 1;
-                }
-                else
-                {
-                   value = 100;
-                }
-             }
-             else if (direction === "CCW")
-             {
-                /* Left direction */
-                if (parseInt(progressBarWidget.value(), 10) > 0)
-                {
-                   value = parseInt(progressBarWidget.value(), 10) - 1;
-                }
-                else
-                {
-                   value = 0;
-                }
-             }
-
-             resultDiv.innerText = value + "%";
-             progressBarWidget.value(value);
-          };
-
-      document.addEventListener("pagebeforeshow", function()
-         {
-            resultDiv = document.getElementById("result");
-
-            progressBar = document.getElementById("circleprogress");
-            progressBarWidget = new tau.widget.CircleProgressBar(progressBar,
-                                                                 {size: "large"});
-            resultDiv.innerText = progressBarWidget.value() + "%";
-            /* Add rotarydetent handler to document */
-            document.addEventListener("rotarydetent", rotaryDetentHandler);
-         });
-
-      document.addEventListener("pagehide", function()
-         {
-            progressBarWidget.destroy();
-            document.removeEventListener("rotarydetent", rotaryDetentHandler);
-         });
-   }());
+   (function()
+   {
+      var progressBar,
+          progressBarWidget,
+          resultDiv,
+          value,
+          direction,
+          rotaryDetentHandler = function(e)
+          {
+             /* Get rotary direction */
+             direction = e.detail.direction;
+
+             if (direction === "CW")
+             {
+                /* Right direction */
+                if (parseInt(progressBarWidget.value(), 10) < 100)
+                {
+                   value = parseInt(progressBarWidget.value(), 10) + 1;
+                }
+                else
+                {
+                   value = 100;
+                }
+             }
+             else if (direction === "CCW")
+             {
+                /* Left direction */
+                if (parseInt(progressBarWidget.value(), 10) > 0)
+                {
+                   value = parseInt(progressBarWidget.value(), 10) - 1;
+                }
+                else
+                {
+                   value = 0;
+                }
+             }
+
+             resultDiv.innerText = value + "%";
+             progressBarWidget.value(value);
+          };
+
+      document.addEventListener("pagebeforeshow", function()
+         {
+            resultDiv = document.getElementById("result");
+
+            progressBar = document.getElementById("circleprogress");
+            progressBarWidget = new tau.widget.CircleProgressBar(progressBar,
+                                                                 {size: "large"});
+            resultDiv.innerText = progressBarWidget.value() + "%";
+            /* Add rotarydetent handler to document */
+            document.addEventListener("rotarydetent", rotaryDetentHandler);
+         });
+
+      document.addEventListener("pagehide", function()
+         {
+            progressBarWidget.destroy();
+            document.removeEventListener("rotarydetent", rotaryDetentHandler);
+         });
+   }());
 </script>
        diff --git a/org.tizen.guides/html/web/ui/tau/tau_w.htm b/org.tizen.guides/html/web/ui/tau/tau_w.htm index 46acb4d..ceab89f 100644 --- a/org.tizen.guides/html/web/ui/tau/tau_w.htm +++ b/org.tizen.guides/html/web/ui/tau/tau_w.htm @@ -34,12 +34,12 @@

        Tizen Advanced UI

        - +

        The Tizen Advanced UI Framework components allow you to create and manage various kinds of UI components. The components represent a visual UI element, such as a button or slider, which gives you interaction and manipulation features.

        This feature is supported in mobile and wearable applications only.

        -

        TAU is the standard Web UI library for Tizen platform, originated from the Tizen Web UI Framework Library (standard library for Tizen 2.2.1), which was mainly an extension to jQuery Mobile. The key features of the Web UI Framework Library were coding simplification and application creation speed. The purpose of TAU is to be the "framework advanced to the next level".

        +

        TAU is the standard Web UI library for Tizen platform, originated from the Tizen Web UI Framework Library (standard library for Tizen 2.2.1), which was mainly an extension to jQuery Mobile. The key features of the Web UI Framework Library were coding simplification and application creation speed. The purpose of TAU is to be the "framework advanced to the next level".

        Note diff --git a/org.tizen.guides/html/web/ui/tau/thumbnail_ww.htm b/org.tizen.guides/html/web/ui/tau/thumbnail_ww.htm index 737efa0..7fcbb92 100644 --- a/org.tizen.guides/html/web/ui/tau/thumbnail_ww.htm +++ b/org.tizen.guides/html/web/ui/tau/thumbnail_ww.htm @@ -49,21 +49,21 @@
        1. Edit the HTML code to add the thumbnail component to your application screen: 
          -<div class="ui-page ui-page-active" id="sectionChangerPage"
-     data-enable-page-scroll="false">
-   <div id="sectionChanger" class="ui-content ui-section-changer">
-      <div id="scroller">
-         <section class="ui-section-active">
-            <div class="thumbnail">1</div>
-         </section>
-         <section>
-            <div class="thumbnail">2</div>
-         </section>
-         <section>
-            <div class="thumbnail">3</div>
-         </section>
-      </div>
-   </div>
+<div class="ui-page ui-page-active" id="sectionChangerPage"
+     data-enable-page-scroll="false">
+   <div id="sectionChanger" class="ui-content ui-section-changer">
+      <div id="scroller">
+         <section class="ui-section-active">
+            <div class="thumbnail">1</div>
+         </section>
+         <section>
+            <div class="thumbnail">2</div>
+         </section>
+         <section>
+            <div class="thumbnail">3</div>
+         </section>
+      </div>
+   </div>
 </div>
          2. @@ -72,49 +72,49 @@ 
           section
 {
-   padding: 0 10px 0 10px;
-   height: 100%;
+   padding: 0 10px 0 10px;
+   height: 100%;
 }
 .thumbnail
 {
-   height: 300px;
-   width: 200px;
-   background-color: #80482f;
-   top: 50%;
-   transform: translate3d(0, -50%, 0);
-   position: relative;
-   text-align: center;
-   line-height: 300px;
+   height: 300px;
+   width: 200px;
+   background-color: #80482f;
+   top: 50%;
+   transform: translate3d(0, -50%, 0);
+   position: relative;
+   text-align: center;
+   line-height: 300px;
 }
 .ui-section-active .thumbnail
 {
-   background-color: #000000;
-   border: 1px solid #a06322;
+   background-color: #000000;
+   border: 1px solid #a06322;
 }
 
 @media all and (-tizen-geometric-shape: circle)
 {
-   section
-   {
-      padding: 0;
-   }
-   .thumbnail
-   {
-      height: 200px;
-      width: 200px;
-      border-radius: 50%;
-      background-color: #802532;
-      top: 50%;
-      position: relative;
-      text-align: center;
-      line-height: 200px;
-      transform: scale(0.8) translate3d(0, -60%, 0);
-      transition: transform 300ms;
-   }
-   .ui-section-active .thumbnail
-   {
-      transform: scale(1) translate3d(0, -50%, 0);
-   }
+   section
+   {
+      padding: 0;
+   }
+   .thumbnail
+   {
+      height: 200px;
+      width: 200px;
+      border-radius: 50%;
+      background-color: #802532;
+      top: 50%;
+      position: relative;
+      text-align: center;
+      line-height: 200px;
+      transform: scale(0.8) translate3d(0, -60%, 0);
+      transition: transform 300ms;
+   }
+   .ui-section-active .thumbnail
+   {
+      transform: scale(1) translate3d(0, -50%, 0);
+   }
 }
          @@ -122,17 +122,17 @@ section 
           (function()
 {
-   var page = document.getElementById("sectionChangerPage"),
-       sectionChanger = document.getElementById("sectionChanger");
-
-   page.addEventListener("pagebeforeshow", function()
-      {
-         tau.widget.SectionChanger(sectionChanger,
-         {
-            orientation: "horizontal",
-            fillContent: false
-         });
-      });
+   var page = document.getElementById("sectionChangerPage"),
+       sectionChanger = document.getElementById("sectionChanger");
+
+   page.addEventListener("pagebeforeshow", function()
+      {
+         tau.widget.SectionChanger(sectionChanger,
+         {
+            orientation: "horizontal",
+            fillContent: false
+         });
+      });
 })();
          diff --git a/org.tizen.guides/html/web/ui/tau/ui_component_w.htm b/org.tizen.guides/html/web/ui/tau/ui_component_w.htm index d8cbdf7..37e7f72 100644 --- a/org.tizen.guides/html/web/ui/tau/ui_component_w.htm +++ b/org.tizen.guides/html/web/ui/tau/ui_component_w.htm @@ -5,7 +5,7 @@ - + @@ -58,15 +58,15 @@

          The following example shows the creation of some components with a class selector:

           <!--Create an Expandable component-->
-<div class="ui-expandable" id="expandable-test">
-   <h1>Expandable head</h1>
-   <div>Content</div>
+<div class="ui-expandable" id="expandable-test">
+   <h1>Expandable head</h1>
+   <div>Content</div>
 </div>
 
 <!--Create a ToggleSwitch component-->
-<select class="ui-toggleswitch">
-   <option value="off"></option>
-   <option value="on"></option>
+<select class="ui-toggleswitch">
+   <option value="off"></option>
+   <option value="on"></option>
 </select>
          @@ -75,13 +75,13 @@

          The following example shows the creation of some components with a data-role selector:

           <!--Create a TextEnveloper component-->
-<div data-role="textenveloper"></div>
+<div data-role="textenveloper"></div>
 
 <!--Create a Drawer component-->
-<div data-role="drawer">
-   <ul data-role="listview">
-      <li><a href="#">List item 1</a></li>
-   </ul>
+<div data-role="drawer">
+   <ul data-role="listview">
+      <li><a href="#">List item 1</a></li>
+   </ul>
 </div>
          @@ -96,22 +96,22 @@

          Various options can be set with data- attribute when the component is being created. You can set options this way only when the component is created. After creating the component, changing the data attributes on the HTML element does not change the component options.

          The following example shows a SectionChanger code with a data- option:

          -<div id="hasSectionchangerPage" class="ui-page">
-   <header class="ui-header">
-      <h2 class="ui-title">SectionChanger</h2>
-   </header>
-   <div class="ui-section-changer" data-orientation="horizontal"
-        data-circular="true" data-use-tab="true">
-      <div>
-         <section>
-            <h3>LEFT1 PAGE</h3>
-         </section>
-         <section class="ui-section-active">
-            <h3>MAIN PAGE</h3>
-         </section>
-         <section>
-      </div>
-   </div>
+<div id="hasSectionchangerPage" class="ui-page">
+   <header class="ui-header">
+      <h2 class="ui-title">SectionChanger</h2>
+   </header>
+   <div class="ui-section-changer" data-orientation="horizontal"
+        data-circular="true" data-use-tab="true">
+      <div>
+         <section>
+            <h3>LEFT1 PAGE</h3>
+         </section>
+         <section class="ui-section-active">
+            <h3>MAIN PAGE</h3>
+         </section>
+         <section>
+      </div>
+   </div>
 </div>

          The data-circular and data-use-tab attributes are the initial options for creating a SectionChanger.

          @@ -122,30 +122,30 @@

          Options can be set as arguments to the component constructor. When using options as arguments, you must use the camelCase name.

          The following example shows the use of a manual constructor:

          -<div id="hasSectionchangerPage" class="ui-page">
-   <header class="ui-header">
-      <h2 class="ui-title">SectionChanger</h2>
-   </header>
-   <div class="ui-section-changer" id="sectionchanger">
-      <div>
-         <section>
-            <h3>LEFT1 PAGE</h3>
-         </section>
-         <section class="ui-section-active">
-            <h3>MAIN PAGE</h3>
-         </section>
-      </div>
-   </div>
+<div id="hasSectionchangerPage" class="ui-page">
+   <header class="ui-header">
+      <h2 class="ui-title">SectionChanger</h2>
+   </header>
+   <div class="ui-section-changer" id="sectionchanger">
+      <div>
+         <section>
+            <h3>LEFT1 PAGE</h3>
+         </section>
+         <section class="ui-section-active">
+            <h3>MAIN PAGE</h3>
+         </section>
+      </div>
+   </div>
 </div>
 
 <script>
-   var sectionEl = document.getElementById("sectionchanger"),
-       sectionChangerWidget = tau.widget.SectionChanger(sectionEl,
-       {
-          orientation: "horizontal",
-          circular: true
-          useTab: true
-       });
+   var sectionEl = document.getElementById("sectionchanger"),
+       sectionChangerWidget = tau.widget.SectionChanger(sectionEl,
+       {
+          orientation: "horizontal",
+          circular: true
+          useTab: true
+       });
 </script>
          @@ -153,29 +153,29 @@
        2. Setting options with a method call

          To set options dynamically, use the option() method.

          -<div id="hasSectionchangerPage" class="ui-page">
-   <header class="ui-header">
-      <h2 class="ui-title">SectionChanger</h2>
-   </header>
-   <div class="ui-section-changer" data-orientation="horizontal"
-        data-circular="true" data-use-tab="true">
-      <div>
-         <section>
-            <h3>LEFT1 PAGE</h3>
-         </section>
-         <section class="ui-section-active">
-            <h3>MAIN PAGE</h3>
-         </section>
-         <section>
-      </div>
-   </div>
+<div id="hasSectionchangerPage" class="ui-page">
+   <header class="ui-header">
+      <h2 class="ui-title">SectionChanger</h2>
+   </header>
+   <div class="ui-section-changer" data-orientation="horizontal"
+        data-circular="true" data-use-tab="true">
+      <div>
+         <section>
+            <h3>LEFT1 PAGE</h3>
+         </section>
+         <section class="ui-section-active">
+            <h3>MAIN PAGE</h3>
+         </section>
+         <section>
+      </div>
+   </div>
 </div>
 
 <script>
-   var sectionEl = document.getElementById("sectionchanger"),
-       sectionChangerWidget = tau.widget.SectionChanger(sectionEl);
+   var sectionEl = document.getElementById("sectionchanger"),
+       sectionChangerWidget = tau.widget.SectionChanger(sectionEl);
 
-   sectionChangerWidget.option("circular", true);
+   sectionChangerWidget.option("circular", true);
 </script>
          3. @@ -187,21 +187,21 @@
          1. Create the UI component: 
            -<div class="ui-indexscrollbar" id="indexscrollbar"></div>
+<div class="ui-indexscrollbar" id="indexscrollbar"></div>
 <script>
-   $("#indexscrollbar").indexscrollbar();
+   $("#indexscrollbar").indexscrollbar();
 </script>
          2. Use the call methods: 
            -$(".selector").componentName("methodName", argument1, argument2, ...);
+$(".selector").componentName("methodName", argument1, argument2, ...);
 
            -<div class="ui-indexscrollbar" id="indexscrollbar"></div>
+<div class="ui-indexscrollbar" id="indexscrollbar"></div>
 <script>
-   /* If the IndexScrollBar component is created */
-   $("#indexscrollbar").indexscrollbar("destroy");
+   /* If the IndexScrollBar component is created */
+   $("#indexscrollbar").indexscrollbar("destroy");
 </script>
            3. diff --git a/org.tizen.guides/html/web/ui/ui_guide_w.htm b/org.tizen.guides/html/web/ui/ui_guide_w.htm index 2c04d3f..296eb76 100644 --- a/org.tizen.guides/html/web/ui/ui_guide_w.htm +++ b/org.tizen.guides/html/web/ui/ui_guide_w.htm @@ -5,13 +5,13 @@ - + - User Interface + User Interface @@ -27,7 +27,7 @@
          3. Tizen 2.3.1 and Higher for Wearable
        -
        +

        User Interface

        @@ -42,7 +42,7 @@ - +
        diff --git a/org.tizen.guides/html/web/w3c/communication/comm_guide_w.htm b/org.tizen.guides/html/web/w3c/communication/comm_guide_w.htm index 8d50ceb..28911a5 100644 --- a/org.tizen.guides/html/web/w3c/communication/comm_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/communication/comm_guide_w.htm @@ -39,15 +39,15 @@

        The main communication features are:

        • HTML5 Web Messaging in mobile and wearable applications only -

          Enables you to send and receive data between Web sites and through a message channel.

          • +

          Enables you to send and receive data between Web sites and through a message channel.

        • WebSocket in mobile and wearable applications only

          Enables you to connect to the socket server, and send and receive data.

        • XMLHttpRequest (Level 1 and 2) in mobile and wearable applications only

          Enables you to use cross-origin resource sharing (CORS) to request and send data of various content types, and to monitor the operation progress.

          • -
        • Server-Sent Events in mobile applications only +
        • Server-Sent Events in mobile applications only

          Enables you to exchange push data with the server.

        - + diff --git a/org.tizen.guides/html/web/w3c/communication/server_sent_w.htm b/org.tizen.guides/html/web/w3c/communication/server_sent_w.htm index be6a291..7e4043d 100644 --- a/org.tizen.guides/html/web/w3c/communication/server_sent_w.htm +++ b/org.tizen.guides/html/web/w3c/communication/server_sent_w.htm @@ -38,10 +38,10 @@

        Server-Sent Events

        - +

        Server-Sent Events feature is used to realize server push in a Web environment. The server push feature has evolved over time from a hidden IFrame through Ajax polling and Comet to the current implementation of server-sent events.

        -

        This feature is supported in mobile applications only.

        +

        This feature is supported in mobile applications only.

        The Server-Sent Events API defines a simple data structure and interface, and a communication mechanism to realize the server push. In addition, it can handle the received data in the general DOM event format. However, the API repeatedly requests the data from the client to the server, so it is not a complete server push. The repeat period of the server request is determined by the retry value of the event stream data format. If the value is not defined, the repeat period is the default value of the browser.

        @@ -57,14 +57,14 @@

        Triggering Server Push Requests

        - +

        To take advantage of the server push feature, you must learn to connect to the server to request push data:

        1. Create an EventSource interface instance: 
           <script>
-   var serverPage = "http://165.213.198.151:8080/server_sent_events_server.php";
-   var eventSource = new EventSource(serverPage);
+   var serverPage = "http://165.213.198.151:8080/server_sent_events_server.php";
+   var eventSource = new EventSource(serverPage);
          @@ -74,21 +74,21 @@
        2. Implement the event handler for the open event: 
          -   var log = document.getElementById("log")
+   var log = document.getElementById("log")
 
-   /* Open event */
-   eventSource.onopen = function(e)
-   {
-      log.innerHTML+= "<p>open: " + new Date() + "</p>";
-   };
+   /* Open event */
+   eventSource.onopen = function(e)
+   {
+      log.innerHTML+= "<p>open: " + new Date() + "</p>";
+   };
 </script>

          The open event is triggered repeatedly based on the retry value of the event stream data format, to request push messages from the server.

        In the following figure, the open event is fired every 2 seconds.

        -

        Figure: Push request event

        -

        Push request event

        +

        Figure: Push request event

        +

        Push request event

        Source Code

        For the complete source code related to this use case, see the following files:

        @@ -96,22 +96,22 @@
      14. server_sent_events_client1.html
      15. server_sent_events_server.php
        16. - +

        Receiving Server Push Data

        - -

        To take advantage of the server push feature, you must learn to handle the push data events:

        + +

        To take advantage of the server push feature, you must learn to handle the push data events:

        1. Define the data server that the client connects to, according to the event stream interpretation rules.

          Set the MIME type to text/event-stream so that the event stream can be sent, and set the header not to be cached.

           <?php
-   header('Content-Type: text/event-stream');
-   header('Cache-Control: no-cache');
+   header('Content-Type: text/event-stream');
+   header('Cache-Control: no-cache');
 
-   echo "retry: 2000\n\n"; /* Reconnection interval */
-   echo "data: push time => ". date('r') . "\n\n";
+   echo "retry: 2000\n\n"; /* Reconnection interval */
+   echo "data: push time => ". date('r') . "\n\n";
 
-   flush();
+   flush();
 ?>
          2. @@ -119,29 +119,29 @@

          Create an EventSource interface instance and implement the event handler for the message event:

           <script>
-   var serverPage = "http://localhost/server_sent_events_server.php";
-   var eventSource = new EventSource(serverPage);
-   var log = document.getElementById("log");
-
-   /* Open event */
-   eventSource.onopen = function(e)
-   {
-      log.innerHTML+= "<p>-----------------------</p>";
-      log.innerHTML+= "<p>open: " + new Date() + "</p>";
-   };
-
-   /* message event */
-   eventSource.onmessage = function(e)
-   {
-      log.innerHTML+= "<p>[push data]: <br/>" + e.data + "</p>";
-   };
+   var serverPage = "http://localhost/server_sent_events_server.php";
+   var eventSource = new EventSource(serverPage);
+   var log = document.getElementById("log");
+
+   /* Open event */
+   eventSource.onopen = function(e)
+   {
+      log.innerHTML+= "<p>-----------------------</p>";
+      log.innerHTML+= "<p>open: " + new Date() + "</p>";
+   };
+
+   /* message event */
+   eventSource.onmessage = function(e)
+   {
+      log.innerHTML+= "<p>[push data]: <br/>" + e.data + "</p>";
+   };
 </script>

        In the following figure, the open event is fired every 2 seconds and the message event shows that push data is received.

        -

        Figure: Push message event

        -

        Push message event

        +

        Figure: Push message event

        +

        Push message event

        Source Code

        For the complete source code related to this use case, see the following files:

          diff --git a/org.tizen.guides/html/web/w3c/communication/web_messaging_w.htm b/org.tizen.guides/html/web/w3c/communication/web_messaging_w.htm index 99fd6e9..fba02be 100644 --- a/org.tizen.guides/html/web/w3c/communication/web_messaging_w.htm +++ b/org.tizen.guides/html/web/w3c/communication/web_messaging_w.htm @@ -60,41 +60,41 @@

          The postMessage() method supports the following parameters:

          • message: Message to be sent.
            • -
          • targetOrigin: Domain receiving the message. If a certain domain cannot be defined, use the wildcard ('*').
            • +
          • targetOrigin: Domain receiving the message. If a certain domain cannot be defined, use the wildcard ('*').
          • transfer (optional): List of transferable objects.
          -

          Learning how to use cross-document messaging enhances the communication capabilities of your application:

          +

          Learning how to use cross-document messaging enhances the communication capabilities of your application:

          1. Create document A and B.
          2. Insert document B as iframe into document A: 
            -<iframe id="frame1"
-        src="./web_messaging_cross_document_messaging_iframe.htm"></iframe>
+<iframe id="frame1"
+        src="./web_messaging_cross_document_messaging_iframe.htm"></iframe>
          3. In document A, use the sendMessage() method to send a message to document B.

            Use the postMessage() method of the iframe window, which sends the message from the method content, to deliver the message to the iframe.

             <script>
-   function sendMessage(message)
-   {
-      var frame1 = document.getElementById('frame1');
-      frame1.contentWindow.postMessage(message, '*');
-   }
+   function sendMessage(message)
+   {
+      var frame1 = document.getElementById('frame1');
+      frame1.contentWindow.postMessage(message, '*');
+   }
 </script>
          4. Register the message event handler in document B to receive the sent message: 
             <script>
-   btnSendMessageHandler = function(e)
-   {
-      var messageEle = document.getElementById('message');
-      sendMessage(messageEle.value);
-   };
-   /* Register event handler */
-   btnSendMessage.onclick = btnSendMessageHandler;
+   btnSendMessageHandler = function(e)
+   {
+      var messageEle = document.getElementById('message');
+      sendMessage(messageEle.value);
+   };
+   /* Register event handler */
+   btnSendMessage.onclick = btnSendMessageHandler;
 </script>
            5. @@ -104,34 +104,34 @@ - +

            Using Channel Messaging

            -

            The MessageChannel instance broadcasts message sending and receiving, and has 2 properties: port1 and port2. Each port is used to send and receive messages, and a message that is sent from one port with the postMessage() method is received by the other through the message event.

            -

            Learning how to use channel messaging enhances the communication capabilities of your application:

            +

            The MessageChannel instance broadcasts message sending and receiving, and has 2 properties: port1 and port2. Each port is used to send and receive messages, and a message that is sent from one port with the postMessage() method is received by the other through the message event.

            +

            Learning how to use channel messaging enhances the communication capabilities of your application:

              -
            1. To send a message from document A to document B, create in document A a MessageChannel interface instance, which has 2 message port attributes: port1 and port2. +
            2. To send a message from document A to document B, create in document A a MessageChannel interface instance, which has 2 message port attributes: port1 and port2.

              The port2 attribute of the MessageChannel instance is delivered to document B through the postMessage() method of the document B window object:

               <script>
-   var messageChannel = new MessageChannel();
-
-   function setMessagePort()
-   {
-      /* iframe element ID of the port to be delivered */
-      var frame1 = document.getElementById('iframe1');
-      frame1.contentWindow.postMessage('', [messageChannel.port2], '*');
-   };
-
-   window.onload = function()
-   {
-      setMessagePort();
-   };
-
-   /* Message is sent to port2 through port1 */
-   function sendMessage(message)
-   {
-      messageChannel.port1.postMessage(message);
-   };
+   var messageChannel = new MessageChannel();
+
+   function setMessagePort()
+   {
+      /* iframe element ID of the port to be delivered */
+      var frame1 = document.getElementById('iframe1');
+      frame1.contentWindow.postMessage('', [messageChannel.port2], '*');
+   };
+
+   window.onload = function()
+   {
+      setMessagePort();
+   };
+
+   /* Message is sent to port2 through port1 */
+   function sendMessage(message)
+   {
+      messageChannel.port1.postMessage(message);
+   };
 </script>
              @@ -144,19 +144,19 @@
            3. Define a message event in the window object of document B, and register the event handler in the port sent from document A. 
               <script>
-   var port = null;
-
-   messageHandler = function(e)
-   {
-      port = e.ports[0];
-      port.onmessage = function(e)
-      {
-         var messageEle = document.getElementById('message');
-         messageEle.innerHTML = e.data;
-      };
-   };
-
-   window.onmessage = messageHandler;
+   var port = null;
+
+   messageHandler = function(e)
+   {
+      port = e.ports[0];
+      port.onmessage = function(e)
+      {
+         var messageEle = document.getElementById('message');
+         messageEle.innerHTML = e.data;
+      };
+   };
+
+   window.onmessage = messageHandler;
 </script>

              A message sent through the postMessage() method of port1 from document A is received through the message event of port2 in document B, and the message sent through the postMessage() method of port2 from document B is received through the message event of port1 in document A.

              diff --git a/org.tizen.guides/html/web/w3c/communication/websocket_w.htm b/org.tizen.guides/html/web/w3c/communication/websocket_w.htm index 914ede3..f1462c4 100644 --- a/org.tizen.guides/html/web/w3c/communication/websocket_w.htm +++ b/org.tizen.guides/html/web/w3c/communication/websocket_w.htm @@ -31,7 +31,7 @@
            4. Sending Data to the Server
            5. Receiving Data from the Server
            6. Closing the Socket Connection
              7. -
        +

        Related Info

        • WebSocket API for Mobile Web
          • @@ -42,12 +42,12 @@

          WebSocket

          - +

          WebSocket in a Web environment enables connection-oriented full duplex communication, as with a TCP socket. (The server and browser can send and receive data real-time through a continuously connected TCP line.)

          This feature is supported in mobile and wearable applications only.

          -

          The difference between the previously used communication method in the Web environment and the new Web socket lies in the protocol. The Web socket protocol uses HTTP in establishing a connection, however, all communication after the connection is established happens using the Web socket's independent protocol.

          +

          The difference between the previously used communication method in the Web environment and the new Web socket lies in the protocol. The Web socket protocol uses HTTP in establishing a connection, however, all communication after the connection is established happens using the Web socket's independent protocol.

          With a Web socket, the used header is extremely small, causing very little overhead. A long-term connection is used as a basis, meaning that if there is connection, sending data from client or server is possible. The long-term connection means that data can be sent and received through 1 connection, and you do not need to establish a separate connection for each sending and receiving instance. Ping and pong frames can also be used.

          @@ -69,12 +69,12 @@ URL format has some restrictions, for example, it must use the ws

          Connecting to the Socket Server

          - -

          To use the Web socket features in your application, you must learn to connect to a socket server:

          + +

          To use the Web socket features in your application, you must learn to connect to a socket server:

          1. Create a WebSocket interface instance using a valid socket server URL as a parameter:

            -var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
+var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
 
 var webSocket = new WebSocket(webSocketURL);
            @@ -85,13 +85,13 @@ var webSocket = new WebSocket(webSocketURL); /* If the connection is established */ webSocket.onopen = function(e) { -   console.log('connection open, readyState: ' + e.target.readyState); + console.log('connection open, readyState: ' + e.target.readyState); }; /* If the connection fails or is closed with prejudice */ webSocket.onerror = function(e) { -   /* Error handling */ + /* Error handling */ };

            If the connection is established, the readyState attribute is changed to 1 and the open event is triggered. If the connection fails, the attribute value is set to 3, and the HTTP 503 error is returned.

            @@ -104,12 +104,12 @@ webSocket.onerror = function(e)

        Sending Data to the Server

        - -

        To use the Web socket features in your application, you must learn to connect to send data to the server:

        + +

        To use the Web socket features in your application, you must learn to connect to send data to the server:

        1. Create a WebSocket interface instance using a valid socket server URL as a parameter:

          -var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
+var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
 
 var webSocket = new WebSocket(webSocketURL);
          @@ -119,10 +119,10 @@ var webSocket = new WebSocket(webSocketURL); 
           function sendMessage(msg)
 {
-   if (webSocket.readyState === 1)
-   {
-      webSocket.send(msg);
-   }
+   if (webSocket.readyState === 1)
+   {
+      webSocket.send(msg);
+   }
 };
          2. @@ -135,12 +135,12 @@ function sendMessage(msg)

          Receiving Data from the Server

          - -

          To use the Web socket features in your application, you must learn to receive data from the server:

          + +

          To use the Web socket features in your application, you must learn to receive data from the server:

          1. Create a WebSocket interface instance using a valid socket server URL as a parameter:

            -var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
+var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
 
 var webSocket = new WebSocket(webSocketURL);
            @@ -149,7 +149,7 @@ var webSocket = new WebSocket(webSocketURL); 
             webSocket.onmessage = function(e)
 {
-   console.log('server message: ' + e.data);
+   console.log('server message: ' + e.data);
 };
            2. @@ -160,14 +160,14 @@ webSocket.onmessage = function(e)
          2. web_socket.htm
            3. - +

            Closing the Socket Connection

            - -

            To use the Web socket features in your application, you must learn to close the socket connection:

            + +

            To use the Web socket features in your application, you must learn to close the socket connection:

            1. Create a WebSocket interface instance using a valid socket server URL as a parameter:

              -var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
+var webSocketUrl = "wss://html5labs-interop.cloudapp.net:443/echo";
 
 var webSocket = new WebSocket(webSocketURL);
              @@ -176,7 +176,7 @@ var webSocket = new WebSocket(webSocketURL); 
               webSocket.onclose = function(e)
 {
-   console.log('connection close, readyState: ' + e.target.readyState);
+   console.log('connection close, readyState: ' + e.target.readyState);
 };
              2. @@ -185,10 +185,10 @@ webSocket.onclose = function(e) 
               function closeConnection()
 {
-   if (webSocket.readyState === 1)
-   {
-      webSocket.close();
-   }
+   if (webSocket.readyState === 1)
+   {
+      webSocket.close();
+   }
 };
              diff --git a/org.tizen.guides/html/web/w3c/communication/xmlhttprequest_w.htm b/org.tizen.guides/html/web/w3c/communication/xmlhttprequest_w.htm index fbc927a..572f8b2 100644 --- a/org.tizen.guides/html/web/w3c/communication/xmlhttprequest_w.htm +++ b/org.tizen.guides/html/web/w3c/communication/xmlhttprequest_w.htm @@ -105,19 +105,19 @@

              Sending a Cross-origin Request

              - +

              To use the XML HTTP request features in your application, you must learn to send a cross-origin request:

              1. Create an XMLHttpRequest interface instance:

                 <script>
-   var client = new XMLHttpRequest();
+   var client = new XMLHttpRequest();

              2. Open the connection with the open() method using the cross-domain URL as a parameter. Send the request with the send() method.

                -   client.open("GET", "video_sample.mp4");
-   client.send();
+   client.open("GET", "video_sample.mp4");
+   client.send();
 </script>
                @@ -134,45 +134,45 @@
              3. video_sample.mp4
                4. - +

                Uploading Files with Ajax

                To use the XML HTTP request features in your application, you must learn to upload files on the background with Ajax:

                1. Define the input elements for the file upload. Use the upload() method for the button click event to upload the file when the button is clicked.

                  -<input type="file" id="uploadfile" name="uploadfile"/>
-<input type="button" value="upload" onclick="upload()"/>
+<input type="file" id="uploadfile" name="uploadfile"/>
+<input type="button" value="upload" onclick="upload()"/>
                  2. -

                2. In the upload() method, create a FormData interface instance, and add the file element with the attached file into it. Use the send() method to send the FormData to the server. +

                3. In the upload() method, create a FormData interface instance, and add the file element with the attached file into it. Use the send() method to send the FormData to the server. 

                   <script>
-   var client = new XMLHttpRequest();
-
-   function upload()
-   {
-      var file = document.getElementById("uploadfile");
-
-      /* Create a FormData instance */
-      var formData = new FormData();
-      /* Add the file */
-      formData.append("upload", file.files[0]);
-
-      client.open("post", "/upload", true);
-      client.setRequestHeader("Content-Type", "multipart/form-data");
-      client.send(formData); /* Send to server */
-   }
-
-   /* Check the response status */
-   client.onreadystatechange = function()
-   {
-      if (client.readyState == 4 && client.status == 200)
-      {
-         alert(client.statusText);
-      }
-   }
+   var client = new XMLHttpRequest();
+
+   function upload()
+   {
+      var file = document.getElementById("uploadfile");
+
+      /* Create a FormData instance */
+      var formData = new FormData();
+      /* Add the file */
+      formData.append("upload", file.files[0]);
+
+      client.open("post", "/upload", true);
+      client.setRequestHeader("Content-Type", "multipart/form-data");
+      client.send(formData); /* Send to server */
+   }
+
+   /* Check the response status */
+   client.onreadystatechange = function()
+   {
+      if (client.readyState == 4 && client.status == 200)
+      {
+         alert(client.statusText);
+      }
+   }
 </script>
                  4. @@ -182,95 +182,95 @@ - +

                  Handling Request Events

                  To use the XML HTTP request features in your application, you must learn to track requests through events:

                  1. Define a text element in which to display the request event results:

                    -<div id="divText"></div>
+<div id="divText"></div>

                  2. Create an XMLHttpRequest interface instance and define event handlers for it:

                     <script>
-   var html = "";
-
-   var client = new XMLHttpRequest();
-
-   /* Event handlers */
-   client.onloadstart = onloadstarthandler;
-   client.onprogress = onprogresshandler;
-   client.onabort = onaborthandler;
-   client.onerror = onerrorhandler;
-   client.onload = onloadhandler;
-   client.ontimeout = ontimeouthandler;
-   client.onloadend = onloadendhandler;
-   client.onreadystatechange = onreadystatechangehandler;
-
-   /* Assign request type and server path */
-   client.open("GET", "video_sample.mp4");
-   client.send();
+   var html = "";
+
+   var client = new XMLHttpRequest();
+
+   /* Event handlers */
+   client.onloadstart = onloadstarthandler;
+   client.onprogress = onprogresshandler;
+   client.onabort = onaborthandler;
+   client.onerror = onerrorhandler;
+   client.onload = onloadhandler;
+   client.ontimeout = ontimeouthandler;
+   client.onloadend = onloadendhandler;
+   client.onreadystatechange = onreadystatechangehandler;
+
+   /* Assign request type and server path */
+   client.open("GET", "video_sample.mp4");
+   client.send();

                  3. Define the actions of each event handler:

                    -   /* When the request begins */
-   function onloadstarthandler(e)
-   {
-      html += "onloadstart<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* When the request is in progress */
-   function onprogresshandler(e)
-   {
-      html += "onprogress<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* When the client cancels the request */
-   function onaborthandler(e)
-   {
-      html += "onabort<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* When server exception occurs */
-   function onerrorhandler(e)
-   {
-      html += "onerror<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* When the request is successfully terminated */
-   function onloadhandler(e)
-   {
-      html += "onload<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* When a timeout occurs */
-   function ontimeouthandler(e)
-   {
-      html += "ontimeout<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* When request is terminated regardless of success or failure */
-   function onloadendhandler(e)
-   {
-      html += "onloadend<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
-
-   /* Checks current progress based on a random repetition period */
-   function onreadystatechangehandler(e)
-   {
-      html += "onreadystate<br/>";
-      document.getElementById("divText").innerHTML = html;
-   }
+   /* When the request begins */
+   function onloadstarthandler(e)
+   {
+      html += "onloadstart<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* When the request is in progress */
+   function onprogresshandler(e)
+   {
+      html += "onprogress<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* When the client cancels the request */
+   function onaborthandler(e)
+   {
+      html += "onabort<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* When server exception occurs */
+   function onerrorhandler(e)
+   {
+      html += "onerror<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* When the request is successfully terminated */
+   function onloadhandler(e)
+   {
+      html += "onload<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* When a timeout occurs */
+   function ontimeouthandler(e)
+   {
+      html += "ontimeout<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* When request is terminated regardless of success or failure */
+   function onloadendhandler(e)
+   {
+      html += "onloadend<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
+
+   /* Checks current progress based on a random repetition period */
+   function onreadystatechangehandler(e)
+   {
+      html += "onreadystate<br/>";
+      document.getElementById("divText").innerHTML = html;
+   }
 </script>
                    4. @@ -281,55 +281,55 @@
                  4. xhr2.html
                  5. video_sample.mp4
                    6. - +

                    Tracking Download Progress State

                    -

                    To use the XML HTTP request features in your application, you must learn to track download progress:

                    +

                    To use the XML HTTP request features in your application, you must learn to track download progress:

                    1. Define the input elements for managing a download. Use the sendRequest() and abortRequest() methods for the button click events to start and cancel a download.

                      -<input type="button" value="Send XMLHttpRequest" onclick="sendRequest()"/>
-<input type="button" value="Abort Sending" onclick="abortRequest()"/>
-<div id="divText"></div>
+<input type="button" value="Send XMLHttpRequest" onclick="sendRequest()"/>
+<input type="button" value="Abort Sending" onclick="abortRequest()"/>
+<div id="divText"></div>

                    2. Create an XMLHttpRequest interface instance and define the handlers for the onprogress and onabort events to track the download progress and cancellation events:

                       <script>
-   var client = new XMLHttpRequest();
+   var client = new XMLHttpRequest();
 
-   client.onprogress = onprogresshandler;
-   client.onabort = onaborthandler;
+   client.onprogress = onprogresshandler;
+   client.onabort = onaborthandler;
 </script>

                    3. Use the send() method to request for a file to be read when the Start download button is clicked. When the Cancel download button is clicked, use the abort() method to cancel the download.

                       <script>
-   /* When Start download button is clicked */
-   function sendRequest()
-   {
-      client.send();
-   }
-
-   /* When Cancel download button is clicked */
-   function abortRequest()
-   {
-      client.abort();
-   }
+   /* When Start download button is clicked */
+   function sendRequest()
+   {
+      client.send();
+   }
+
+   /* When Cancel download button is clicked */
+   function abortRequest()
+   {
+      client.abort();
+   }

                    4. During the download, use the onprogresshandler event handler to track the current and total download size, and calculate the download status. With the onaborthandler event handler, you can display the cancellation notification on the screen.

                      -   function onprogresshandler(e)
-   {
-      document.getElementById("divText").innerHTML = "DownLoading... (" + parseInt(e.loaded / e.totalSize * 100) + "%)";
-   }
-
-   function onaborthandler(e)
-   {
-      document.getElementById("divText").innerHTML = "Download has been cancelled by user.";
-   }
+   function onprogresshandler(e)
+   {
+      document.getElementById("divText").innerHTML = "DownLoading... (" + parseInt(e.loaded / e.totalSize * 100) + "%)";
+   }
+
+   function onaborthandler(e)
+   {
+      document.getElementById("divText").innerHTML = "Download has been cancelled by user.";
+   }
 </script>
                      5. diff --git a/org.tizen.guides/html/web/w3c/device/battery_w.htm b/org.tizen.guides/html/web/w3c/device/battery_w.htm index f583213..6d7ee5e 100644 --- a/org.tizen.guides/html/web/w3c/device/battery_w.htm +++ b/org.tizen.guides/html/web/w3c/device/battery_w.htm @@ -11,7 +11,7 @@ Battery Status - + @@ -45,9 +45,9 @@

                      Battery Status

                      You can programmatically determine the battery status of the device on which your application is running.

                      - +

                      This feature is supported in mobile and wearable applications only.

                      - +

                      The main features of the Battery Status API include:

                      - +

                      Knowing the battery status of the device helps you to defer or scale back work when the device is not charging or is low on battery. For example:

                      • A Web-based email client can modify how often it checks the server for new email based on the battery status. It can make the check every few seconds if the device is charging or has a full battery, but less often if the device is not charging or is low on battery.
                      • A Web-based word processor can monitor the battery level and prevent data loss by saving any changes before the battery runs out.
                      @@ -65,23 +65,23 @@

                      Retrieving Battery Status Information

                      -

                      To enhance the user interaction with the device, you must learn to retrieve and display the battery status:

                      -
                        +

                        To enhance the user interaction with the device, you must learn to retrieve and display the battery status:

                        +

                        1. Define the elements used to display the battery status information on the screen:

                          -<div>charging: <span id="charging"></span></div>
-<div>level: <span id="level"></span></div>
+<div>charging: <span id="charging"></span></div>
+<div>level: <span id="level"></span></div>
                          -
                          2. +

                        2. Check whether the Battery Status API is supported. If it is supported, the object navigator area contains the battery property:

                           <script>
-   /* As Tizen is webkit-based, it uses the webkit prefix */
-   var battery = navigator.battery || navigator.webkitBattery
-      || navigator.mozBattery;
+   /* As Tizen is webkit-based, it uses the webkit prefix */
+   var battery = navigator.battery || navigator.webkitBattery
+      || navigator.mozBattery;
 </script>
                          3. @@ -92,21 +92,21 @@ 
                           <script>
-   window.addEventListener('load', function(e)
-      {
-         /* Charging status: true or false */
-         document.querySelector('#charging').textContent =
-            battery.charging ? 'charging' : 'not charging';
-
-         /* Battery.level: between 0 and 1 (for example, 0.50) */
-         document.querySelector('#level').textContent =
-            Math.floor(battery.level * 100) + '%';
-      }, false);
+   window.addEventListener('load', function(e)
+      {
+         /* Charging status: true or false */
+         document.querySelector('#charging').textContent =
+            battery.charging ? 'charging' : 'not charging';
+
+         /* Battery.level: between 0 and 1 (for example, 0.50) */
+         document.querySelector('#level').textContent =
+            Math.floor(battery.level * 100) + '%';
+      }, false);
 </script>
                          -
                        +
                      -

                      Figure: Displaying battery status (in mobile applications only)

                      +

                      Figure: Displaying battery status (in mobile applications only)

                      Displaying battery status (in mobile applications only)

                      Source Code

                      @@ -114,29 +114,29 @@ - +

                      Detecting Battery Status Changes

                      - -

                      To enhance the user interaction with the device, you must learn to set event handlers to detect changes in the battery status:

                      -
                        + +

                        To enhance the user interaction with the device, you must learn to set event handlers to detect changes in the battery status:

                        +

                        1. Define the elements used to display the battery status change information on the screen:

                          -<div id="charging"></div>
+<div id="charging"></div>
 <div>
-   <progress id="progress" value="0" max="100"></progress>
-   <span id="level"></span>
+   <progress id="progress" value="0" max="100"></progress>
+   <span id="level"></span>
 </div>
-<div id="message"></div>
+<div id="message"></div>
                          -
                          2. +

                        2. Check whether the Battery Status API is supported. If it is supported, the object navigator area contains the battery property:

                           <script>
-   /* As Tizen is webkit-based, it uses the webkit prefix */
-   var battery = navigator.battery || navigator.mozBattery
-      || navigator.webkitBattery;
+   /* As Tizen is webkit-based, it uses the webkit prefix */
+   var battery = navigator.battery || navigator.mozBattery
+      || navigator.webkitBattery;
 </script>
                          3. @@ -145,12 +145,12 @@ 
                           <script>
-   window.addEventListener('load', getBatteryState);
+   window.addEventListener('load', getBatteryState);
 
-   /* Detects changes in the battery charging status */
-   battery.addEventListener('chargingchange', getBatteryState);
-   /* Detects changes in the battery level */
-   battery.addEventListener('levelchange', getBatteryState);
+   /* Detects changes in the battery charging status */
+   battery.addEventListener('chargingchange', getBatteryState);
+   /* Detects changes in the battery level */
+   battery.addEventListener('levelchange', getBatteryState);
 </script>
                          @@ -159,28 +159,28 @@ 
                           <script>
-   function getBatteryState()
-   {
-      var message = "";
-
-      var charging = battery.charging;
-      var level = Math.floor(battery.level * 100);
-
-      if (charging == false && level < 100)
-      {
-         /* Not charging */
-      }
-      else if (level == 100)
-      {
-         message = "Charging is completed";
-      }
-
-      document.querySelector('#charging').textContent =
-         charging ? 'charging...' : 'Please connect the charger.';
-      document.querySelector('#level').textContent = level + "%";
-      document.querySelector('#progress').value = level;
-      document.querySelector('#message').textContent = message;
-   }
+   function getBatteryState()
+   {
+      var message = "";
+
+      var charging = battery.charging;
+      var level = Math.floor(battery.level * 100);
+
+      if (charging == false && level < 100)
+      {
+         /* Not charging */
+      }
+      else if (level == 100)
+      {
+         message = "Charging is completed";
+      }
+
+      document.querySelector('#charging').textContent =
+         charging ? 'charging...' : 'Please connect the charger.';
+      document.querySelector('#level').textContent = level + "%";
+      document.querySelector('#progress').value = level;
+      document.querySelector('#message').textContent = message;
+   }
 </script>

                          If the battery is not charging, a message is displayed telling you to charge the battery.

                          @@ -188,10 +188,10 @@ You can use a progress bar to display the battery charging level.

                          -
                        +
                      -

                      Figure: Battery status (in mobile applications only)

                      -

                      Battery status (in mobile applications only)

                      +

                      Figure: Battery status (in mobile applications only)

                      +

                      Battery status (in mobile applications only)

                      Source Code

                      diff --git a/org.tizen.guides/html/web/w3c/device/browser_state_w.htm b/org.tizen.guides/html/web/w3c/device/browser_state_w.htm index 812fad3..371fc39 100644 --- a/org.tizen.guides/html/web/w3c/device/browser_state_w.htm +++ b/org.tizen.guides/html/web/w3c/device/browser_state_w.htm @@ -37,10 +37,10 @@

                      HTML5 Browser state

                      - +

                      You can access information about the network connection state of the browser.

                      -

                      This feature is supported in mobile applications only.

                      +

                      This feature is supported in mobile applications only.

                      The navigator.onLine attribute returns false, if the browser cannot establish a connection to the network when a remote page is requested. To track the changes in the connection state, you must subscribe to the applicable events: online and offline. The events can be executed in the Window or WorkerGlobalScope object.

                      @@ -85,32 +85,32 @@ 
                       <!DOCTYPE HTML>
 <html>
-   <head>
-      <title>Online status</title>
-      <script>
+   <head>
+      <title>Online status</title>
+      <script>
 
                      -         function updateIndicator()
-         {
-            var status = navigator.onLine ? 'online' : 'offline';
-            document.getElementById('indicator').textContent = status;
-         }
+         function updateIndicator()
+         {
+            var status = navigator.onLine ? 'online' : 'offline';
+            document.getElementById('indicator').textContent = status;
+         }

                    5. Subscribe to event listeners to be informed when the connection state changes:

                      -         /* Receive event when page is loaded */
-         window.onload = updateIndicator;
-         /* Receive event when network connection is available */
-         window.ononline = updateIndicator;
-         /* Receive event when network connection is unavailable */
-         window.onoffline = updateIndicator;
+         /* Receive event when page is loaded */
+         window.onload = updateIndicator;
+         /* Receive event when network connection is available */
+         window.ononline = updateIndicator;
+         /* Receive event when network connection is unavailable */
+         window.onoffline = updateIndicator;
 
                      -      </script>
-   </head>
-   <body>
-      <p>The network is: <span id="indicator">(state unknown)</span>
-   </body>
+      </script>
+   </head>
+   <body>
+      <p>The network is: <span id="indicator">(state unknown)</span>
+   </body>
 </html>

                    Source Code

                    diff --git a/org.tizen.guides/html/web/w3c/device/device_guide_w.htm b/org.tizen.guides/html/web/w3c/device/device_guide_w.htm index 0575f25..d5bddfa 100644 --- a/org.tizen.guides/html/web/w3c/device/device_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/device/device_guide_w.htm @@ -43,13 +43,13 @@
                  6. DeviceOrientation Event Specification in mobile and wearable applications only

                    Enables you to detect rotation and acceleration motions on the device.

                  7. Touch Events version 1 in mobile and wearable applications only -

                    Enables you to implement various types of touch events, coordinate touch points, and control multi-touch.

                    8. +

                    Enables you to implement various types of touch events, coordinate touch points, and control multi-touch.

                  8. Vibration in mobile and wearable applications only

                    Enables you to implement different vibration patterns on a Tizen device.

                  9. HTML5 Browser state in mobile applications only

                    Enables you to retrieve information about the network connection state of the browser.

                  10. Screen Orientation in mobile applications only -

                    Enables you to retrieve the current screen orientation state, monitor state changes, and lock the screen to a specific orientation.

                    11. +

                    Enables you to retrieve the current screen orientation state, monitor state changes, and lock the screen to a specific orientation.

                    diff --git a/org.tizen.guides/html/web/w3c/device/device_orientation_w.htm b/org.tizen.guides/html/web/w3c/device/device_orientation_w.htm index 2c05a11..a4921fd 100644 --- a/org.tizen.guides/html/web/w3c/device/device_orientation_w.htm +++ b/org.tizen.guides/html/web/w3c/device/device_orientation_w.htm @@ -11,7 +11,7 @@ DeviceOrientation Event Specification - + @@ -66,26 +66,26 @@ 
                     <h1>Device orientation tutorial</h1>
 <div>
-   <p id="alpha"></p>
-   <p id="beta"></p>
-   <p id="gamma"></p>
+   <p id="alpha"></p>
+   <p id="beta"></p>
+   <p id="gamma"></p>
 </div>
 
 <script>
 
                    -   var alphaElem = document.getElementById("alpha");
-   var betaElem = document.getElementById("beta");
-   var gammaElem = document.getElementById("gamma");
+   var alphaElem = document.getElementById("alpha");
+   var betaElem = document.getElementById("beta");
+   var gammaElem = document.getElementById("gamma");
                  11. To track changes in the device rotation, subscribe to the deviceorientation event: 
                    -   window.addEventListener("deviceorientation", function(e)
-      {
-         alphaElem.innerHTML ='alpha value ' + Math.round(e.alpha);
-         betaElem.innerHTML = 'beta value ' + Math.round(e.beta);
-         gammaElem.innerHTML = 'gamma value ' + Math.round(e.gamma);
-      }, true);
+   window.addEventListener("deviceorientation", function(e)
+      {
+         alphaElem.innerHTML ='alpha value ' + Math.round(e.alpha);
+         betaElem.innerHTML = 'beta value ' + Math.round(e.beta);
+         gammaElem.innerHTML = 'gamma value ' + Math.round(e.gamma);
+      }, true);
 
                     </script>
@@ -96,7 +96,7 @@
  
-			
+
 				
                    Detecting Device Acceleration
                    
 			
                    Learning how to detect device acceleration is a basic device motion handling skill:
                    
 
                      
@@ -104,40 +104,40 @@
 
                       <h1>device orientation tutorial</h1>
 <div>
-   <p id="firElem"></p>
-   <p id="secElem"></p>
-   <p id="thirElem"></p>
+   <p id="firElem"></p>
+   <p id="secElem"></p>
+   <p id="thirElem"></p>
 </div>
 
 <script>
 
                      
 
                      -   var firElem = document.getElementById("firElem");
-   var secElem = document.getElementById("secElem");
-   var thirElem = document.getElementById("thirElem");
+   var firElem = document.getElementById("firElem");
+   var secElem = document.getElementById("secElem");
+   var thirElem = document.getElementById("thirElem");
 
                      
 
                    1. To track changes in the device acceleration, subscribe to the devicemotion event:
 
                      -   window.addEventListener("devicemotion", function(e)
-   {
-      /* Data for acceleration */
-      firElem.innerHTML = 'acceleration value<br/><br/> '
-         + '[ x value: ' + Math.round(e.acceleration.x) + " ]<br/>"
-         + '[ y value: ' + Math.round(e.acceleration.y) + " ]<br/>"
-         + '[ z value: ' + Math.round(e.acceleration.z) + ']';
-
-      /* Data for acceleration, including gravity */
-      secElem.innerHTML = 'accelerationIncludingGravity value<br/><br/> '
-         + '[ x value: ' + Math.round(e.accelerationIncludingGravity.x) + " ]<br/>"
-         + '[ y value: ' + Math.round(e.accelerationIncludingGravity.y) + " ]<br/>"
-         + '[ z value: ' + Math.round(e.accelerationIncludingGravity.z) + ']';
-
-      /* Data for rotation rate */
-      thirElem.innerHTML = 'rotationRate value<br/><br/> '
-         + '[ alpha value: ' + Math.round(e.rotationRate.alpha) + " degree ]<br/>"
-         + '[ beta value: ' + Math.round(e.rotationRate.beta) + " degree ]<br/>"
-         + '[ gamma value: ' + Math.round(e.rotationRate.gamma) + ' degree ]';
-   }, true);
+   window.addEventListener("devicemotion", function(e)
+   {
+      /* Data for acceleration */
+      firElem.innerHTML = 'acceleration value<br/><br/> '
+         + '[ x value: ' + Math.round(e.acceleration.x) + " ]<br/>"
+         + '[ y value: ' + Math.round(e.acceleration.y) + " ]<br/>"
+         + '[ z value: ' + Math.round(e.acceleration.z) + ']';
+
+      /* Data for acceleration, including gravity */
+      secElem.innerHTML = 'accelerationIncludingGravity value<br/><br/> '
+         + '[ x value: ' + Math.round(e.accelerationIncludingGravity.x) + " ]<br/>"
+         + '[ y value: ' + Math.round(e.accelerationIncludingGravity.y) + " ]<br/>"
+         + '[ z value: ' + Math.round(e.accelerationIncludingGravity.z) + ']';
+
+      /* Data for rotation rate */
+      thirElem.innerHTML = 'rotationRate value<br/><br/> '
+         + '[ alpha value: ' + Math.round(e.rotationRate.alpha) + " degree ]<br/>"
+         + '[ beta value: ' + Math.round(e.rotationRate.beta) + " degree ]<br/>"
+         + '[ gamma value: ' + Math.round(e.rotationRate.gamma) + ' degree ]';
+   }, true);
 
                      
 
                       </script>
@@ -146,7 +146,7 @@
  
                      For the complete source code related to this use case, see the following file:
                      
   
+ 
 
 
 
diff --git a/org.tizen.guides/html/web/w3c/device/screen_orientation_w.htm b/org.tizen.guides/html/web/w3c/device/screen_orientation_w.htm
index 5e8c928..fe9ae1d 100644
--- a/org.tizen.guides/html/web/w3c/device/screen_orientation_w.htm
+++ b/org.tizen.guides/html/web/w3c/device/screen_orientation_w.htm
@@ -53,7 +53,7 @@
 
                      To receive notifications of the screen orientation changes, add an event listener to the Screen object, or assign a function reference to the screen.onorientationchange attribute:
                      
 
                       /* Add listener */
-screen.addEventListener("orientationchange", handleScreenOrientationFun, false);
+screen.addEventListener("orientationchange", handleScreenOrientationFun, false);
 
 /* Or assign reference */
 screen.onorientationchange = handleScreenOrientationFun;
@@ -75,18 +75,18 @@ screen.onorientationchange = handleScreenOrientationFun;
 
                      1. Define the text and button elements for the screen (the body of the HTML page):
 
                         <body>
-   <div class="main">
-      <p>Current orientation is:</p>
-      <p id="currentOrientation" class="current-orientation"></p>
-
-      <button id="portrait-primary" class="button">Portrait primary</button><br/>
-      <button id="landscape-secondary"
-              class="button">Landscape secondary</button><br/>
-      <button id="portrait-secondary"
-              class="button">Portrait secondary</button><br/>
-      <button id="landscape-primary" class="button">Landscape primary</button><br/>
-      <button id="unlock-orientation" class="button">Unlock orientation</button>
-   </div>
+   <div class="main">
+      <p>Current orientation is:</p>
+      <p id="currentOrientation" class="current-orientation"></p>
+
+      <button id="portrait-primary" class="button">Portrait primary</button><br/>
+      <button id="landscape-secondary"
+              class="button">Landscape secondary</button><br/>
+      <button id="portrait-secondary"
+              class="button">Portrait secondary</button><br/>
+      <button id="landscape-primary" class="button">Landscape primary</button><br/>
+      <button id="unlock-orientation" class="button">Unlock orientation</button>
+   </div>
 </body>
 
                        2. 
 
@@ -94,15 +94,15 @@ screen.onorientationchange = handleScreenOrientationFun;
 
 
                         <script>
-   function updateCurrOrrTxt()
-   {
-      document.getElementById("currentOrientation").innerHTML = screen.orientation;
-   }
-
-   window.onload = function()
-   {
-      document.getElementById("currentOrientation").innerHTML = screen.orientation;
-      screen.addEventListener("orientationchange", updateCurrOrrTxt, false);
+   function updateCurrOrrTxt()
+   {
+      document.getElementById("currentOrientation").innerHTML = screen.orientation;
+   }
+
+   window.onload = function()
+   {
+      document.getElementById("currentOrientation").innerHTML = screen.orientation;
+      screen.addEventListener("orientationchange", updateCurrOrrTxt, false);
 
                        
 
 
                      2. Use the onclick event handlers to react to the button clicks. For the first 4 buttons, use the lockOrientation() method to lock the screen orientation in place, and for the final button, use the unlockOrientation() method to release the orientation lock.
@@ -111,18 +111,18 @@ screen.onorientationchange = handleScreenOrientationFun;
 
                        The lockOrientation() method accepts the following parameter values: portrait-primary, portrait-secondary, landscape-primary, landscape-secondary, portrait, and landscape.
                        
 
 
                        -      document.getElementById("portrait-primary").onclick = function()
-      {
-         screen.lockOrientation('portrait-primary');
-      }
-
-      /* Other 3 orientation buttons are handled similarly */
-
-      document.getElementById("unlock-orientation").onclick = function()
-      {
-         screen.unlockOrientation();
-      }
-   }
+      document.getElementById("portrait-primary").onclick = function()
+      {
+         screen.lockOrientation('portrait-primary');
+      }
+
+      /* Other 3 orientation buttons are handled similarly */
+
+      document.getElementById("unlock-orientation").onclick = function()
+      {
+         screen.unlockOrientation();
+      }
+   }
 </script>
 
                        
 
@@ -136,34 +136,34 @@ screen.onorientationchange = handleScreenOrientationFun;
 
 
                      3. Define CSS styles in the <head> section of the document to make the application more eye-catching.
 
                        -<style type="text/css">
-   *
-   {
-      font-family: Lucida Sans, Arial, Helvetica, sans-serif;
-   }
-   .main
-   {
-      font-size: 32px;
-      text-align: center;
-      margin-top: auto;
-      margin-left: auto;
-      margin-right: auto;
-      margin-bottom: auto;
-   }
-
-   .button
-   {
-      font-size: x-large;
-      margin-top: 25px;
-      width: 80%;
-      height: 50px;
-   }
-
-   .current-orientation
-   {
-      font-size: xx-large;
-      font-weight: bolder;
-   }
+<style type="text/css">
+   *
+   {
+      font-family: Lucida Sans, Arial, Helvetica, sans-serif;
+   }
+   .main
+   {
+      font-size: 32px;
+      text-align: center;
+      margin-top: auto;
+      margin-left: auto;
+      margin-right: auto;
+      margin-bottom: auto;
+   }
+
+   .button
+   {
+      font-size: x-large;
+      margin-top: 25px;
+      width: 80%;
+      height: 50px;
+   }
+
+   .current-orientation
+   {
+      font-size: xx-large;
+      font-weight: bolder;
+   }
 </style>
 
                      
 
diff --git a/org.tizen.guides/html/web/w3c/device/task_compass_w.htm b/org.tizen.guides/html/web/w3c/device/task_compass_w.htm
index c5574e6..8ef17be 100644
--- a/org.tizen.guides/html/web/w3c/device/task_compass_w.htm
+++ b/org.tizen.guides/html/web/w3c/device/task_compass_w.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Task: Compass  
+	Task: Compass
 
 
 
@@ -20,7 +20,7 @@
 	
                      
 		
                      Mobile Web
                      
 	
                      
-	
+
 	
                      
 		
                      Dependencies
                      
 		
 	
                      
-
        +
        -

        Task: Compass

        -

        This task, based on the Compass sample delivered with the Tizen Studio, demonstrates how you can use the DeviceOrientation Event Specification API to create a compass-functionality for your application. For more information on the sample functionality and creating the sample with the full source code, see Compass.

        -

        This task consists of the following parts:

        -
          +

          Task: Compass

          +

          This task, based on the Compass sample delivered with the Tizen Studio, demonstrates how you can use the DeviceOrientation Event Specification API to create a compass-functionality for your application. For more information on the sample functionality and creating the sample with the full source code, see Compass.

          +

          This task consists of the following parts:

          + - +
        +

        This sample is a fully functional application for gathering and using the orientation data from the device motion sensor.

        -

        Defining the Application Layout

        -

        The Compass sample application layout contains only 1 screen: the main screen that displays the compass and its current direction. The sample does not use the Web UI framework.

        - -

        The following figure shows the main screen of the application.

        -

        Figure: Compass screen

        -

        Compass screen

        - +

        Defining the Application Layout

        +

        The Compass sample application layout contains only 1 screen: the main screen that displays the compass and its current direction. The sample does not use the Web UI framework.

        + +

        The following figure shows the main screen of the application.

        +

        Figure: Compass screen

        +

        Compass screen

        +

        Defining the Main Screen

        -
          +
          1. index.html Source File -

            The main screen of the application displays the compass: the rotation section is a graphical representation of the compass, the shadow section shows certain graphical effects, and the direction and angle sections define the current angle to the north and the cardinal direction the device is currently facing.

            +

            The main screen of the application displays the compass: the rotation section is a graphical representation of the compass, the shadow section shows certain graphical effects, and the direction and angle sections define the current angle to the north and the cardinal direction the device is currently facing.

            -<div id="application">
-   <div id="rotation"></div>
-   <div id="shadow"></div>
-   <div id="direction"></div>
-   <div id="angle"></div>
+<div id="application">
+   <div id="rotation"></div>
+   <div id="shadow"></div>
+   <div id="direction"></div>
+   <div id="angle"></div>
 </div>

          Initializing the Application

          -
            -
          1. main.js Source File -
              -

            1. The application uses the ready event to determine when it has been initialized, and to call the init() method.

              +
                +
              1. main.js Source File +
                  +

                1. The application uses the ready event to determine when it has been initialized, and to call the init() method.

                   $(document).ready(init);
                  2. - +

                2. The init() method start the motion sensor by registering a listener for capturing orientation change events.

                   function init()
 {
-   "use strict";
-   hdExitButton();
-   startSensor();
+   "use strict";
+   hdExitButton();
+   startSensor();
 }
 
 function startSensor()
 {
-   "use strict";
-   window.addEventListener("deviceorientation", onDeviceOrientation, false);
+   "use strict";
+   window.addEventListener("deviceorientation", onDeviceOrientation, false);
 }
              -

              Managing the Needle Movement

              +

              Managing the Needle Movement

              The orientation data interpretation and needle movement functionality is implemented in the main.js file.

              1. Determining the Cardinal Direction @@ -109,8 +109,8 @@ function startSensor() 
                 function onDeviceOrientation(dataEvent)
 {
-   "use strict";
-   var angle = dataEvent.alpha,
+   "use strict";
+   var angle = dataEvent.alpha,
 }
                2. @@ -122,44 +122,44 @@ function onDeviceOrientation(dataEvent) 
                 if (angle < 68 || angle > 292)
 {
-   text += 'NORTH';
-} 
+   text += 'NORTH';
+}
 else if (angle > 112 && angle < 248)
 {
-   text += 'SOUTH';,
+   text += 'SOUTH';,
 }
 
 if (angle > 22 && angle < 158)
 {
-   text += 'EAST';
+   text += 'EAST';
 }
 else if (angle > 202 && angle < 338)
 {
-   text += 'WEST';
+   text += 'WEST';
 }
            2. Updating the Compass Needle Position -
                +

                1. To update the compass needle position on the screen, the change required in the needle position is calculated based on the previous and new angle.

                   deltaAngle = angleMemory - angle;
 if (Math.abs(deltaAngle) > 180)
 {
-   if (deltaAngle > 0)
-   {
-      rotation -= ((360 - angleMemory) + angle);
-   }
-   else
-   {
-      rotation += (angleMemory + (360 - angle));
-   }
+   if (deltaAngle > 0)
+   {
+      rotation -= ((360 - angleMemory) + angle);
+   }
+   else
+   {
+      rotation += (angleMemory + (360 - angle));
+   }
 }
 else
 {
-   rotation += deltaAngle;
+   rotation += deltaAngle;
 }
 angleMemory = angle;
                  2. @@ -168,9 +168,9 @@ angleMemory = angle; 
                  -$('#direction').text(text);
-$("#angle").html(Math.round(angle) + "<sup>o</sup>");
-$('#rotation').css('-webkit-transform', 'rotate(' + rotation + 'deg)');
+$('#direction').text(text);
+$("#angle").html(Math.round(angle) + "<sup>o</sup>");
+$('#rotation').css('-webkit-transform', 'rotate(' + rotation + 'deg)');
              diff --git a/org.tizen.guides/html/web/w3c/device/task_touch_paint_mw.htm b/org.tizen.guides/html/web/w3c/device/task_touch_paint_mw.htm index 2990b1d..35035ea 100644 --- a/org.tizen.guides/html/web/w3c/device/task_touch_paint_mw.htm +++ b/org.tizen.guides/html/web/w3c/device/task_touch_paint_mw.htm @@ -5,13 +5,13 @@ - + - Task: Touch Paint + Task: Touch Paint @@ -20,7 +20,7 @@

              Mobile Web

              - + -
        +

        Task: Touch Paint

        -

        This task, based on the TouchPaint sample delivered with the Tizen Studio, demonstrates how you can use the Touch Events version 1 API to create a simple paint application using the touch events and the Canvas element. For more information on the sample functionality and creating the sample with the full source code, see Touch Paint.

        +

        This task, based on the TouchPaint sample delivered with the Tizen Studio, demonstrates how you can use the Touch Events version 1 API to create a simple paint application using the touch events and the Canvas element. For more information on the sample functionality and creating the sample with the full source code, see Touch Paint.

        -

        This task consists of the following parts:

        -
          +

          This task consists of the following parts:

          + -

          This sample is a fully functional application for implementing a basic drawing application.

          +
        • Drawing on Canvas defines how to detect touch events and draw lines on the canvas.
          • +
        • Using Drawing Features defines how to select and use drawing features, such as colors and line widths.
          • +
        +

        This sample is a fully functional application for implementing a basic drawing application.

        Defining the Application Layout

        -

        The TouchPaint sample application layout contains only 1 screen: the main screen that displays a canvas on which you can draw with a finger.

        +

        The TouchPaint sample application layout contains only 1 screen: the main screen that displays a canvas on which you can draw with a finger.

        + +

        The following figure shows the main screen of the application.

        -

        The following figure shows the main screen of the application.

        - -

        Figure: TouchPaint screen

        -

        TouchPaint screen

        +

        Figure: TouchPaint screen

        +

        TouchPaint screen

        Defining the Main Screen

        -
          +
          1. index.html Source File

            The main screen displays a Canvas element, and a description area. The description area defines a color picker and a slider as <input> elements to allow the user can select the color and line width of their strokes. A button is also defined to allow the user to clear the canvas.

             <body>
-   <h2>Touch paint</h2>
-   <canvas class="canvas addHeight">
-      This browser is not supported
-   </canvas>
-   <div class="desc">
-      <label>Color:<input type="color" class="strokeColor"></label>
-      <label>Line width:
-         <input type="range" min="5" max="30" step="5"
-                value="5" class="strokeWidth"/>
-      </label>
-   </div>
-   <nav></nav>
-   <button class="clearBtn">Clear</button>
+   <h2>Touch paint</h2>
+   <canvas class="canvas addHeight">
+      This browser is not supported
+   </canvas>
+   <div class="desc">
+      <label>Color:<input type="color" class="strokeColor"></label>
+      <label>Line width:
+         <input type="range" min="5" max="30" step="5"
+                value="5" class="strokeWidth"/>
+      </label>
+   </div>
+   <nav></nav>
+   <button class="clearBtn">Clear</button>
 </body>
            2. -
          +

        Drawing on Canvas

        -

        This section builds upon the elements described in Handling Touch Events and Controlling Multi-point Touches.

        +

        This section builds upon the elements described in Handling Touch Events and Controlling Multi-point Touches.

        Initializing the Canvas

        -
          -
        1. main.js Source File +
            +
          1. main.js Source File

            Define event listeners and handlers to manage the touchstart, touchmove, and touchend events on the canvas.

             window.onload = function()
 {
-   canvas = document.querySelector(".canvas");
-   var context = canvas.getContext("2d");
+   canvas = document.querySelector(".canvas");
+   var context = canvas.getContext("2d");
 
-   /* Canvas size setting */
-   canvas.width = document.width;
-   canvas.height = document.height - 130;
+   /* Canvas size setting */
+   canvas.width = document.width;
+   canvas.height = document.height - 130;
 
-   /* Touch event listeners */
-   canvas.addEventListener("touchstart", touchStartHandler, false);
-   canvas.addEventListener("touchmove", touchMoveHandler, false);
-   canvas.addEventListener("touchend", touchEndHandler, false);
+   /* Touch event listeners */
+   canvas.addEventListener("touchstart", touchStartHandler, false);
+   canvas.addEventListener("touchmove", touchMoveHandler, false);
+   canvas.addEventListener("touchend", touchEndHandler, false);
 }

          Drawing Lines Based on Touch Events

          -

          The line drawing functionality is implemented in the main.js file.

          -
            +

            The line drawing functionality is implemented in the main.js file.

            +
            1. Drawing based on Retrieved Event Coordinates -

              To draw an image with fingers, you must find out the coordinates of the triggered touch events. -Retrieve the coordinates in the touchMoveHandler() event handler.

              +

              To draw an image with fingers, you must find out the coordinates of the triggered touch events. +Retrieve the coordinates in the touchMoveHandler() event handler.

               function touchMoveHandler(e)
 {
-   touches = e.touches.item(0);
+   touches = e.touches.item(0);
 
-   log.innerHTML =
-      '<strong>pageX:</strong> ' + touches.pageX +
-      '<br/><strong>pageY:</strong> ' + touches.pageY;
+   log.innerHTML =
+      '<strong>pageX:</strong> ' + touches.pageX +
+      '<br/><strong>pageY:</strong> ' + touches.pageY;
 
-   context.fillStyle = "#f00";
+   context.fillStyle = "#f00";
 
-   /* For accurate coordinates, calculate minus offset(Left) from page(X) */
-   context.fillRect(touches.pageX - this.offsetLeft,
-                    touches.pageY - this.offsetTop, 5, 5);
+   /* For accurate coordinates, calculate minus offset(Left) from page(X) */
+   context.fillRect(touches.pageX - this.offsetLeft,
+                    touches.pageY - this.offsetTop, 5, 5);
 }
              -

              Every time a touchmove event is fired, the pageX and pageY coordinates of the page are shown in the log, and a quadrangle of 5 x 5 pixels is created. However, since it is difficult to implement line drawing this way, use the changedTouches attribute instead, as shown below.

              +

              Every time a touchmove event is fired, the pageX and pageY coordinates of the page are shown in the log, and a quadrangle of 5 x 5 pixels is created. However, since it is difficult to implement line drawing this way, use the changedTouches attribute instead, as shown below.

            2. Drawing based on Stored Event Coordinates @@ -159,9 +159,9 @@ var isMoved = false; function touchStartHandler(e) { -   /* Store the current touch information (coordinates) */ -   touches = e.changedTouches; -   drawPath.push(touches[0]); + /* Store the current touch information (coordinates) */ + touches = e.changedTouches; + drawPath.push(touches[0]); }
              3. @@ -170,32 +170,32 @@ function touchStartHandler(e) 
               function touchMoveHandler(e)
 {
-   isMoved = true;
-   touches = e.changedTouches;
-
-   /* Assign the line style to be drawn */
-   context.lineWidth = strokeWidth;
-   context.strokeStyle = strokeColor;
-   context.lineJoin = "round";
-
-   for (var i = 0; i < touches.length; i++)
-   {
-      var idx = drawPathSetting(touches[i].identifier);
-
-      /* Draw a line from the stored coordinates to the current coordinates */
-      context.beginPath();
-      context.moveTo(drawPath[idx].pageX - this.offsetLeft,
-                     drawPath[idx].pageY - this.offsetTop);
-      context.lineTo(touches[i].pageX - this.offsetLeft,
-                     touches[i].pageY - this.offsetTop);
-
-      context.closePath();
-      context.stroke();
-
-      /* Delete the stored coordinates and store the current ones */
-      drawPath.splice(idx, 1, touches[i]);
-   }
-   e.preventDefault();
+   isMoved = true;
+   touches = e.changedTouches;
+
+   /* Assign the line style to be drawn */
+   context.lineWidth = strokeWidth;
+   context.strokeStyle = strokeColor;
+   context.lineJoin = "round";
+
+   for (var i = 0; i < touches.length; i++)
+   {
+      var idx = drawPathSetting(touches[i].identifier);
+
+      /* Draw a line from the stored coordinates to the current coordinates */
+      context.beginPath();
+      context.moveTo(drawPath[idx].pageX - this.offsetLeft,
+                     drawPath[idx].pageY - this.offsetTop);
+      context.lineTo(touches[i].pageX - this.offsetLeft,
+                     touches[i].pageY - this.offsetTop);
+
+      context.closePath();
+      context.stroke();
+
+      /* Delete the stored coordinates and store the current ones */
+      drawPath.splice(idx, 1, touches[i]);
+   }
+   e.preventDefault();
 }
              @@ -204,42 +204,42 @@ function touchMoveHandler(e) 
               function touchEndHandler()
 {
-   /* Display the touching point */
-   if (!isMoved)
-   {
-      var startPoint = (Math.PI/180)*0;
-      var endPoint = (Math.PI/180)*360;
-      context.fillStyle = strokeColor;
-      context.beginPath();
-      context.arc(touches[0].pageX - this.offsetLeft,
-                  touches[0].pageY - this.offsetTop,
-                  strokeWidth/2, startPoint, endPoint, true);
-      context.closePath();
-      context.fill();
-   }
-   isMoved=false;
-   drawPath.length = 0; /* Initialize the stored coordinates */
+   /* Display the touching point */
+   if (!isMoved)
+   {
+      var startPoint = (Math.PI/180)*0;
+      var endPoint = (Math.PI/180)*360;
+      context.fillStyle = strokeColor;
+      context.beginPath();
+      context.arc(touches[0].pageX - this.offsetLeft,
+                  touches[0].pageY - this.offsetTop,
+                  strokeWidth/2, startPoint, endPoint, true);
+      context.closePath();
+      context.fill();
+   }
+   isMoved=false;
+   drawPath.length = 0; /* Initialize the stored coordinates */
 }
          1. Drawing based on Multi-point Touches -

            If the application is controlled with fingers, you must handle multi-point touches (a mouse-controlled application only create one touch at a time and only needs 2 events to handle it). To manage multi-touches, the index of the touches[index] array is used.

            +

            If the application is controlled with fingers, you must handle multi-point touches (a mouse-controlled application only create one touch at a time and only needs 2 events to handle it). To manage multi-touches, the index of the touches[index] array is used.

            The drawPathSetting() method allows the application to handle multi-point touches since the existing and current coordinates of the touch events are connected respectively.

            The touchMoveHandler() event handler uses the drawPathSetting() method to return the index of the drawPath array (which contains the touch event details saved so far). Since the information is similar to the identifier of the touch event which has been currently triggered, the array enables each touch event to have its own information.

             function drawPathSetting(idx)
 {
-   for (var i = 0; i < drawPath.length; i++)
-   {
-      var _idx = drawPath[i].identifier;
-      if (_idx === idx)
-      {
-         return i;
-      }
-   }
-
-   return -1;
+   for (var i = 0; i < drawPath.length; i++)
+   {
+      var _idx = drawPath[i].identifier;
+      if (_idx === idx)
+      {
+         return i;
+      }
+   }
+
+   return -1;
 }
            @@ -250,10 +250,10 @@ function drawPathSetting(idx)

            Using Drawing Features

            - +

            Initializing Drawing

            -
              -
            1. main.js Source File +
                +
              1. main.js Source File

                Variables are declared to store and display the color and line width selection of the user.

                 var strokeColorSel, strokeWidthSel;
@@ -263,43 +263,43 @@ var strokeWidth = 5;

              Applying the Stroke Styles

              -
                +
                1. main.js Source File
                  1. Add the color and line width values that the user has selected to the applicable variables, and define event handlers to track changes in the user selection. 
                     window.onload = function()
 {
-   strokeColorSel = document.querySelector(".strokeColor");
-   strokeWidthSel = document.querySelector(".strokeWidth");
+   strokeColorSel = document.querySelector(".strokeColor");
+   strokeWidthSel = document.querySelector(".strokeWidth");
 
-   /* Add event listeners */
-   strokeColorSel.addEventListener("change", changeStrokeColor, false);
-   strokeWidthSel.addEventListener("change", changeStrokeWidth, false);
+   /* Add event listeners */
+   strokeColorSel.addEventListener("change", changeStrokeColor, false);
+   strokeWidthSel.addEventListener("change", changeStrokeWidth, false);
                  2. If the user changes the color or line width, the event handlers call the changeStrokeColor() or changeStrokeWidth() method to set the new style value. 
                    -   function changeStrokeColor()
-   {
-      strokeColor = this.value;
-   }
-
-   function changeStrokeWidth()
-   {
-      strokeWidth = this.value;
-   }
+   function changeStrokeColor()
+   {
+      strokeColor = this.value;
+   }
+
+   function changeStrokeWidth()
+   {
+      strokeWidth = this.value;
+   }
 }
                    3. -
                  3. To use the style values, apply them in the touchMoveHandler() event handler, which draws the user's strokes on the canvas. +
                  4. To use the style values, apply them in the touchMoveHandler() event handler, which draws the user's strokes on the canvas. 
                     function touchMoveHandler(e)
 {
-   context.lineWidth = strokeWidth; /* Selected line width */
-   context.strokeStyle = strokeColor; /* Selected line color */
+   context.lineWidth = strokeWidth; /* Selected line width */
+   context.strokeStyle = strokeColor; /* Selected line color */
 
-   /* Draw the strokes */
+   /* Draw the strokes */
 }
                    5. diff --git a/org.tizen.guides/html/web/w3c/device/task_touch_paint_ww.htm b/org.tizen.guides/html/web/w3c/device/task_touch_paint_ww.htm index b9a62ee..b8712c8 100644 --- a/org.tizen.guides/html/web/w3c/device/task_touch_paint_ww.htm +++ b/org.tizen.guides/html/web/w3c/device/task_touch_paint_ww.htm @@ -5,13 +5,13 @@ - + - Task: Touch Paint + Task: Touch Paint @@ -20,7 +20,7 @@

                    Wearable Web

                    - +

                    Dependencies

                    -
        +

        Task: Touch Paint

        -

        This task, based on the TouchPaint sample delivered with the Tizen Studio, demonstrates how you can use the Touch Events version 1 API to create a simple paint application using the touch events and the Canvas element. For more information on the sample functionality and creating the sample with the full source code, see Touch Paint.

        +

        This task, based on the TouchPaint sample delivered with the Tizen Studio, demonstrates how you can use the Touch Events version 1 API to create a simple paint application using the touch events and the Canvas element. For more information on the sample functionality and creating the sample with the full source code, see Touch Paint.

        -

        This task consists of the following parts:

        -
          +

          This task consists of the following parts:

          + -

          This sample is a fully functional application for implementing a basic drawing application.

          +
        • Drawing on Canvas defines how to detect touch events and draw lines on the canvas.
          • +
        • Using Drawing Features defines how to select and use drawing features, such as colors and line widths.
          • +
        +

        This sample is a fully functional application for implementing a basic drawing application.

        Defining the Application Layout

        -

        The TouchPaint sample application layout contains 2 screens: the main screen displaying a canvas on which you can draw with a finger, and the Options screen which allows you to set up the color and the thickness of the line being drawn.

        - -

        The following figure shows the main screens of the application.

        - -

        Figure: TouchPaint screens

        -

        TouchPaint screens

        +

        The TouchPaint sample application layout contains 2 screens: the main screen displaying a canvas on which you can draw with a finger, and the Options screen which allows you to set up the color and the thickness of the line being drawn.

        + +

        The following figure shows the main screens of the application.

        + +

        Figure: TouchPaint screens

        +

        TouchPaint screens

        Defining the Main Screen

        -
          +
            -
          1. index.html Source File +
          2. index.html Source File

            The main screen displays a Canvas element and 2 buttons (for accessing the Options screen and for clearing the canvas area).

            -<div class="ui-page ui-page-active" id="main">
-   <div class="ui-header" id="main-header" data-position="fixed">
-      <h2 class="ui-title">TouchPaint</h2>
-   </div>
-   <div class="ui-content" id="main-content"></div>
-   <div class="ui-footer ui-grid-col-2" id="main-footer">
-      <button type="button" class="ui-btn" id="main-options-btn">Options</button>
-      <button type="button" class="ui-btn" id="main-clear-btn">Clear</button>
-   </div>
+<div class="ui-page ui-page-active" id="main">
+   <div class="ui-header" id="main-header" data-position="fixed">
+      <h2 class="ui-title">TouchPaint</h2>
+   </div>
+   <div class="ui-content" id="main-content"></div>
+   <div class="ui-footer ui-grid-col-2" id="main-footer">
+      <button type="button" class="ui-btn" id="main-options-btn">Options</button>
+      <button type="button" class="ui-btn" id="main-clear-btn">Clear</button>
+   </div>
 </div>
            -

            The above code snippet does not contain the canvas element, which is added to the <div id="main-content"> element by the JavaScript code after the application start.

            +

            The above code snippet does not contain the canvas element, which is added to the <div id="main-content"> element by the JavaScript code after the application start.

            3. -
          +
        -

        Defining the Options Screen

        -
          +

          Defining the Options Screen

          +
            -
          1. index.html Source File +
          2. index.html Source File

            The Options screen displays a slider element, line preview, 4-color (white, red, green, and blue) picker and 2 buttons (Cancel and OK).

            The slider allows the user to change the line width. Each slider position change results in a change in the line preview thickness. A tap action on the color picker results in a change in the line preview color. A tap action on the buttons moves the user to main screen without or with saving the changes.

            -<div class="ui-page" id="options">
-   <div class="ui-header" data-position="fixed">
-      <h2 class="ui-title">Options</h2>
-   </div>
-   <div class="ui-content">
-      <input type="range" min="1" max="20" value="1" id="options-range"></input>
-      <div id="options-preview"></div>
-      <div id="options-colors">
-         <div id="options-colors-white" class="options-colors"></div>
-         <div id="options-colors-red" class="options-colors"></div>
-         <div id="options-colors-green" class="options-colors"></div>
-         <div id="options-colors-blue" class="options-colors"></div>
-      </div>
-   </div>
-   <div class="ui-footer ui-grid-col-2">
-      <button type="button" class="ui-btn" id="options-cancel-btn">Cancel</button>
-      <button type="button" class="ui-btn" id="options-ok-btn">OK</button>
-   </div>
+<div class="ui-page" id="options">
+   <div class="ui-header" data-position="fixed">
+      <h2 class="ui-title">Options</h2>
+   </div>
+   <div class="ui-content">
+      <input type="range" min="1" max="20" value="1" id="options-range"></input>
+      <div id="options-preview"></div>
+      <div id="options-colors">
+         <div id="options-colors-white" class="options-colors"></div>
+         <div id="options-colors-red" class="options-colors"></div>
+         <div id="options-colors-green" class="options-colors"></div>
+         <div id="options-colors-blue" class="options-colors"></div>
+      </div>
+   </div>
+   <div class="ui-footer ui-grid-col-2">
+      <button type="button" class="ui-btn" id="options-cancel-btn">Cancel</button>
+      <button type="button" class="ui-btn" id="options-ok-btn">OK</button>
+   </div>
 </div>
            3. -
          +
        + -

        Drawing on Canvas

        -

        This section builds upon the elements described in Handling Touch Events and Controlling Multi-point Touches.

        - +

        This section builds upon the elements described in Handling Touch Events and Controlling Multi-point Touches.

        +

        Initializing the Canvas

        -
          -
        1. main.js Source File +
            +
          1. main.js Source File

            The canvas is initialized in JavaScript, and includes the size calculation, ID setting, and adding of the element to the main page content.

             function initCanvas()
 {
-   canvas = document.createElement('canvas');
-   canvas.width = window.innerWidth;
-   canvas.height = window.innerHeight - header.offsetHeight - footer.offsetHeight;
-   canvas.setAttribute('id', 'main-canvas');
-   content.appendChild(canvas);
-   context = canvas.getContext('2d');
+   canvas = document.createElement('canvas');
+   canvas.width = window.innerWidth;
+   canvas.height = window.innerHeight - header.offsetHeight - footer.offsetHeight;
+   canvas.setAttribute('id', 'main-canvas');
+   content.appendChild(canvas);
+   context = canvas.getContext('2d');
 }

          Drawing Lines Based on Touch Events

          -

          The line drawing functionality is implemented in the main.js file.

          -
            -
          1. main.js Source File +

            The line drawing functionality is implemented in the main.js file.

            +
              +
            1. main.js Source File
              1. -

                Define event listeners and handlers to manage the touchstart, touchmove, and touchend events on the canvas.

                +

                Define event listeners and handlers to manage the touchstart, touchmove, and touchend events on the canvas.

                 function addCanvasListeners()
 {
-   canvas.addEventListener('touchstart', onCanvasTouchStart);
-   canvas.addEventListener('touchend', onCanvasTouchEnd);
-   canvas.addEventListener('touchmove', onCanvasTouchMove);
-   footer.addEventListener('touchend', onFooterTouchEnd);
+   canvas.addEventListener('touchstart', onCanvasTouchStart);
+   canvas.addEventListener('touchend', onCanvasTouchEnd);
+   canvas.addEventListener('touchmove', onCanvasTouchMove);
+   footer.addEventListener('touchend', onFooterTouchEnd);
 }
                2. @@ -170,57 +170,57 @@ function addCanvasListeners() 
                 function onCanvasTouchStart(ev)
 {
-   var touch = ev.changedTouches[0];
-
-   drawPath[touch.identifier] = touch;
-
-   context.fillStyle = strokeColor;
-   context.beginPath();
-   context.arc(drawPath[touch.identifier].pageX - canvas.offsetLeft,
-               drawPath[touch.identifier].pageY - canvas.offsetTop
-               - header.offsetHeight,
-               strokeWidth / 2, 0, Math.PI * 2, true);
-   context.closePath();
-   context.fill();
+   var touch = ev.changedTouches[0];
+
+   drawPath[touch.identifier] = touch;
+
+   context.fillStyle = strokeColor;
+   context.beginPath();
+   context.arc(drawPath[touch.identifier].pageX - canvas.offsetLeft,
+               drawPath[touch.identifier].pageY - canvas.offsetTop
+               - header.offsetHeight,
+               strokeWidth / 2, 0, Math.PI * 2, true);
+   context.closePath();
+   context.fill();
 }
 
 function onCanvasTouchEnd(ev)
 {
-   var touch = ev.changedTouches[0];
+   var touch = ev.changedTouches[0];
 
-   delete drawPath[touch.identifier];
+   delete drawPath[touch.identifier];
 }
 
 function onCanvasTouchMove(ev)
 {
-   var touches = ev.changedTouches,
-       touchesLength = touches.length,
-       currentDrawPath = null,
-       i = 0;
-
-   context.lineWidth = strokeWidth + ADDITIONAL_LINE_WIDTH;
-   context.strokeStyle = strokeColor;
-   context.lineJoin = 'round';
-
-   for (i = 0; i < touchesLength; i += 1)
-   {
-      currentDrawPath = drawPath[touches[i].identifier];
-      if (currentDrawPath !== undefined)
-      {
-         context.beginPath();
-         context.moveTo(currentDrawPath.pageX - canvas.offsetLeft + HALF_PIXEL,
-                        currentDrawPath.pageY - canvas.offsetTop
-                        + HALF_PIXEL - header.offsetHeight);
-         context.lineTo(touches[i].pageX - canvas.offsetLeft + HALF_PIXEL,
-                        touches[i].pageY - canvas.offsetTop
-                        + HALF_PIXEL - header.offsetHeight);
-         context.closePath();
-         context.stroke();
-
-         drawPath[touches[i].identifier] = touches[i];
-      }
-   }
-   ev.preventDefault();
+   var touches = ev.changedTouches,
+       touchesLength = touches.length,
+       currentDrawPath = null,
+       i = 0;
+
+   context.lineWidth = strokeWidth + ADDITIONAL_LINE_WIDTH;
+   context.strokeStyle = strokeColor;
+   context.lineJoin = 'round';
+
+   for (i = 0; i < touchesLength; i += 1)
+   {
+      currentDrawPath = drawPath[touches[i].identifier];
+      if (currentDrawPath !== undefined)
+      {
+         context.beginPath();
+         context.moveTo(currentDrawPath.pageX - canvas.offsetLeft + HALF_PIXEL,
+                        currentDrawPath.pageY - canvas.offsetTop
+                        + HALF_PIXEL - header.offsetHeight);
+         context.lineTo(touches[i].pageX - canvas.offsetLeft + HALF_PIXEL,
+                        touches[i].pageY - canvas.offsetTop
+                        + HALF_PIXEL - header.offsetHeight);
+         context.closePath();
+         context.stroke();
+
+         drawPath[touches[i].identifier] = touches[i];
+      }
+   }
+   ev.preventDefault();
 }
                @@ -231,50 +231,50 @@ function onCanvasTouchMove(ev)

                Using Drawing Features

                -

                Changing the Line Thickness

                -
                  -
                1. options.js Source File +

                  Changing the Line Thickness

                  +
                    +
                  1. options.js Source File

                    The user changes the line thickness using a slider. The new slider value is set as the width of the preview element, as well as a value in the options object.

                     function onRangeChange(ev)
 {
-   setPreviewHeight(ev.target.value);
+   setPreviewHeight(ev.target.value);
 }
 function setPreviewHeight(value)
 {
-   preview.style.height = value + 'px';
+   preview.style.height = value + 'px';
 }
 function setOptionValues()
 {
-   options.setStrokeWidth(range.value);
+   options.setStrokeWidth(range.value);
 }
                    2. -
                  2. main.js Source File +
                  3. main.js Source File

                    During drawing, the selected thickness is applied to the line being drawn.

                     function getOptionValues()
 {
-   strokeWidth = options.getStrokeWidth();
+   strokeWidth = options.getStrokeWidth();
 }
 
 context.lineWidth = strokeWidth + ADDITIONAL_LINE_WIDTH;
                  -

                  Changing the Line Color

                  -
                    +

                    Changing the Line Color

                    +
                    1. options.js Source File

                      The user changes the line color by selecting it from the color picker. The new color is set as the preview element background, as well as a value in the options object.

                       function onWhiteTap()
 {
-   preview.style.backgroundColor = '#fff';
+   preview.style.backgroundColor = '#fff';
 }
 
 function setOptionValues()
 {
-   o.setStrokeColor(preview.style.backgroundColor);
+   o.setStrokeColor(preview.style.backgroundColor);
 }
                      2. @@ -283,7 +283,7 @@ function setOptionValues() 
                       function getOptionValues()
 {
-   strokeColor = o.getStrokeColor();
+   strokeColor = o.getStrokeColor();
 }
 
 context.strokeStyle = strokeColor;
diff --git a/org.tizen.guides/html/web/w3c/device/touch_w.htm b/org.tizen.guides/html/web/w3c/device/touch_w.htm
index b16c01f..fa6502a 100644
--- a/org.tizen.guides/html/web/w3c/device/touch_w.htm
+++ b/org.tizen.guides/html/web/w3c/device/touch_w.htm
@@ -5,20 +5,20 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
-  Touch Events version 1 
-  
+  Touch Events version 1
+ 
  
- 
+
  	
+
        -

        Touch Events version 1

        +

        Touch Events version 1

        As there is no mouse in a mobile device, the user actions must be handled with touch events, instead of mouse events.

        @@ -76,26 +76,26 @@

        For a practical example of drawing a simple image by using touch events and canvas elements, see the Touch Paint sample task (in mobile and wearable applications).

        A touch-based mobile operating system uses tap and double-tap gestures. The tap is used to generate a click event, and double-tap used for zooming. To recognize the touch gestures, the OS sets a timer which starts at the first tap and checks for a second before the event is fired. This causes a delay in the single tap event, making the touch responsiveness of the application suffer. To avoid the delay, you can enhance the touch event responsiveness by making the page unscalable, or modifying touch responses.

        - +

        Handling Touch Events

        Depending on the touch type, different touch events occur:

        • When the user first touches the element and removes their finger from the screen, the touchstart and touchend events occur. -

          Figure: Simple touch (in mobile applications only)

          -

          Simple touch (in mobile applications only)

          +

          Figure: Simple touch (in mobile applications only)

          +

          Simple touch (in mobile applications only)

          • -
        • When the user moves their finger across the element, and then removes their finger, the touchstart, touchmove, and touchend events occur. +
        • When the user moves their finger across the element, and then removes their finger, the touchstart, touchmove, and touchend events occur. -

          Figure: Moving touch (in mobile applications only)

          -

          Moving touch (in mobile applications only)

          +

          Figure: Moving touch (in mobile applications only)

          +

          Moving touch (in mobile applications only)

        • When the user long-presses the DOM element, such as text or image, in the element, the touchstart and touchcancel events occur. -

          Figure: Canceling touch with a long press (in mobile applications only)

          +

          Figure: Canceling touch with a long press (in mobile applications only)

          Canceling touch with a long press (in mobile applications only)

          @@ -103,51 +103,51 @@ In Tizen, the touchcancel event occurs when a context menu is activated by a long press of a DOM element, such as text or image.
          • -
        +

        Learning how to handle touch events improves the user interaction of your application:

        1. Define the element from which you want to trigger touch events. In this case, an area with a text and an image is defined as an element. 
          -<div id="touchable">
-   Touch or drag this box with one finger.
-   <img src="https://www.tizen.org/sites/all/themes/tizen_theme/logo.png"
-        alt="Tizen logo">
+<div id="touchable">
+   Touch or drag this box with one finger.
+   <img src="https://www.tizen.org/sites/all/themes/tizen_theme/logo.png"
+        alt="Tizen logo">
 </div>
-<div id="log"></div>
+<div id="log"></div>
        2. Add event handlers for the defined element: 
           <script>
-   var log = document.querySelector("log");
-   var touchable = document.querySelector("touchable");
-
-   /* touchstart event */
-   touchable.addEventListener("touchstart", function(e)
-      {
-         log.innerHTML = "<p>Touch Event: touchstart</p>";
-      }, false);
-
-   /* touchend event */
-   touchable.addEventListener("touchend", function(e)
-      {
-         log.innerHTML += "<p>Touch Event: touchend</p>";
-      }, false);
-
-   /* touchmove event */
-   touchable.addEventListener("touchmove", function(e)
-      {
-         log.innerHTML += "<p>Touch Event: touchmove</p>";
-      }, false);
-
-   /* touchcancel event */
-   touchable.addEventListener("touchcancel", function(e)
-      {
-         log.innerHTML += "<p>Touch Event: touchcancel</p>";
-      }, false);
+   var log = document.querySelector("log");
+   var touchable = document.querySelector("touchable");
+
+   /* touchstart event */
+   touchable.addEventListener("touchstart", function(e)
+      {
+         log.innerHTML = "<p>Touch Event: touchstart</p>";
+      }, false);
+
+   /* touchend event */
+   touchable.addEventListener("touchend", function(e)
+      {
+         log.innerHTML += "<p>Touch Event: touchend</p>";
+      }, false);
+
+   /* touchmove event */
+   touchable.addEventListener("touchmove", function(e)
+      {
+         log.innerHTML += "<p>Touch Event: touchmove</p>";
+      }, false);
+
+   /* touchcancel event */
+   touchable.addEventListener("touchcancel", function(e)
+      {
+         log.innerHTML += "<p>Touch Event: touchcancel</p>";
+      }, false);
 </script>
        @@ -157,14 +157,14 @@ Since the device input takes place by touching the screen, sometimes the features of your application and the browser can respond simultaneously to the same touch event. To prevent the unintended effects (for example, the customized gesture and the browser scroll operating simultaneously), use the preventDefault() method to prevent the basic browser events: 
         <script>
-   touchable.addEventListener("touchmove", function(e)
-      {
-         if (event.touches.length >= 1)
-         {
-            log.innerHTML += "<p>Touch Event: touchmove</p>";
-            e.preventDefault(); /* Prevent default scroll action */
-         }
-      }, false);
+   touchable.addEventListener("touchmove", function(e)
+      {
+         if (event.touches.length >= 1)
+         {
+            log.innerHTML += "<p>Touch Event: touchmove</p>";
+            e.preventDefault(); /* Prevent default scroll action */
+         }
+      }, false);
 </script>
        @@ -173,49 +173,49 @@

        For the complete source code related to this use case, see the following file:

        - + +

        Retrieving the Event Point Occurrence

        - +

        Learning how to retrieve the coordinate of the touch event point occurrence improves the user interaction of your application:

        1. Define the element from which you want to trigger touch events. In this case, an area with a text is defined as an element. 
          -<div id="touchable">
-   Touch and move this box with one finger.
+<div id="touchable">
+   Touch and move this box with one finger.
 </div>
-<div id="log"></div>
+<div id="log"></div>
        2. Add an event listener and handler for the touchmove event to the defined element: 
           <script>
-   var log = document.getElementById("log");
-   var touchable = document.getElementById("touchable");
-
-   /* touchmove event */
-   touchable.addEventListener("touchmove", phaseCalcul, false);
-
-   function phaseCalcul(e)
-   {
-      var pTarget = e.touches.item(0);
-
-      log.innerHTML =
-         '<strong>pageX:</strong> ' + pTarget.pageX +
-         '<br/><strong>pageY:</strong> ' + pTarget.pageY +
-         '<br/><strong>clientX:</strong> ' + pTarget.clientX +
-         '<br/><strong>clientY:</strong> ' + pTarget.clientY +
-         '<br/><strong>screenX:</strong> ' + pTarget.screenX +
-         '<br/><strong>screenY:</strong> ' + pTarget.screenY;
-
-      e.preventDefault();
-   }
+   var log = document.getElementById("log");
+   var touchable = document.getElementById("touchable");
+
+   /* touchmove event */
+   touchable.addEventListener("touchmove", phaseCalcul, false);
+
+   function phaseCalcul(e)
+   {
+      var pTarget = e.touches.item(0);
+
+      log.innerHTML =
+         '<strong>pageX:</strong> ' + pTarget.pageX +
+         '<br/><strong>pageY:</strong> ' + pTarget.pageY +
+         '<br/><strong>clientX:</strong> ' + pTarget.clientX +
+         '<br/><strong>clientY:</strong> ' + pTarget.clientY +
+         '<br/><strong>screenX:</strong> ' + pTarget.screenX +
+         '<br/><strong>screenY:</strong> ' + pTarget.screenY;
+
+      e.preventDefault();
+   }
 </script>
          -

          Each time the touchmove event is triggered, the position of the touch point is renewed. The position is returned in 2D coordinates of the page, client, and screen. You can use the position to compare the coordinates to the touchstart and touchend events, and to analyze the gesture of the user by using the consequent touchmove events to determine the movement direction. +

          Each time the touchmove event is triggered, the position of the touch point is renewed. The position is returned in 2D coordinates of the page, client, and screen. You can use the position to compare the coordinates to the touchstart and touchend events, and to analyze the gesture of the user by using the consequent touchmove events to determine the movement direction.

        @@ -223,50 +223,50 @@

        For the complete source code related to this use case, see the following file:

        - + +

        Controlling Multi-point Touches

        - +

        Learning how to control multiple concurrent touch events improves the user interaction of your application:

        1. Define the element from which you want to trigger touch events. In this case, an area with a text is defined as an element. 
          -<div id="touchable"> Touch this box with two finger. </div>
+<div id="touchable"> Touch this box with two finger. </div>
        2. Add an event listener and handler for the touchstart event to the defined element: 
           <script>
-   var touchable = document.getElementById("touchable");
-
-   /* touchstart event */
-   touchable.addEventListener("touchstart", touchStartHandler, false);
-
-   function touchStartHandler(e)
-   {
-      /* Return if there is no multi-point touch */
-      if (e.touches.length < 2) return;
-
-      var width = Math.abs(e.touches.item(0).clientX - e.touches.item(1).clientX);
-      var height = Math.abs(e.touches.item(0).clientY - e.touches.item(1).clientY);
-
-      /* Create a new image object instance */
-      var tizenLogo = document.createElement("img");
-      tizenLogo.setAttribute("src", "sample_image.png");
-      tizenLogo.setAttribute("width", width);
-      tizenLogo.setAttribute("height", height);
-      tizenLogo.style.position = "absolute";
-
-      /* Assign the position where the image is shown based on the touch point */
-      tizenLogo.style.left =
-         (e.touches.item(0).pageX + e.touches.item(1).pageX - width) / 2 + "px";
-      tizenLogo.style.top =
-         (e.touches.item(0).pageY + e.touches.item(1).pageY - height) / 2 + "px";
-
-      this.appendChild(tizenLogo);
-   }
+   var touchable = document.getElementById("touchable");
+
+   /* touchstart event */
+   touchable.addEventListener("touchstart", touchStartHandler, false);
+
+   function touchStartHandler(e)
+   {
+      /* Return if there is no multi-point touch */
+      if (e.touches.length < 2) return;
+
+      var width = Math.abs(e.touches.item(0).clientX - e.touches.item(1).clientX);
+      var height = Math.abs(e.touches.item(0).clientY - e.touches.item(1).clientY);
+
+      /* Create a new image object instance */
+      var tizenLogo = document.createElement("img");
+      tizenLogo.setAttribute("src", "sample_image.png");
+      tizenLogo.setAttribute("width", width);
+      tizenLogo.setAttribute("height", height);
+      tizenLogo.style.position = "absolute";
+
+      /* Assign the position where the image is shown based on the touch point */
+      tizenLogo.style.left =
+         (e.touches.item(0).pageX + e.touches.item(1).pageX - width) / 2 + "px";
+      tizenLogo.style.top =
+         (e.touches.item(0).pageY + e.touches.item(1).pageY - height) / 2 + "px";
+
+      this.appendChild(tizenLogo);
+   }
 </script>
          @@ -279,64 +279,64 @@

          For the complete source code related to this use case, see the following file:

          +

          Enhancing Touch Responsiveness

          - +

          To avoid having a delay in the single tap gesture, you can make the page unscalable, or modify touch responses:

          • Make a page unscalable:

            If a page is made unscalable, the double-tap gesture is not required for zooming, so the single tap gesture can be processed without delay. To make a page unscalable, use the viewport meta tag:

            -<meta name="viewport"
-      content="width=device-width, initial-scale=1.0, minimum-scale=1.0,
-               maximum-scale=1.0, user-scalable=0">
+<meta name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0,
+               maximum-scale=1.0, user-scalable=0">
          • Modify touch responses

            A touch event occurs immediately when the touched point is released, making it faster than the tap event. However, the touch event occurs even though the touched point is moved before releasing.

            • To avoid processing the gesture when the touched point is moved, check whether the touched point is moved by setting a flag in the touchmove() event handler: 
              -<a id="test" href="#">Click test using touch event</a>
-<div id="log"></div>
+<a id="test" href="#">Click test using touch event</a>
+<div id="log"></div>
 <script>
-   var moved = false;
+   var moved = false;
 
-   $('#test').on('touchstart', function(e)
-      {
-         moved = false;
-      });
+   $('#test').on('touchstart', function(e)
+      {
+         moved = false;
+      });
 
-   $('#test').on('touchmove', function(e)
-      {
-         moved = true;
-      });
+   $('#test').on('touchmove', function(e)
+      {
+         moved = true;
+      });
 
-   $('#test').on('touchend', function(e)
-      {
-         if (!moved)
-            $('#log').innerHTML = "Test link is clicked!";
+   $('#test').on('touchend', function(e)
+      {
+         if (!moved)
+            $('#log').innerHTML = "Test link is clicked!";
 
-         return false;
-      });
+         return false;
+      });
 </script>

              To avoid activating the click event after the touch event, set the return type to false.

            • You can also use the vclick event provided by jQuery Mobile. The vclick event is based on the touch event and generated only if the touched point is not moved. 
              -<a id="test" href="#">Click test using touch event</a>
-<div id="log"></div>
+<a id="test" href="#">Click test using touch event</a>
+<div id="log"></div>
 <script>
-   $('#test').on('vclick', function(e)
-      {
-         $('#log').html("Test link is clicked!");
+   $('#test').on('vclick', function(e)
+      {
+         $('#log').html("Test link is clicked!");
 
-         return false;
-      });
+         return false;
+      });
 </script>
              • -
          +
          3. diff --git a/org.tizen.guides/html/web/w3c/device/vibration_w.htm b/org.tizen.guides/html/web/w3c/device/vibration_w.htm index 322cc80..c975771 100644 --- a/org.tizen.guides/html/web/w3c/device/vibration_w.htm +++ b/org.tizen.guides/html/web/w3c/device/vibration_w.htm @@ -11,7 +11,7 @@ Vibration - + @@ -54,7 +54,7 @@

          Managing Vibrations

          - +

          To enhance the user interaction with the device, learn to manage vibrations:

            @@ -62,69 +62,69 @@ 
             <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="utf-8"/>
-      <meta name="viewport"
-            content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
-      <title>Tizen Vibration API Example code</title>
+   <head>
+      <meta charset="utf-8"/>
+      <meta name="viewport"
+            content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+      <title>Tizen Vibration API Example code</title>
 
-      <script>
+      <script>
 
            -         function singleVibration()
-         {
-            /* Vibrate for 2 seconds */
-            navigator.vibrate(2000);
-         }
+         function singleVibration()
+         {
+            /* Vibrate for 2 seconds */
+            navigator.vibrate(2000);
+         }
          1. To launch a vibration that uses a pattern of vibration and still periods, define the pattern as the vibrate() method parameter: 
            -         function patternVibration()
-         {
-            /* Vibrate in a given pattern: 1 sec on, 1 sec off, 2 sec on, 2 sec off */
-            navigator.vibrate([1000, 1000, 2000, 2000, 1000]);
-         }
+         function patternVibration()
+         {
+            /* Vibrate in a given pattern: 1 sec on, 1 sec off, 2 sec on, 2 sec off */
+            navigator.vibrate([1000, 1000, 2000, 2000, 1000]);
+         }
          2. To stop the vibration before it ends naturally, use the vibrate() method with 0 or [] as a parameter. The method call cancels all existing vibrations. 
            -         function stopVibration()
-         {
-            navigator.vibrate(0);
-         }
+         function stopVibration()
+         {
+            navigator.vibrate(0);
+         }
          3. Create the buttons used to manage the vibrations: 
            -      </script>
-   </head>
-
-   <body>
-      <header style="width: 100%; text-align: center;">
-         <h1>Vibration API Example</h1>
-      </header>
-
-      <nav style="width: 100%; text-align: center;">
-         <!--Button click calls singleVibration()-->
-         <button onclick="singleVibration();"
-                 style="width: 200px; height: 50px; margin-bottom: 10px">
-            Single vibration
-         </button>
-
-         <!--Button click calls patternVibration()-->
-         <button onclick="patternVibration();"
-                 style="width: 200px; height: 50px; margin-bottom: 10px">
-            Pattern vibration
-         </button>
-
-         <!--Button click calls stopVibration()-->
-         <button onclick="stopVibration();"
-                 style="width: 200px; height: 50px">
-            Stop vibration
-         </button>
-      </nav>
-   </body>
+      </script>
+   </head>
+
+   <body>
+      <header style="width: 100%; text-align: center;">
+         <h1>Vibration API Example</h1>
+      </header>
+
+      <nav style="width: 100%; text-align: center;">
+         <!--Button click calls singleVibration()-->
+         <button onclick="singleVibration();"
+                 style="width: 200px; height: 50px; margin-bottom: 10px">
+            Single vibration
+         </button>
+
+         <!--Button click calls patternVibration()-->
+         <button onclick="patternVibration();"
+                 style="width: 200px; height: 50px; margin-bottom: 10px">
+            Pattern vibration
+         </button>
+
+         <!--Button click calls stopVibration()-->
+         <button onclick="stopVibration();"
+                 style="width: 200px; height: 50px">
+            Stop vibration
+         </button>
+      </nav>
+   </body>
 </html>

          Source Code

          diff --git a/org.tizen.guides/html/web/w3c/graphics/canvas_w.htm b/org.tizen.guides/html/web/w3c/graphics/canvas_w.htm index f0678a2..79ac458 100644 --- a/org.tizen.guides/html/web/w3c/graphics/canvas_w.htm +++ b/org.tizen.guides/html/web/w3c/graphics/canvas_w.htm @@ -5,20 +5,20 @@ - + - HTML5 Canvas - + HTML5 Canvas + - +

          Mobile Web Wearable Web

          - +

          Dependencies

          -
          +

        HTML5 Canvas

        - +

        The HTML5 canvas allows you to use graphics on the screen, and draw and manage various shapes. The HTML Canvas 2D Context API (in mobile or wearable applications) defines a special canvas element that expresses images or shapes with JavaScript.

        This feature is supported in mobile and wearable applications only.

        @@ -67,13 +67,13 @@

        You can also draw and mask objects on the canvas.

      16. Using styles and transformations -

        You can use a canvas to create text or lines other than images and shapes.

        +

        You can use a canvas to create text or lines other than images and shapes.

        17. For all canvas objects (images, shapes, text, and lines), you can define colors (the fillStyle and strokeStyle attributes), shadows (the shadowColor and shadowBlur attributes), and gradation (the createLinearGradient() method). You can also use the transformation methods, such as scale(), translate(), transform(), and rotate(), to implement, for example, transparency or shape gradient transformations.

        - -

        In mobile applications only, in HTML5, the HTML5 SVG API (in mobile or wearable applications) provides similar features as the canvas. Their difference is that SVG expresses graphics using vectors, while the canvas is based on pixels. To express complex graphics, use the canvas, and to express graphics with a liberal expansion or reduction, use SVG. + +

        In mobile applications only, in HTML5, the HTML5 SVG API (in mobile or wearable applications) provides similar features as the canvas. Their difference is that SVG expresses graphics using vectors, while the canvas is based on pixels. To express complex graphics, use the canvas, and to express graphics with a liberal expansion or reduction, use SVG.

        @@ -86,14 +86,14 @@

        Using a Canvas

        To create a canvas in your application:

        - +
          -
        1. Create a <canvas> element with the HTML5 Canvas Element API. +
        2. Create a <canvas> element with the HTML5 Canvas Element API.

          The canvas assigns the region (canvas context) where images are drawn with JavaScript.

          -<canvas width="300" height="300" id="canvas">
-   This browser is not supported
+<canvas width="300" height="300" id="canvas">
+   This browser is not supported
 </canvas>
          @@ -105,10 +105,10 @@
        3. Use the CanvasRenderingContext2D interface to connect to the canvas and get the canvas context: 
          -var canvas = document.querySelector("canvas"),
-var context = canvas.getContext('2d');
+var canvas = document.querySelector("canvas"),
+var context = canvas.getContext('2d');
          -

          The interface has various methods and attributes for expressing images and shapes.

          4. +

          The interface has various methods and attributes for expressing images and shapes.

        4. To manage the work stack of the canvas, use the following methods:
          • save(): Pushes the current state onto the stack.
            • @@ -122,7 +122,7 @@ var context = canvas.getContext('2d'); 
             if (!(canvas.getContext))
 {
-   alert("This browser is not supported");
+   alert("This browser is not supported");
 }

            Source Code

            @@ -131,7 +131,7 @@ if (!(canvas.getContext))
          • canvas_tutorial1.html
          • canvas_tutorial2.html
          - +

          Using Images on the Canvas

          To use images in the canvas, use the drawImage() method of the HTML Canvas 2D Context API. The method receives information, such as the image URL and position, and where it is indicated, and then creates the image in the canvas. The created image is pixel-based.

          @@ -141,7 +141,7 @@ if (!(canvas.getContext))

        To use images on a canvas:

        - +

        1. Use the drawImage() method to express an image in the canvas.

          When you define the URL of the image to be imported and its coordinates, the original image is imported as it is. You can hide certain parts of the image by assigning its size accordingly.

          @@ -165,15 +165,15 @@ var transImage = context.getImageData(30, 20, image.width, image.height); /* Convert the data color value for each image pixel */ for (var i = 0; i < transImage.data.length; i += 4) { -   transImage.data[i + 0] = 255 - transImage.data[i + 0]; -   transImage.data[i + 1] = 255 - transImage.data[i + 1]; -   transImage.data[i + 2] = 255 - transImage.data[i + 2]; + transImage.data[i + 0] = 255 - transImage.data[i + 0]; + transImage.data[i + 1] = 255 - transImage.data[i + 1]; + transImage.data[i + 2] = 255 - transImage.data[i + 2]; } /* Insert the converted image back to the canvas */ context.putImageData(transImage, 30, 20);
          2. -

        2. Use the CanvasTransformation interface to transform the selected object, for example, its size, angle, or position. By connecting to the image used in the canvas, you can also rotate it. (The following figure applies to mobile applications only.) +

        3. Use the CanvasTransformation interface to transform the selected object, for example, its size, angle, or position. By connecting to the image used in the canvas, you can also rotate it. (The following figure applies to mobile applications only.) 

          @@ -202,10 +202,10 @@ context.restore();
 	
        4. canvas_tutorial1.html
          5. 
 	
        5. canvas_tutorial2.html
          6. 
  
-		
+
 				
          Drawing Shapes to the Canvas
          
 
          With the HTML Canvas 2D Context API, you can draw various shapes, such as rectangles (rect()), circles (arc() and arcTo()), and lines (lineTo() and bezierCurveTo()), to a canvas. You can define the position and size of the shapes, and also merge shapes with other shape objects.
          
-
          To create and draw shapes on a canvas:
           
+
          To create and draw shapes on a canvas:
          
 
 
            
 
          1. Use the rect() method to create a rectangle.
@@ -213,17 +213,17 @@ context.restore();
 
 
             /* Rectangle fill style */
-context.fillStyle = '#333';
+context.fillStyle = '#333';
 context.fillRect(10, 10, 300, 300);
 
 /* Rectangle stroke style */
-context.strokeStyle = '#ff0';
+context.strokeStyle = '#ff0';
 context.strokeRect(100, 100, 100, 100);
 
 /* Rectangle clear style */
 context.clearRect(50, 50, 100, 100);
 
            
-
            Assign rectangle attributes (in mobile applications only)
             
+
            Assign rectangle attributes (in mobile applications only)
            
 
            2. 
 
 
          2. Use the arc() method to create a circle.
@@ -250,7 +250,7 @@ context.arcTo(150, 50, 100, 100, 50);
 context.lineTo(300, 200);
 context.stroke();
          -

          Assign circle attributes (in mobile applications only)

          +

          Assign circle attributes (in mobile applications only)

        6. Use the CanvasTransformation interface to transform the created shapes. With compositing, a certain part of the shape can be made transparent. (The following figure applies to mobile applications only.)

          @@ -265,9 +265,9 @@ context.beginPath(); context.arc(150, 150, 100, 0, 2 * Math.PI); /* Fill the shape */ -context.fillStyle = 'tomato'; +context.fillStyle = 'tomato'; -

          Transform shapes (in mobile applications only)

          +

          Transform shapes (in mobile applications only)

        @@ -275,24 +275,24 @@ context.fillStyle = 'tomato'; Note For a canvas, the rendering occurs in the order from the back of the input source.
        - +

        Source Code

        For the complete source code related to this use case, see the following file:

        +

        Drawing Masks to the Canvas

        - -

        To draw masks on a canvas:

        + +

        To draw masks on a canvas:

        1. Create the HTML layout with a canvas and 2 button input elements for brush selection: 
          -<canvas id="canvas" width="600" height="300"></canvas>
-<input type="button" value="Small brush" id="smallBrush"/>
-<input type="button" value="Big brush" id="bigBrush"/>
+<canvas id="canvas" width="600" height="300"></canvas>
+<input type="button" value="Small brush" id="smallBrush"/>
+<input type="button" value="Big brush" id="bigBrush"/>
          2. @@ -300,11 +300,11 @@ context.fillStyle = 'tomato'; 
           <style>
-   body
-   {
-      background: url(images/tizen_blackfold3.png) no-repeat;
-      background-size: cover;
-   }
+   body
+   {
+      background: url(images/tizen_blackfold3.png) no-repeat;
+      background-size: cover;
+   }
 </style>
          @@ -313,9 +313,9 @@ context.fillStyle = 'tomato'; 
           var lastX = 0,
-    lastX = 0,
-    mouseBtn = false,
-    brushSize = 4;
+    lastX = 0,
+    mouseBtn = false,
+    brushSize = 4;
 var canvas, context;
          @@ -324,71 +324,71 @@ var canvas, context; 
           window.onload = function()
 {
-   canvas = document.getElementById('canvas');
-   context = canvas.getContext("2d");
-   if (!context)
-   {
-      return;
-   }
+   canvas = document.getElementById('canvas');
+   context = canvas.getContext("2d");
+   if (!context)
+   {
+      return;
+   }
 }
          -
        2. Draw an image on the canvas using the drawImage() method. The user is able to replace the image with another using a brush. +
        3. Draw an image on the canvas using the drawImage() method. The user is able to replace the image with another using a brush.

          Create a new Image object, including the path of the image file. Define the line width to be based on the brush size selected by the user.

           var img = new Image();
-img.addEventListener('load', function()
-   {
-      context.drawImage(img, 0, 0);
-   });
-img.src = "images/TizenPinwheelArrows.png";
+img.addEventListener('load', function()
+   {
+      context.drawImage(img, 0, 0);
+   });
+img.src = "images/TizenPinwheelArrows.png";
 context.lineWidth = brushSize;
-context.lineCap = 'round';
+context.lineCap = 'round';
        4. Define the button events and brushes: 
          -var smallBtn = document.getElementById("smallBrush");
-smallBtn.addEventListener('click', smallBrush);
-var bigBtn = document.getElementById("bigBrush");
-bigBtn.addEventListener('click', bigBrush);
+var smallBtn = document.getElementById("smallBrush");
+smallBtn.addEventListener('click', smallBrush);
+var bigBtn = document.getElementById("bigBrush");
+bigBtn.addEventListener('click', bigBrush);
 
 function smallBrush(e)
 {
-   context.beginPath();
-   brushSize = 4;
-   context.lineWidth = brushSize;
+   context.beginPath();
+   brushSize = 4;
+   context.lineWidth = brushSize;
 }
 /* Define the big brush similarly */
        5. Add event listeners to detect touch and mouse events: 
          -canvas.addEventListener('touchstart', startDraw);
-canvas.addEventListener('touchmove', drawStep);
-canvas.addEventListener('touchend', stopDraw);
-canvas.addEventListener('mouseout', stopDraw);
+canvas.addEventListener('touchstart', startDraw);
+canvas.addEventListener('touchmove', drawStep);
+canvas.addEventListener('touchend', stopDraw);
+canvas.addEventListener('mouseout', stopDraw);
 /* Event listeners for mouse events */

          The touchstart and mousedown events only store the event coordinates, the touchmove and mousemove events define the position and direction of the drawing, and the touchend and mouseup events indicate that the user event ends, as illustrated in the following figure.

          Drawing events

          6. -
        6. Use the updateLastPos() method to update the lastX and lastY variable values. The real coordinates can be calculated by reducing the offset position of the canvas element from the touch position coordinates. The 'touch' string indicates that the event is a touch event. +
        7. Use the updateLastPos() method to update the lastX and lastY variable values. The real coordinates can be calculated by reducing the offset position of the canvas element from the touch position coordinates. The 'touch' string indicates that the event is a touch event. 
           function updateLastPos(e)
 {
-   if (e.type.indexOf('touch') >= 0)
-   {
-      var pos = e.touches.item(0);
-      lastX = pos.clientX-pos.target.offsetLeft;
-      lastY = pos.clientY-pos.target.offsetTop;
-   }
-   else
-   {
-      lastX = e.offsetX;
-      lastY = e.offsetY;
-   }
+   if (e.type.indexOf('touch') >= 0)
+   {
+      var pos = e.touches.item(0);
+      lastX = pos.clientX-pos.target.offsetLeft;
+      lastY = pos.clientY-pos.target.offsetTop;
+   }
+   else
+   {
+      lastX = e.offsetX;
+      lastY = e.offsetY;
+   }
 }
          8. @@ -397,11 +397,11 @@ function updateLastPos(e) 
           function startDraw(e)
 {
-   updateLastPos(e);
-   context.globalCompositeOperation = 'destination-out';
-   context.beginPath();
-   context.moveTo(lastX, lastY);
-   mouseBtn = true;
+   updateLastPos(e);
+   context.globalCompositeOperation = 'destination-out';
+   context.beginPath();
+   context.moveTo(lastX, lastY);
+   mouseBtn = true;
 }
          @@ -410,12 +410,12 @@ function startDraw(e) 
           function drawStep(e)
 {
-   if (mouseBtn)
-   {
-      updateLastPos(e);
-      context.lineTo(lastX, lastY);
-      context.stroke();
-   }
+   if (mouseBtn)
+   {
+      updateLastPos(e);
+      context.lineTo(lastX, lastY);
+      context.stroke();
+   }
 }
          @@ -423,34 +423,34 @@ function drawStep(e) 
           function stopDraw(e)
 {
-   context.globalCompositeOperation = 'source-over';
-   mouseBtn = false;
+   context.globalCompositeOperation = 'source-over';
+   mouseBtn = false;
 }

          Drawing masks

        - +

        Source Code

        For the complete source code related to this use case, see the following file:

        +

        Creating Text and Lines on the Canvas

        To create text and lines on a canvas:

        - +

        1. To draw a line, use the moveTo() method to assign the beginning point of the line, and the lineTo() method to assign the end point of the line. The stroke() method draws the full line. 

          -context.lineJoin = "bevel";
+context.lineJoin = "bevel";
 context.lineWidth = 20;
 
 context.beginPath();
-context.lineJoin = "round";
+context.lineJoin = "round";
 context.moveTo(20, 20);
 context.lineTo(100, 40);
 context.stroke();
@@ -460,9 +460,9 @@ context.stroke();
 
          The font attribute defines the font style, and the textBaseline attribute the vertical alignment of the text.
          
 
 
          -context.font = 'italic 400 22px/2 sans-serif';
-context.strokeStyle = "#f00";
-context.textBaseline = "alphabetic";
+context.font = 'italic 400 22px/2 sans-serif';
+context.strokeStyle = "#f00";
+context.textBaseline = "alphabetic";
 context.moveTo(150, 20);
 context.lineTo(150, 170);
 context.stroke();
@@ -471,10 +471,10 @@ context.stroke();
 
        2. Use the textAlign attribute and the fillText() method to position the text in the assigned location:
          
 
 
          -context.textAlign = "start";
-context.fillText("textAlign=start", 150, 50);
-context.textAlign = "end";
-context.measureText("textAlign=end", 150, 100);
+context.textAlign = "start";
+context.fillText("textAlign=start", 150, 50);
+context.textAlign = "end";
+context.measureText("textAlign=end", 150, 100);
 
          3.
        @@ -482,44 +482,44 @@ context.measureText("textAlign=end", 150, 100); Note When drawing multiple images in a canvas, indicate the starting point with the beginPath() method to prevent unforeseen errors.
        - +

        Source Code

        For the complete source code related to this use case, see the following files:

        - + +

        Performance Comparison of Canvas 2D and WebGL in Mobile Applications

        -

        In Web documents prior to HTML5, only simple image loading was supported. To create graphic animations, you had to use a separate plug-in. However, as the graphic-related APIs have become more standardized, you can now express graphics by using only JavaScript, without a separate plug-in.

        +

        In Web documents prior to HTML5, only simple image loading was supported. To create graphic animations, you had to use a separate plug-in. However, as the graphic-related APIs have become more standardized, you can now express graphics by using only JavaScript, without a separate plug-in.

        + +

        When developing Web applications that need to express complex graphics, such as games, the most important issue to consider is graphic performance. Currently, the HTML Canvas 2D Context API and WebGL are used to express graphic elements in many games. The following example illustrates how to create an effective graphic animation by comparing the performance of the renderers in the Canvas 2D Context API and WebGL.

        -

        When developing Web applications that need to express complex graphics, such as games, the most important issue to consider is graphic performance. Currently, the HTML Canvas 2D Context API and WebGL are used to express graphic elements in many games. The following example illustrates how to create an effective graphic animation by comparing the performance of the renderers in the Canvas 2D Context API and WebGL.

        -

        To compare the performance, 2 simple Web applications must be created, using respectively the Canvas 2D Context API and WebGL:

        1. Create the applications with the following logic: -
          1. Load an image.
            2. -
          2. Render the loaded image in the random location of the canvas.
            3. -
          3. Use the requestAnimationFrame() method of the Timing control for script-based animations API (in mobile or wearable applications) to change the color of the loaded image, based on different times.
            4. -
          4. Create a logic that measures FPS (frames per second) in order to check the performance.
          2. -
        2. Execute the applications and measure the FPS.
          3. -
        3. Increase only the number of objects so that the same 1~N images, under the same conditions, are shown repeatedly based on 1~N.
          4. -
        4. Measure the FPS as the number of repeatedly shown objects increase.
        +
        1. Load an image.
          2. +
        2. Render the loaded image in the random location of the canvas.
          3. +
        3. Use the requestAnimationFrame() method of the Timing control for script-based animations API (in mobile or wearable applications) to change the color of the loaded image, based on different times.
          4. +
        4. Create a logic that measures FPS (frames per second) in order to check the performance.
        +
      17. Execute the applications and measure the FPS.
        18. +
      18. Increase only the number of objects so that the same 1~N images, under the same conditions, are shown repeatedly based on 1~N.
        19. +
      19. Measure the FPS as the number of repeatedly shown objects increase.

        20. The following figure shows the result of the test: As the number of objects increase, the performance of the Canvas 2D Context API rapidly decreases when compared to WebGL (the result is subject to change according to the complexity of the application logic). As such, when expressing many graphic objects all differently, it is much more efficient to use WebGL than the Canvas 2D Context API.

        -

        Figure: Test result

        +

        Figure: Test result

        Test result

        - -

        There is one problem with using WebGL; the ratio of mobile browsers supporting it is quite low compared to the Canvas 2D Context API, and even when it is supported, usually only partial features are included (support for 3D acceleration, reflection effect, and camera effect is particularly low). The following figure shows the support status of WebGL in computer (top) and mobile (bottom) browsers, as published in http://webglstats.com/ in June 2013.

        -

        Figure: WebGL support in computer and mobile browsers

        +

        There is one problem with using WebGL; the ratio of mobile browsers supporting it is quite low compared to the Canvas 2D Context API, and even when it is supported, usually only partial features are included (support for 3D acceleration, reflection effect, and camera effect is particularly low). The following figure shows the support status of WebGL in computer (top) and mobile (bottom) browsers, as published in http://webglstats.com/ in June 2013.

        + +

        Figure: WebGL support in computer and mobile browsers

        WebGL support in computer and mobile browsers

        -

        Many mobile browsers do not support WebGL or only partially support WebGL. Even though Tizen supports WebGL, it is recommended to use the Canvas 2D Context API for small amount of 2D drawings, since the API is supported in most mobile browsers. However, for performance critical applications, use WebGL for faster 2D performance.

        +

        Many mobile browsers do not support WebGL or only partially support WebGL. Even though Tizen supports WebGL, it is recommended to use the Canvas 2D Context API for small amount of 2D drawings, since the API is supported in most mobile browsers. However, for performance critical applications, use WebGL for faster 2D performance.

        diff --git a/org.tizen.guides/html/web/w3c/graphics/graphics_guide_w.htm b/org.tizen.guides/html/web/w3c/graphics/graphics_guide_w.htm index 3454ee9..976207c 100644 --- a/org.tizen.guides/html/web/w3c/graphics/graphics_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/graphics/graphics_guide_w.htm @@ -5,20 +5,20 @@ - + - Graphics - + Graphics + - +

        Mobile Web Wearable Web

        - +

        Dependencies

        -
        +

        Graphics

        The graphics features include creating and editing various kinds of images, shapes, text, and elements.

        - +

        The following graphics features apply in mobile and wearable applications only:

        • HTML5 Canvas

          Enables you to create images, shapes, and text using the HTML5 canvas element and HTML canvas 2D context.

        • HTML5 SVG -

          Enables you to create and modify SVG elements in your application.

          • +

          Enables you to create and modify SVG elements in your application.

        - +
        diff --git a/org.tizen.guides/html/web/w3c/graphics/svg_w.htm b/org.tizen.guides/html/web/w3c/graphics/svg_w.htm index 45c53b9..190e05e 100644 --- a/org.tizen.guides/html/web/w3c/graphics/svg_w.htm +++ b/org.tizen.guides/html/web/w3c/graphics/svg_w.htm @@ -5,20 +5,20 @@ - + - HTML5 SVG - + HTML5 SVG + - +

        Mobile Web Wearable Web

        - +

        Dependencies

        -
        +

        HTML5 SVG

        - +

        The SVG supports 2D graphics through SVG (Scalable Vector Graphics). Prior to HTML5, SVG functioned based on XML, so it was only used in XHTML or with a separate SVG plug-in. Since HTML5, however, an svg tag is used in the XML format, and can be added as an inline element in HTML.

        This feature is supported in mobile and wearable applications only.

        @@ -70,17 +70,17 @@
      20. Text

        Define the textual content and the location on the screen:

        -<svg xmlns="http://www.w3.org/2000/svg">
-   <text x="60" y="150">Hello World</text>
+<svg xmlns="http://www.w3.org/2000/svg">
+   <text x="60" y="150">Hello World</text>
 </svg>
      21. Images

        Define the image file, the image location on the screen, and the image size:

        -<svg xmlns="http://www.w3.org/2000/svg">
-   <image xlink:href="http://developer.tizen.org/sites/all/themes/tizen_theme/logo.png"
-          x="10" y="10" width="224" height="74"/>
+<svg xmlns="http://www.w3.org/2000/svg">
+   <image xlink:href="http://developer.tizen.org/sites/all/themes/tizen_theme/logo.png"
+          x="10" y="10" width="224" height="74"/>
 </svg>
        22. @@ -88,8 +88,8 @@

        Making Shapes

        -

        To create shapes as inline SVG elements:

        - +

        To create shapes as inline SVG elements:

        +
        1. Create the SVG element with the svg tag.
        2. Use the graphic elements to create various shapes. The absolute coordinates of the graphics element determine the size of the SVG. You can define the shape, size, location on the screen, line width, and the line and fill colors for the shapes. @@ -98,195 +98,195 @@

        3. To create a line between 2 assigned coordinates, use the <line> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <line x1="20" y1="20" x2="220" y2="120" stroke="blue" stroke-width="5"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <line x1="20" y1="20" x2="220" y2="120" stroke="blue" stroke-width="5"/>
 </svg>

        4. To create a rectangle at the assigned coordinates, use the <rect> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <rect x="1" y="1" width="120" height="40"
-         fill="blue" stroke="red" stroke-width="2"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <rect x="1" y="1" width="120" height="40"
+         fill="blue" stroke="red" stroke-width="2"/>
 </svg>

        5. To create a circle with the assigned barycentric coordinate and radius, use the <circle> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <circle cx="150" cy="100" r="50" fill="blue" stroke="red" stroke-width="3"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <circle cx="150" cy="100" r="50" fill="blue" stroke="red" stroke-width="3"/>
 </svg>

        6. To create an ellipse with the assigned barycentric coordinate and the X and Y axis radius, use the <ellipse> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <ellipse  cx="130" cy="80" rx="125" ry="50" fill="blue"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <ellipse  cx="130" cy="80" rx="125" ry="50" fill="blue"/>
 </svg>

        7. To create a polygon comprised of a set of assigned coordinates, use the <polygon> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <polygon fill-rule="evenodd" fill="blue" stroke="black"
-            points="148,16 116,96 196,48 100,48 180,96"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <polygon fill-rule="evenodd" fill="blue" stroke="black"
+            points="148,16 116,96 196,48 100,48 180,96"/>
 </svg>

        Source Code

        For the complete source code related to this use case, see the following file:

        - + +

        Grouping SVG Elements

        - -

        To group inline SVG elements:

        - + +

        To group inline SVG elements:

        +

        1. Combine various SVG elements in a group using the <g> container element, whose id attribute must be defined.

          If you assign a presentation attribute to the group, all the child elements inherit it. For example, in the example below, the stroke color black is defined for the group, which means that both the rectangle and circle elements within the group use the black stroke color.

          -<svg xmlns="http://www.w3.org/2000/svg" width="600px" height="600px">
-   <g id="shape-group" stroke="black">
-      <desc>Shape Group</desc>
-      <rect x="0.5" y="0.5"  fill="blue"  width="275" height="168"/>
-      <circle fill="red" stroke-width="4" cx="245" cy="159" r="93"/>
-   </g>
+<svg xmlns="http://www.w3.org/2000/svg" width="600px" height="600px">
+   <g id="shape-group" stroke="black">
+      <desc>Shape Group</desc>
+      <rect x="0.5" y="0.5"  fill="blue"  width="275" height="168"/>
+      <circle fill="red" stroke-width="4" cx="245" cy="159" r="93"/>
+   </g>

        2. You can reference the group using the id attribute:

          -   <use xlink:href="#shape-group" x="20" y="40"/>
-   <use xlink:href="#shape-group" x="40" y="60"/>
-   <use xlink:href="#shape-group" x="60" y="80"/>
+   <use xlink:href="#shape-group" x="20" y="40"/>
+   <use xlink:href="#shape-group" x="40" y="60"/>
+   <use xlink:href="#shape-group" x="60" y="80"/>
 </svg>

        3. If you have multiple groups, use the <defs> element as a container for them:

          -<svg xmlns="http://www.w3.org/2000/svg" width="600px" height="600px">
-   <defs>
-      <g id="shape-group" stroke="black">
-         <desc>Shape Group 1</desc>
-         <rect x="0.5" y="0.5"  fill="blue"  width="275" height="168"/>
-         <circle fill="red" stroke-width="4" cx="245" cy="159" r="93"/>
-      </g>
-      <g id="shape-group2" stroke="black">
-         <desc>Shape Group 2</desc>
-         <rect x="0.5" y="0.5"  fill="red"  width="275" height="168"/>
-         <circle fill="blue" stroke-width="4" cx="245" cy="159" r="93"/>
-      </g>
-   </defs>
-   <g>
-      <desc>Shape Group 3</desc>
-      <use xlink:href="#shape-group" x="60" y="80 "/>
-      <use xlink:href="#shape-group2" transform="rotate(40)" x="120" y="70"/>
-      <use xlink:href="#shape-group" transform="rotate(15)" x="190" y="120"/>
-      <use xlink:href="#shape-group2" transform="rotate(20)" x="120" y="70"/>
-   </g>
+<svg xmlns="http://www.w3.org/2000/svg" width="600px" height="600px">
+   <defs>
+      <g id="shape-group" stroke="black">
+         <desc>Shape Group 1</desc>
+         <rect x="0.5" y="0.5"  fill="blue"  width="275" height="168"/>
+         <circle fill="red" stroke-width="4" cx="245" cy="159" r="93"/>
+      </g>
+      <g id="shape-group2" stroke="black">
+         <desc>Shape Group 2</desc>
+         <rect x="0.5" y="0.5"  fill="red"  width="275" height="168"/>
+         <circle fill="blue" stroke-width="4" cx="245" cy="159" r="93"/>
+      </g>
+   </defs>
+   <g>
+      <desc>Shape Group 3</desc>
+      <use xlink:href="#shape-group" x="60" y="80 "/>
+      <use xlink:href="#shape-group2" transform="rotate(40)" x="120" y="70"/>
+      <use xlink:href="#shape-group" transform="rotate(15)" x="190" y="120"/>
+      <use xlink:href="#shape-group2" transform="rotate(20)" x="120" y="70"/>
+   </g>
 </svg>

        Source Code

        For the complete source code related to this use case, see the following file:

        - + +

        Animating SVG Elements

        - -

        To animate inline SVG elements:

        - + +

        To animate inline SVG elements:

        +

        1. To animate a specific element attribute based on time, use the <animate> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <rect x="1" y="1" width="120" height="40" fill="blue"
-         stroke="red" stroke-width="2">
-      <animate attributeName="width" to="300" dur="5s"
-               repeatCount="1" fill="remove"/>
-   </rect>
-   <rect x="1" y="50" width="120" height="40"
-         fill="blue" stroke="red" stroke-width="2">
-      <animate attributeName="width" to="300" dur="5s"
-               repeatCount="1" fill="freeze"/>
-   </rect>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <rect x="1" y="1" width="120" height="40" fill="blue"
+         stroke="red" stroke-width="2">
+      <animate attributeName="width" to="300" dur="5s"
+               repeatCount="1" fill="remove"/>
+   </rect>
+   <rect x="1" y="50" width="120" height="40"
+         fill="blue" stroke="red" stroke-width="2">
+      <animate attributeName="width" to="300" dur="5s"
+               repeatCount="1" fill="freeze"/>
+   </rect>
 </svg>

        2. To change the (fill or line) color of the element, use the <animateColor> element:

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <rect x="1" y="1" width="120" height="40"
-         fill="blue" stroke="red" stroke-width="2">
-      <animateColor to="red" attributeName="fill" dur="5s"
-                    repeatCount="indefinite"/>
-   </rect>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <rect x="1" y="1" width="120" height="40"
+         fill="blue" stroke="red" stroke-width="2">
+      <animateColor to="red" attributeName="fill" dur="5s"
+                    repeatCount="indefinite"/>
+   </rect>
 </svg>

        3. To create a motion animation, use the <animateMotion> element. The element assigns the parent element to the <mpath> as reference element, and animates according to the shape of the <mpath> element.

          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <path d="M-12.5, -6.75 L12.5, -6.75 L0, -43.75 z"
-         fill="blue" stroke="gray" stroke-width="3">
-      <animateMotion dur="6s" repeatCount="indefinite" rotate="auto">
-         <mpath xlink:href="#path1"/>
-      </animateMotion>
-   </path>
-   <path id="path1" d="M25, 100 Q50, 20 75, 70 T135, 70 T185, 70 T235, 70 T275, 70"
-         fill="none" stroke="blue" stroke-width="3"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <path d="M-12.5, -6.75 L12.5, -6.75 L0, -43.75 z"
+         fill="blue" stroke="gray" stroke-width="3">
+      <animateMotion dur="6s" repeatCount="indefinite" rotate="auto">
+         <mpath xlink:href="#path1"/>
+      </animateMotion>
+   </path>
+   <path id="path1" d="M25, 100 Q50, 20 75, 70 T135, 70 T185, 70 T235, 70 T275, 70"
+         fill="none" stroke="blue" stroke-width="3"/>
 </svg>

        Source Code

        For the complete source code related to this use case, see the following file:

        - + +

        Controlling SVG Elements through Scripting

        - +

        To use scripts to manage events related to SVG elements:

        - +
        1. Define an SVG element: 
          -<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
-   <rect x="1" y="1" width="120" height="40" fill="blue"
-         stroke="red" stroke-width="2"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
+   <rect x="1" y="1" width="120" height="40" fill="blue"
+         stroke="red" stroke-width="2"/>
 </svg>

        2. Use the <script> element to handle events related to the SVG elements.

          -

          The script usage is similar to handling DOM as a script. The following example controls the SVG element's width attribute through the click event. +

          The script usage is similar to handling DOM as a script. The following example controls the SVG element's width attribute through the click event. 

           <script>
-   var rectElemt = document.getElementById('rect')
-   rectElemt].addEventListener('click', rect_click);
-
-   function rect_click(event)
-   {
-      var target = event.target
-      var targetWidth = target.getAttribute("width");
-      if (targetWidth == 120)
-      {
-         target.setAttribute("width", targetWidth * 2);
-      }
-      else
-      {
-         target.setAttribute("width", targetWidth * 0.5);
-      };
-   };
+   var rectElemt = document.getElementById('rect')
+   rectElemt].addEventListener('click', rect_click);
+
+   function rect_click(event)
+   {
+      var target = event.target
+      var targetWidth = target.getAttribute("width");
+      if (targetWidth == 120)
+      {
+         target.setAttribute("width", targetWidth * 2);
+      }
+      else
+      {
+         target.setAttribute("width", targetWidth * 0.5);
+      };
+   };
 </script>

        Source Code

        @@ -294,7 +294,7 @@ - +
        diff --git a/org.tizen.guides/html/web/w3c/graphics/task_basicwatch_w.htm b/org.tizen.guides/html/web/w3c/graphics/task_basicwatch_w.htm index 8a05f02..f60dff2 100644 --- a/org.tizen.guides/html/web/w3c/graphics/task_basicwatch_w.htm +++ b/org.tizen.guides/html/web/w3c/graphics/task_basicwatch_w.htm @@ -5,13 +5,13 @@ - + - Task: Basic Watch + Task: Basic Watch @@ -20,7 +20,7 @@

        Wearable Web

        - +

        Dependencies

        -
        +

        Task: Basic Watch

        - -

        This task, based on the BasicWatch sample delivered with the Tizen Studio, demonstrates how you can use the HTML Canvas 2D Context API to create an analog watch on a canvas. For more information on the sample functionality and creating the sample with the full source code, see Basic Watch.

        -

        This task consists of the following parts:

        -
          +

          This task, based on the BasicWatch sample delivered with the Tizen Studio, demonstrates how you can use the HTML Canvas 2D Context API to create an analog watch on a canvas. For more information on the sample functionality and creating the sample with the full source code, see Basic Watch.

          + +

          This task consists of the following parts:

          + -

          This sample is a fully functional application for displaying a clock on a canvas.

          +
        +

        This sample is a fully functional application for displaying a clock on a canvas.

        Defining the Application Layout

        - -

        The BasicWatch sample application layout contains only 1 screen: the main screen that displays the clock.

        - -

        The following figure shows the main screen of the application.

        -

        Figure: BasicWatch screen

        + +

        The BasicWatch sample application layout contains only 1 screen: the main screen that displays the clock.

        + +

        The following figure shows the main screen of the application.

        +

        Figure: BasicWatch screen

        BasicWatch screen

        - -

        Defining the Main Screen

        -
          -
        1. index.html Source File + +

          Defining the Main Screen

          +
            +
          1. index.html Source File

            The main screen displays a canvas element on which the watch face and needles are placed.

             <head>
-   <title>Canvas Clock - Canvas API Tutorial</title>
-   <link rel="stylesheet" type="text/css" href="css/style.css"/>
+   <title>Canvas Clock - Canvas API Tutorial</title>
+   <link rel="stylesheet" type="text/css" href="css/style.css"/>
 </head>
 <body>
-   <canvas class="canvas"></canvas>
-   <script src="js/main.js"></script>
+   <canvas class="canvas"></canvas>
+   <script src="js/main.js"></script>
 </body>
          2. main.js Source File
              -
            1. -

              Create the clock in the middle of the canvas. Define the watch face style.

              +
            2. +

              Create the clock in the middle of the canvas. Define the watch face style.

               function renderDots()
 {
-   'use strict';
+   'use strict';
 
-   var dx = 0,
-       dy = 0,
-       i = 1,
-       angle = null;
+   var dx = 0,
+       dy = 0,
+       i = 1,
+       angle = null;
 
-   context.save();
-   context.translate(canvas.width / 2, canvas.height / 2);
-   context.beginPath();
-   context.fillStyle = '#999999';
+   context.save();
+   context.translate(canvas.width / 2, canvas.height / 2);
+   context.beginPath();
+   context.fillStyle = '#999999';

            3. Create 4 dots on the sides of the watch face and use the fill() method to style the dots.

              -   for (i = 1; i <= 4; i++)
-   {
-      angle = (i - 3) * (Math.PI * 2) / 4;
-      dx = clockRadius * 0.9 * Math.cos(angle);
-      dy = clockRadius * 0.9 * Math.sin(angle);
-
-      context.arc(dx, dy, 3, 0, 2 * Math.PI, false);
-      context.fill();
-   }
-   context.closePath();
+   for (i = 1; i <= 4; i++)
+   {
+      angle = (i - 3) * (Math.PI * 2) / 4;
+      dx = clockRadius * 0.9 * Math.cos(angle);
+      dy = clockRadius * 0.9 * Math.sin(angle);
+
+      context.arc(dx, dy, 3, 0, 2 * Math.PI, false);
+      context.fill();
+   }
+   context.closePath();
              4. - +

            4. Create the center point.

              -   context.beginPath();
+   context.beginPath();
 
-   context.fillStyle = '#ff9000';
-   context.strokeStyle = '#fff';
-   context.lineWidth = 4;
+   context.fillStyle = '#ff9000';
+   context.strokeStyle = '#fff';
+   context.lineWidth = 4;
 
-   context.arc(0, 0, 7, 0, 2 * Math.PI, false);
-   context.fill();
-   context.stroke();
-   context.closePath();
+   context.arc(0, 0, 7, 0, 2 * Math.PI, false);
+   context.fill();
+   context.stroke();
+   context.closePath();
 }
          @@ -135,29 +135,29 @@ function renderDots()

          Define the application category.

          -<tizen:category name="http://tizen.org/category/wearable_clock"/>
+<tizen:category name="http://tizen.org/category/wearable_clock"/>
          Note - To run your application on Samsung Gear 2, Samsung Gear 2 Neo, and Samsung Gear S devices, use <tizen:category name="com.samsung.wmanager.WATCH_CLOCK"/> instead of <tizen:category name="http://tizen.org/category/wearable_clock"/>. + To run your application on Samsung Gear 2, Samsung Gear 2 Neo, and Samsung Gear S devices, use <tizen:category name="com.samsung.wmanager.WATCH_CLOCK"/> instead of <tizen:category name="http://tizen.org/category/wearable_clock"/>.
          -
          2. +
        2. main.js Source File

          1. Modify the window.requestAnimationFrame() method to make the application compatible with the main browsers.

             window.requestAnimationFrame = window.requestAnimationFrame ||
-   window.webkitRequestAnimationFrame ||
-   window.mozRequestAnimationFrame ||
-   window.oRequestAnimationFrame ||
-   window.msRequestAnimationFrame ||
-   function(callback)
-   {
-      'use strict';
-      window.setTimeout(callback, 1000 / 60);
-   };
+   window.webkitRequestAnimationFrame ||
+   window.mozRequestAnimationFrame ||
+   window.oRequestAnimationFrame ||
+   window.msRequestAnimationFrame ||
+   function(callback)
+   {
+      'use strict';
+      window.setTimeout(callback, 1000 / 60);
+   };
          2. @@ -165,28 +165,28 @@ window.requestAnimationFrame = window.requestAnimationFrame || 
             window.onload = function()
 {
-   'use strict';
+   'use strict';
 
-   canvas = document.querySelector('canvas');
-   context = canvas.getContext('2d');
-   clockRadius = document.width / 2;
+   canvas = document.querySelector('canvas');
+   context = canvas.getContext('2d');
+   clockRadius = document.width / 2;
 
-   canvas.width = document.width;
-   canvas.height = canvas.width;
+   canvas.width = document.width;
+   canvas.height = canvas.width;

          3. Define an event listener to detect back key events.

            -   window.addEventListener('tizenhwkey', function(e)
-      {
-         if (e.keyName == 'back')
-         {
-            tizen.application.getCurrentApplication().exit();
-         }
-      });
-
-   window.requestAnimationFrame(watch);
+   window.addEventListener('tizenhwkey', function(e)
+      {
+         if (e.keyName == 'back')
+         {
+            tizen.application.getCurrentApplication().exit();
+         }
+      });
+
+   window.requestAnimationFrame(watch);
 };
            4. @@ -195,31 +195,31 @@ window.onload = function()

          Displaying the Time

          - -

          This section builds upon the elements described in Creating Text and Lines on the Canvas.

          + +

          This section builds upon the elements described in Creating Text and Lines on the Canvas.

          Creating the Clock Needles

          The clock needles are rendered in the main.js file. -
            +
            1. Rendering the Clock Needles

              The needles can be created using the renderNeedle() method.

              To create the needle as a triangle or a polygon, assign the coordinate of the beginning point with the moveTo() method. To assign the rest of the points of the triangle or polygon, use the lineTo() method, which defines the position of the next connecting vertex. You can also adjust the size of each clock needle with the lineTo() method.

               function renderNeedle(angle, radius)
 {
-   'use strict';
-   context.save();
-   context.rotate(angle);
-   context.beginPath();
-   context.lineWidth = 4;
-   context.strokeStyle = '#fff';
-   context.moveTo(6, 0);
-   context.lineTo(radius, 0);
-   context.closePath();
-   context.stroke();
-   context.closePath();
-   context.restore();
+   'use strict';
+   context.save();
+   context.rotate(angle);
+   context.beginPath();
+   context.lineWidth = 4;
+   context.strokeStyle = '#fff';
+   context.moveTo(6, 0);
+   context.lineTo(radius, 0);
+   context.closePath();
+   context.stroke();
+   context.closePath();
+   context.restore();
 }
            2. Creating the Hour Needle @@ -227,14 +227,14 @@ function renderNeedle(angle, radius) 
               function renderHourNeedle(hour)
 {
-   'use strict';
+   'use strict';
 
-   var angle = null,
-       radius = null;
+   var angle = null,
+       radius = null;
 
-   angle = (hour - 3) * (Math.PI * 2) / 12;
-   radius = clockRadius * 0.55;
-   renderNeedle(angle, radius);
+   angle = (hour - 3) * (Math.PI * 2) / 12;
+   radius = clockRadius * 0.55;
+   renderNeedle(angle, radius);
 }
            3. Creating the Minute Needle @@ -242,55 +242,55 @@ function renderHourNeedle(hour) 
               function renderMinuteNeedle(minute)
 {
-   'use strict';
+   'use strict';
 
-   var angle = null,
-       radius = null;
+   var angle = null,
+       radius = null;
 
-   angle = (minute - 15) * (Math.PI * 2) / 60;
-   radius = clockRadius * 0.75;
-   renderNeedle(angle, radius);
+   angle = (minute - 15) * (Math.PI * 2) / 60;
+   radius = clockRadius * 0.75;
+   renderNeedle(angle, radius);
 }

            Indicating the Current Time

            The time displaying functionality is implemented in the main.js file.

            -
              -
            1. Determining the Time +
                +
              1. Determining the Time

                Use the new Date() method to find out the current time. To point the needles accurately, define variables for the current hour and minute.

                 function watch()
 {
-   'use strict';
-
-   var date = new Date(),
-       hours = date.getHours(),
-       minutes = date.getMinutes(),
-       seconds = date.getSeconds(),
-       hour = hours + minutes / 60,
-       minute = minutes + seconds / 60;
-       nextMove = 1000 - date.getMilliseconds();
+   'use strict';
+
+   var date = new Date(),
+       hours = date.getHours(),
+       minutes = date.getMinutes(),
+       seconds = date.getSeconds(),
+       hour = hours + minutes / 60,
+       minute = minutes + seconds / 60;
+       nextMove = 1000 - date.getMilliseconds();
              2. Erasing the Previous Time

                Use the clearRect() method to delete the previous time (the previously positioned needles) every time a new time is indicated. 

                -   context.clearRect(0, 0, context.canvas.width, context.canvas.height);
+   context.clearRect(0, 0, context.canvas.width, context.canvas.height);
              3. Pointing the Clock Needles

                Display the current time.

                -   renderDots();
-   renderHourNeedle(hour);
-   renderMinuteNeedle(minute);
-
-   context.restore();
-   setTimeout(function()
-      {
-         window.requestAnimationFrame(watch);
-      }, nextMove);
+   renderDots();
+   renderHourNeedle(hour);
+   renderMinuteNeedle(minute);
+
+   context.restore();
+   setTimeout(function()
+      {
+         window.requestAnimationFrame(watch);
+      }, nextMove);
 }
              diff --git a/org.tizen.guides/html/web/w3c/location/geolocation_w.htm b/org.tizen.guides/html/web/w3c/location/geolocation_w.htm index 4287c89..6cc8d21 100644 --- a/org.tizen.guides/html/web/w3c/location/geolocation_w.htm +++ b/org.tizen.guides/html/web/w3c/location/geolocation_w.htm @@ -48,7 +48,7 @@

              This feature is supported in mobile and wearable applications only.

              -

              Using the Geolocation interface, you can retrieve position information with "one-shot" position requests (with the getCurrentPosition() method) or repeated position updates (with the watchPosition() method). Both methods take the following parameters:

              +

              Using the Geolocation interface, you can retrieve position information with "one-shot" position requests (with the getCurrentPosition() method) or repeated position updates (with the watchPosition() method). Both methods take the following parameters:

              • Success event handler, which is a function invoked when an attempt to obtain the current location is successful.
              • Error event handler, which is a function invoked when an attempt to obtain the current location fails (optional).
                • @@ -70,54 +70,54 @@

                To provide users with location-based features, you must learn to create a mobile GPS application to retrieve location information:

                  -
                1. Create event handlers for the location requests. -

                  The Geolocation interface allows 2 types of location requests: "one-shot" position request and repeated position updates. Both request types use the same event handlers. The success event handler is invoked when an attempt to obtain the current location is successful, while the error event handler is invoked when the attempt fails. The success event handler is mandatory, and contains a position parameter that hold the actual position information.

                  +
                2. Create event handlers for the location requests. +

                  The Geolocation interface allows 2 types of location requests: "one-shot" position request and repeated position updates. Both request types use the same event handlers. The success event handler is invoked when an attempt to obtain the current location is successful, while the error event handler is invoked when the attempt fails. The success event handler is mandatory, and contains a position parameter that hold the actual position information.

                   function successCallback(position)
 {
-   document.getElementById("locationInfo").innerHTML =
-      "Latitude: " + position.coords.latitude
-      + "<br/>Longitude: " + position.coords.longitude;
+   document.getElementById("locationInfo").innerHTML =
+      "Latitude: " + position.coords.latitude
+      + "<br/>Longitude: " + position.coords.longitude;
 }
 
 function errorCallback(error)
 {
-   var errorInfo = document.getElementById("locationInfo");
-
-   switch (error.code)
-   {
-      case error.PERMISSION_DENIED:
-         errorInfo.innerHTML = "User denied the request for Geolocation.";
-         break;
-      case error.POSITION_UNAVAILABLE:
-         errorInfo.innerHTML = "Location information is unavailable.";
-         break;
-      case error.TIMEOUT:
-         errorInfo.innerHTML = "The request to get user location timed out.";
-         break;
-      case error.UNKNOWN_ERROR:
-         errorInfo.innerHTML = "An unknown error occurred.";
-         break;
-   }
+   var errorInfo = document.getElementById("locationInfo");
+
+   switch (error.code)
+   {
+      case error.PERMISSION_DENIED:
+         errorInfo.innerHTML = "User denied the request for Geolocation.";
+         break;
+      case error.POSITION_UNAVAILABLE:
+         errorInfo.innerHTML = "Location information is unavailable.";
+         break;
+      case error.TIMEOUT:
+         errorInfo.innerHTML = "The request to get user location timed out.";
+         break;
+      case error.UNKNOWN_ERROR:
+         errorInfo.innerHTML = "An unknown error occurred.";
+         break;
+   }
 }
                  3. -
                3. Create a "one-shot" position request with the getCurrentPosition() method. +
                4. Create a "one-shot" position request with the getCurrentPosition() method.

                  The maximumAge parameter determines that if the user agent does not have cached position information that is fresher than 60000 milliseconds (1 minute), new location information is automatically obtained.

                   function oneShotFunc()
 {
-   if (navigator.geolocation)
-   {
-      navigator.geolocation.getCurrentPosition(successCallback, errorCallback,
-                                               {maximumAge: 60000});
-   }
-   else
-   {
-      document.getElementById("locationInfo").innerHTML =
-         "Geolocation is not supported.";
-   }
+   if (navigator.geolocation)
+   {
+      navigator.geolocation.getCurrentPosition(successCallback, errorCallback,
+                                               {maximumAge: 60000});
+   }
+   else
+   {
+      document.getElementById("locationInfo").innerHTML =
+         "Geolocation is not supported.";
+   }
 }

                  If you do not want to wait for new position information, but are willing to use cached information regardless of how old it is, you can use the maximumAge and timeout parameters together ({maximumAge: Infinity, timeout: 0}). In this case, if the user agent has no position information cached, it automatically invokes the error event handler.

                  @@ -127,15 +127,15 @@ function oneShotFunc() 
                   function watchFunc()
 {
-   if (navigator.geolocation)
-   {
-      watchId = navigator.geolocation.watchPosition(successCallback, errorCallback);
-   }
-   else
-   {
-      document.getElementById("locationInfo").innerHTML =
-         "Geolocation is not supported.";
-   }
+   if (navigator.geolocation)
+   {
+      watchId = navigator.geolocation.watchPosition(successCallback, errorCallback);
+   }
+   else
+   {
+      document.getElementById("locationInfo").innerHTML =
+         "Geolocation is not supported.";
+   }
 }
                  5. @@ -143,22 +143,22 @@ function watchFunc() 
                   function stopWatchFunc()
 {
-   if (navigator.geolocation)
-   {
-      navigator.geolocation.clearWatch(watchId);
-   }
-   else
-   {
-      document.getElementById("locationInfo").innerHTML =
-         "Geolocation is not supported.";
-   }
+   if (navigator.geolocation)
+   {
+      navigator.geolocation.clearWatch(watchId);
+   }
+   else
+   {
+      document.getElementById("locationInfo").innerHTML =
+         "Geolocation is not supported.";
+   }
 }

                The following figure illustrates the GPS application.

                -

                Figure: GPS application (in mobile applications only)

                +

                Figure: GPS application (in mobile applications only)

                GPS application (in mobile applications only)

                Source Code

                diff --git a/org.tizen.guides/html/web/w3c/location/location_guide_w.htm b/org.tizen.guides/html/web/w3c/location/location_guide_w.htm index 2f33467..518f7d0 100644 --- a/org.tizen.guides/html/web/w3c/location/location_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/location/location_guide_w.htm @@ -45,7 +45,7 @@
              • Geolocation API Specification

                Allows you to determine the geographical position of a mobile device using various positioning methods, such as the Global Positioning System (GPS) and network positioning system.

              - +
        diff --git a/org.tizen.guides/html/web/w3c/media/getusermedia_w.htm b/org.tizen.guides/html/web/w3c/media/getusermedia_w.htm index 29b4a63..f3eaac5 100644 --- a/org.tizen.guides/html/web/w3c/media/getusermedia_w.htm +++ b/org.tizen.guides/html/web/w3c/media/getusermedia_w.htm @@ -70,18 +70,18 @@
      22. Create the HTML5 video element (in mobile or wearable applications) and a button used to control audio stream access: 
         <body>
-   <video id="videoPlay" src="" autoplay controls ></video><br/>
-   <input type="button" value="START" onclick="getVideoStream();" id="btnStart"/>
+   <video id="videoPlay" src="" autoplay controls ></video><br/>
+   <input type="button" value="START" onclick="getVideoStream();" id="btnStart"/>
 </body>
      23. Use the navigator.webkitGetUserMedia() method to derive audio streams: 
         <script>
-   function getVideoStream()
-   {
-      navigator.webkitGetUserMedia({video: true}, successCallBack, errorCallBack);
-   }
+   function getVideoStream()
+   {
+      navigator.webkitGetUserMedia({video: true}, successCallBack, errorCallBack);
+   }
 </script>
        @@ -91,11 +91,11 @@
      24. Retrieve audio stream information and create stream URL: 
         <script>
-   function SuccessCallback(stream)
-   {
-      var URL = window.webkitURL;
-      document.getElementById("videoPlay").src = URL.createObjectURL(stream);
-   }
+   function SuccessCallback(stream)
+   {
+      var URL = window.webkitURL;
+      document.getElementById("videoPlay").src = URL.createObjectURL(stream);
+   }
 </script>
        25. @@ -114,13 +114,13 @@ 
         <body>
-   <video id="videoView" src="" autoplay></video><br/>
-   <img id="imgView" src="">
-   <canvas id="canvasView" style="display: none;"
-           width="300" height="225"></canvas><br/>
-   <input type="button" value="WebCamStart"
-          onclick="getVideoStream();" id="btnPlay"/>
-   <input type="button" value="Capture" onclick="getCapture();" id="btnCapture"/>
+   <video id="videoView" src="" autoplay></video><br/>
+   <img id="imgView" src="">
+   <canvas id="canvasView" style="display: none;"
+           width="300" height="225"></canvas><br/>
+   <input type="button" value="WebCamStart"
+          onclick="getVideoStream();" id="btnPlay"/>
+   <input type="button" value="Capture" onclick="getCapture();" id="btnCapture"/>
 </body>
        @@ -128,20 +128,20 @@

      25. Enable rendering of the retrieved media stream by calling the webkitGetUserMedia() method:

         <script>
-   function getVideoStream()
-   {
-      navigator.webkitGetUserMedia({video: true}, SuccessCallBack, ErrorCallBack);
-   }
-   function SuccessCallBack(stream)
-   {
-      var URL = window.webkitURL;
-      document.getElementById("videoView").src = URL.createObjectURL(stream);
-      localStream = stream;
-   }
-   function ErrorCallBack(e)
-   {
-      /* Error handling */
-   }
+   function getVideoStream()
+   {
+      navigator.webkitGetUserMedia({video: true}, SuccessCallBack, ErrorCallBack);
+   }
+   function SuccessCallBack(stream)
+   {
+      var URL = window.webkitURL;
+      document.getElementById("videoView").src = URL.createObjectURL(stream);
+      localStream = stream;
+   }
+   function ErrorCallBack(e)
+   {
+      /* Error handling */
+   }
 </script>
        26. @@ -149,18 +149,18 @@

      26. Display the captured frame in a video element using the drawImage() method: 

         <script>
-   var localStream = "";
-   function getCapture()
-   {
-      if (localStream)
-      {
-         var canvas = document.getElementById("canvasView");
-         var context = canvas.getContext('2d');
-
-         context.drawImage(document.getElementById("videoView"), 0, 0, 300, 225);
-         document.getElementById("imgView").src = canvas.toDataURL('image/web');
-      }
-   }
+   var localStream = "";
+   function getCapture()
+   {
+      if (localStream)
+      {
+         var canvas = document.getElementById("canvasView");
+         var context = canvas.getContext('2d');
+
+         context.drawImage(document.getElementById("videoView"), 0, 0, 300, 225);
+         document.getElementById("imgView").src = canvas.toDataURL('image/web');
+      }
+   }
 </script>
        27. diff --git a/org.tizen.guides/html/web/w3c/media/media_capture_w.htm b/org.tizen.guides/html/web/w3c/media/media_capture_w.htm index 32fc8ff..0cb4837 100644 --- a/org.tizen.guides/html/web/w3c/media/media_capture_w.htm +++ b/org.tizen.guides/html/web/w3c/media/media_capture_w.htm @@ -59,7 +59,7 @@ 

        -<input type="file" capture="filesystem"/>
+<input type="file" capture="filesystem"/>

        File types

        @@ -68,9 +68,9 @@

        Assign format, such as filesystem, camera, or camcorder:

        -<input type="file" accept="audio/*" capture="camera"/>
-<input type="file" accept="image/*" capture="camcorder"/>
-<input type="file" accept="video/*" capture="microphone"/>
+<input type="file" accept="audio/*" capture="camera"/>
+<input type="file" accept="image/*" capture="camcorder"/>
+<input type="file" accept="video/*" capture="microphone"/>

        diff --git a/org.tizen.guides/html/web/w3c/media/task_piano_w.htm b/org.tizen.guides/html/web/w3c/media/task_piano_w.htm index 4409f9f..f18a34b 100644 --- a/org.tizen.guides/html/web/w3c/media/task_piano_w.htm +++ b/org.tizen.guides/html/web/w3c/media/task_piano_w.htm @@ -5,13 +5,13 @@ - + - Task: Piano + Task: Piano @@ -20,7 +20,7 @@

        Mobile Web

        - +

        Dependencies

        -
        +
        -

        Task: Piano

        -

        This task, based on the Piano sample delivered with the Tizen Studio, demonstrates how you can use the HTML5 audio element API to create a piano application and play sounds. For more information on the sample functionality and creating the sample with the full source code, see Piano.

        - -

        This task consists of the following parts:

        -
          +

          Task: Piano

          +

          This task, based on the Piano sample delivered with the Tizen Studio, demonstrates how you can use the HTML5 audio element API to create a piano application and play sounds. For more information on the sample functionality and creating the sample with the full source code, see Piano.

          + +

          This task consists of the following parts:

          + -

          This sample is a fully functional application for playing a piano. The user can use multi-touch to play a combination of sounds from a single octave.

          - -

          Defining the Application Layout

          -

          The Piano sample application layout contains only 1 screen: the main screen that displays the piano keyboard.

          - -

          The following figure shows the main screen of the application.

          -

          Figure: Piano screen

          -

          Piano screen

          - -

          Defining the Main Screen

          -
            +
          1. Handling the Keys defines how to create the piano object.
            2. +
          2. Playing Sounds defines how to use the audio element to play sounds.
            3. +
        +

        This sample is a fully functional application for playing a piano. The user can use multi-touch to play a combination of sounds from a single octave.

        + +

        Defining the Application Layout

        +

        The Piano sample application layout contains only 1 screen: the main screen that displays the piano keyboard.

        + +

        The following figure shows the main screen of the application.

        +

        Figure: Piano screen

        +

        Piano screen

        + +

        Defining the Main Screen

        +
        1. index.html Source File

          The main screen displays a piano keyboard. The keys are defined as <div> elements whose class attribute is set to button.

          -<body ondragstart="return false" onselectstart="return false">
-
-   <div class="button white_btn" id="play0"></div>
-   <div class="button white_btn" id="play2"></div>
-   <div class="button white_btn" id="play4"></div>
-   <div class="button white_btn" id="play5"></div>
-   <div class="button white_btn" id="play7"></div>
-   <div class="button white_btn" id="play9"></div>
-   <div class="button white_btn" id="play11"></div>
-   <div class="button white_btn" id="play12"></div>
-
-   <div class="button black_btn" style="left: 8.6%" id="play1"></div>
-   <div class="button black_btn" style="left: 21.2%" id="play3"></div>
-   <div class="button black_btn" style="left: 45.8%" id="play6"></div>
-   <div class="button black_btn" style="left: 58.4%" id="play8"></div>
-   <div class="button black_btn" style="left: 70.9%" id="play10"></div>
-   <div class="button black_btn" style="left: 95%" id="play13"></div>
+<body ondragstart="return false" onselectstart="return false">
+
+   <div class="button white_btn" id="play0"></div>
+   <div class="button white_btn" id="play2"></div>
+   <div class="button white_btn" id="play4"></div>
+   <div class="button white_btn" id="play5"></div>
+   <div class="button white_btn" id="play7"></div>
+   <div class="button white_btn" id="play9"></div>
+   <div class="button white_btn" id="play11"></div>
+   <div class="button white_btn" id="play12"></div>
+
+   <div class="button black_btn" style="left: 8.6%" id="play1"></div>
+   <div class="button black_btn" style="left: 21.2%" id="play3"></div>
+   <div class="button black_btn" style="left: 45.8%" id="play6"></div>
+   <div class="button black_btn" style="left: 58.4%" id="play8"></div>
+   <div class="button black_btn" style="left: 70.9%" id="play10"></div>
+   <div class="button black_btn" style="left: 95%" id="play13"></div>
 
 </body>
          2. @@ -94,47 +94,47 @@ 
           .white_btn
 {
-   background: url('../white.png') bottom center no-repeat transparent;
-   height: 100%;
-   display: inline-block;
-   background-size: 100%;
-   width: 12.5%;
-   height: 100%;
-   position: relative;
-   float: left;
-   margin: 0;
-   padding: 0;
-   display: block;
-   margin: 0;
+   background: url('../white.png') bottom center no-repeat transparent;
+   height: 100%;
+   display: inline-block;
+   background-size: 100%;
+   width: 12.5%;
+   height: 100%;
+   position: relative;
+   float: left;
+   margin: 0;
+   padding: 0;
+   display: block;
+   margin: 0;
 }
 
 .white_btn.pressed
-   {
-   background-image: url('../white_pressed.png');
+   {
+   background-image: url('../white_pressed.png');
 }
 
 .black_btn
-   {
-   float: left;
-   background: url('../black.png')  bottom center no-repeat transparent;
-   width: 7.6%;
-   height: 73.8%;
-   background-size: 100%;
-   background-position: top center;
-   position: fixed;
-   top: 0px;
+   {
+   float: left;
+   background: url('../black.png')  bottom center no-repeat transparent;
+   width: 7.6%;
+   height: 73.8%;
+   background-size: 100%;
+   background-position: top center;
+   position: fixed;
+   top: 0px;
 }
 
 .black_btn.pressed
 {
-   background-image: url('../black_pressed.png');
+   background-image: url('../black_pressed.png');
 }
          -
        +

        Initializing the Application

        -
          +
          1. main.js Source File
            1. @@ -144,20 +144,20 @@ var piano; function Piano() { -   "use strict"; + "use strict"; } function() { -   "use strict"; -   Piano.prototype = -   { -      touchPianoKey: [], -      lockIds: {}, -      audio: [], -      whiteCache: null, -      blackCache: null -   } + "use strict"; + Piano.prototype = + { + touchPianoKey: [], + lockIds: {}, + audio: [], + whiteCache: null, + blackCache: null + } };
              2. @@ -166,17 +166,17 @@ function() 
               Piano.prototype.audioInit = function audioInit()
 {
-   var i, self = this;
-   for (i = 0; i <= 13; i += 1)
-   {
-      this.audio[i] = document.createElement('audio');
-      this.audio[i].name = i;
-      this.audio[i].src = this.audio[i].name + ".wav";
-      this.audio[i].addEventListener("playing", function()
-      {
-         self.lockIds["play" + this.name] = false;
-      });
-   }
+   var i, self = this;
+   for (i = 0; i <= 13; i += 1)
+   {
+      this.audio[i] = document.createElement('audio');
+      this.audio[i].name = i;
+      this.audio[i].src = this.audio[i].name + ".wav";
+      this.audio[i].addEventListener("playing", function()
+      {
+         self.lockIds["play" + this.name] = false;
+      });
+   }
 };
              @@ -184,9 +184,9 @@ Piano.prototype.audioInit = function audioInit()
            -

            Handling the Keys

            -

            The event handling functionality is implemented in the main.js file.

            -
              +

              Handling the Keys

              +

              The event handling functionality is implemented in the main.js file.

              +
              1. Creating Event Listeners

                1. The onPianoKeyTouchDown() event listener is created to detect the touch event, when the user presses a piano key.

                  @@ -194,25 +194,25 @@ Piano.prototype.audioInit = function audioInit() 
                   Piano.prototype.onPianoKeyTouchDown = function onPianoKeyTouchDown(data)
 {
-   data.originalEvent.preventDefault();
-   var element, touch, i, len;
-   for (i = 0, len = data.originalEvent.changedTouches.length; i < len; i += 1)
-   {
-      touch = data.originalEvent.changedTouches[i];
-      element = document.elementFromPoint(touch.clientX, touch.clientY);
-      if (element)
-      {
-         if (this.touchPianoKey[touch.identifier] !== element.id)
-         {
-            $('#' +
-              this.touchPianoKey[touch.identifier]).removeClass('pressed');
-            this.playAudioByElement(element, touch.identifier, function()
-            {
-               this.lockIds[element.id] = true;
-            });
-         }
-      }
-   }
+   data.originalEvent.preventDefault();
+   var element, touch, i, len;
+   for (i = 0, len = data.originalEvent.changedTouches.length; i < len; i += 1)
+   {
+      touch = data.originalEvent.changedTouches[i];
+      element = document.elementFromPoint(touch.clientX, touch.clientY);
+      if (element)
+      {
+         if (this.touchPianoKey[touch.identifier] !== element.id)
+         {
+            $('#' +
+              this.touchPianoKey[touch.identifier]).removeClass('pressed');
+            this.playAudioByElement(element, touch.identifier, function()
+            {
+               this.lockIds[element.id] = true;
+            });
+         }
+      }
+   }
 };
                2. @@ -221,19 +221,19 @@ Piano.prototype.onPianoKeyTouchDown = function onPianoKeyTouchDown(data) 
                   Piano.prototype.onPianoKeyTouchUp = function onPianoKeyTouchUp(data)
 {
-   var i, touchId, len, buttonId;
-   for (i = 0, len = data.originalEvent.changedTouches.length; i < len; i += 1)
-   {
-      /* Get the number assigned to the finger touching the screen */
-      touchId = data.originalEvent.changedTouches[i].identifier;
-      buttonId = this.touchPianoKey[touchId];
-      setTimeout(function()
-         {
-            (function(id) {$('#' + id).removeClass('pressed');})
-            (buttonId);
-         }, 100);
-      this.touchPianoKey[touchId] = undefined;
-   }
+   var i, touchId, len, buttonId;
+   for (i = 0, len = data.originalEvent.changedTouches.length; i < len; i += 1)
+   {
+      /* Get the number assigned to the finger touching the screen */
+      touchId = data.originalEvent.changedTouches[i].identifier;
+      buttonId = this.touchPianoKey[touchId];
+      setTimeout(function()
+         {
+            (function(id) {$('#' + id).removeClass('pressed');})
+            (buttonId);
+         }, 100);
+      this.touchPianoKey[touchId] = undefined;
+   }
 };
                @@ -244,75 +244,75 @@ Piano.prototype.onPianoKeyTouchUp = function onPianoKeyTouchUp(data) 
                 Piano.prototype.bindEvents = function bindEvents()
 {
-   var self = this;
-
-   $(".button").bind('touchstart touchmove', function(e)
-      {
-         self.onPianoKeyTouchDown(e);
-      });
-   $(".button").bind('touchend', function(e)
-      {
-         self.onPianoKeyTouchUp(e);
-      });
-   $('#back').bind('touchstart', function(event)
-      {
-         event.preventDefault();
-         event.stopPropagation();
-         /* Apply CSS style dynamically */
-         $(this).addClass('active');
-         tizen.application.getCurrentApplication().exit();
-      });
-
-   $('#back').bind('touchend', function(event)
-      {
-         /* Cancel the applied CSS style */
-         $(this).removeClass('active');
-      });
-
-   document.addEventListener('webkitvisibilitychange', function()
-      {
-         if (document.webkitVisibilityState === 'visible')
-         {
-            self.audioInit()
-         }
-      })
+   var self = this;
+
+   $(".button").bind('touchstart touchmove', function(e)
+      {
+         self.onPianoKeyTouchDown(e);
+      });
+   $(".button").bind('touchend', function(e)
+      {
+         self.onPianoKeyTouchUp(e);
+      });
+   $('#back').bind('touchstart', function(event)
+      {
+         event.preventDefault();
+         event.stopPropagation();
+         /* Apply CSS style dynamically */
+         $(this).addClass('active');
+         tizen.application.getCurrentApplication().exit();
+      });
+
+   $('#back').bind('touchend', function(event)
+      {
+         /* Cancel the applied CSS style */
+         $(this).removeClass('active');
+      });
+
+   document.addEventListener('webkitvisibilitychange', function()
+      {
+         if (document.webkitVisibilityState === 'visible')
+         {
+            self.audioInit()
+         }
+      })
 };
                2. -
              - - -

              Playing Sounds

              - -

              This section builds upon the elements described in Playing Media Files.

              -
                +
              + + +

              Playing Sounds

              + +

              This section builds upon the elements described in Playing Media Files.

              +
              1. main.js Source File

                The playAudioByElement() method is used to play the sound determined in the audio element, when a given key button is pressed.

                 Piano.prototype.playAudioByElement =
-   function playAudioByElement(element, touchId, callback)
+   function playAudioByElement(element, touchId, callback)
 {
-   var audio = this.audio[element.id.substr(4)];
-   $(element).addClass('pressed');
-   this.touchPianoKey[touchId] = element.id;
-   if (audio)
-   {
-      if (audio.paused)
-      {
-         audio.play();
-      }
-      if (audio.currentTime !== 0)
-      {
-         audio.currentTime = 0;
-      }
-      if (callback instanceof Function)
-      {
-         callback.call(this);
-      }
-   }
+   var audio = this.audio[element.id.substr(4)];
+   $(element).addClass('pressed');
+   this.touchPianoKey[touchId] = element.id;
+   if (audio)
+   {
+      if (audio.paused)
+      {
+         audio.play();
+      }
+      if (audio.currentTime !== 0)
+      {
+         audio.currentTime = 0;
+      }
+      if (callback instanceof Function)
+      {
+         callback.call(this);
+      }
+   }
 };
                2. -
              +
            diff --git a/org.tizen.guides/html/web/w3c/media/task_selfcamera_w.htm b/org.tizen.guides/html/web/w3c/media/task_selfcamera_w.htm index cb7463d..7ee1769 100644 --- a/org.tizen.guides/html/web/w3c/media/task_selfcamera_w.htm +++ b/org.tizen.guides/html/web/w3c/media/task_selfcamera_w.htm @@ -69,23 +69,23 @@

            The <div> elements are used to define the camera elements for the screen.

             <body>
-   <div id="camera"></div>
+   <div id="camera"></div>
 
-   <div id="countdown"></div>
+   <div id="countdown"></div>
 
-   <div class="timers">
-      <div id="timer2"></div>
-      <div id="timer5"></div>
-      <div id="timer10"></div>
-   </div>
+   <div class="timers">
+      <div id="timer2"></div>
+      <div id="timer5"></div>
+      <div id="timer10"></div>
+   </div>
 
-   <div id="thumbnail">
-      <div id="upImage"></div>
-   </div>
+   <div id="thumbnail">
+      <div id="upImage"></div>
+   </div>
 
-   <div id="shutter-container">
-      <div id="shutter"></div>
-   </div>
+   <div id="shutter-container">
+      <div id="shutter"></div>
+   </div>
 </body>
          2. css/style.css Source File @@ -94,55 +94,55 @@ style.css file defines the positions and styles of the camera elements. #camera { -   width: 100%; -   height: 100%; -   overflow: hidden; + width: 100%; + height: 100%; + overflow: hidden; } div#countdown { -   position: absolute; -   width: 100%; -   height: 100%; -   top: 20%; -   font-size: 200pt; -   text-align: center; -   vertical-align: middle; -   color: rgba(135, 226, 0, 0.8); -   margin: auto 0; -   z-index: 10; + position: absolute; + width: 100%; + height: 100%; + top: 20%; + font-size: 200pt; + text-align: center; + vertical-align: middle; + color: rgba(135, 226, 0, 0.8); + margin: auto 0; + z-index: 10; } .timers { -   position: absolute; -   width: 100%; -   background-color: rgba(10, 10, 10, 0.4); -   top: 0; -   left: 0; + position: absolute; + width: 100%; + background-color: rgba(10, 10, 10, 0.4); + top: 0; + left: 0; } div#thumbnail { -   position: absolute; -   width: 56px; -   height: 64px; -   left: 13px; -   bottom: 19px; -   background-size: 56px 64px; -   background-color: transparent; -   background-image: url('../images/none.png'); -   background-repeat: no-repeat; -   z-index: 100; + position: absolute; + width: 56px; + height: 64px; + left: 13px; + bottom: 19px; + background-size: 56px 64px; + background-color: transparent; + background-image: url('../images/none.png'); + background-repeat: no-repeat; + z-index: 100; } div#shutter-container { -   width: 100%; -   height: 86px; -   position: absolute; -   bottom: 0; -   z-index: 11 + width: 100%; + height: 86px; + position: absolute; + bottom: 0; + z-index: 11 }
          @@ -153,12 +153,12 @@ div#shutter-container 
           <!--Configuration file content-->
 <widget ...>
-   <!--Other configuration details-->
-   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
-   <tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>
-   <tizen:privilege name="http://tizen.org/privilege/content.read"/>
-   <tizen:privilege name="http://tizen.org/privilege/content.write"/>
+   <!--Other configuration details-->
+   <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
+   <tizen:privilege name="http://tizen.org/privilege/filesystem.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/filesystem.write"/>
+   <tizen:privilege name="http://tizen.org/privilege/content.read"/>
+   <tizen:privilege name="http://tizen.org/privilege/content.write"/>
 </widget>
        @@ -166,7 +166,7 @@ div#shutter-container

        Accessing the Camera Stream

        This section builds upon the elements described in Accessing a Video Stream.

        - +

        Managing the Application Object

        The application object functionality is implemented in the main.js file.

        @@ -179,33 +179,33 @@ div#shutter-container var selfCamera; function SelfCamera() { -   "use strict"; + "use strict"; } function() { -   "use strict"; -   var DELAY_2_SECOND = 2, DELAY_5_SECOND = 5, DELAY_10_SECOND = 10; -   var previewLock = false; - -   SelfCamera.prototype = -   { -      countdown: -1, /* Current value after clicking the camera button */ -      countdownTimeoutID: -1, -      countSound: new Audio('sounds/sounds_count.wav'), -      img: document.createElement('canvas'), -      filename: '', -      loadDirectory: '', -      saveDirectory: 'images/', -      IMG_PREFIX: 'SelfCamera_', -      shutterSound: new Audio('sounds/sounds_Shutter_01.wav'), -      timer: null, /* Value set by the buttons */ -      systemIO: null, -      video: null, -      src: null, -      isMediaWorking: false -      previewLock: false -   }; + "use strict"; + var DELAY_2_SECOND = 2, DELAY_5_SECOND = 5, DELAY_10_SECOND = 10; + var previewLock = false; + + SelfCamera.prototype = + { + countdown: -1, /* Current value after clicking the camera button */ + countdownTimeoutID: -1, + countSound: new Audio('sounds/sounds_count.wav'), + img: document.createElement('canvas'), + filename: '', + loadDirectory: '', + saveDirectory: 'images/', + IMG_PREFIX: 'SelfCamera_', + shutterSound: new Audio('sounds/sounds_Shutter_01.wav'), + timer: null, /* Value set by the buttons */ + systemIO: null, + video: null, + src: null, + isMediaWorking: false + previewLock: false + }; } @@ -215,8 +215,8 @@ function() selfCamera = new SelfCamera(); $(document).ready(function() { -   "use strict"; -   selfCamera.init(); + "use strict"; + selfCamera.init(); }); @@ -227,10 +227,10 @@ $(document).ready(function() 
         SelfCamera.prototype.bindVideoEvents = function()
 {
-   var self = this;
-   $(this.video).on("stalled", function(e) {this.load();});
-   $(this.video).on("playing", this.resizeVideo.bind(this));
-   $(this.video).on('click', function() {this.play();});
+   var self = this;
+   $(this.video).on("stalled", function(e) {this.load();});
+   $(this.video).on("playing", this.resizeVideo.bind(this));
+   $(this.video).on('click', function() {this.play();});
 };
        @@ -238,48 +238,48 @@ SelfCamera.prototype.bindVideoEvents = function() 
         SelfCamera.prototype.bindEvents = function bindEvents()
 {
-   var self = this;
-
-   document.addEventListener('webkitvisibilitychange', function(event)
-   {
-      self.clearCountdown();
-      previewLock = false;
-      if (document.webkitVisibilityState === 'visible')
-      {
-         if (self.video !== null)
-         {
-            self.reloadSaveDirectory(function() {self.video.play();});
-         }
-         self.loadThumbnail(true, false);
-      }
-   });
-
-   $('shutter').mousedown(function(ev) {$('shutter').addClass('active');})
-               .mouseup(function(ev) {$('shutter').removeClass('active');})
-               .on('touchstart',
-                   function(ev) {$('shutter').addClass('active');})
-               .on('touchend',
-                   function(ev) {$('shutter').removeClass('active');});
-
-   $(window).on('tizenhwkey', function(e)
-   {
-      if (e.originalEvent.keyName === "back")
-      {
-         if (self.countdownTimeoutID !== -1)
-         {
-            self.clearCountdown();
-            self.loadThumbnail(true, false);
-         }
-         else
-         {
-            tizen.application.getCurrentApplication().exit();
-         }
-   });
-
-   this.bindTimerClicks();
-
-   $('#thumbnail').on('click', this.launchPreview.bind(this));
-   $('#shutter').on('touchstart', this.shutterTouched.bind(this));
+   var self = this;
+
+   document.addEventListener('webkitvisibilitychange', function(event)
+   {
+      self.clearCountdown();
+      previewLock = false;
+      if (document.webkitVisibilityState === 'visible')
+      {
+         if (self.video !== null)
+         {
+            self.reloadSaveDirectory(function() {self.video.play();});
+         }
+         self.loadThumbnail(true, false);
+      }
+   });
+
+   $('shutter').mousedown(function(ev) {$('shutter').addClass('active');})
+               .mouseup(function(ev) {$('shutter').removeClass('active');})
+               .on('touchstart',
+                   function(ev) {$('shutter').addClass('active');})
+               .on('touchend',
+                   function(ev) {$('shutter').removeClass('active');});
+
+   $(window).on('tizenhwkey', function(e)
+   {
+      if (e.originalEvent.keyName === "back")
+      {
+         if (self.countdownTimeoutID !== -1)
+         {
+            self.clearCountdown();
+            self.loadThumbnail(true, false);
+         }
+         else
+         {
+            tizen.application.getCurrentApplication().exit();
+         }
+   });
+
+   this.bindTimerClicks();
+
+   $('#thumbnail').on('click', this.launchPreview.bind(this));
+   $('#shutter').on('touchstart', this.shutterTouched.bind(this));
 };
        @@ -292,19 +292,19 @@ SelfCamera.prototype.bindEvents = function bindEvents()
      27. The startPreview() method requests the video stream using the getUserMedia() method of the navigator. 
         navigator.getUserMedia(options, this.onCaptureVideoSuccess.bind(this),
-                       this.onCaptureVideoError.bind(this));
+                       this.onCaptureVideoError.bind(this));
      28. The onCaptureVideoSuccess() event handler obtains the stream URL and creates the video element with the createVideoElement() method. 
         SelfCamera.prototype.onCaptureVideoSuccess = function onCaptureVideoSuccess(stream)
 {
-   var urlStream;
-   urlStream = window.webkitURL.createObjectURL(stream); /* Create stream */
-   this.isMediaWorking = true;
-   /* Create video element with stream handler */
-   this.createVideoElement(urlStream);
-   this.setTimer(DELAY_2_SECOND); /* Initialize timer button options */
+   var urlStream;
+   urlStream = window.webkitURL.createObjectURL(stream); /* Create stream */
+   this.isMediaWorking = true;
+   /* Create video element with stream handler */
+   this.createVideoElement(urlStream);
+   this.setTimer(DELAY_2_SECOND); /* Initialize timer button options */
 };

      29. The createVideoElement() method defines the video element, except for the @@ -312,15 +312,15 @@ src attribute, which is already defined by the onCaptureVideoSucces 

         SelfCamera.prototype.createVideoElement = function(src)
 {
-   this.video = $('<video/>',
-   {
-      autoplay: 'autoplay',
-      id: 'video',
-      style: 'height:' + $(window).height() + 'px',
-      src: src
-   }).appendTo("#camera").get(0);
-
-   this.bindVideoEvents();
+   this.video = $('<video/>',
+   {
+      autoplay: 'autoplay',
+      id: 'video',
+      style: 'height:' + $(window).height() + 'px',
+      src: src
+   }).appendTo("#camera").get(0);
+
+   this.bindVideoEvents();
 };
        30. @@ -335,24 +335,24 @@ SelfCamera.prototype.createVideoElement = function(src) 
         SelfCamera.prototype.captureImage = function captureImage(video)
 {
-   var sourceWidth = window.innerWidth,
-       sourceHeight = window.innerHeight,
-       sourceX = (sourceWidth - $(video).width()) / 2,
-       sourceY = (sourceHeight - $(video).height()) / 2;
-
-   this.img.width = sourceWidth;
-   this.img.height = sourceHeight;
-
-   /* Crop image to viewport dimensions */
-   this.img.getContext('2d').drawImage(video, sourceX, sourceY,
-                                       $(video).width(), $(video).height());
-
-   /*
-      For the best available dimension, use the following:
-      this.img.width = video.videoWidth;
-      this.img.height = video.videoHeight;
-      this.img.getContext('2d').drawImage(video, 0, 0);
-   */
+   var sourceWidth = window.innerWidth,
+       sourceHeight = window.innerHeight,
+       sourceX = (sourceWidth - $(video).width()) / 2,
+       sourceY = (sourceHeight - $(video).height()) / 2;
+
+   this.img.width = sourceWidth;
+   this.img.height = sourceHeight;
+
+   /* Crop image to viewport dimensions */
+   this.img.getContext('2d').drawImage(video, sourceX, sourceY,
+                                       $(video).width(), $(video).height());
+
+   /*
+      For the best available dimension, use the following:
+      this.img.width = video.videoWidth;
+      this.img.height = video.videoHeight;
+      this.img.getContext('2d').drawImage(video, 0, 0);
+   */
 };
        @@ -360,45 +360,45 @@ SelfCamera.prototype.captureImage = function captureImage(video) 
         SelfCamera.prototype.saveCanvas = function saveCanvas(canvas, fileName)
 {
-   var data, self = this,
-       onSuccess = function(fileHandle)
-       {
-          this.setLoadDirectory(this.getFileDirectoryURI(fileHandle));
-          tizen.content.scanFile(fileName,
-                                 function() {self.loadThumbnail(false, false);},
-                                 function() {/* Error handling */});
-       }.bind(this);
-
-   data = canvas.toDataURL().replace('data:image/png;base64,', '')
-      .replace('data:,', '');
-
-   this.systemIO.saveFileContent(fileName, data, onSuccess, 'base64');
+   var data, self = this,
+       onSuccess = function(fileHandle)
+       {
+          this.setLoadDirectory(this.getFileDirectoryURI(fileHandle));
+          tizen.content.scanFile(fileName,
+                                 function() {self.loadThumbnail(false, false);},
+                                 function() {/* Error handling */});
+       }.bind(this);
+
+   data = canvas.toDataURL().replace('data:image/png;base64,', '')
+      .replace('data:,', '');
+
+   this.systemIO.saveFileContent(fileName, data, onSuccess, 'base64');
 };
      30. Save the image. 
         saveFileContent: function SystemIO_saveFileContent(filePath, fileContent,
-                                                   onSaveSuccess, fileEncoding)
+                                                   onSaveSuccess, fileEncoding)
 {
-   var pathData = this.getPathData(filePath),
-       self = this,
-       fileHandle;
-
-   function onOpenDirSuccess(dir)
-   {
-      /* Create a new file */
-      fileHandle = self.createFile(dir, pathData.fileName);
-      if (fileHandle !== false)
-      {
-         /* Save data into the file */
-         self.writeFile(fileHandle, fileContent, onSaveSuccess,
-                        false, fileEncoding);
-      }
-   }
-
-   /* Open the directory */
-   this.openDir(pathData.dirName, onOpenDirSuccess);
+   var pathData = this.getPathData(filePath),
+       self = this,
+       fileHandle;
+
+   function onOpenDirSuccess(dir)
+   {
+      /* Create a new file */
+      fileHandle = self.createFile(dir, pathData.fileName);
+      if (fileHandle !== false)
+      {
+         /* Save data into the file */
+         self.writeFile(fileHandle, fileContent, onSaveSuccess,
+                        false, fileEncoding);
+      }
+   }
+
+   /* Open the directory */
+   this.openDir(pathData.dirName, onOpenDirSuccess);
 };
        31. diff --git a/org.tizen.guides/html/web/w3c/media/video_audio_w.htm b/org.tizen.guides/html/web/w3c/media/video_audio_w.htm index 85cb7b8..214b7ca 100644 --- a/org.tizen.guides/html/web/w3c/media/video_audio_w.htm +++ b/org.tizen.guides/html/web/w3c/media/video_audio_w.htm @@ -69,7 +69,7 @@

        You can use the Play() and Pause() methods of the Media object to control playing and pausing media files. With media events, additional features can be used.

      31. Retrieving duration and play time -

        You can retrieve the duration and play time of the media file, if its metadata (such as playing time, duration, and video's width and height) is loaded.

        +

        You can retrieve the duration and play time of the media file, if its metadata (such as playing time, duration, and video's width and height) is loaded.

      32. Playing from a random position

        You can indicate the playback time by playing the media file from a random position. To do this, you must change the currentTime value of the Media object to trigger the timeupdate event.

        @@ -93,8 +93,8 @@

      33. To create an audio player, create an audio element including the necessary attributes:

        -<audio id="audio" src="media/audio_sample.mp3"
-       preload="auto" controls muted loop autoplay>
+<audio id="audio" src="media/audio_sample.mp3"
+       preload="auto" controls muted loop autoplay>
 </audio>

        Audio player

        @@ -102,12 +102,12 @@

      34. To create a video player, create a video element including the necessary attributes. In addition to the attributes available for the audio element, you can also use the width, height, and poster attributes.

        -<video id="video" src="media/video_sample.mp4"
-       width="400" height="220" poster="media/poster_sample.png"
-       preload="auto" controls muted loop>
+<video id="video" src="media/video_sample.mp4"
+       width="400" height="220" poster="media/poster_sample.png"
+       preload="auto" controls muted loop>
 </video>
        -

        A player with a play control (built-in control provided in the browser) is created. The control is visible only when the controls attribute is added. If the poster attribute is not defined, the video's first frame is shown on the screen before the playback. The following figure shows the video player before and during playback. +

        A player with a play control (built-in control provided in the browser) is created. The control is visible only when the controls attribute is added. If the poster attribute is not defined, the video's first frame is shown on the screen before the playback. The following figure shows the video player before and during playback.

        Video player before playback Video player during playback

        35. @@ -140,12 +140,12 @@
        1. Create the video element and buttons used to control the play and pause: 
          -<div class="media">
-   <video id="video" src="media/video_sample.mp4"></video>
-   <div>
-      <button id="v-play" type="button">play</button>
-      <button id="v-pause" type="button" disabled >pause</button>
-   </div>
+<div class="media">
+   <video id="video" src="media/video_sample.mp4"></video>
+   <div>
+      <button id="v-play" type="button">play</button>
+      <button id="v-pause" type="button" disabled >pause</button>
+   </div>
 </div>

          The Pause button is disabled until the play event occurs.

          @@ -154,43 +154,43 @@ 
           <script>
-   var play_button = document.getElementById("v-play");
-   var pause_button = document.getElementById("v-pause");
-
-   play_button.addEventListener("click", function()
-      {
-         video.play(); /* Play movie */
-      }, false);
-
-   pause_button.addEventListener("click", function()
-      {
-         video.pause(); /* Pause movie */
-      }, false);
+   var play_button = document.getElementById("v-play");
+   var pause_button = document.getElementById("v-pause");
+
+   play_button.addEventListener("click", function()
+      {
+         video.play(); /* Play movie */
+      }, false);
+
+   pause_button.addEventListener("click", function()
+      {
+         video.pause(); /* Pause movie */
+      }, false);

        2. Apply event listeners to detect button events an react to them:

          -   var video = document.getElementById("video");
-
-   video.addEventListener("play", function()
-      {
-         play_button.disabled = true; /* Play button disabled */
-         pause_button.disabled = false; /* Pause button enabled */
-      }, false);
-
-   video.addEventListener("pause", function()
-      {
-         play_button.disabled = false; /* Play button enabled */
-         pause_button.disabled = true; /* Pause button disabled */
-      }, false);
-
-   video.addEventListener("ended", function()
-      {
-         play_button.disabled = false; /* Play button enabled */
-         pause_button.disabled = true; /* Pause button disabled */
-      }, false);
+   var video = document.getElementById("video");
+
+   video.addEventListener("play", function()
+      {
+         play_button.disabled = true; /* Play button disabled */
+         pause_button.disabled = false; /* Pause button enabled */
+      }, false);
+
+   video.addEventListener("pause", function()
+      {
+         play_button.disabled = false; /* Play button enabled */
+         pause_button.disabled = true; /* Pause button disabled */
+      }, false);
+
+   video.addEventListener("ended", function()
+      {
+         play_button.disabled = false; /* Play button enabled */
+         pause_button.disabled = true; /* Pause button disabled */
+      }, false);
 </script>
          @@ -217,11 +217,11 @@

          1. Create the video element and the elements to display the total duration and playing time of the file:

            -<div class="media">
-   <h1>Play Time Example</h1>
-   <video id="video" src="media/video_sample.mp4" controls preload="auto"></video>
-   <div class="log">Current Play Time: <span id="currentTime"></span></div>
-   <div class="log">Total Play Time: <span id="totalTime"></span></div>
+<div class="media">
+   <h1>Play Time Example</h1>
+   <video id="video" src="media/video_sample.mp4" controls preload="auto"></video>
+   <div class="log">Current Play Time: <span id="currentTime"></span></div>
+   <div class="log">Total Play Time: <span id="totalTime"></span></div>
 </div>
            2. @@ -230,39 +230,39 @@ 
             <script>
-   var video = document.getElementById("video");
-   var currentTime = document.getElementById("currentTime");
-   var totalTime = document.getElementById("totalTime");
-
-   /* Indicate the total duration */
-   video.addEventListener("loadedmetadata", function()
-      {
-         /* Total video duration */
-            var totalSec = video.duration;
-
-         /* Import method to change seconds to time (HH:MM:SS) format */
-         var time = secondsToTime(totalSec);
-
-         /* Display the calculated time on screen */
-         totalTime.innerHTML = parseInt(totalSec)
-            + "sec (" + time.h + ":" + time.m + ":" + time.s + ")";
-      }, false);
+   var video = document.getElementById("video");
+   var currentTime = document.getElementById("currentTime");
+   var totalTime = document.getElementById("totalTime");
+
+   /* Indicate the total duration */
+   video.addEventListener("loadedmetadata", function()
+      {
+         /* Total video duration */
+            var totalSec = video.duration;
+
+         /* Import method to change seconds to time (HH:MM:SS) format */
+         var time = secondsToTime(totalSec);
+
+         /* Display the calculated time on screen */
+         totalTime.innerHTML = parseInt(totalSec)
+            + "sec (" + time.h + ":" + time.m + ":" + time.s + ")";
+      }, false);

          2. Apply the timeupdate media event to the video object to get the playing time:

            -   /* Indicate play time status */
-   video.addEventListener("timeupdate", function()
-      {
-         /* Current play time */
-         var currSec = video.currentTime;
-         var c_time = secondsToTime(currSec
-
-         /* Display the current play time */
-         currentTime.innerHTML = parseInt(currSec)
-            + "sec (" + c_time.h + ":" + c_time.m + ":" + c_time.s + ")";
-      }, false);
+   /* Indicate play time status */
+   video.addEventListener("timeupdate", function()
+      {
+         /* Current play time */
+         var currSec = video.currentTime;
+         var c_time = secondsToTime(currSec
+
+         /* Display the current play time */
+         currentTime.innerHTML = parseInt(currSec)
+            + "sec (" + c_time.h + ":" + c_time.m + ":" + c_time.s + ")";
+      }, false);
 </script>
            3. @@ -270,33 +270,33 @@ 
             <script>
-   /* Change seconds to time (HH:MM:SS) format */
-   function secondsToTime(secs)
-   {
-      var hours = Math.floor(secs / (60 * 60));
-
-      var divisor_for_minutes = secs % (60 * 60);
-      var minutes = Math.floor(divisor_for_minutes / 60);
-
-      var divisor_for_seconds = divisor_for_minutes % 60;
-      var seconds = Math.ceil(divisor_for_seconds);
-
-      /* Set as JSON object */
-      var obj =
-      {
-         "h": intToString(hours),
-         "m": intToString(minutes),
-         "s": intToString(seconds)
-      };
-
-      return obj;
-   }
-
-   /* Ensure that each time is set in 2 characters according to the time format */
-   function intToString(time)
-   {
-      return (parseInt(time) < 10 ? ("0" + time) : time);
-   }
+   /* Change seconds to time (HH:MM:SS) format */
+   function secondsToTime(secs)
+   {
+      var hours = Math.floor(secs / (60 * 60));
+
+      var divisor_for_minutes = secs % (60 * 60);
+      var minutes = Math.floor(divisor_for_minutes / 60);
+
+      var divisor_for_seconds = divisor_for_minutes % 60;
+      var seconds = Math.ceil(divisor_for_seconds);
+
+      /* Set as JSON object */
+      var obj =
+      {
+         "h": intToString(hours),
+         "m": intToString(minutes),
+         "s": intToString(seconds)
+      };
+
+      return obj;
+   }
+
+   /* Ensure that each time is set in 2 characters according to the time format */
+   function intToString(time)
+   {
+      return (parseInt(time) < 10 ? ("0" + time) : time);
+   }
 </script>

            Figure: Displaying the duration and play time (in mobile applications only)

            @@ -319,13 +319,13 @@

            Create the video element and buttons used to control the timeline:

            -<div class="media">
-   <video id="video" src="media/video_sample.mp4" controls ></video>
-   <div>
-      <button id="v-back">5 Sec Backward</button>
-      <button id="v-forw">5 Sec Forward</button>
-   </div>
-   <div><button id="v-goto">Go to 40 Sec</button></div>
+<div class="media">
+   <video id="video" src="media/video_sample.mp4" controls ></video>
+   <div>
+      <button id="v-back">5 Sec Backward</button>
+      <button id="v-forw">5 Sec Forward</button>
+   </div>
+   <div><button id="v-goto">Go to 40 Sec</button></div>
 </div>
            @@ -333,28 +333,28 @@ 
             <script>
-   var video = document.getElementById("video"); /* Video object */
-   var back_button = document.getElementById("v-back"); /* Back button */
-   var forw_button = document.getElementById("v-forw"); /* Forward button */
-   var go_button = document.getElementById("v-goto"); /* Jump button */
-
-   /* Move 5 seconds back */
-   back_button.addEventListener("click", function()
-      {
-         video.currentTime -= 5;
-      }, false);
-
-   /* Move 5 seconds forward */
-   forw_button.addEventListener("click", function()
-      {
-         video.currentTime += 5;
-      }, false);
-
-   /* Move timeline to 40 seconds */
-   go_button.addEventListener("click", function()
-      {
-         video.currentTime = 40;
-      }, false);
+   var video = document.getElementById("video"); /* Video object */
+   var back_button = document.getElementById("v-back"); /* Back button */
+   var forw_button = document.getElementById("v-forw"); /* Forward button */
+   var go_button = document.getElementById("v-goto"); /* Jump button */
+
+   /* Move 5 seconds back */
+   back_button.addEventListener("click", function()
+      {
+         video.currentTime -= 5;
+      }, false);
+
+   /* Move 5 seconds forward */
+   forw_button.addEventListener("click", function()
+      {
+         video.currentTime += 5;
+      }, false);
+
+   /* Move timeline to 40 seconds */
+   go_button.addEventListener("click", function()
+      {
+         video.currentTime = 40;
+      }, false);
 </script>

            If the metadata of the media file is loaded, you can move to the assigned timeline position even when the media file is not playing. For more information, see Retrieving Media Information.

            @@ -378,10 +378,10 @@

          3. Create the video element and the elements to display the download progress status of the media file:

            -<div class="media">
-   <video id="video" src="media/video_sample.mp4" controls
-          poster="media/poster_sample.png"></video>
-   <div>Progress: <span id="state"></span></div>
+<div class="media">
+   <video id="video" src="media/video_sample.mp4" controls
+          poster="media/poster_sample.png"></video>
+   <div>Progress: <span id="state"></span></div>
 </div>

            While the download is in progress, the poster1.png image is shown.

            @@ -391,27 +391,27 @@ 
             <script>
-   var video = document.getElementById("video")
+   var video = document.getElementById("video")
 
-   /* Progress event */
-   video.addEventListener("progress", function()
-      {
-         /* Returns a TimeRanges object */
-         var buffered = video.buffered;
+   /* Progress event */
+   video.addEventListener("progress", function()
+      {
+         /* Returns a TimeRanges object */
+         var buffered = video.buffered;
 
-         /* Returns time in seconds */
-         var buffered_end = buffered.end();
+         /* Returns time in seconds */
+         var buffered_end = buffered.end();

          4. Use the progress media event to convert the end time to percent form, and display the progress state:

            -         /* Change to progress rate percent */
-         var progress = (buffered_end / video.duration) * 100;
+         /* Change to progress rate percent */
+         var progress = (buffered_end / video.duration) * 100;
 
-         /* Display the progress state */
-         document.getElementById("state").innerHTML = parseInt(progress) + "%";
-      }, false);
+         /* Display the progress state */
+         document.getElementById("state").innerHTML = parseInt(progress) + "%";
+      }, false);
 </script>

            Figure: Displaying the progress state (in mobile applications only)

            @@ -438,11 +438,11 @@

          5. Create the video element and buttons used to control the screen size:

            -<video id="video" src="media/video_sample.mp4" controls ></video>
+<video id="video" src="media/video_sample.mp4" controls ></video>
 <div>
-   <button id="size_big">600 * 410</button>
-   <button id="size_middle">320 * 220</button>
-   <button id="size_small">150 * 150</button>
+   <button id="size_big">600 * 410</button>
+   <button id="size_middle">320 * 220</button>
+   <button id="size_small">150 * 150</button>
 </div>
            6. @@ -451,28 +451,28 @@ 
             <script>
-   var video = document.getElementById("video")
-
-   /* Resize to big size */
-   document.getElementById("size_big").addEventListener("click", function()
-      {
-         video.width = 600;
-         video.height = 410;
-      }, false);
-
-   /* Resize to middle size */
-   document.getElementById("size_middle").addEventListener("click", function()
-      {
-         video.width = 320;
-         video.height = 220;
-      }, false);
-
-   /* Resize to small size */
-   document.getElementById("size_small").addEventListener("click", function()
-      {
-         video.width = 150;
-         video.height = 150;
-      }, false);
+   var video = document.getElementById("video")
+
+   /* Resize to big size */
+   document.getElementById("size_big").addEventListener("click", function()
+      {
+         video.width = 600;
+         video.height = 410;
+      }, false);
+
+   /* Resize to middle size */
+   document.getElementById("size_middle").addEventListener("click", function()
+      {
+         video.width = 320;
+         video.height = 220;
+      }, false);
+
+   /* Resize to small size */
+   document.getElementById("size_small").addEventListener("click", function()
+      {
+         video.width = 150;
+         video.height = 150;
+      }, false);
 </script>

            Figure: Resizing the video screen (in mobile applications only)

            @@ -500,29 +500,29 @@

            1. Create the video element and determine the media files you want to check:

              -<div class="media">
-   <video id="video1" src="media/video_sample_001.ogv" controls ></video>
-   <div class="log">video/ogg can play type: <span id="vlog1"></span></div>
+<div class="media">
+   <video id="video1" src="media/video_sample_001.ogv" controls ></video>
+   <div class="log">video/ogg can play type: <span id="vlog1"></span></div>
 </div>
 
-<div class="media">
-   <video id="video2" src="media/video_sample_002.webm" controls ></video>
-   <div class="log">audio/acc can play type: <span id="vlog2"></span></div>
+<div class="media">
+   <video id="video2" src="media/video_sample_002.webm" controls ></video>
+   <div class="log">audio/acc can play type: <span id="vlog2"></span></div>
 </div>

            2. Use the canPlayType() method to check, whether the selected media files have an acceptable MIME type, and can be played:

               <script>
-   var video1 = document.getElementById("video1");
-   var video2 = document.getElementById("video2");
-   var videoElem03 = document.getElementById("video3");
+   var video1 = document.getElementById("video1");
+   var video2 = document.getElementById("video2");
+   var videoElem03 = document.getElementById("video3");
 
-   /* Check the ogg format */
-   document.getElementById("vlog1").innerHTML = video1.canPlayType('video/ogg');
+   /* Check the ogg format */
+   document.getElementById("vlog1").innerHTML = video1.canPlayType('video/ogg');
 
-   /* Check the webm format */
-   document.getElementById("vlog2").innerHTML = video2.canPlayType('audio/acc');
+   /* Check the webm format */
+   document.getElementById("vlog2").innerHTML = video2.canPlayType('audio/acc');
 </script>
              3. @@ -541,44 +541,44 @@

              1. Create the video and button elements, which can induce errors:

                -<div class="media">
-   <video id="video" src="media/video_sample.mp4" controls ></video>
-   <div>
-      <button id="btn01">src Null</button>
-   </div>
+<div class="media">
+   <video id="video" src="media/video_sample.mp4" controls ></video>
+   <div>
+      <button id="btn01">src Null</button>
+   </div>
 </div>

              2. Add an event listener to detect errors and trigger error messages:

                 <script>
-   var video = document.getElementById("video")
-
-   /* Button event: induce error */
-   document.getElementById("btn01").addEventListener("click", function()
-      {
-         video.src = ""; /* Set value as null value */
-      }, false);
-
-   video.addEventListener("error", function()
-      {
-         /* Video playback failed: show a message saying why */
-         switch (video.error.code)
-         {
-            case 1:
-               alert("MEDIA_ERR_ABORTED = 1 Media data download is stopped by the user");
-               break;
-            case 2:
-               alert("MEDIA_ERR_NETWORK = 2 Download is stopped due to network error ");
-               break;
-            case 3:
-               alert("MEDIA_ERR_DECODE = 3 Media data decoding failure ");
-               break;
-            case 4:
-               alert("MEDIA_ERR_SRC_NOT_SUPPORTED = 4 Format not supported");
-               break
-         }
-      }, false);
+   var video = document.getElementById("video")
+
+   /* Button event: induce error */
+   document.getElementById("btn01").addEventListener("click", function()
+      {
+         video.src = ""; /* Set value as null value */
+      }, false);
+
+   video.addEventListener("error", function()
+      {
+         /* Video playback failed: show a message saying why */
+         switch (video.error.code)
+         {
+            case 1:
+               alert("MEDIA_ERR_ABORTED = 1 Media data download is stopped by the user");
+               break;
+            case 2:
+               alert("MEDIA_ERR_NETWORK = 2 Download is stopped due to network error ");
+               break;
+            case 3:
+               alert("MEDIA_ERR_DECODE = 3 Media data decoding failure ");
+               break;
+            case 4:
+               alert("MEDIA_ERR_SRC_NOT_SUPPORTED = 4 Format not supported");
+               break
+         }
+      }, false);
 </script>
                3. diff --git a/org.tizen.guides/html/web/w3c/media/webaudio_w.htm b/org.tizen.guides/html/web/w3c/media/webaudio_w.htm index 44ca138..7af99fb 100644 --- a/org.tizen.guides/html/web/w3c/media/webaudio_w.htm +++ b/org.tizen.guides/html/web/w3c/media/webaudio_w.htm @@ -69,12 +69,12 @@

              3. Load a source audio file using XMLHttpRequest. Set the responseType to arraybuffer to receive binary response:

                 <script>
-   var url = "sample.mp3";
-   var request = new XMLHttpRequest();
-   request.open("GET", url, true);
-   request.responseType = "arraybuffer";
+   var url = "sample.mp3";
+   var request = new XMLHttpRequest();
+   request.open("GET", url, true);
+   request.responseType = "arraybuffer";
 
-   request.send();
+   request.send();
 </script>
                4. @@ -82,12 +82,12 @@

              4. The onload event is triggered. Retrieve the decoded audio data:

                 <script>
-   /* Asynchronous event handling */
-   request.onload = function()
-   {
-      /* Put the modulated audio data into the audioData variable */
-      var audioData = request.response;
-   };
+   /* Asynchronous event handling */
+   request.onload = function()
+   {
+      /* Put the modulated audio data into the audioData variable */
+      var audioData = request.response;
+   };
 </script>

                This data is used in the AudioBuffer.

                @@ -98,8 +98,8 @@

                Create a WebKit-based AudioContext instance, which plays and manages the audio data:

                 <script>
-   var context;
-   context = new webkitAudioContext();
+   var context;
+   context = new webkitAudioContext();
 </script>

                AudioContext instance supports various sound inputs, and it is possible to create an audio graph. You can create 1 or more sound sources to manage sound and connect to the sound destination.

                @@ -112,24 +112,24 @@

              5. Create the audio buffer using the createBuffer() method:

                 <script>
-   var context = new webkitAudioContext();
-   function setSound()
-   {
-      var url = "sample_audio.mp3";
-      var request = new XMLHttpRequest();
-      request.open("GET", url, true);
-      request.responseType = "arraybuffer";
-
-      /* Asynchronous callback */
-      request.onload = function()
-      {
-         /* Create the sound source */
-         soundSource = context.createBufferSource();
-         soundBuffer = context.createBuffer(request.response, true);
-         soundSource.buffer = soundBuffer;
-      };
-      request.send();
-   }
+   var context = new webkitAudioContext();
+   function setSound()
+   {
+      var url = "sample_audio.mp3";
+      var request = new XMLHttpRequest();
+      request.open("GET", url, true);
+      request.responseType = "arraybuffer";
+
+      /* Asynchronous callback */
+      request.onload = function()
+      {
+         /* Create the sound source */
+         soundSource = context.createBufferSource();
+         soundBuffer = context.createBuffer(request.response, true);
+         soundSource.buffer = soundBuffer;
+      };
+      request.send();
+   }
 </script>

                The createBuffer() method is used as a synchronous decoding method to create an audio buffer of the required size.

                @@ -138,32 +138,32 @@

              6. Create the audio buffer using the decodeAudioData() method:

                 <script>
-   var context = new webkitAudioContext();
-   function setSound()
-   {
-      var url = "sample_audio.mp3";
-      var request = new XMLHttpRequest();
-      request.open("GET", url, true);
-      request.responseType = "arraybuffer";
-
-      /* Asynchronous callback */
-      request.onload = function()
-      {
-         /* Create the sound source */
-         soundSource = context.createBufferSource();
-
-         /*
-            Import a callback that provides PCM audio data
-            decoded as an audio buffer
-         */
-         context.decodeAudioData(request.response, function(buffer)
-            {
-               bufferData = buffer;
-               soundSource.buffer = bufferData;
-            }, this.onDecodeError);
-      };
-      request.send();
-   }
+   var context = new webkitAudioContext();
+   function setSound()
+   {
+      var url = "sample_audio.mp3";
+      var request = new XMLHttpRequest();
+      request.open("GET", url, true);
+      request.responseType = "arraybuffer";
+
+      /* Asynchronous callback */
+      request.onload = function()
+      {
+         /* Create the sound source */
+         soundSource = context.createBufferSource();
+
+         /*
+            Import a callback that provides PCM audio data
+            decoded as an audio buffer
+         */
+         context.decodeAudioData(request.response, function(buffer)
+            {
+               bufferData = buffer;
+               soundSource.buffer = bufferData;
+            }, this.onDecodeError);
+      };
+      request.send();
+   }
 </script>

                The decodeAudioData() method asynchronously decodes audio data from the XMLHttpRequest array buffer. Since this method does not prevent the execution of JavaScript threads, consider using it instead of the createBuffer() method.

                @@ -189,23 +189,23 @@

              7. Create a WebKit-based AudioContext instance:

                 <script>
-   var context;
-   context = new webkitAudioContext();
+   var context;
+   context = new webkitAudioContext();

              8. Route a single audio source directly to the output:

                -   var soundSource;
+   var soundSource;
 
-   function startSound(audioData)
-   {
-      soundSource = context.createBufferSource();
-      soundSource.buffer = soundBuffer;
+   function startSound(audioData)
+   {
+      soundSource = context.createBufferSource();
+      soundSource.buffer = soundBuffer;
 
-      /* Direct routing to speaker */
-      soundSource.connect(volumeNode);
-      volumeNode.connect(context.destination);
-   }
+      /* Direct routing to speaker */
+      soundSource.connect(volumeNode);
+      volumeNode.connect(context.destination);
+   }
 </script>

                All routing occurs within an AudioContext containing a single AudioDestinationNode.

                @@ -220,31 +220,31 @@

              9. Create an AudioContext instance:

                 <script>
-   var context;
-   context = new webkitAudioContext();
+   var context;
+   context = new webkitAudioContext();

              10. Create the sound source:

                -   function startSound(audioData)
-   {
-      soundSource = context.createBufferSource();
-      soundBuffer = context.createBuffer(audioData, true);
-      soundSource.buffer = soundBuffer;
+   function startSound(audioData)
+   {
+      soundSource = context.createBufferSource();
+      soundBuffer = context.createBuffer(audioData, true);
+      soundSource.buffer = soundBuffer;
 
-      volumeNode = context.createGainNode();
-      filter = context.createBiquadFilter();
-      audioAnalyser = context.createAnalyser();
+      volumeNode = context.createGainNode();
+      filter = context.createBiquadFilter();
+      audioAnalyser = context.createAnalyser();

              11. Create the node to manage the output, for example, adjusting volume and applying filters:

                -      soundSource.connect(volumeNode);
-      volumeNode.connect(filter);
-      filter.connect(audioAnalyser);
-      audioAnalyser.connect(context.destination);
-   }
+      soundSource.connect(volumeNode);
+      volumeNode.connect(filter);
+      filter.connect(audioAnalyser);
+      audioAnalyser.connect(context.destination);
+   }
 </script>
                @@ -270,24 +270,24 @@

              12. Create a WebKit-based AudioContext instance:

                 <script>
-   var context;
-   context = new webkitAudioContext();
+   var context;
+   context = new webkitAudioContext();

              13. Play audio through direct sound destination using the noteOn() method:

                -   function playSound()
-   {
-      var soundSource = context.createBufferSource();
-      soundSource.buffer = soundBuffer;
-      soundSource.connect(context.destination);
-      soundSource.noteOn(context.currentTime);
-   }
+   function playSound()
+   {
+      var soundSource = context.createBufferSource();
+      soundSource.buffer = soundBuffer;
+      soundSource.connect(context.destination);
+      soundSource.noteOn(context.currentTime);
+   }
 </script>
                -

                Use time as parameter of the noteOn() method. Time is based on the currentTime property of the AudioContext, and expressed in seconds. If you set the value as '0', the playback begins immediately.

                +

                Use time as parameter of the noteOn() method. Time is based on the currentTime property of the AudioContext, and expressed in seconds. If you set the value as '0', the playback begins immediately.

                -

                You can also use time as parameter of the noteOff() method. If you set the value as '0', the playback stops immediately.

                +

                You can also use time as parameter of the noteOff() method. If you set the value as '0', the playback stops immediately.

              diff --git a/org.tizen.guides/html/web/w3c/perf_opt/jquery_performance_improvement_w.htm b/org.tizen.guides/html/web/w3c/perf_opt/jquery_performance_improvement_w.htm index 9ad269b..7841efe 100644 --- a/org.tizen.guides/html/web/w3c/perf_opt/jquery_performance_improvement_w.htm +++ b/org.tizen.guides/html/web/w3c/perf_opt/jquery_performance_improvement_w.htm @@ -49,70 +49,70 @@

              The following example HTML code has been used as a basis when describing the techniques:

              -<div id="contents">
-   <h3>Selector Test</h3>
-   <ul id="contents_list">
-      <li>List 1</li>
-      <li>List 2</li>
-      <li>List 3</li>
-   </ul>
-   <button id="search_dom" class="blue">Search DOM</button>
+<div id="contents">
+   <h3>Selector Test</h3>
+   <ul id="contents_list">
+      <li>List 1</li>
+      <li>List 2</li>
+      <li>List 3</li>
+   </ul>
+   <button id="search_dom" class="blue">Search DOM</button>
 </div>
-<div id="contents1">
-   <h3>Selector Test</h3>
-   <ul id="contents_list1">
-      <li>List 1</li>
-      <li>List 2</li>
-      <li>List 3</li>
-   </ul>
-   <button id="search_dom1" class="blue">Search DOM</button>
+<div id="contents1">
+   <h3>Selector Test</h3>
+   <ul id="contents_list1">
+      <li>List 1</li>
+      <li>List 2</li>
+      <li>List 3</li>
+   </ul>
+   <button id="search_dom1" class="blue">Search DOM</button>
 </div>
-<div id="contents2">
-   <h3>Selector Test</h3>
-   <ul id="contents_list2">
-      <li>List 1</li>
-      <li>List 2</li>
-      <li>List 3</li>
-   </ul>
-   <button id="search_dom2" class="blue">Search DOM</button>
+<div id="contents2">
+   <h3>Selector Test</h3>
+   <ul id="contents_list2">
+      <li>List 1</li>
+      <li>List 2</li>
+      <li>List 3</li>
+   </ul>
+   <button id="search_dom2" class="blue">Search DOM</button>
 </div>
-<div id="contents3">
-   <h3>Selector Test</h3>
-   <ul id="contents_list3">
-      <li>List 1</li>
-      <li>List 2</li>
-      <li>List 3</li>
-   </ul>
-   <button id="search_dom3" class="blue">Search DOM</button>
+<div id="contents3">
+   <h3>Selector Test</h3>
+   <ul id="contents_list3">
+      <li>List 1</li>
+      <li>List 2</li>
+      <li>List 3</li>
+   </ul>
+   <button id="search_dom3" class="blue">Search DOM</button>
 </div>
-<div id="contents4">
-   <h3>Selector Test</h3>
-   <ul id="contents_list4">
-      <li>List 1</li>
-      <li>List 2</li>
-      <li>List 3</li>
-   </ul>
-   <button id="search_dom4" class="blue">Search DOM</button>
+<div id="contents4">
+   <h3>Selector Test</h3>
+   <ul id="contents_list4">
+      <li>List 1</li>
+      <li>List 2</li>
+      <li>List 3</li>
+   </ul>
+   <button id="search_dom4" class="blue">Search DOM</button>
 </div>
-<div id="contents5">
-   <h3>Selector Test</h3>
-   <ul id="contents_list5">
-      <li>List 1</li>
-      <li>List 2</li>
-      <li>List 3</li>
-   </ul>
-   <button id="search_dom5" class="blue">Search DOM</button>
+<div id="contents5">
+   <h3>Selector Test</h3>
+   <ul id="contents_list5">
+      <li>List 1</li>
+      <li>List 2</li>
+      <li>List 3</li>
+   </ul>
+   <button id="search_dom5" class="blue">Search DOM</button>
 </div>

              Using Selectors

              When navigating a specific element, use an ID selector prior to other selectors, such as tags and classes. The following example shows how using an ID selector improves performance.

               /* Code#1 */
-var search_button = $('button');
+var search_button = $('button');
 
               /* Code#2 */
-var search_button = $('#contents button');
+var search_button = $('#contents button');

              Figure: jQuery performance improvement result (in mobile applications only)

              jQuery performance improvement result (in mobile applications only)

              @@ -135,15 +135,15 @@ var search_button = $('#contents button');

              When using a class selector, apply a tag preceded by the class name. The following example shows how using a tag improves performance.

               /* Code#1 */
-var search_button = $('.blue');
+var search_button = $('.blue');
 
               /* Code#2 */
-var search_button = $('button.blue');
+var search_button = $('button.blue');
 
               /* Code#3 */
-var search_button = $('#contents button.blue');
+var search_button = $('#contents button.blue');

              Figure: jQuery performance improvement result (in mobile applications only)

              jQuery performance improvement result (in mobile applications only)

              @@ -171,16 +171,16 @@ var search_button = $('#contents button.blue');

              The following example shows how using a cache improves performance.

               /* Code#1 */
-$("#search_dom").on('click', function() {});
-$("#search_dom").removeClass('blue');
-$("#search_dom").addClass('red');
+$("#search_dom").on('click', function() {});
+$("#search_dom").removeClass('blue');
+$("#search_dom").addClass('red');
 
               /* Code#2 */
-var $search_button = $("#search_dom");
-$search_button.on('click', function() {});
-$search_button.removeClass('blue');
-$search_button.addClass('red');
+var $search_button = $("#search_dom");
+$search_button.on('click', function() {});
+$search_button.removeClass('blue');
+$search_button.addClass('red');

              Figure: jQuery performance improvement result (in mobile applications only)

              jQuery performance improvement result (in mobile applications only)

              @@ -205,13 +205,13 @@ $search_button.addClass('red');

              When a DOM element is changed, chaining ties similar object references into groups for execution. jQuery objects need not be repeatedly created as existing ones can be reused. The following example shows how chaining improves performance.

               /* Code#1 */
-$("#contents").addClass('active');
-$("#contents").css('border', '1px solid');
-$("#contents").('background-color', 'red');
+$("#contents").addClass('active');
+$("#contents").css('border', '1px solid');
+$("#contents").('background-color', 'red');
 
               /* Code#2 */
-$("#contents").addClass('active').css('border', '1px solid').('background-color', 'red');
+$("#contents").addClass('active').css('border', '1px solid').('background-color', 'red');

              Figure: jQuery performance improvement result (in mobile applications only)

              jQuery performance improvement result (in mobile applications only)

              @@ -236,23 +236,23 @@ $("#contents").addClass('active').css('border', '1

              The following example shows how applying DOM control improves performance.

               /* Code#1 */
-var $contents_list = $('#contents_list'),
-    array_list = [...];
+var $contents_list = $('#contents_list'),
+    array_list = [...];
 
 for (var i = 0, len = array_list.length; i < len; i++)
 {
-   $contents_list.append('<li>' + array_list[i] + '</li>');
+   $contents_list.append('<li>' + array_list[i] + '</li>');
 }
 
               /* Code#2 */
-var $contents_list = $('#contents_list'),
-    array_list = [...],
-    list = '';
+var $contents_list = $('#contents_list'),
+    array_list = [...],
+    list = '';
 
 for (var i = 0, len = array_list.length; i < len; i++)
 {
-   list += '<li>' + array_list[i] + '</li>';
+   list += '<li>' + array_list[i] + '</li>';
 }
 $contents_list.append(list);
              diff --git a/org.tizen.guides/html/web/w3c/perf_opt/js_performance_improvement_w.htm b/org.tizen.guides/html/web/w3c/perf_opt/js_performance_improvement_w.htm index cb7b09e..a416804 100644 --- a/org.tizen.guides/html/web/w3c/perf_opt/js_performance_improvement_w.htm +++ b/org.tizen.guides/html/web/w3c/perf_opt/js_performance_improvement_w.htm @@ -54,22 +54,22 @@ 
               /* Code#1 */
 var array_list = [0,1,2,3,4,5,6,7,8,9],
-    new_array_list = [];
+    new_array_list = [];
 
 for (var i = 0, len = array_list.length; i < len; i++)
 {
-   new_array_list.push(array_list[i]);
-   console.log(array_list[i]);
+   new_array_list.push(array_list[i]);
+   console.log(array_list[i]);
 }
 
               /* Code#2 */
 var array_list = [0,1,2,3,4,5,6,7,8,9],
-    new_array_list = [];
+    new_array_list = [];
 
 for (var i = 0, len = array_list.length; i < len; i++)
 {
-   new_array_list.push(array_list[i])
+   new_array_list.push(array_list[i])
 }

              Figure: JavaScript performance improvement result (in mobile applications only)

              @@ -95,20 +95,20 @@ for (var i = 0, len = array_list.length; i < len; i++) 
               /* Code#1 */
 var array_list = [0,1,2,3,4,5,6,7,8,9],
-    new_array_list = [];
+    new_array_list = [];
 for (var idx in array_list)
 {
-   new_array_list.push(array_list[idx]);
+   new_array_list.push(array_list[idx]);
 }
 
               /* Code#2 */
 var array_list = [0,1,2,3,4,5,6,7,8,9],
-    new_array_list = [];
+    new_array_list = [];
 for (var i = 0, len = array_list.length; i < len; i++)
 {
-   new_array_list.push(array_list[i]);
+   new_array_list.push(array_list[i]);
 }

              Figure: JavaScript performance improvement result (in mobile applications only)

              @@ -139,30 +139,30 @@ for (var i = 0, len = array_list.length; i < len; i++) 
               /* Code#1 */
 var array_list = [],
-    new_array_list = [],
-    i = 0;
+    new_array_list = [],
+    i = 0;
 for (i = 0; i < 100; i++)
 {
-   array_list.push(i);
+   array_list.push(i);
 }
 for (i = 0; i < array_list.length; i++)
 {
-   new_array_list.push(array_list[i]);
+   new_array_list.push(array_list[i]);
 }
 
               /* Code#2 */
 var array_list = [],
-    new_array_list = [],
-    i = 0,
-    arrayLen = 0;
+    new_array_list = [],
+    i = 0,
+    arrayLen = 0;
 for (i = 0; i < 100; i++)
 {
-   array_list.push(i);
+   array_list.push(i);
 }
 for (i = 0, arrayLen = array_list.length; i < arrayLen; i++)
 {
-   new_array_list.push(array_list[i]);
+   new_array_list.push(array_list[i]);
 }

              Figure: JavaScript performance improvement result (in mobile applications only)

              @@ -187,18 +187,18 @@ for (i = 0, arrayLen = array_list.length; i < arrayLen; i++)

              Using literal expressions instead of newly created ones improves the JavaScript performance. Literal expressions are optimized for modern browser engines. They reduce the amount of interpretation time of the JavaScript interpreter. The following example shows how using literal expressions improves performance.

               /* Code#1 */
-var str = "";
+var str = "";
 for (var i = 0; i < 100; i++)
 {
-   str = new String("abcd");
+   str = new String("abcd");
 }
 
               /* Code#2 */
-var str = "";
+var str = "";
 for (var i = 0; i < 100; i++)
 {
-   str = "abcd";
+   str = "abcd";
 }
              @@ -226,27 +226,27 @@ for (var i = 0; i < 100; i++)

              The following example shows how applying DOM control improves performance.

               /* Code#1 */
-var id = document.getElementById('contents_list').getAttribute('id');
-var name = document.getElementById('contents_list').getAttribute('name');
-var style = document.getElementById('contents_list').getAttribute('style');
+var id = document.getElementById('contents_list').getAttribute('id');
+var name = document.getElementById('contents_list').getAttribute('name');
+var style = document.getElementById('contents_list').getAttribute('style');
 for (var i = 0; i < 100; i++)
 {
-   id = document.getElementById('contents_list').getAttribute('id');
-   name = document.getElementById('contents_list').getAttribute('name');
-   style = document.getElementById('contents_list').getAttribute('style');
+   id = document.getElementById('contents_list').getAttribute('id');
+   name = document.getElementById('contents_list').getAttribute('name');
+   style = document.getElementById('contents_list').getAttribute('style');
 }
 
               /* Code#2 */
-var contents_list = document.getElementById('contents_list');
-var id = contents_list.getAttribute('id');
-var name = contents_list.getAttribute('name');
-var style = contents_list.getAttribute('style');
+var contents_list = document.getElementById('contents_list');
+var id = contents_list.getAttribute('id');
+var name = contents_list.getAttribute('name');
+var style = contents_list.getAttribute('style');
 for (var i = 0; i < 100; i++)
 {
-   id = contents_list.getAttribute('id');
-   name = contents_list.getAttribute('name');
-   style = contents_list.getAttribute('style');
+   id = contents_list.getAttribute('id');
+   name = contents_list.getAttribute('name');
+   style = contents_list.getAttribute('style');
 }

              Figure: JavaScript performance improvement result (in mobile applications only)

              diff --git a/org.tizen.guides/html/web/w3c/perf_opt/page_w.htm b/org.tizen.guides/html/web/w3c/perf_opt/page_w.htm index 4736621..97ca3e3 100644 --- a/org.tizen.guides/html/web/w3c/perf_opt/page_w.htm +++ b/org.tizen.guides/html/web/w3c/perf_opt/page_w.htm @@ -71,21 +71,21 @@

            3. Retrieve the page visibility status with the hidden property: 

               <script>
-   var logText = document.querySelector('.log');
+   var logText = document.querySelector('.log');
 
-   function pageVisibilityHandler()
-   {
-      logText.innerHTML +=
-         '<p>Hidden: <span>' + document.webkitHidden; + '</span></p>';
+   function pageVisibilityHandler()
+   {
+      logText.innerHTML +=
+         '<p>Hidden: <span>' + document.webkitHidden; + '</span></p>';
              -

              The hidden property returns true if the document in the top-level browsing context (root window in the browser's viewport) [HTML5] is not visible at all. If the document is at least partially visible, the property returns false.

              +

              The hidden property returns true if the document in the top-level browsing context (root window in the browser's viewport) [HTML5] is not visible at all. If the document is at least partially visible, the property returns false.

            4. Retrieve the page visibility status with the visibilityState property:

              -      logText.innerHTML +=
-         '<p>VisibilityState: <span>' + document.webkitVisibilityState;
-         + '</span></p>';
-   }
+      logText.innerHTML +=
+         '<p>VisibilityState: <span>' + document.webkitVisibilityState;
+         + '</span></p>';
+   }
 </script>

              The visibilityState property returns one of the following DOMString types:

              @@ -120,67 +120,67 @@

            5. Define the elements used to play video on the screen:

               <!--video control-->
-<div class="media">
-   <video id="video" src="video_sample.mp4" width="360" height="220"></video>
-   <div>
-      <!--video control buttons-->
-      <button id="v-play" type="button">play</button>
-      <button id="v-pause" type="button" disabled >pause</button>
-   </div>
+<div class="media">
+   <video id="video" src="video_sample.mp4" width="360" height="220"></video>
+   <div>
+      <!--video control buttons-->
+      <button id="v-play" type="button">play</button>
+      <button id="v-pause" type="button" disabled >pause</button>
+   </div>
 </div>

            6. Add event listeners to play and pause the video based on the button clicks:

               <script>
-   var play_button = document.getElementById("v-play");
-   var pause_button = document.getElementById("v-pause");
-   var video = document.getElementById("video");
-
-   play_button.addEventListener("click", function()
-      {
-         video.play(); /* Play video */
-      }, false);
-
-   pause_button.addEventListener("click", function()
-      {
-         video.pause(); /* Pause video */
-      }, false);
-
-   /* Enable and disable buttons based on the playback status */
-   video.addEventListener("play", function()
-      {
-         play_button.disabled = true; /* Disable play button */
-         pause_button.disabled = false; /* Enable pause button */
-      }, false);
-
-   video.addEventListener("pause", function()
-      {
-         play_button.disabled = false; /* Enable play button */
-         pause_button.disabled = true; /* Disable pause button */
-      }, false);
+   var play_button = document.getElementById("v-play");
+   var pause_button = document.getElementById("v-pause");
+   var video = document.getElementById("video");
+
+   play_button.addEventListener("click", function()
+      {
+         video.play(); /* Play video */
+      }, false);
+
+   pause_button.addEventListener("click", function()
+      {
+         video.pause(); /* Pause video */
+      }, false);
+
+   /* Enable and disable buttons based on the playback status */
+   video.addEventListener("play", function()
+      {
+         play_button.disabled = true; /* Disable play button */
+         pause_button.disabled = false; /* Enable pause button */
+      }, false);
+
+   video.addEventListener("pause", function()
+      {
+         play_button.disabled = false; /* Enable play button */
+         pause_button.disabled = true; /* Disable pause button */
+      }, false);
 </script>

            7. Add an event listener to track the page visibility status changes. When the status changes and the visibilityChange event is triggered, use the hidden property to check whether the page is hidden or visible, and to play or pause the video accordingly.

               <script>
-   /* Add visibility status event listener */
-   document.addEventListener("webkitvisibilitychange", pageVisibilityHandler, false);
-
-   /* When the visibility status changes */
-   function pageVisibilityHandler()
-   {
-      /* Check whether the page is hidden */
-      if (!(document.webkitHidden))
-      {
-         video.play(); /* Play video */
-      }
-      else
-      {
-         video.pause(); /* Pause video */
-      }
-   }
+   /* Add visibility status event listener */
+   document.addEventListener("webkitvisibilitychange", pageVisibilityHandler, false);
+
+   /* When the visibility status changes */
+   function pageVisibilityHandler()
+   {
+      /* Check whether the page is hidden */
+      if (!(document.webkitHidden))
+      {
+         video.play(); /* Play video */
+      }
+      else
+      {
+         video.pause(); /* Pause video */
+      }
+   }
 </script>
              8. diff --git a/org.tizen.guides/html/web/w3c/perf_opt/timing_control_w.htm b/org.tizen.guides/html/web/w3c/perf_opt/timing_control_w.htm index bdbf2b6..69a0856 100644 --- a/org.tizen.guides/html/web/w3c/perf_opt/timing_control_w.htm +++ b/org.tizen.guides/html/web/w3c/perf_opt/timing_control_w.htm @@ -51,14 +51,14 @@ In mobile applications, when using the emulator, you must include the webkit prefix in method names, such as window.performance.webkitNow(). However, when using a device, the prefix must not be used. In addition, when using the emulator, methods assigned to variables must be formatted as follows: 
               window.performance.windowNow =
-   window.performance.now || window.performance.webkitNow || Date.now;
+   window.performance.now || window.performance.webkitNow || Date.now;
 window.performance.windowNow();

              In wearable applications, when you are using the emulator and want to support backward compatibility, methods assigned to variables must be formatted as follows:

               window.performance.windowNow =
-   window.performance.now || window.performance.webkitNow || Date.now;
+   window.performance.now || window.performance.webkitNow || Date.now;
 window.performance.windowNow();
        @@ -73,14 +73,14 @@ window.performance.windowNow();

      35. Create the HTML layout, including a <nav> element with 3 buttons and <div> elements for the pinwheel image and text:

         <nav>
-   <a href="#" id="leftBtn" class="btn">Left</a>
-   <a href="#" id="playstopBtn" class="btn">Stop</a>
-   <a href="#" id="rightBtn" class="btn">Right</a>
+   <a href="#" id="leftBtn" class="btn">Left</a>
+   <a href="#" id="playstopBtn" class="btn">Stop</a>
+   <a href="#" id="rightBtn" class="btn">Right</a>
 </nav>
 
-<div id="pinwheel">
-   <div id="rotateBackground"></div>
-   TIZEN OS
+<div id="pinwheel">
+   <div id="rotateBackground"></div>
+   TIZEN OS
 </div>
        36. @@ -90,69 +90,69 @@ window.performance.windowNow(); 
         body
 {
-   display: -webkit-flex;
-   -webkit-flex-direction: column;
+   display: -webkit-flex;
+   -webkit-flex-direction: column;
 }
 
 nav
 {
-   display: -webkit-flex;
-   -webkit-flex-direction: row;
-   -webkit-align-content: stretch;
-   width: 100%;
+   display: -webkit-flex;
+   -webkit-flex-direction: row;
+   -webkit-align-content: stretch;
+   width: 100%;
 }

      36. To enable the rotation of the background, define the pinwheel element in relation to its children, and set its size to change according to the display size. Define the rotateBackground element to have a fixed size depending on the display size:

         #pinwheel
 {
-   width: 90vw;
-   height: 80vh;
-   position: relative;
-   overflow: hidden;
-   line-height: 80vh;
-   text-align: center;
+   width: 90vw;
+   height: 80vh;
+   position: relative;
+   overflow: hidden;
+   line-height: 80vh;
+   text-align: center;
 }
 
 #rotateBackground
 {
-   background: url(images/Tizen-Pinwheel-On-Dark-RGB.png) no-repeat center;
-   background-size: 90vw;
-   content: "";
-   position: absolute;
-   width: 90vw;
-   height: 90vh;
-   z-index: -1;
+   background: url(images/Tizen-Pinwheel-On-Dark-RGB.png) no-repeat center;
+   background-size: 90vw;
+   content: "";
+   position: absolute;
+   width: 90vw;
+   height: 90vh;
+   z-index: -1;
 }

      37. Declare the variables used in the application:

        -<script type="text/javascript">
-   var leftDiv, rightDiv, playstopDiv,
-       handlerRequest, rotateBackgroundDiv, rotation = 0, speed = -1;
+<script type="text/javascript">
+   var leftDiv, rightDiv, playstopDiv,
+       handlerRequest, rotateBackgroundDiv, rotation = 0, speed = -1;
 </script>

        The leftDiv, rightDiv, playstopDiv, and rotateBackgroundDiv variables contain DOM elements from the application UI. The handlerRequest variable handles the requestAnimationFrame() requests. The rotation variable is the current angle of the pinwheel, and the speed variable is the rotation speed in degrees per frame.

      38. Create a DOM object for the Play or Stop button and define button events:

        -playstopDiv = document.getElementById("playstopBtn");
+playstopDiv = document.getElementById("playstopBtn");
 
 playstopDiv.onclick = function()
 {
-   if (handlerRequest)
-   {
-      window.webkitCancelRequestAnimationFrame(handlerRequest);
-      handlerRequest = 0;
-      playstopDiv.innerHTML = "Play";
-   }
-   else
-   {
-      handlerRequest = window.webkitRequestAnimationFrame(nextFrame);
-      playstopDiv.innerHTML = "Stop";
-   }
+   if (handlerRequest)
+   {
+      window.webkitCancelRequestAnimationFrame(handlerRequest);
+      handlerRequest = 0;
+      playstopDiv.innerHTML = "Play";
+   }
+   else
+   {
+      handlerRequest = window.webkitRequestAnimationFrame(nextFrame);
+      playstopDiv.innerHTML = "Stop";
+   }
 }

        When the handlerRequest variable returns true, the animation is played. Clicking the button calls the cancelRequestAnimationFrame() method to stop the animation. The handlerRequest is reset to value 0, and the button text changes from Stop to Play.

        @@ -162,33 +162,33 @@ playstopDiv.onclick = function() 
         function nextFrame(arg)
 {
-   rotation += speed;
-
-   if (rotation > 360)
-   {
-      rotation -= 360;
-   }
-   else if (rotation < -360)
-   {
-      rotation += 360;
-   }
-   rotateBackgroundDiv.style.webkitTransform = "rotate(" + rotation + "deg)";
-   handlerRequest = window.webkitRequestAnimationFrame(nextFrame);
+   rotation += speed;
+
+   if (rotation > 360)
+   {
+      rotation -= 360;
+   }
+   else if (rotation < -360)
+   {
+      rotation += 360;
+   }
+   rotateBackgroundDiv.style.webkitTransform = "rotate(" + rotation + "deg)";
+   handlerRequest = window.webkitRequestAnimationFrame(nextFrame);
 }

        The callback method is automatically called before the screen is updated. To keep the animation going, the requestAnimationFrame() method is called at the end of the callback method. Because the callback is synchronized with screen updates, when application is in the background and not visible on the screen, the updates are not called and the animation stops.

      39. Set events for the Left and Right buttons. Tapping the buttons increases or decreases the animation speed.

        -leftDiv = document.getElementById("leftBtn");
+leftDiv = document.getElementById("leftBtn");
 leftDiv.onclick = function()
 {
-   speed -= 0.5;
+   speed -= 0.5;
 }
-rightDiv = document.getElementById("rightBtn");
+rightDiv = document.getElementById("rightBtn");
 rightDiv.onclick = function()
 {
-   speed += 0.5;
+   speed += 0.5;
 }
 handlerRequest = window.webkitRequestAnimationFrame(nextFrame);
        diff --git a/org.tizen.guides/html/web/w3c/perf_opt/web_workers_w.htm b/org.tizen.guides/html/web/w3c/perf_opt/web_workers_w.htm index 2f0d01b..c2b2d53 100644 --- a/org.tizen.guides/html/web/w3c/perf_opt/web_workers_w.htm +++ b/org.tizen.guides/html/web/w3c/perf_opt/web_workers_w.htm @@ -84,10 +84,10 @@ If a worker triggers a message event, the onmessage() event handler var n = 1; index: while (true) { -   n += 1; -   for (var i = 2; i <= Math.sqrt(n); i += 1) -      if (n % i == 0) continue index; -   postMessage(n); + n += 1; + for (var i = 2; i <= Math.sqrt(n); i += 1) + if (n % i == 0) continue index; + postMessage(n); }

        This JavaScript operation delivers the calculated value of the Math.sqrt(n) method to the postMessage() method. It cannot be used for continuous posting of the Boolean operation.

        @@ -95,21 +95,21 @@ index: while (true)

      40. Create a Web worker to be activated in the background. The JavaScript URL defining the worker needs to be delivered when creating the worker object:

        -<button type="button" onclick="workerStart()">Start</button>
-<button type="button" onclick="worker.terminate()">Stop</button>
+<button type="button" onclick="workerStart()">Start</button>
+<button type="button" onclick="worker.terminate()">Stop</button>
 <output></output>
 
         <script>
-   var worker = new Worker("worker3.js");
-
-   function workerStart()
-   {
-      worker.onmessage = function(e)
-      {
-         document.querySelector("output").textContent = e.data;
-      };
-   }
+   var worker = new Worker("worker3.js");
+
+   function workerStart()
+   {
+      worker.onmessage = function(e)
+      {
+         document.querySelector("output").textContent = e.data;
+      };
+   }
 </script>

        When the Start button is clicked, message data is received from the worker and displayed in the <output> element. When the Stop button is clicked, the worker is terminated.

        @@ -119,8 +119,8 @@ index: while (true)
      41. To create a subworker, use the importScripts() method: 
        -importScripts('worker1.js');
-importScripts('worker1.js', 'worker2.js');
+importScripts('worker1.js');
+importScripts('worker1.js', 'worker2.js');

        The subworker creates its own independent thread, and is activated in it, so it has the same restrictions as a host worker. This means that communication between subworkers is impossible, but a host worker can communicate with subworkers within the same object.

        42. @@ -130,9 +130,9 @@ importScripts('worker1.js', 'worker2.js'); 
         worker.onerror = function(e)
 {
-   document.querySelectorAll("output")[1].textContent =
-      ['filename: ', e.filename, ' lineno: ', e.lineno, ' error: ', e.message]
-      .join(' ');
+   document.querySelectorAll("output")[1].textContent =
+      ['filename: ', e.filename, ' lineno: ', e.lineno, ' error: ', e.message]
+      .join(' ');
 };
        @@ -140,12 +140,12 @@ worker.onerror = function(e) 
         function errorMessage(e)
 {
-   document.querySelectorAll("output")[1].textContent =
-      ['filename: ', e.filename, ' lineno: ', e.lineno, ' error: ', e.message]
-      .join(' ');
+   document.querySelectorAll("output")[1].textContent =
+      ['filename: ', e.filename, ' lineno: ', e.lineno, ' error: ', e.message]
+      .join(' ');
 }
 
-worker.addEventListener('error', errorMessage, false);
+worker.addEventListener('error', errorMessage, false);
        @@ -159,19 +159,19 @@ worker.addEventListener('error', errorMessage, false);
      42. Send a message in one of the following ways:
        • -

          Use the postMessage() method to send a "Hello" message to a Web worker:

          +

          Use the postMessage() method to send a "Hello" message to a Web worker:

          -var worker = new Worker('worker1.js');
-worker.postMessage("Hello");
+var worker = new Worker('worker1.js');
+worker.postMessage("Hello");

        • Use the JSON format to send the message:

          -var worker = new Worker('worker2.js');
+var worker = new Worker('worker2.js');
 worker.postMessage(
 {
-   a: "Hello", b: "Tizen"
+   a: "Hello", b: "Tizen"
 });
          • @@ -182,16 +182,16 @@ worker.postMessage( 
           worker.onmessage = function(e)
 {
-   alert(e.data);
+   alert(e.data);
 };

        • Use the addEventListener() method to listen to the event of receiving a message:

          -worker.addEventListener("message", function(e)
-   {
-      alert(e.data);
-   }, false);
+worker.addEventListener("message", function(e)
+   {
+      alert(e.data);
+   }, false);
        @@ -202,7 +202,7 @@ worker.addEventListener("message", function(e) 
         self.onmessage = function(e)
 {
-   self.postMessage("You say: " + e.data);
+   self.postMessage("You say: " + e.data);
 };
        43. @@ -210,15 +210,15 @@ self.onmessage = function(e) 
         self.onmessage = function(e)
 {
-   var b = e.data.b;
-   if (b === "Tizen")
-   {
-      self.postMessage(e.data.b + " say: " + e.data.a);
-   }
-   else
-   {
-      self.postMessage("You say: " + e.data.a);
-   }
+   var b = e.data.b;
+   if (b === "Tizen")
+   {
+      self.postMessage(e.data.b + " say: " + e.data.a);
+   }
+   else
+   {
+      self.postMessage("You say: " + e.data.a);
+   }
 };
        @@ -254,44 +254,44 @@ self.onmessage = function(e) 
         function colorFilterStart()
 {
-   var picture = document.getElementById('picture');
-   var canvas = document.querySelector('canvas');
-   canvas.width = document.width;
-   canvas.height = picture.clientHeight;
-   var tempContext = canvas.getContext("2d");
-   tempContext.drawImage(picture, 0, 0, canvas.width, canvas.height);
-   var pixels = canvas.width * canvas.height * 4;
-   var canvasData = tempContext.getImageData(0, 0, canvas.width, canvas.height);
-   var binaryData = canvasData.data;
-   var timeStart = new Date();
-
-   colorFilter(binaryData, pixels);
-   tempContext.putImageData(canvasData, 0, 0);
-   var timeDiffer = new Date() - timeStart;
-   message.innerHTML = timeDiffer + " ms";
+   var picture = document.getElementById('picture');
+   var canvas = document.querySelector('canvas');
+   canvas.width = document.width;
+   canvas.height = picture.clientHeight;
+   var tempContext = canvas.getContext("2d");
+   tempContext.drawImage(picture, 0, 0, canvas.width, canvas.height);
+   var pixels = canvas.width * canvas.height * 4;
+   var canvasData = tempContext.getImageData(0, 0, canvas.width, canvas.height);
+   var binaryData = canvasData.data;
+   var timeStart = new Date();
+
+   colorFilter(binaryData, pixels);
+   tempContext.putImageData(canvasData, 0, 0);
+   var timeDiffer = new Date() - timeStart;
+   message.innerHTML = timeDiffer + " ms";
 };
 
 function colorChange(scale, gab, position)
 {
-   return Math.max(Math.min(255, (scale * gab + (1 - scale) * position)), 0);
+   return Math.max(Math.min(255, (scale * gab + (1 - scale) * position)), 0);
 };
 
 function colorFilter(binaryData, pixels)
 {
-   var data = binaryData;
-   var colorValue = parseFloat((Math.random() * 0.9 + 0.1).toFixed(3));
-   for (var i = 0; i < pixels; i += .5)
-   {
-      binaryData[i] =
-         colorChange(Math.random() * 0.5 + 0.5, (data[i] * colorValue)
-         + (data[i + 1] * 0.769) + (data[i + 2] * 0.189), data[i]);
-      binaryData[i + 1] =
-         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.349)
-         + (data[i + 1] * 0.686) + (data[i + 2] * 0.168), data[i + 1]);
-      binaryData[i + 2] =
-         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.272)
-         + (data[i + 1] * 0.534) + (data[i + 2] * 0.131), data[i + 2]);
-   }
+   var data = binaryData;
+   var colorValue = parseFloat((Math.random() * 0.9 + 0.1).toFixed(3));
+   for (var i = 0; i < pixels; i += .5)
+   {
+      binaryData[i] =
+         colorChange(Math.random() * 0.5 + 0.5, (data[i] * colorValue)
+         + (data[i + 1] * 0.769) + (data[i + 2] * 0.189), data[i]);
+      binaryData[i + 1] =
+         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.349)
+         + (data[i + 1] * 0.686) + (data[i + 2] * 0.168), data[i + 1]);
+      binaryData[i + 2] =
+         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.272)
+         + (data[i + 1] * 0.534) + (data[i + 2] * 0.131), data[i + 2]);
+   }
 };
        @@ -317,46 +317,46 @@ function colorFilter(binaryData, pixels) 
         function colorFilterStart()
 {
-   var picture = document.getElementById('picture');
-   var canvas = document.querySelector('canvas');
-   canvas.width = document.width;
-   canvas.height = picture.clientHeight;
-   var tempContext = canvas.getContext("2d");
-   var pixels = canvas.width * canvas.height * 4;
-   tempContext.drawImage(picture, 0, 0, canvas.width, canvas.height);
-   var workerNember = 4;
-   var count = 0;
-   var pixelLength = pixels / workerNember;
-   var pixelSize = canvas.height / workerNember;
-   var timeStart = new Date();
-
-   /* Loop to use multi-thread Web workers */
-   for (var i = 0; i < workerNember; i++)
-   {
-      var worker = new Worker("js/worker.js");
-      var canvasData =
-         tempContext.getImageData(0, pixelSize * i, canvas.width, pixelSize);
-
-      /* Handle data received from the host worker */
-      worker.onmessage = function(e)
-      {
-         count++;
-         tempContext.putImageData(e.data.canvasData, 0, pixelSize * e.data.count);
-         if (count == workerNember)
-         {
-            var timeDiffer = new Date() - timeStart;
-            message.innerHTML = timeDiffer + " ms";
-         }
-      };
-
-      /* Send data to the host worker */
-      worker.postMessage(
-      {
-         "data": canvasData,
-         "length": pixelLength,
-         "count": i
-      });
-   }
+   var picture = document.getElementById('picture');
+   var canvas = document.querySelector('canvas');
+   canvas.width = document.width;
+   canvas.height = picture.clientHeight;
+   var tempContext = canvas.getContext("2d");
+   var pixels = canvas.width * canvas.height * 4;
+   tempContext.drawImage(picture, 0, 0, canvas.width, canvas.height);
+   var workerNember = 4;
+   var count = 0;
+   var pixelLength = pixels / workerNember;
+   var pixelSize = canvas.height / workerNember;
+   var timeStart = new Date();
+
+   /* Loop to use multi-thread Web workers */
+   for (var i = 0; i < workerNember; i++)
+   {
+      var worker = new Worker("js/worker.js");
+      var canvasData =
+         tempContext.getImageData(0, pixelSize * i, canvas.width, pixelSize);
+
+      /* Handle data received from the host worker */
+      worker.onmessage = function(e)
+      {
+         count++;
+         tempContext.putImageData(e.data.canvasData, 0, pixelSize * e.data.count);
+         if (count == workerNember)
+         {
+            var timeDiffer = new Date() - timeStart;
+            message.innerHTML = timeDiffer + " ms";
+         }
+      };
+
+      /* Send data to the host worker */
+      worker.postMessage(
+      {
+         "data": canvasData,
+         "length": pixelLength,
+         "count": i
+      });
+   }
 }
        @@ -364,40 +364,40 @@ function colorFilterStart() 
         onmessage = function(e)
 {
-   var canvasData = e.data.data;
-   var binaryData = canvasData.data;
-   var pixels = e.data.length;
-   var count = e.data.count;
-
-   colorFilter(binaryData, pixels);
-   postMessage(
-   {
-      "canvasData": canvasData,
-      "count": count
-   });
+   var canvasData = e.data.data;
+   var binaryData = canvasData.data;
+   var pixels = e.data.length;
+   var count = e.data.count;
+
+   colorFilter(binaryData, pixels);
+   postMessage(
+   {
+      "canvasData": canvasData,
+      "count": count
+   });
 };
 
 function colorChange(scale, gab, position)
 {
-   return Math.max(Math.min(255, (scale * gab + (1 - scale) * position)), 0);
+   return Math.max(Math.min(255, (scale * gab + (1 - scale) * position)), 0);
 };
 
 function colorFilter(binaryData, pixels)
 {
-   var data = binaryData;
-   var colorValue = parseFloat((Math.random() * 0.9 + 0.1).toFixed(3));
-   for (var i = 0; i < pixels; i += .5)
-   {
-      binaryData[i] =
-         colorChange(Math.random() * 0.5 + 0.5, (data[i] * colorValue)
-         + (data[i + 1] * 0.769) + (data[i + 2] * 0.189), data[i]);
-      binaryData[i + 1] =
-         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.349)
-         + (data[i + 1] * 0.686) + (data[i + 2] * 0.168), data[i + 1]);
-      binaryData[i + 2] =
-         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.272)
-         + (data[i + 1] * 0.534) + (data[i + 2] * 0.131), data[i + 2]);
-   }
+   var data = binaryData;
+   var colorValue = parseFloat((Math.random() * 0.9 + 0.1).toFixed(3));
+   for (var i = 0; i < pixels; i += .5)
+   {
+      binaryData[i] =
+         colorChange(Math.random() * 0.5 + 0.5, (data[i] * colorValue)
+         + (data[i + 1] * 0.769) + (data[i + 2] * 0.189), data[i]);
+      binaryData[i + 1] =
+         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.349)
+         + (data[i + 1] * 0.686) + (data[i + 2] * 0.168), data[i + 1]);
+      binaryData[i + 2] =
+         colorChange(Math.random() * 0.5 + 0.5, (data[i] * 0.272)
+         + (data[i + 1] * 0.534) + (data[i + 2] * 0.131), data[i + 2]);
+   }
 };
        diff --git a/org.tizen.guides/html/web/w3c/security/cors_w.htm b/org.tizen.guides/html/web/w3c/security/cors_w.htm index 5f06225..8af7334 100644 --- a/org.tizen.guides/html/web/w3c/security/cors_w.htm +++ b/org.tizen.guides/html/web/w3c/security/cors_w.htm @@ -117,12 +117,12 @@
      43. Create an XML HTTP request on the client side, using JavaScript code that requests Ajax communication: 
         <script>
-   var method = "GET";
-   var url = "http://another-domain.com/CORS/";
-   var xhr = new XMLHttpRequest();
+   var method = "GET";
+   var url = "http://another-domain.com/CORS/";
+   var xhr = new XMLHttpRequest();
 
-   xhr.open(method, url);
-   xhr.send();
+   xhr.open(method, url);
+   xhr.send();
 </script>
        44. @@ -130,13 +130,13 @@
      44. On the server side, define the domain from which requests are allowed. In this case, the http://origin-domain.com domain has the required authority. 
         <?php
-   header("Access-Control-Allow-Origin: http://origin-domain.com");
+   header("Access-Control-Allow-Origin: http://origin-domain.com");
 ?>

        If all sites are allowed to send requests, use the wildcard (*):

         <?php
-   header("Access-Control-Allow-Origin: *");
+   header("Access-Control-Allow-Origin: *");
 ?>
        45. @@ -184,13 +184,13 @@ Origin http://another-domain.com/CORS is not allowed by Access-Control-Allow-Ori
      45. Create an XML HTTP request on the client side, using JavaScript code that requests Ajax communication. In addition, define the request Content-Type and add a custom header. 
         <script>
-   var xhr = new XMLHttpRequest();
-   xhr.open("PUT", "http://another-domain.com/CORS/");
+   var xhr = new XMLHttpRequest();
+   xhr.open("PUT", "http://another-domain.com/CORS/");
 
-   xhr.setRequestHeader("Content-Type", "application/json");
+   xhr.setRequestHeader("Content-Type", "application/json");
 
-   xhr.setRequestHeader("Header-Custom-TizenCORS", "OK");
-   xhr.send(data);
+   xhr.setRequestHeader("Header-Custom-TizenCORS", "OK");
+   xhr.send(data);
 </script>
        46. @@ -198,28 +198,28 @@ Origin http://another-domain.com/CORS is not allowed by Access-Control-Allow-Ori

      46. On the server side, define the domain from which requests are allowed. In this case, the http://110.0.0.160:8081 domain has the required authority. In addition, define various server settings.

         <?php
-   header("Access-Control-Allow-Origin: http://110.0.0.160:8081");
+   header("Access-Control-Allow-Origin: http://110.0.0.160:8081");
 
-   /* Allowed request method */
-   header("Access-Control-Allow-Methods: PUT");
+   /* Allowed request method */
+   header("Access-Control-Allow-Methods: PUT");
 
-   /* Allowed custom header */
-   header("Access-Control-Allow-Headers: Content-Type");
+   /* Allowed custom header */
+   header("Access-Control-Allow-Headers: Content-Type");
 
-   /* Age set to 1 day to improve speed caching */
-   header("Access-Control-Max-Age: 86400");
+   /* Age set to 1 day to improve speed caching */
+   header("Access-Control-Max-Age: 86400");
 
-   /* Options request exits before the page is completely loaded */
-   if (strtolower($_SERVER['REQUEST_METHOD']) == 'options')
-   {
-      exit();
-   }
+   /* Options request exits before the page is completely loaded */
+   if (strtolower($_SERVER['REQUEST_METHOD']) == 'options')
+   {
+      exit();
+   }
 
-   /* Response data */
-   $arr = array("user_name" => "tizen", "phone_number" => "12312334234");
+   /* Response data */
+   $arr = array("user_name" => "tizen", "phone_number" => "12312334234");
 
-   /* Response data returned in JSON format */
-   echo json_encode($arr);
+   /* Response data returned in JSON format */
+   echo json_encode($arr);
 ?>
        47. diff --git a/org.tizen.guides/html/web/w3c/security/iframe_w.htm b/org.tizen.guides/html/web/w3c/security/iframe_w.htm index b8902af..9de8097 100644 --- a/org.tizen.guides/html/web/w3c/security/iframe_w.htm +++ b/org.tizen.guides/html/web/w3c/security/iframe_w.htm @@ -92,104 +92,104 @@
        1. Create an <input> element of the checkbox type that enables the sandbox activation. In addition, create an iframe element with the sandbox property. To allow script execution in the iframe element content and cookie access, set the sandbox attribute value as allow-same-origin: 
          -<input type="checkbox" id="chkSandbox" name="chkSandbox"
-       onclick="setSandbox()"/> Enable Sandbox
-<div id="description" style="padding: 10px; margin: 10px;"></div>
-
-<iframe src="iframe_cookie_stolen.html"
-        sandbox="allow-scripts allow-same-origin"
-        id="iframe" seamless
-        width="100%" height="350px"
-        style="border: 1px solid #DCDCDC;"></iframe>
+<input type="checkbox" id="chkSandbox" name="chkSandbox"
+       onclick="setSandbox()"/> Enable Sandbox
+<div id="description" style="padding: 10px; margin: 10px;"></div>
+
+<iframe src="iframe_cookie_stolen.html"
+        sandbox="allow-scripts allow-same-origin"
+        id="iframe" seamless
+        width="100%" height="350px"
+        style="border: 1px solid #DCDCDC;"></iframe>
        2. Create a test cookie: 
           <script>
-   SetCookie('userid', 'example@tizen.org', 7);
-
-   function SetCookie(name, value, expiredays)
-   {
-      var today = new Date();
-      today.setDate(today.getDate() + expiredays);
-      document.cookie =
-         name + "=" + escape(value) + "; path=/; expires="
-         + today.toGMTString() + ";";
-   }
+   SetCookie('userid', 'example@tizen.org', 7);
+
+   function SetCookie(name, value, expiredays)
+   {
+      var today = new Date();
+      today.setDate(today.getDate() + expiredays);
+      document.cookie =
+         name + "=" + escape(value) + "; path=/; expires="
+         + today.toGMTString() + ";";
+   }
 </script>
        3. To block cookie access, remove the allow-same-origin attribute from the sandbox attribute value: 
           <script>
-   function setSandbox()
-   {
-      var checkbox = document.querySelector('#chkSandbox');
-      var frame = document.querySelector('#iframe');
-      var frameInfo = "", flag = "";
-
-      if (checkbox.checked)
-      {
-         /* Access to cookies within the same domain is not allowed */
-         flag = "allow-scripts';
-         frameInfo = "<iframe src sandbox="allow-scripts"></iframe>";
-      }
-      else
-      {
-         /* Access to cookies within the same domain is allowed */
-         flag = "allow-scripts allow-same-origin";
-         frameInfo =
-            "<iframe src sandbox="allow-scripts allow-same-origin"></iframe>";
-      }
-
-      frame.setAttribute("sandbox", flag);
-      frame.setAttribute("src", "iframe_cookie_stolen.html");
-      document.querySelector("#description").textContent = frameInfo;
-   }
+   function setSandbox()
+   {
+      var checkbox = document.querySelector('#chkSandbox');
+      var frame = document.querySelector('#iframe');
+      var frameInfo = "", flag = "";
+
+      if (checkbox.checked)
+      {
+         /* Access to cookies within the same domain is not allowed */
+         flag = "allow-scripts';
+         frameInfo = "<iframe src sandbox="allow-scripts"></iframe>";
+      }
+      else
+      {
+         /* Access to cookies within the same domain is allowed */
+         flag = "allow-scripts allow-same-origin";
+         frameInfo =
+            "<iframe src sandbox="allow-scripts allow-same-origin"></iframe>";
+      }
+
+      frame.setAttribute("sandbox", flag);
+      frame.setAttribute("src", "iframe_cookie_stolen.html");
+      document.querySelector("#description").textContent = frameInfo;
+   }
 </script>
        4. Display the result: 
          -<div id="message"></div>
+<div id="message"></div>
        5. If the sandboxing functionality is active, a message is displayed. If the sandboxing functionality is inactive, the imported cookie is displayed: 
           <script>
-   window.onload = function()
-   {
-      var message = document.getElementById("message");
-      try
-      {
-         message.innerHTML =
-            "<h3>stole parent window's cookie</h3> userid: " + GetCookie("userid");
-      }
-      catch (e)
-      {
-         message.innerHTML = "<h3>HTML5 Sandbox blocked access to cookies.</h3>";
-      }
-   }
-
-   function GetCookie(Name)
-   {
-      var search = Name + "="
-
-      if (document.cookie.length > 0)
-      {
-
-         offset = document.cookie.indexOf(search)
-
-         if (offset != -1)
-         {
-            offset += search.length
-            end = document.cookie.indexOf(";", offset)
-
-            if (end == -1) end = document.cookie.length
-
-            return unescape(document.cookie.substring(offset, end));
-         }
-      }
-
-      return "";
-   }
+   window.onload = function()
+   {
+      var message = document.getElementById("message");
+      try
+      {
+         message.innerHTML =
+            "<h3>stole parent window's cookie</h3> userid: " + GetCookie("userid");
+      }
+      catch (e)
+      {
+         message.innerHTML = "<h3>HTML5 Sandbox blocked access to cookies.</h3>";
+      }
+   }
+
+   function GetCookie(Name)
+   {
+      var search = Name + "="
+
+      if (document.cookie.length > 0)
+      {
+
+         offset = document.cookie.indexOf(search)
+
+         if (offset != -1)
+         {
+            offset += search.length
+            end = document.cookie.indexOf(";", offset)
+
+            if (end == -1) end = document.cookie.length
+
+            return unescape(document.cookie.substring(offset, end));
+         }
+      }
+
+      return "";
+   }
 </script>
        @@ -208,61 +208,61 @@
        1. Create an <input> element of the checkbox type that disables the sandbox. In addition, create an iframe element with the sandbox property: 
          -<input type="checkbox" id="chkSandbox" name="chkSandbox"
-       onclick="setSandbox()"/> Disable Sandbox
-<div id="description" style="padding: 10px; margin: 10px;"></div>
+<input type="checkbox" id="chkSandbox" name="chkSandbox"
+       onclick="setSandbox()"/> Disable Sandbox
+<div id="description" style="padding: 10px; margin: 10px;"></div>
 
-<iframe src="iframe_page_redirection.html"
-        sandbox="allow-scripts"
-        id="iframe" seamless></iframe>
+<iframe src="iframe_page_redirection.html"
+        sandbox="allow-scripts"
+        id="iframe" seamless></iframe>
        2. If the sandbox attribute is deactivated, set the allow-top-navigation attribute to the sandbox attribute value: 
           <script>
-   function setSandbox()
-   {
-      var checkbox = document.querySelector("#chkSandbox");
-      var frame = document.querySelector("#iframe");
-      var frameInfo = "", flag = "";
-
-      if (checkbox.checked)
-      {
-         flag = "allow-scripts allow-top-navigation";
-         frameInfo =
-            "<iframe src sandbox="allow-scripts allow-top-navigation"></iframe>";
-      }
-      else
-      {
-         flag = "allow-scripts";
-         frameInfo = "<iframe src sandbox="allow-scripts"></iframe>";
-      }
-
-      frame.setAttribute("sandbox", flag);
-      frame.setAttribute("src", "iframe_page_redirection.html");
-      document.querySelector("#description").textContent = frameInfo;
-   }
+   function setSandbox()
+   {
+      var checkbox = document.querySelector("#chkSandbox");
+      var frame = document.querySelector("#iframe");
+      var frameInfo = "", flag = "";
+
+      if (checkbox.checked)
+      {
+         flag = "allow-scripts allow-top-navigation";
+         frameInfo =
+            "<iframe src sandbox="allow-scripts allow-top-navigation"></iframe>";
+      }
+      else
+      {
+         flag = "allow-scripts";
+         frameInfo = "<iframe src sandbox="allow-scripts"></iframe>";
+      }
+
+      frame.setAttribute("sandbox", flag);
+      frame.setAttribute("src", "iframe_page_redirection.html");
+      document.querySelector("#description").textContent = frameInfo;
+   }
 </script>
        3. Include the image displayed on the page: 
          -<img id="img" alt="Tizen Lockup on Dark"
-     src="http://www.tizen.org/sites/default/files/admins/tizen-branding-lockup-on-dark.png" 
-     onclick="alert('fake advertisement!');"
-     width="240" height="103"/>
+<img id="img" alt="Tizen Lockup on Dark"
+     src="http://www.tizen.org/sites/default/files/admins/tizen-branding-lockup-on-dark.png" 
+     onclick="alert('fake advertisement!');"
+     width="240" height="103"/>
        4. If the page redirection is blocked, a message is displayed. If not, the user is redirected to the warning.html page: 
           <script>
-   try
-   {
-      location = "warning.html";
-   }
-   catch (e)
-   {
-      alert("HTML5 Sandbox prevented top level navigation.");
-   }
+   try
+   {
+      location = "warning.html";
+   }
+   catch (e)
+   {
+      alert("HTML5 Sandbox prevented top level navigation.");
+   }
 </script>
        @@ -283,76 +283,76 @@
        1. Create an <input> element of the checkbox type that enables the sandbox activation. In addition, create an iframe element with the sandbox property. To allow form submission, set the sandbox attribute value as allow-forms: 
          -<input type="checkbox" id="chkSandbox" name="chkSandbox"
-       onclick="setSandbox()"/> Enable Sandbox
-<div id="description" style="padding: 10px; margin: 10px;"></div>
+<input type="checkbox" id="chkSandbox" name="chkSandbox"
+       onclick="setSandbox()"/> Enable Sandbox
+<div id="description" style="padding: 10px; margin: 10px;"></div>
 
-<iframe src="iframe_form_submission.html"
-        sandbox="allow-scripts allow-same-origin allow-forms"
-        width="100%" height="200px"></iframe>
+<iframe src="iframe_form_submission.html"
+        sandbox="allow-scripts allow-same-origin allow-forms"
+        width="100%" height="200px"></iframe>
        2. If the sandbox attribute is activated, remove the allow-forms attribute from the sandbox attribute value: 
           <script>
-   function setSandbox()
-   {
-      var checkbox = document.querySelector('#chkSandbox');
-      var frame = document.querySelector('#iframe');
-      var frameInfo = "", flag = "";
-
-      if (checkbox.checked)
-      {
-         flag = "allow-scripts allow-same-origin";
-         frameInfo =
-            "<iframe src sandbox="allow-scripts allow-same-origin"></iframe>";
-      }
-      else
-      {
-         flag = "allow-scripts allow-same-origin allow-forms";
-         frameInfo =
-            "<iframe src sandbox='allow-scripts allow-same-origin allow-forms'></iframe>";
-      }
-
-      frame.setAttribute("sandbox", flag);
-      frame.setAttribute("src", "iframe_form_submission.html");
-      document.querySelector("#description").textContent = frameInfo;
-   }
+   function setSandbox()
+   {
+      var checkbox = document.querySelector('#chkSandbox');
+      var frame = document.querySelector('#iframe');
+      var frameInfo = "", flag = "";
+
+      if (checkbox.checked)
+      {
+         flag = "allow-scripts allow-same-origin";
+         frameInfo =
+            "<iframe src sandbox="allow-scripts allow-same-origin"></iframe>";
+      }
+      else
+      {
+         flag = "allow-scripts allow-same-origin allow-forms";
+         frameInfo =
+            "<iframe src sandbox='allow-scripts allow-same-origin allow-forms'></iframe>";
+      }
+
+      frame.setAttribute("sandbox", flag);
+      frame.setAttribute("src", "iframe_form_submission.html");
+      document.querySelector("#description").textContent = frameInfo;
+   }
 </script>
        3. Create a form for the login screen with <input> elements to enter an email and password, and submit them: 
          -<form method="get" action="iframe_form_submission.html">
-   <h3>Advertisement, SNS</h3>
-
-   <fieldset>
-      <legend>Login</legend>
-      <input type="text" id="email" name="email"
-             placeholder="e-mail address" required />
-      <input type="password" id="password" name="password"
-             placeholder="password" required />
-   </fieldset>
-   <input type="submit" value="Login"/>
+<form method="get" action="iframe_form_submission.html">
+   <h3>Advertisement, SNS</h3>
+
+   <fieldset>
+      <legend>Login</legend>
+      <input type="text" id="email" name="email"
+             placeholder="e-mail address" required />
+      <input type="password" id="password" name="password"
+             placeholder="password" required />
+   </fieldset>
+   <input type="submit" value="Login"/>
 </form>
        4. If the sandbox attribute is deactivated, the imported login information is displayed: 
           <script>
-   window.onload = function()
-   {
-      var html;
-
-      if (location.href.indexOf("?") >= 0)
-      {
-         html =
-            ['<div id="message">',
-            '<h3>Catches login qualification certifying information</h3>',
-            (location.href.split("?")[1]).replace("&", "<br />"),
-            '</div>'].join('');
-
-         document.body.innerHTML = html;
-      }
-   }
+   window.onload = function()
+   {
+      var html;
+
+      if (location.href.indexOf("?") >= 0)
+      {
+         html =
+            ['<div id="message">',
+            '<h3>Catches login qualification certifying information</h3>',
+            (location.href.split("?")[1]).replace("&", "<br />"),
+            '</div>'].join('');
+
+         document.body.innerHTML = html;
+      }
+   }
 </script>
        @@ -373,46 +373,46 @@
        1. Create an <input> element of the checkbox type that enables the sandbox activation. In addition, create an iframe element with the sandbox property. To allow pop-ups, set the sandbox attribute value as allow-popups: 
          -<input type="checkbox" id="chkSandbox" name="chkSandbox"
-       onclick="setSandbox()"/> Enable Sandbox
-<div id="description" style="padding:10 px; margin:10 px;"></div>
-
-<iframe src="iframe_popup.html"
-        sandbox="allow-scripts allow-same-origin allow-popups"
-        id="iframe" seamless
-        style="border: 1px solid #DCDCDC;"></iframe>
+<input type="checkbox" id="chkSandbox" name="chkSandbox"
+       onclick="setSandbox()"/> Enable Sandbox
+<div id="description" style="padding:10 px; margin:10 px;"></div>
+
+<iframe src="iframe_popup.html"
+        sandbox="allow-scripts allow-same-origin allow-popups"
+        id="iframe" seamless
+        style="border: 1px solid #DCDCDC;"></iframe>
        2. If the sandbox attribute is activated, remove the allow-popups flag from the sandbox attribute value: 
           <script>
-   function setSandbox()
-   {
-      var checkbox = document.querySelector('#chkSandbox');
-      var frame = document.querySelector('#iframe');
-      var frameInfo = "", flag ="";
-
-      if (checkbox.checked)
-      {
-         flag = 'allow-scripts allow-same-origin';
-         frameInfo =
-            '<iframe src sandbox="allow-scripts allow-same-origin"></iframe>';
-      }
-      else
-      {
-         flag = 'allow-scripts allow-same-origin allow-popups'
-         frameInfo =
-            '<iframe src sandbox="allow-scripts allow-same-origin allow-popups"></iframe>';
-      }
-
-      frame.setAttribute("sandbox", flag);
-      frame.setAttribute("src", "iframe_popup.html");
-      document.querySelector("#description").textContent = frameInfo;
-   }
+   function setSandbox()
+   {
+      var checkbox = document.querySelector('#chkSandbox');
+      var frame = document.querySelector('#iframe');
+      var frameInfo = "", flag ="";
+
+      if (checkbox.checked)
+      {
+         flag = 'allow-scripts allow-same-origin';
+         frameInfo =
+            '<iframe src sandbox="allow-scripts allow-same-origin"></iframe>';
+      }
+      else
+      {
+         flag = 'allow-scripts allow-same-origin allow-popups'
+         frameInfo =
+            '<iframe src sandbox="allow-scripts allow-same-origin allow-popups"></iframe>';
+      }
+
+      frame.setAttribute("sandbox", flag);
+      frame.setAttribute("src", "iframe_popup.html");
+      document.querySelector("#description").textContent = frameInfo;
+   }
 </script>
        3. Create an external link in the iframe element: 
          -<p>[<a href="https://www.tizen.org/about" target="_blank">Click Link!</a>]</p>
+<p>[<a href="https://www.tizen.org/about" target="_blank">Click Link!</a>]</p>
        @@ -432,37 +432,37 @@
      47. Create the needed HTML elements, including the CSS style of the parent document. Create an iframe element with the seamless attribute setting, and another iframe element without the setting: 
         <head>
-   <style>
-      body, html
-      {
-         margin: 0; padding: 0;
-      }
-      body
-      {
-         font-size: 12px;
-      }
-      h3
-      {
-         color: blue;
-      }
-   </style>
+   <style>
+      body, html
+      {
+         margin: 0; padding: 0;
+      }
+      body
+      {
+         font-size: 12px;
+      }
+      h3
+      {
+         color: blue;
+      }
+   </style>
 </head>
 <body>
-   <h2>HTML5 iframe</h2>
-   <iframe seamless src="iframe.html"></iframe>
-   <iframe src="iframe.html"></iframe>
+   <h2>HTML5 iframe</h2>
+   <iframe seamless src="iframe.html"></iframe>
+   <iframe src="iframe.html"></iframe>
 </body>
      48. Create the iframe element content. The iframe element with the seamless attribute set displays the content with the inherited CSS style: 
         <body>
-   <h3>iframe! h3 Content</h3>
-   <ul>
-      <li><a href="http://tizen.org">tizen.org</a></li>
-      <li><a href="http://tizen.org" target="_self">
-         tizen.org target="_self"</a>
-      </li>
-   </ul>
+   <h3>iframe! h3 Content</h3>
+   <ul>
+      <li><a href="http://tizen.org">tizen.org</a></li>
+      <li><a href="http://tizen.org" target="_self">
+         tizen.org target="_self"</a>
+      </li>
+   </ul>
 </body>
        49. diff --git a/org.tizen.guides/html/web/w3c/storage/appcache_w.htm b/org.tizen.guides/html/web/w3c/storage/appcache_w.htm index 750bf3e..d2afb7e 100644 --- a/org.tizen.guides/html/web/w3c/storage/appcache_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/appcache_w.htm @@ -43,8 +43,8 @@

        HTML5 application caches can be used to store and utilize resources needed in Web applications, such as HTML, CSS, and JavaScript files, and images. You can cache certain files in the browser to use them in an offline state, or define them to be always updated from the server.

        -

        This feature is supported in mobile applications only.

        - +

        This feature is supported in mobile applications only.

        +

        HTML5 application caches provide you with the following benefits:

        • Offline support @@ -72,8 +72,8 @@

          The following example demonstrates cache enabling. For a complete source code, see appcache_update.html.

           <!DOCTYPE html>
-<html manifest="tizen.appcache">
-   <!--Page content-->
+<html manifest="tizen.appcache">
+   <!--Page content-->
 </html>
          @@ -85,7 +85,7 @@ 
           CACHE MANIFEST
 # 2013-03-18 v2.0.0
-images/sound-icon.png 
+images/sound-icon.png
 images/background.png
 /tizen_application_cache.html
 /main.js
@@ -114,7 +114,7 @@ NETWORK:
 comm.cgi
 login.asp
          -

          All requests to these resources bypass the cache, even if the user if offline. Wild cards like '*' can be used.

          • +

          All requests to these resources bypass the cache, even if the user if offline. Wild cards like '*' can be used.

        • Define the fallback pages in the FALLBACK section:

          @@ -140,7 +140,7 @@ FALLBACK:
 
          Include the manifest property in  the <html> tag to enable loading the manifest file and caching content by the browser:
          
 
           <!DOCTYPE html>
-<html manifest="clock.appcache">
+<html manifest="clock.appcache">
        • @@ -156,29 +156,29 @@ cache_test.js

          Reconnect and check whether there are edited items in the manifest file using the update() method:

           <script>
-   var update = function()
-   {
-      var appCache = window.applicationCache;
-      appCache.addEventListener('updateready', handleCacheEvent, false);
-      appCache.update();
+   var update = function()
+   {
+      var appCache = window.applicationCache;
+      appCache.addEventListener('updateready', handleCacheEvent, false);
+      appCache.update();

        • If there are changes in the manifest file, use the swapCache() and handleCacheEvent() methods to update the cache:

          -      function handleCacheEvent(e)
-      {
-         if (appCache.status == appCache.UPDATEREADY)
-         {
-            try
-            {
-               window.applicationCache.swapCache();
-               document.getElementById('log').innerHTML = "Update is successful";
-            }
-         }
-      }
-   };
-</script> 
+      function handleCacheEvent(e)
+      {
+         if (appCache.status == appCache.UPDATEREADY)
+         {
+            try
+            {
+               window.applicationCache.swapCache();
+               document.getElementById('log').innerHTML = "Update is successful";
+            }
+         }
+      }
+   };
+</script>
          • @@ -195,7 +195,7 @@ cache_test.js

        Managing the Cache Events

        - +

        To check the current status of the cache:

          @@ -203,24 +203,24 @@ cache_test.js

          Check the window.applicationCache.status value:

           <script>
-   var appCache = window.applicationCache;
-
-   switch (appCache.status)
-   {
-      case 0: /* ApplicationCache.status is UNCACHED */
-         break;
-      case 1: /* ApplicationCache.status is IDLE */
-         break;
-      case 2: /* ApplicationCache.status is CHECKING */
-         break;
-      case 3: /* ApplicationCache.status is DOWNLOADING */
-         break;
-      case 4: /* ApplicationCache.status is UPDATEREADY */
-         break;
-      case 5: /* ApplicationCache.status is OBSOLETE */
-         break;
-      default: break;
-   }
+   var appCache = window.applicationCache;
+
+   switch (appCache.status)
+   {
+      case 0: /* ApplicationCache.status is UNCACHED */
+         break;
+      case 1: /* ApplicationCache.status is IDLE */
+         break;
+      case 2: /* ApplicationCache.status is CHECKING */
+         break;
+      case 3: /* ApplicationCache.status is DOWNLOADING */
+         break;
+      case 4: /* ApplicationCache.status is UPDATEREADY */
+         break;
+      case 5: /* ApplicationCache.status is OBSOLETE */
+         break;
+      default: break;
+   }
 </script>
          @@ -228,49 +228,49 @@ cache_test.js

          Different events can occur based on the cache status. Use the addEventListener() method to add listeners in order to detect events:

           <script>
-   var appCache = window.applicationCache;
-   appCache.addEventListener('cached', function()
-      {
-         /* Cached resource is downloaded */
-      }, false);
-
-   appCache.addEventListener('checking', function()
-      {
-         /*
-            Manifest file is downloaded for the first time
-            or if there is an update in the manifest
-         */
-      }, false);
-
-   appCache.addEventListener('downloading', function()
-      {
-         /* Content is being updated */
-      }, false);
-
-   appCache.addEventListener('error', function()
-      {
-         /* Error occurred */
-      }, false);
-
-   appCache.addEventListener('noupdate', function()
-      {
-         /* No update is available */
-      }, false);
-
-   appCache.addEventListener('obsolete', function()
-      {
-         /* Manifest file cannot be found */
-      }, false);
-
-   appCache.addEventListener('progress', function()
-      {
-         /* Cache file is being downloaded */
-      }, false);
-
-   appCache.addEventListener('updateready', function()
-      {
-         /* All resources for update are downloaded */
-      }, false);
+   var appCache = window.applicationCache;
+   appCache.addEventListener('cached', function()
+      {
+         /* Cached resource is downloaded */
+      }, false);
+
+   appCache.addEventListener('checking', function()
+      {
+         /*
+            Manifest file is downloaded for the first time
+            or if there is an update in the manifest
+         */
+      }, false);
+
+   appCache.addEventListener('downloading', function()
+      {
+         /* Content is being updated */
+      }, false);
+
+   appCache.addEventListener('error', function()
+      {
+         /* Error occurred */
+      }, false);
+
+   appCache.addEventListener('noupdate', function()
+      {
+         /* No update is available */
+      }, false);
+
+   appCache.addEventListener('obsolete', function()
+      {
+         /* Manifest file cannot be found */
+      }, false);
+
+   appCache.addEventListener('progress', function()
+      {
+         /* Cache file is being downloaded */
+      }, false);
+
+   appCache.addEventListener('updateready', function()
+      {
+         /* All resources for update are downloaded */
+      }, false);
 </script>
          diff --git a/org.tizen.guides/html/web/w3c/storage/file_w.htm b/org.tizen.guides/html/web/w3c/storage/file_w.htm index 187d2d7..8d90843 100644 --- a/org.tizen.guides/html/web/w3c/storage/file_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/file_w.htm @@ -49,11 +49,11 @@

          File

          - -

          Tizen enables you to access local storage to read file information. In mobile applications, you can also manipulate files by accessing sandboxed file systems.

          - + +

          Tizen enables you to access local storage to read file information. In mobile applications, you can also manipulate files by accessing sandboxed file systems.

          +

          This feature is supported in mobile and wearable applications only.

          - +

          The main features of the File API include:

          • Local file management @@ -93,10 +93,10 @@

            Reading basic information, such as file name, size, MIME type, modification date, and path, of a local file is a useful file management skill:

              -
            1. To display file information, create the <input type="file"> element and other needed elements: +
            2. To display file information, create the <input type="file"> element and other needed elements: 
              -<input type="file" id="tizenFiles" onchange="readSelectedFiles();" multiple />
-<div id="selectedFileInfoList"></div>
+<input type="file" id="tizenFiles" onchange="readSelectedFiles();" multiple />
+<div id="selectedFileInfoList"></div>
              @@ -105,41 +105,41 @@
              3. -
            3. Create a FileList instance: +
            4. Create a FileList instance: 
               <script>
-   var files = document.getElementById("tizenFiles").files;
-   if (files.length === 0) return;
+   var files = document.getElementById("tizenFiles").files;
+   if (files.length === 0) return;
 </script>
              5. -
            5. Use the readSelectedFiles() method of the FileList interface to retrieve and display file information, such as file name, size, MIME type, and modification date: +
            6. Use the readSelectedFiles() method of the FileList interface to retrieve and display file information, such as file name, size, MIME type, and modification date: 
               <script>
-   function readSelectedFiles()
-   {
-      var displaySection = document.getElementById('selectedFileInfoList');
-      var html = [];
-      for (var i = 0; i < files.length; i++)
-      {
-         var file = files[i];
-         html.push("<li>",
-                   "<strong>", escape(file.name), "</strong><br />",
-                   "    type: ", file.type, "<br />", /* MIME type */
-                   "    size: ", file.size, "bytes<br />", /* Size */
-                   "    lastModifiedDate: ", /* Last modification date */
-                   (file.lastModifiedDate ?
-                    file.lastModifiedDate.toLocaleDateString() : ""),
-                   "   <br />",
-                   "</li>");
-      }
-      displaySection.innerHTML = "<ul>" + html.join("") + "</ul>";
-   }
+   function readSelectedFiles()
+   {
+      var displaySection = document.getElementById('selectedFileInfoList');
+      var html = [];
+      for (var i = 0; i < files.length; i++)
+      {
+         var file = files[i];
+         html.push("<li>",
+                   "<strong>", escape(file.name), "</strong><br />",
+                   "    type: ", file.type, "<br />", /* MIME type */
+                   "    size: ", file.size, "bytes<br />", /* Size */
+                   "    lastModifiedDate: ", /* Last modification date */
+                   (file.lastModifiedDate ?
+                    file.lastModifiedDate.toLocaleDateString() : ""),
+                   "   <br />",
+                   "</li>");
+      }
+      displaySection.innerHTML = "<ul>" + html.join("") + "</ul>";
+   }
 </script>
              -

              Figure: Displaying file information (in mobile applications only)

              -

              Displaying file information (in mobile applications only)

              +

              Figure: Displaying file information (in mobile applications only)

              +

              Displaying file information (in mobile applications only)

            Source Code

            @@ -147,17 +147,17 @@ - +

            Reading Local File Content

            - +

            Reading a local image file in a Web application is a useful file management skill:

              -
            1. To read a local image file and display its information, create the <input type="file"> element and other needed elements: +
            2. To read a local image file and display its information, create the <input type="file"> element and other needed elements: 
              -<input type="file" id="tizenFiles" onchange="readSelectedFiles();" multiple/>
-<div id="selectedFileInfoList"></div>
+<input type="file" id="tizenFiles" onchange="readSelectedFiles();" multiple/>
+<div id="selectedFileInfoList"></div>
              3. @@ -165,46 +165,46 @@

              If the data is loaded, an onload event is fired. Create an img element to allocate the event result property value for rendering:

               <script>
-   function readSelectedFiles()
-   {
-      var files = document.getElementById("tizenFiles").files;
-      if (files.length === 0)
-      {
-         return;
-      }
-
-      var html = [];
-      for (var i = 0; i < files.length; i++)
-      {
-         var file = files[i];
-
-         var reader = new FileReader();
-
-         /* Check whether the file is an image */
-         if (!file.type.match("image.*"))
-         {
-            continue;
-         }
-
-         reader.onload = (function(e)
-         {
-            var img = document.createElement("img");
-            img.src = e.target.result;
-
-            /* Set the selected image's dataURL */
-            img.title = escape(file.name);
-            img.className = "img";
-
-            document.getElementById("selectedFileInfoList").appendChild(img);
-         };
-         reader.readAsDataURL(file);
-      }
-   }
-</script> 
+   function readSelectedFiles()
+   {
+      var files = document.getElementById("tizenFiles").files;
+      if (files.length === 0)
+      {
+         return;
+      }
+
+      var html = [];
+      for (var i = 0; i < files.length; i++)
+      {
+         var file = files[i];
+
+         var reader = new FileReader();
+
+         /* Check whether the file is an image */
+         if (!file.type.match("image.*"))
+         {
+            continue;
+         }
+
+         reader.onload = (function(e)
+         {
+            var img = document.createElement("img");
+            img.src = e.target.result;
+
+            /* Set the selected image's dataURL */
+            img.title = escape(file.name);
+            img.className = "img";
+
+            document.getElementById("selectedFileInfoList").appendChild(img);
+         };
+         reader.readAsDataURL(file);
+      }
+   }
+</script>
              -

              Figure: Displaying an image file (in mobile applications only)

              -

              Displaying an image file (in mobile applications only)

              +

              Figure: Displaying an image file (in mobile applications only)

              +

              Displaying an image file (in mobile applications only)

            Source Code

            @@ -218,23 +218,23 @@

            Slicing a local file using the Blob interface is a useful file management skill:

              -
            1. Create the <input type="file"> element, the element for inputting the start byte and the end byte for slice, and the element for displaying the slicing result: +
            2. Create the <input type="file"> element, the element for inputting the start byte and the end byte for slice, and the element for displaying the slicing result: 
              -<input type="file" id="tizenFile" name="tizenFile"
-       onchange="setFileSize();"/> <br />
-start byte: <input type="text" id="startByte"
-                   name="startByte" style="width: 100px;"/>~
-end byte: <input type="text" id="endByte" name="endByte" style="width: 100px;"/>
-<input type="button" value="Slice File" onclick="readBinaryString();"/>
-
-<div id="result" style="padding: 25px 10px 0 20px;"></div>
+<input type="file" id="tizenFile" name="tizenFile"
+       onchange="setFileSize();"/> <br />
+start byte: <input type="text" id="startByte"
+                   name="startByte" style="width: 100px;"/>~
+end byte: <input type="text" id="endByte" name="endByte" style="width: 100px;"/>
+<input type="button" value="Slice File" onclick="readBinaryString();"/>
+
+<div id="result" style="padding: 25px 10px 0 20px;"></div>
            3. To read the local file, create a FileReader instance: 
               <script>
-   var reader = new FileReader();
+   var reader = new FileReader();
 </script>
              4. @@ -243,46 +243,46 @@ end byte: <input type="text" id="endByte" name="endB 
               <script>
-   function readBinaryString()
-   {
-      if (document.getElementById("tizenFile").files.length === 0)
-      {
-         alert("Upload File");
+   function readBinaryString()
+   {
+      if (document.getElementById("tizenFile").files.length === 0)
+      {
+         alert("Upload File");
 
-         return;
-      }
+         return;
+      }
 
-      var file = document.getElementById("tizenFile").files[0];
-      var startByte = document.getElementById("startByte").value;
-      var endByte = document.getElementById("endByte").value;
+      var file = document.getElementById("tizenFile").files[0];
+      var startByte = document.getElementById("startByte").value;
+      var endByte = document.getElementById("endByte").value;
 
-      var blob = file.slice(startByte, endByte);
+      var blob = file.slice(startByte, endByte);
              -

              A new Blob object is created.

              +

              A new Blob object is created.

            4. Read the data as a binary string using the readAsBinaryString() method:

              -      reader.readAsBinaryString(blob);
-   }
+      reader.readAsBinaryString(blob);
+   }
 </script>
            5. If the data loading is complete, the read data is displayed. Check the status using the onloadend event: 
               <script>
-   reader.onloadend = function(e)
-   {
-      if (e.target.readyState == FileReader.DONE) /* DONE == 2 */
-      {
-         document.getElementById('result').textContent = e.target.result;
-      }
-   };
+   reader.onloadend = function(e)
+   {
+      if (e.target.readyState == FileReader.DONE) /* DONE == 2 */
+      {
+         document.getElementById('result').textContent = e.target.result;
+      }
+   };
 </script>
              -

              Figure: Slicing a file (in mobile applications only)

              -

              Slicing a file (in mobile applications only)

              +

              Figure: Slicing a file (in mobile applications only)

              +

              Slicing a file (in mobile applications only)

            Source Code

            @@ -290,7 +290,7 @@ end byte: <input type="text" id="endByte" name="endB - +

            Accessing a Sandboxed File System

            Requesting access to sandboxed sections of a local file system is a useful file management skill:

            @@ -299,26 +299,26 @@ end byte: <input type="text" id="endByte" name="endB
          • Use the requestFileSystem() method of the LocalFileSystem interface to request access to sandboxed sections of a local file system: 
             <script>
-   /* Tizen uses the webkit prefix */
-   window.requestFileSystem = window.webkitRequestFileSystem;
-
-   var fs = null;
-
-   /* Initialize the file system when loading a page */
-   if (window.requestFileSystem)
-   {
-      initFS();
-   }
-
-   function initFS()
-   {
-      /* Request for access to the sandboxed file system */
-      /* and define PERSISTENT or TEMPORARY storage */
-      window.requestFileSystem(window.TEMPORARY,
-                               1024 * 1024, /* Storage space (bytes) */
-                               function(filesystem) {fs = filesystem;},
-                               errorHandler);
-   }
+   /* Tizen uses the webkit prefix */
+   window.requestFileSystem = window.webkitRequestFileSystem;
+
+   var fs = null;
+
+   /* Initialize the file system when loading a page */
+   if (window.requestFileSystem)
+   {
+      initFS();
+   }
+
+   function initFS()
+   {
+      /* Request for access to the sandboxed file system */
+      /* and define PERSISTENT or TEMPORARY storage */
+      window.requestFileSystem(window.TEMPORARY,
+                               1024 * 1024, /* Storage space (bytes) */
+                               function(filesystem) {fs = filesystem;},
+                               errorHandler);
+   }
 </script>
            @@ -327,7 +327,7 @@ end byte: <input type="text" id="endByte" name="endB The requestFileSystem() method is created in the Web application program when it is initially called.
          -

          The directory file in the file system root can be searched, created and deleted by accessing local file system. +

          The directory file in the file system root can be searched, created and deleted by accessing local file system.

          @@ -343,62 +343,62 @@ end byte: <input type="text" id="endByte" name="endB

          Reading a file or directory in a sandboxed section of a local file system is a useful file management skill:

            -
          1. Create the <input type="button"> element for displaying the entries (directories or files) stored in the root directory within the file system, and the list element for displaying the result: +
          2. Create the <input type="button"> element for displaying the entries (directories or files) stored in the root directory within the file system, and the list element for displaying the result: 
            -<input type="button" value="Show FileList" onclick="ShowFileList();"/>
-<ul id="resultSection"></ul>
+<input type="button" value="Show FileList" onclick="ShowFileList();"/>
+<ul id="resultSection"></ul>
          3. To read the entry within the file system, use the createReader() method of the DirectoryEntry interface: 
             <script>
-   function ShowFileList()
-   {
-      if (!fs) return;
+   function ShowFileList()
+   {
+      if (!fs) return;
 
-      var objResultSection = document.querySelector('#resultSection');
+      var objResultSection = document.querySelector('#resultSection');
 
-      var root = fs.root;
-      var dirReader = root.createReader();
+      var root = fs.root;
+      var dirReader = root.createReader();
          4. Use the readEntries() method of the DirectoryReader interface to read all entries: 
            -      dirReader.readEntries(function(entries)
-      {
+      dirReader.readEntries(function(entries)
+      {
          5. Display the list of the relevant entries using the Entry interface: 
            -         if (!entries.length)
-         {
-            objResultSection.innerHTML = 'Filesystem is empty.';
-         }
-         else
-         {
-            var fragment = document.createDocumentFragment();
-            var entry, i;
-
-            for (i = 0; i < entries.length; i++)
-            {
-               entry = entries[i];
-
-               var img =
-                  entry.isDirectory ? '<img class="icon-img"
-                                            src="img/icon_folder.png" alt="folder">'
-                  : '<img class="icon-img" src="img/icon_file.png" alt="file">';
-
-               var li = document.createElement('li');
-               /* Display entry name */
-               li.innerHTML = [img, '<span>', entry.name, '</span>'].join('');
-               objResultSection.innerHTML = '';
-               fragment.appendChild(li);
-            }
-            objResultSection.appendChild(fragment);
-         }
-      }, errorHandler);
-   }
+         if (!entries.length)
+         {
+            objResultSection.innerHTML = 'Filesystem is empty.';
+         }
+         else
+         {
+            var fragment = document.createDocumentFragment();
+            var entry, i;
+
+            for (i = 0; i < entries.length; i++)
+            {
+               entry = entries[i];
+
+               var img =
+                  entry.isDirectory ? '<img class="icon-img"
+                                            src="img/icon_folder.png" alt="folder">'
+                  : '<img class="icon-img" src="img/icon_file.png" alt="file">';
+
+               var li = document.createElement('li');
+               /* Display entry name */
+               li.innerHTML = [img, '<span>', entry.name, '</span>'].join('');
+               objResultSection.innerHTML = '';
+               fragment.appendChild(li);
+            }
+            objResultSection.appendChild(fragment);
+         }
+      }, errorHandler);
+   }
 </script>
          @@ -408,8 +408,8 @@ end byte: <input type="text" id="endByte" name="endB For error handling, see Accessing a Sandboxed File System.
          -

          Figure: Displaying files

          -

          Displaying files

          +

          Figure: Displaying files

          +

          Displaying files

          Source Code

          @@ -425,46 +425,46 @@ end byte: <input type="text" id="endByte" name="endB

          Creating a directory or file in a sandboxed section of a local file system is a useful file management skill:

            -
          1. Create the select element for selecting the type of entry to be added, <input type="text"> element for entering the entry name, and <input type="button>" element for creating the entry: +
          2. Create the select element for selecting the type of entry to be added, <input type="text"> element for entering the entry name, and <input type="button>" element for creating the entry: 
            -<select id="selType">
-   <option value="dir">Directory</option>
-   <option value="file">File</option>
+<select id="selType">
+   <option value="dir">Directory</option>
+   <option value="file">File</option>
 </select>
-<input type="text" id="txtName" name="txtName"
-       style="width: 200px;" maxlength="20"/>
-<input type="button" value="Add File or Directory" onclick="AddFile();"/>
+<input type="text" id="txtName" name="txtName"
+       style="width: 200px;" maxlength="20"/>
+<input type="button" value="Add File or Directory" onclick="AddFile();"/>
          3. To create a directory, use the getDirectory() method. To create a file, use the getFile() method: 
             <script>
-   function AddFile()
-   {
-      if (!fs) return;
-
-      var type = document.querySelector('#selType').value;
-      var name = document.querySelector('#txtName').value;
-
-      if (name == "")
-      {
-         return alert("Enter File or Directory Name.");
-      }
-
-      if (type == "file")
-      {
-         /* Create file */
-         fs.root.getFile(name, {create: true}, null, errorHandler);
-      }
-      else if (type == "dir")
-      {
-         /* Create directory */
-         fs.root.getDirectory(name, {create: true}, null, errorHandler);
-      }
-
-      document.querySelector('#resultSection').innerHTML = 'Files created.';
-   }
+   function AddFile()
+   {
+      if (!fs) return;
+
+      var type = document.querySelector('#selType').value;
+      var name = document.querySelector('#txtName').value;
+
+      if (name == "")
+      {
+         return alert("Enter File or Directory Name.");
+      }
+
+      if (type == "file")
+      {
+         /* Create file */
+         fs.root.getFile(name, {create: true}, null, errorHandler);
+      }
+      else if (type == "dir")
+      {
+         /* Create directory */
+         fs.root.getDirectory(name, {create: true}, null, errorHandler);
+      }
+
+      document.querySelector('#resultSection').innerHTML = 'Files created.';
+   }
 </script>
            @@ -473,8 +473,8 @@ end byte: <input type="text" id="endByte" name="endB For error handling, see Accessing a Sandboxed File System.
          -

          Figure: Adding a file

          -

          Adding a file

          +

          Figure: Adding a file

          +

          Adding a file

        Source Code

        @@ -488,40 +488,40 @@ end byte: <input type="text" id="endByte" name="endB

        Deleting a directory or file in a sandboxed section of a local file system is a useful file management skill:

          -
        1. Create the <input type="button"> element for deleting the entry (directory or file): +
        2. Create the <input type="button"> element for deleting the entry (directory or file): 
          -<input type="button" value="Remove all files" onclick="RemoveFile();"/>
+<input type="button" value="Remove all files" onclick="RemoveFile();"/>
        3. To delete a directory and all the files in it, use the removeRecursively() method. To delete an individual file, use the remove() method: 
           <script>
-   function RemoveFile()
-   {
-      if (!fs) return;
-
-      var dirReader = fs.root.createReader();
-      var entry, i;
-
-      dirReader.readEntries(function(entries)
-         {
-            for (i = 0; i < entries.length; i++)
-            {
-               entry = entries[i];
-               if (entry.isDirectory)
-               {
-                  entry.removeRecursively(function() {}, errorHandler);
-               }
-               else
-               {
-                  entry.remove(function() {}, errorHandler);
-               }
-            }
-            document.querySelector('#resultSection').innerHTML =
-               'Directory emptied.';
-         }, errorHandler);
-   }
+   function RemoveFile()
+   {
+      if (!fs) return;
+
+      var dirReader = fs.root.createReader();
+      var entry, i;
+
+      dirReader.readEntries(function(entries)
+         {
+            for (i = 0; i < entries.length; i++)
+            {
+               entry = entries[i];
+               if (entry.isDirectory)
+               {
+                  entry.removeRecursively(function() {}, errorHandler);
+               }
+               else
+               {
+                  entry.remove(function() {}, errorHandler);
+               }
+            }
+            document.querySelector('#resultSection').innerHTML =
+               'Directory emptied.';
+         }, errorHandler);
+   }
 </script>
          @@ -530,8 +530,8 @@ end byte: <input type="text" id="endByte" name="endB For error handling, see Accessing a Sandboxed File System.
        -

        Figure: Deleting files

        -

        Deleting files

        +

        Figure: Deleting files

        +

        Deleting files

        Source Code

        diff --git a/org.tizen.guides/html/web/w3c/storage/indexdb_w.htm b/org.tizen.guides/html/web/w3c/storage/indexdb_w.htm index 332d8dc..f84c92e 100644 --- a/org.tizen.guides/html/web/w3c/storage/indexdb_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/indexdb_w.htm @@ -43,7 +43,7 @@

        Indexed Database

        - +

        In HTML5, an indexed database is a local storage used to store and manipulate data in a client. You can implement effective searches using an index as a simple storage structure in the key-value format.

        @@ -88,18 +88,18 @@ index. You can search and retrieve records stored in the 
         <script>
-   if (!window.webkitIndexedDB)
-   {
-      window.alert("Does not support IndexedDB");
-   }
-   else
-   {
-      var tizenDB = {}
-      var request = window.webkitIndexedDB.open("TizenIndexedDB");
-
-      request.onsuccess = function(e) {}
-      request.onerror = function(e) {/* Error handling */}
-   }
+   if (!window.webkitIndexedDB)
+   {
+      window.alert("Does not support IndexedDB");
+   }
+   else
+   {
+      var tizenDB = {}
+      var request = window.webkitIndexedDB.open("TizenIndexedDB");
+
+      request.onsuccess = function(e) {}
+      request.onerror = function(e) {/* Error handling */}
+   }
 </script>
        @@ -114,7 +114,7 @@ index. You can search and retrieve records stored in the

        Delete the generated database using the window.webkitIndexedDB.deleteDatabase() method:

         <script>
-   window.webkitIndexedDB.deleteDatabase('TizenIndexedDB');
+   window.webkitIndexedDB.deleteDatabase('TizenIndexedDB');
 </script>
        @@ -126,7 +126,7 @@ index. You can search and retrieve records stored in the

        Creating an Object Store

        - +

        An object store can derive keys from the following sources:

          @@ -145,26 +145,26 @@ index. You can search and retrieve records stored in the 
           <script>
-   var tizenDB = {}
-   var request = window.webkitIndexedDB.open("TizenIndexedDB");
-   request.onupgradeneeded = function(e)
-   {
-      tizenDB.db = event.target.result;
-      try
-      {
-         var objStore = tizenDB.db.createObjectStore("tizenStore", {keyPath: "key"});
-      }
-   };
+   var tizenDB = {}
+   var request = window.webkitIndexedDB.open("TizenIndexedDB");
+   request.onupgradeneeded = function(e)
+   {
+      tizenDB.db = event.target.result;
+      try
+      {
+         var objStore = tizenDB.db.createObjectStore("tizenStore", {keyPath: "key"});
+      }
+   };
 </script>
          -

          The name and key path of an independent object are defined in the object store. +

          The name and key path of an independent object are defined in the object store. The keyPath property makes the object store unique and must contain the key attribute to store data in the object store.

        • To delete the object store, use the deleteObjectStore() method:

           <script>
-   window.webkitIndexedDB.deleteObjectStore('tizenStore');
+   window.webkitIndexedDB.deleteObjectStore('tizenStore');
 </script>
          • @@ -174,7 +174,7 @@ The keyPath property makes the object store unique and must contain - +

          Managing Data

          Saving, accessing, and deleting data in an object store is a useful data management skill:

          @@ -185,23 +185,23 @@ The keyPath property makes the object store unique and must contain 
           <script>
-   objStore.transaction.oncomplete = function(e)
-   {
-      var trans = tizenDB.db.transaction("tizenStore", "readwrite");
-      var tizenStore = trans.objectStore("tizenStore");
-      var data =
-      {
-         "key": new Date().getTime(),
-         "text": "Tizen-" + Math.random()
-      };
-
-      var request = tizenStore.put(data);
-      request.onsuccess = function(e)
-      {
-         tizenDB.db.objectStoreId = request.result;
-         console.log(request.result);
-      };
-   }
+   objStore.transaction.oncomplete = function(e)
+   {
+      var trans = tizenDB.db.transaction("tizenStore", "readwrite");
+      var tizenStore = trans.objectStore("tizenStore");
+      var data =
+      {
+         "key": new Date().getTime(),
+         "text": "Tizen-" + Math.random()
+      };
+
+      var request = tizenStore.put(data);
+      request.onsuccess = function(e)
+      {
+         tizenDB.db.objectStoreId = request.result;
+         console.log(request.result);
+      };
+   }
 </script>
          @@ -211,12 +211,12 @@ The keyPath property makes the object store unique and must contain 
           <script>
-   var request = tizenStore.put(data);
-   request.onsuccess = function(e)
-   {
-      tizenDB.db.objectStoreId = request.result;
-      var data = tizenStore.get(tizenDB.db.objectStoreId);
-   };
+   var request = tizenStore.put(data);
+   request.onsuccess = function(e)
+   {
+      tizenDB.db.objectStoreId = request.result;
+      var data = tizenStore.get(tizenDB.db.objectStoreId);
+   };
 </script>
        • @@ -225,16 +225,16 @@ The keyPath property makes the object store unique and must contain 
           <script>
-   var request = tizenStore.put(data);
-   request.onsuccess = function(e)
-   {
-      tizenDB.db.objectStoreId = request.result;
-      var data = tizenStore.delete(tizenDB.db.objectStoreId);
-      data.onsuccess = function(e)
-      {
-         console.log(data);
-      }
-   };
+   var request = tizenStore.put(data);
+   request.onsuccess = function(e)
+   {
+      tizenDB.db.objectStoreId = request.result;
+      var data = tizenStore.delete(tizenDB.db.objectStoreId);
+      data.onsuccess = function(e)
+      {
+         console.log(data);
+      }
+   };
 </script>
          @@ -245,7 +245,7 @@ The keyPath property makes the object store unique and must contain - +

          Creating an Index

          Creating, accessing, and deleting an index is a useful data management skill:

          @@ -256,21 +256,21 @@ The keyPath property makes the object store unique and must contain 
           <script>
-   var objStore = tizenDB.db.createObjectStore("tizenStore", {keyPath: "key"});
-   tizenDB.index = objStore.createIndex("tizen01", "text");
+   var objStore = tizenDB.db.createObjectStore("tizenStore", {keyPath: "key"});
+   tizenDB.index = objStore.createIndex("tizen01", "text");

        • Access the index using the objStore.index() method:

          -   var dbIndex = objStore.index("tizen01");
+   var dbIndex = objStore.index("tizen01");

        • Delete the index using the objStore.deleteIndex() method:

          -   tizenDB.index = objStore.deleteIndex("tizen01");
+   tizenDB.index = objStore.deleteIndex("tizen01");
 </script>
          • diff --git a/org.tizen.guides/html/web/w3c/storage/storage_guide_w.htm b/org.tizen.guides/html/web/w3c/storage/storage_guide_w.htm index da0822a..1b475f3 100644 --- a/org.tizen.guides/html/web/w3c/storage/storage_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/storage_guide_w.htm @@ -49,7 +49,7 @@
        • Web SQL Database in mobile applications only

          Enables you to create databases and access them using SQL statements.

        - +
        diff --git a/org.tizen.guides/html/web/w3c/storage/web_storage_w.htm b/org.tizen.guides/html/web/w3c/storage/web_storage_w.htm index a805ec6..c46eb16 100644 --- a/org.tizen.guides/html/web/w3c/storage/web_storage_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/web_storage_w.htm @@ -64,14 +64,14 @@ is copied to the new window. However, if the data in the new window is edited, i

        You can save and read data in the local and session storages. You can also use the local storage to delete the data.

        Using a Local Storage

        - +

        Saving, reading, and deleting data in a local Web storage is a useful data management skill:

        1. To save data in the storage, use the setItem() method that saves data in the key-value format:

           <script>
-   localStorage.setItem(key.value, data.value);
+   localStorage.setItem(key.value, data.value);
 </script>
          @@ -85,12 +85,12 @@ is copied to the new window. However, if the data in the new window is edited, i

          To get the saved data, use the getItem() method with the data key:

           <script>
-   for (var i = 0; i < localStorage.length; i++)
-   {
-      localhtml +=
-         "<li>" + localStorage.key(i) + " : "
-         + localStorage.getItem(localStorage.key(i)) + "</li>";
-   }
+   for (var i = 0; i < localStorage.length; i++)
+   {
+      localhtml +=
+         "<li>" + localStorage.key(i) + " : "
+         + localStorage.getItem(localStorage.key(i)) + "</li>";
+   }
 </script>
          2. @@ -101,7 +101,7 @@ is copied to the new window. However, if the data in the new window is edited, i
        2. To delete a specific item, use the removeItem() method with the data key: 
           <script>
-   localStorage.removeItem(key.value);
+   localStorage.removeItem(key.value);
 </script>
          3. @@ -109,7 +109,7 @@ is copied to the new window. However, if the data in the new window is edited, i

          To delete all the data stored in the local storage, use the clear() method:

           <script>
-   localStorage.clear();
+   localStorage.clear();
 </script>
          @@ -126,9 +126,9 @@ is copied to the new window. However, if the data in the new window is edited, i - +

          Managing Data in Local and Session Storage

          - +

          With the setItem() method, you can store searches on certain conditions used in the browser by the user. When the user reconnects, the getItem() method is called to retrieve the stored data.

          Knowing how the same data is saved in local storage and session storage, and checking whether data exists when the browser is closed and reopened is a useful data management skill:

          @@ -137,12 +137,12 @@ is copied to the new window. However, if the data in the new window is edited, i

        3. Create the storage key and define a button element for saving the data:

           <body>
-   Storage key:
-   <input type="text" id="storageKey" style="width: 50px"/>
-   value:
-   <input type="text" id="storageData" style="width: 50px"/>
-   <input type="button" id="save" value="SAVE"
-          onclick="addStorage(); return false;" />
+   Storage key:
+   <input type="text" id="storageKey" style="width: 50px"/>
+   value:
+   <input type="text" id="storageData" style="width: 50px"/>
+   <input type="button" id="save" value="SAVE"
+          onclick="addStorage(); return false;" />
 </body>
          4. @@ -151,33 +151,33 @@ is copied to the new window. However, if the data in the new window is edited, i 
           <script>
-   function addStorage()
-   {
-      var key = document.getElementById("storageKey");
-      var data = document.getElementById("storageData");
-
-      /* Set the local storage item */
-      if ("localStorage" in window)
-      {
-         localStorage.setItem(key.value, data.value);
-         location.reload();
-      }
-      else
-      {
-         alert("no localStorage in window");
-      }
-
-      /* Set the session storage item */
-      if ("sessionStorage" in window)
-      {
-         sessionStorage.setItem(key.value, data.value);
-         location.reload();
-      }
-      else
-      {
-         alert("no sessionStorage in window");
-      }
-   }
+   function addStorage()
+   {
+      var key = document.getElementById("storageKey");
+      var data = document.getElementById("storageData");
+
+      /* Set the local storage item */
+      if ("localStorage" in window)
+      {
+         localStorage.setItem(key.value, data.value);
+         location.reload();
+      }
+      else
+      {
+         alert("no localStorage in window");
+      }
+
+      /* Set the session storage item */
+      if ("sessionStorage" in window)
+      {
+         sessionStorage.setItem(key.value, data.value);
+         location.reload();
+      }
+      else
+      {
+         alert("no sessionStorage in window");
+      }
+   }
 </script>
          @@ -186,39 +186,39 @@ is copied to the new window. However, if the data in the new window is edited, i 
           <script>
-   window.onload = function()
-   {
-      var localhtml = "";
-      var sessionhtml = "";
-
-      /* Get the local storage item */
-      for (var i = 0; i < localStorage.length; i++)
-      {
-         localhtml +=
-            "<li>" + localStorage.key(i) + " : "
-            + localStorage.getItem(localStorage.key(i)) + "</li>";
-      }
-      document.getElementById("localStorageData").innerHTML = localhtml;
-
-      /* Get the session storage item */
-      for (var j = 0; j < sessionStorage.length; j++)
-      {
-         sessionhtml +=
-            "<li>" + sessionStorage.key(j) + " : "
-            + sessionStorage.getItem(sessionStorage.key(j)) + "</li>";
-      }
-      document.getElementById("sessionStorageData").innerHTML = sessionhtml;
-   }
+   window.onload = function()
+   {
+      var localhtml = "";
+      var sessionhtml = "";
+
+      /* Get the local storage item */
+      for (var i = 0; i < localStorage.length; i++)
+      {
+         localhtml +=
+            "<li>" + localStorage.key(i) + " : "
+            + localStorage.getItem(localStorage.key(i)) + "</li>";
+      }
+      document.getElementById("localStorageData").innerHTML = localhtml;
+
+      /* Get the session storage item */
+      for (var j = 0; j < sessionStorage.length; j++)
+      {
+         sessionhtml +=
+            "<li>" + sessionStorage.key(j) + " : "
+            + sessionStorage.getItem(sessionStorage.key(j)) + "</li>";
+      }
+      document.getElementById("sessionStorageData").innerHTML = sessionhtml;
+   }
 </script>
          -

          Figure: Displaying local and session storage data (in mobile applications only)

          -

          Displaying local and session storage data (in mobile applications only)

          - +

          Figure: Displaying local and session storage data (in mobile applications only)

          +

          Displaying local and session storage data (in mobile applications only)

          +

          If the browser is closed and reopened, only the local storage data can be displayed, as illustrated in the following figure.

          - -

          Figure: Displaying data after reopening the browser (in mobile applications only)

          -

          Displaying data after reopening the browser (in mobile applications only)

          + +

          Figure: Displaying data after reopening the browser (in mobile applications only)

          +

          Displaying data after reopening the browser (in mobile applications only)

        Source Code

        diff --git a/org.tizen.guides/html/web/w3c/storage/websql_w.htm b/org.tizen.guides/html/web/w3c/storage/websql_w.htm index b8c9fb8..a4fbb24 100644 --- a/org.tizen.guides/html/web/w3c/storage/websql_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/websql_w.htm @@ -41,7 +41,7 @@
      49. Accessing SQL Results Synchronously
      50. Handling a Syntax Error Synchronously
        51. - +

        Related Info

          @@ -54,11 +54,11 @@

          Web SQL Database

          - +

          The Web SQL database provides a way to store databases that can be queried using various SQL statements. Each Tizen application can store multiple databases and each one of them can store multiple tables. Databases can be accessed using the SQL language, which is a common standard for these kinds of applications.

          - -

          This feature is supported in mobile applications only.

          - + +

          This feature is supported in mobile applications only.

          +

          When working with the SQL database, you can use the following approaches:

          • Asynchronous database API @@ -96,15 +96,15 @@ 
             var db;
 var version = 1.0;
-var dbName = "tizendb";
-var dbDisplayName = "tizen_test_db";
+var dbName = "tizendb";
+var dbDisplayName = "tizen_test_db";
 var dbSize = 2 * 1024 * 1024;
 try
 {
-   db = openDatabase(dbName, version, dbDisplayName, dbSize, function(database)
-      {
-         alert("database creation callback");
-      });
+   db = openDatabase(dbName, version, dbDisplayName, dbSize, function(database)
+      {
+         alert("database creation callback");
+      });
 }

            The method takes the following arguments: unique name of the database, expected version of the database to be opened (if an empty string is given any version can be loaded), display name, the estimated size of database (number of bytes), and, optionally, the database creation event handler.

            @@ -131,7 +131,7 @@ try 
             db.transaction(function(t) {/* Place SQL statements here */},
-               function() {alert("SQL statements were executed successfully.");});
+               function() {alert("SQL statements were executed successfully.");});

            The difference between the transaction() and readTransaction() methods is that the latter cannot be used with SQL statements that change the database (such as INSERT, UPDATE, DELETE, or CREATE).

            @@ -144,21 +144,21 @@ db.transaction(function(t) {/* Place SQL statements here */},

          • To execute a SQL statement, use the executeSql() method. The SQL statement is the first parameter of the method and cannot contain SQL transaction statements (such as BEGIN, END, or ROLLBACK):

            -t.executeSql("CREATE TABLE tizenTable (id INTEGER PRIMARY KEY, title TEXT,
-              content TEXT, insertDay DATETIME)", [],
-             function(sqlTransaction, sqlResultSet)
-   {
-      alert("Table has been created.");
-   }, function(sqlTransaction, sqlError)
-   {
-      /* Error handling */
-   });
+t.executeSql("CREATE TABLE tizenTable (id INTEGER PRIMARY KEY, title TEXT,
+              content TEXT, insertDay DATETIME)", [],
+             function(sqlTransaction, sqlResultSet)
+   {
+      alert("Table has been created.");
+   }, function(sqlTransaction, sqlError)
+   {
+      /* Error handling */
+   });

          • Pass arguments to the SQL statement:

            -sqlTransaction.executeSql("SELECT * FROM tizenTable WHERE id=?", [value]);
+sqlTransaction.executeSql("SELECT * FROM tizenTable WHERE id=?", [value]);
            @@ -173,7 +173,7 @@ sqlTransaction.executeSql("SELECT * FROM tizenTable WHERE id=?", [valu - +

            Accessing SQL Results Asynchronously

            To provide users with SQL database features, you must learn to access SQL statement results asynchronously:

            @@ -183,12 +183,12 @@ sqlTransaction.executeSql("SELECT * FROM tizenTable WHERE id=?", [valu
            • The result object of the INSERT statement contains the insert ID, which stores the identifier of the added record. If multiple records were inserted, the insert ID contains the ID of the last inserted record: 
              -sqlTransaction.executeSql("INSERT INTO tizenTable(title, content, insertDay)
-                           VALUES (?, ?, ?)", [title, context, day],
-                          function(sqlTransaction, sqlResultSet)
-   {
-      alert("The 'id' of the new record  is " + sqlResultSet.insertId);
-   });
+sqlTransaction.executeSql("INSERT INTO tizenTable(title, content, insertDay)
+                           VALUES (?, ?, ?)", [title, context, day],
+                          function(sqlTransaction, sqlResultSet)
+   {
+      alert("The 'id' of the new record  is " + sqlResultSet.insertId);
+   });
              • @@ -196,17 +196,17 @@ sqlTransaction.executeSql("INSERT INTO tizenTable(title, content, insertDay It contains the number of selected rows (length field) and the item() method. Use the method with the index argument (integer value from 0 to rows.length - 1) to get individual records: 
              -sqlTransaction.executeSql("SELECT id, title, author FROM books", [],
-                          function(sqlTransaction, sqlResultSet)
-   {
-      var book, i, booksNumber = sqllResultSet.rows.length;
-      for (i = 0; i < booksNumber; i++)
-      {
-         book = sqlResultSet.rows.item(i);
-         alert("id: " + book.id + ", title: " + book.title
-               + ", author: " + book.author);
-      }
-   });
+sqlTransaction.executeSql("SELECT id, title, author FROM books", [],
+                          function(sqlTransaction, sqlResultSet)
+   {
+      var book, i, booksNumber = sqllResultSet.rows.length;
+      for (i = 0; i < booksNumber; i++)
+      {
+         book = sqlResultSet.rows.item(i);
+         alert("id: " + book.id + ", title: " + book.title
+               + ", author: " + book.author);
+      }
+   });
            @@ -218,7 +218,7 @@ sqlTransaction.executeSql("SELECT id, title, author FROM books", [], - +

            Handling a Syntax Error Asynchronously

            To provide users with SQL database features, you must learn to handle SQL database-related errors asynchronously:

            @@ -227,19 +227,19 @@ sqlTransaction.executeSql("SELECT id, title, author FROM books", [],

            Handle a syntax error in the sqlError object:

            -sqlTransaction.executeSql("SELECT * FROM notExistingTable", [],
-                          function(sqlTransaction, sqlResultSet) {},
-                          function(sqlTransaction, sqlError)
-   {
-      switch (sqlError.code)
-      {
-         case sqlError.SYNTAX_ERR:
-            alert("Syntax error has occurred. " + sqlError.message);
-            break;
-         default:
-             alert("Other error");
-      }
-   });
+sqlTransaction.executeSql("SELECT * FROM notExistingTable", [],
+                          function(sqlTransaction, sqlResultSet) {},
+                          function(sqlTransaction, sqlError)
+   {
+      switch (sqlError.code)
+      {
+         case sqlError.SYNTAX_ERR:
+            alert("Syntax error has occurred. " + sqlError.message);
+            break;
+         default:
+             alert("Other error");
+      }
+   });

            Other types of errors that can occur are exceptions. The sqlException object has the same fields as the sqlError object but it must be handled in the try - catch block.

            • @@ -256,11 +256,11 @@ sqlTransaction.executeSql("SELECT * FROM notExistingTable", [], var databaseSync = null; try { -   databaseSync = openDatabaseSync("dbName", "1.0", "display database name", -                                   1024 * 1024, function(databaseSync) -      { -         alert("database creation callback"); -      }); + databaseSync = openDatabaseSync("dbName", "1.0", "display database name", + 1024 * 1024, function(databaseSync) + { + alert("database creation callback"); + }); } @@ -274,7 +274,7 @@ try

            Executing SQL Statements Synchronously

            - +

            To provide users with SQL database features, you must learn to execute SQL statements synchronously:

              @@ -283,7 +283,7 @@ try 
               database.transaction(function(sqlTransactionSync) {/* Place SQL statements here */},
-                     function() {alert("SQL statements were executed successfully.");});
+                     function() {alert("SQL statements were executed successfully.");});

              The difference between the transaction() and readTransaction() methods is that the latter cannot be used with SQL statements that change the database (such as INSERT, UPDATE, DELETE, or CREATE).

              @@ -297,16 +297,16 @@ database.transaction(function(sqlTransactionSync) {/* Place SQL statements here

              To execute a SQL statement, use the executeSql() method. The SQL statement is the first parameter of the method and cannot contain SQL transaction statements (such as BEGIN, END, or ROLLBACK):

               var sqlResultSet =
-      sqlTransactionSync.executeSql("CREATE TABLE IF NOT EXISTS books(id INTEGER
-                                     PRIMARY KEY, title TEXT, author TEXT)", []);
+      sqlTransactionSync.executeSql("CREATE TABLE IF NOT EXISTS books(id INTEGER
+                                     PRIMARY KEY, title TEXT, author TEXT)", []);

            1. Pass arguments to the SQL statement:

               var sqlResultSet =
-      sqlTransactionSync.executeSql("SELECT id FROM books WHERE title=? AND author=?",
-                                    ["Ulysses", "James Joyce"]);
+      sqlTransactionSync.executeSql("SELECT id FROM books WHERE title=? AND author=?",
+                                    ["Ulysses", "James Joyce"]);
              @@ -326,10 +326,10 @@ var sqlResultSet =
            2. The result object of the INSERT statement contains the insert ID, which stores the identifier of the added record. If multiple records were inserted, the insert ID contains the ID of the last inserted record: 
               var sqlResultSet =
-      sqlTransactionSync.executeSql("INSERT INTO books (id, title, author)
-                                     VALUES(NULL, ?, ?)",
-                                    ["Ulysses", "James Joyce"]);
-alert("The 'id' of the new record  is " + sqlResultSet.insertId);
+      sqlTransactionSync.executeSql("INSERT INTO books (id, title, author)
+                                     VALUES(NULL, ?, ?)",
+                                    ["Ulysses", "James Joyce"]);
+alert("The 'id' of the new record  is " + sqlResultSet.insertId);
              3. @@ -338,13 +338,13 @@ It contains the number of selected rows (length field) and the item() var sqlResultSet = -      sqlTransactionSync.executeSql("SELECT id, title, author FROM books"); + sqlTransactionSync.executeSql("SELECT id, title, author FROM books"); var book, i, booksNumber = sqlResultSet.rows.length; for (i = 0; i < booksNumber; i++) { -   book = sqlResultSet.rows.item(i); -   alert("id: " + book.id + ", title: " -         + book.title + ", author: " + book.author); + book = sqlResultSet.rows.item(i); + alert("id: " + book.id + ", title: " + + book.title + ", author: " + book.author); } @@ -361,18 +361,18 @@ for (i = 0; i < booksNumber; i++) 
               try
 {
-   databaseSync.transaction(function(sqlTransactionSync)
-      {
-         var sqlResultSet =
-            sqlTransactionSync.executeSql("DELETE FROM books WHERE id=?", [id]);
-      });
-   /* Instructions if the above SQL statement is executed successfully */
+   databaseSync.transaction(function(sqlTransactionSync)
+      {
+         var sqlResultSet =
+            sqlTransactionSync.executeSql("DELETE FROM books WHERE id=?", [id]);
+      });
+   /* Instructions if the above SQL statement is executed successfully */
 }
 catch (sqlException)
 {
-   postMessage("An error has occurred during deleting the book from the table!
-                Error code: " + sqlException.code
-               + " (" + sqlException.message + ").");
+   postMessage("An error has occurred during deleting the book from the table!
+                Error code: " + sqlException.code
+               + " (" + sqlException.message + ").");
 }
              diff --git a/org.tizen.guides/html/web/w3c/supplement/camera_w.htm b/org.tizen.guides/html/web/w3c/supplement/camera_w.htm index 7550b59..c810b2d 100644 --- a/org.tizen.guides/html/web/w3c/supplement/camera_w.htm +++ b/org.tizen.guides/html/web/w3c/supplement/camera_w.htm @@ -72,10 +72,10 @@ 
               var stream;
 navigator.webkitGetUserMedia({video: true, audio: false}, gotStreamCallback,
-                             noStreamCallback);
+                             noStreamCallback);
 function gotStream(rStream)
 {
-   stream = rStream;
+   stream = rStream;
 }
              @@ -111,11 +111,11 @@ cameraControl.image.takePicture(takePictureSuccess, takePictureError); 
               var recordingSetting =
 {
-   fileName: "sample.3gp";
+   fileName: "sample.3gp";
 }
 cameraControl.recorder.applySettings(recordingSetting,
-                                     recorderSettingSuccessCallback,
-                                     recorderSettingErrorCallback);
+                                     recorderSettingSuccessCallback,
+                                     recorderSettingErrorCallback);
              @@ -135,14 +135,14 @@ cameraControl.recorder.applySettings(recordingSetting, 
               function initCameraPreview()
 {
-   navigator.webkitGetUserMedia({video: true, audio: false},
-                                onPreviewStream,
-                                onPreviewStreamError);
+   navigator.webkitGetUserMedia({video: true, audio: false},
+                                onPreviewStream,
+                                onPreviewStreamError);
 }
 
 function onPreviewStream(stream)
 {
-   cameraStream = stream;
+   cameraStream = stream;
 }
              @@ -150,14 +150,14 @@ function onPreviewStream(stream) 
               function onVisibilityChange()
 {
-   if (document.visibilityState !== 'visible')
-   {
-      cameraStream.stop();
-   }
-   else
-   {
-      initCameraPreview();
-   }
+   if (document.visibilityState !== 'visible')
+   {
+      cameraStream.stop();
+   }
+   else
+   {
+      initCameraPreview();
+   }
 }
              diff --git a/org.tizen.guides/html/web/w3c/supplement/fullscreen_w.htm b/org.tizen.guides/html/web/w3c/supplement/fullscreen_w.htm index 0c3f22c..bfa2fb5 100644 --- a/org.tizen.guides/html/web/w3c/supplement/fullscreen_w.htm +++ b/org.tizen.guides/html/web/w3c/supplement/fullscreen_w.htm @@ -60,20 +60,20 @@

              In the following example, the screen contains an image, a video playback area, and 2 buttons. For the fullscreen mode, the image and 1 button are defined as an element (fs-image). The video playback area (video) is another element.

               <h1>FullScreen</h1>
-<div class="example_body">
-   <div id='fs-image'>
-      <img src="images/tizen_logo_light.png" alt="">
-      <p id="log"></p>
-      <p><button id="toggleImage">Toggle Image fullscreen</button></p>
-   </div>
-   <div>
-      <video id="video" controls preload="none"
-             poster="http://media.w3.org/2010/05/sintel/poster.png">
-         <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4"
-                 type="video/mp4">
-      </video>
-   </div>
-   <button id="toggleVideo">Toggle Video fullscreen</button>
+<div class="example_body">
+   <div id='fs-image'>
+      <img src="images/tizen_logo_light.png" alt="">
+      <p id="log"></p>
+      <p><button id="toggleImage">Toggle Image fullscreen</button></p>
+   </div>
+   <div>
+      <video id="video" controls preload="none"
+             poster="http://media.w3.org/2010/05/sintel/poster.png">
+         <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4"
+                 type="video/mp4">
+      </video>
+   </div>
+   <button id="toggleVideo">Toggle Video fullscreen</button>
 </div>
              @@ -81,14 +81,14 @@

            3. Define the fullscreen mode style by expressing the fullscreen status of the element with the :full-screen CSS pseudo-class (-webkit-full-screen):

               <style>
-   #fs-image: -webkit-full-screen
-   {
-      background: #39c;
-   }
-   #fs-image: full-screen
-   {
-      background: #39c;
-   }
+   #fs-image: -webkit-full-screen
+   {
+      background: #39c;
+   }
+   #fs-image: full-screen
+   {
+      background: #39c;
+   }
 </style>
              4. @@ -96,36 +96,36 @@ 
               <script>
-   function toggleFullScreenHandler(e, target)
-   {
-      var target = document.getElementById(target);
-      /* Check whether in fullscreen mode */
-      if (document.webkitIsFullScreen)
-      {
-         /* Cancel the fullscreen mode */
-         document.webkitCancelFullScreen();
-      }
-      else
-      {
-         /* Switch on the fullscreen mode */
-         target.webkitRequestFullScreen();
-      }
-   }
-
-   document.getElementById('toggleImage').addEventListener('click', function(e)
-      {
-         toggleFullScreenHandler(e, 'fs-image')
-      }, false);
-
-   document.getElementById('toggleVideo').addEventListener('click', function(e)
-      {
-         toggleFullScreenHandler(e, 'video')
-      }, false);
-
-   document.addEventListener('click', function(e)
-      {
-         toggleFullScreenHandler(e)
-      }, false);
+   function toggleFullScreenHandler(e, target)
+   {
+      var target = document.getElementById(target);
+      /* Check whether in fullscreen mode */
+      if (document.webkitIsFullScreen)
+      {
+         /* Cancel the fullscreen mode */
+         document.webkitCancelFullScreen();
+      }
+      else
+      {
+         /* Switch on the fullscreen mode */
+         target.webkitRequestFullScreen();
+      }
+   }
+
+   document.getElementById('toggleImage').addEventListener('click', function(e)
+      {
+         toggleFullScreenHandler(e, 'fs-image')
+      }, false);
+
+   document.getElementById('toggleVideo').addEventListener('click', function(e)
+      {
+         toggleFullScreenHandler(e, 'video')
+      }, false);
+
+   document.addEventListener('click', function(e)
+      {
+         toggleFullScreenHandler(e)
+      }, false);
 </script>
              diff --git a/org.tizen.guides/html/web/w3c/supplement/supplement_guide_w.htm b/org.tizen.guides/html/web/w3c/supplement/supplement_guide_w.htm index 7594f59..5832987 100644 --- a/org.tizen.guides/html/web/w3c/supplement/supplement_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/supplement/supplement_guide_w.htm @@ -5,20 +5,20 @@ - + - Supplementary Features - + Supplementary Features + - +

              Mobile Web Wearable Web

              - +

              Dependencies

              -
              +

              Supplementary Features

              @@ -43,11 +43,11 @@
            4. WebGL - Khronos in mobile and wearable applications only

              Enables you to use the WebGL graphics library to create 3D visual elements.

            5. FullScreen API - Mozilla in mobile applications only -

              Enables you to display an element on fullscreen.

              6. +

              Enables you to display an element on fullscreen.

            6. Camera API (Tizen Extension) in wearable applications only -

              Enables you to control the camera options, capture images, and record video.

              7. +

              Enables you to control the camera options, capture images, and record video.

          - +
          diff --git a/org.tizen.guides/html/web/w3c/supplement/task_camera_w.htm b/org.tizen.guides/html/web/w3c/supplement/task_camera_w.htm index 8eca5fb..cafaf3f 100644 --- a/org.tizen.guides/html/web/w3c/supplement/task_camera_w.htm +++ b/org.tizen.guides/html/web/w3c/supplement/task_camera_w.htm @@ -5,13 +5,13 @@ - + - Task: Camera + Task: Camera @@ -20,7 +20,7 @@

          Wearable Web

          - +

          Dependencies

          -
        +
        @@ -61,59 +61,59 @@

        The Camera sample application layout contains 3 screens: the main screen that shows the camera view port and the mode control, the preview screen that shows the camera preview, and the settings screen that allows you to define the camera settings.

        The application uses a simple MV (Model View) architecture. The js/core directory contains files that implement a simple AMD (Asynchronous Module Definition) and specify module defining.

        - -

        Defining the Main Screen

        -
          + +

          Defining the Main Screen

          +
          1. index.html Source File

            The main screen displays the camera view port and buttons for camera modes and settings. In addition, it contains a progress area for displaying the progress of a recording.

            The screen is styled with the css/style.css file that contains both common styling for all screens and list views, as well as styles for separate elements of each screen. The JavaScript implementation for the screen is located in the js/views/main.js file.

            -<div class="ui-page" id="main">
-   <div class="ui-content">
-      <video id="camera-preview"></video>
-      <button type="button" class="ui-btn hidden navigation" id="mode-btn"></button>
-      <button type="button" class="ui-btn hidden navigation"
-              id="settings-btn"></button>
-      <div id="record-progress" class="hidden">
-         <div id="record-progress-label">
-            <span id="record-progress-label-val"></span>/
-            <span id="record-progress-label-max"></span> secs
-         </div>
-         <div id="record-progress-val"></div>
-      </div>
-      <div id="focus-container" class="hidden">
-         <div id="focus-frame"></div>
-      </div>
-   </div>
+<div class="ui-page" id="main">
+   <div class="ui-content">
+      <video id="camera-preview"></video>
+      <button type="button" class="ui-btn hidden navigation" id="mode-btn"></button>
+      <button type="button" class="ui-btn hidden navigation"
+              id="settings-btn"></button>
+      <div id="record-progress" class="hidden">
+         <div id="record-progress-label">
+            <span id="record-progress-label-val"></span>/
+            <span id="record-progress-label-max"></span> secs
+         </div>
+         <div id="record-progress-val"></div>
+      </div>
+      <div id="focus-container" class="hidden">
+         <div id="focus-frame"></div>
+      </div>
+   </div>
 </div>

          Defining the Preview Screen

          -
            +
            1. index.html Source File

              The preview screen displays the image and video preview.

              The screen is styled with the css/style.css file that contains both common styling for all screens and list views, as well as styles for separate elements of each screen. The JavaScript implementation for the screen is located in the js/views/preview.js file.

              -<div class="ui-page" id="preview">
-   <div class="ui-content paused">
-      <img id="preview-picture" class="hidden"/>
-      <video id="preview-video" class="hidden"></video>
-      <div id="preview-foreground" class="paused hidden"></div>
-   </div>
+<div class="ui-page" id="preview">
+   <div class="ui-content paused">
+      <img id="preview-picture" class="hidden"/>
+      <video id="preview-video" class="hidden"></video>
+      <div id="preview-foreground" class="paused hidden"></div>
+   </div>
 </div>
            -

            Defining the Settings Screen

            -
              +

              Defining the Settings Screen

              +
              1. index.html Source File

                The Settings screen displays the picture and video size and format settings.

                @@ -122,28 +122,28 @@

                The screen is styled with the css/style.css file that contains both common styling for all screens and list views, as well as styles for separate elements of each screen. The JavaScript implementation for the screen is located in the js/views/settings.js file.

                -<div class="ui-page" id="settings">
-   <div class="ui-header" data-position="fixed">
-      <h2 class="ui-title">Settings</h2>
-   </div>
-   <div class="ui-content">
-      <ul class="ui-listview">
-         <li><a id="picture-size-btn">Picture size</a></li>
-         <li><a id="picture-format-btn">Picture format</a></li>
-         <li><a id="recording-format-btn">Recording format</a></li>
-      </ul>
-   </div>
+<div class="ui-page" id="settings">
+   <div class="ui-header" data-position="fixed">
+      <h2 class="ui-title">Settings</h2>
+   </div>
+   <div class="ui-content">
+      <ul class="ui-listview">
+         <li><a id="picture-size-btn">Picture size</a></li>
+         <li><a id="picture-format-btn">Picture format</a></li>
+         <li><a id="recording-format-btn">Recording format</a></li>
+      </ul>
+   </div>
 </div>
 
-<div class="ui-page" id="picture-size">
-   <div class="ui-header" data-position="fixed">
-      <h2 class="ui-title">Picture size</h2>
-   </div>
-   <div class="ui-content">
-      <div class="listbox">
-         <ul class="ui-listview" id="picture-size-list"></ul>
-      </div>
-   </div>
+<div class="ui-page" id="picture-size">
+   <div class="ui-header" data-position="fixed">
+      <h2 class="ui-title">Picture size</h2>
+   </div>
+   <div class="ui-content">
+      <div class="listbox">
+         <ul class="ui-listview" id="picture-size-list"></ul>
+      </div>
+   </div>
 </div>
 <!--Picture and recording format have similar screens-->
                @@ -152,12 +152,12 @@

                Defining the Preview

                - +

                This section builds upon the elements described in Accessing the Camera Device.

                -

                Initializing the Preview

                -
                  +

                  Initializing the Preview

                  +
                  1. js/views/main.js Source File @@ -165,58 +165,58 @@

                    After launching the application, set the variables for the camera preview, call the initCameraPreview() method to initialize the preview, and register the event handler for when the camera is ready to display the preview.

                     var e = req.core.event,
-    page = null,
-    camera = req.models.camera,
-    cameraPreview = null;
+    page = null,
+    camera = req.models.camera,
+    cameraPreview = null;
 /* Initialize module */
 function init()
 {
-   page = document.getElementById('main');
-   cameraPreview = document.getElementById('camera-preview');
-   bindEvents();
-   initCameraPreview();
+   page = document.getElementById('main');
+   cameraPreview = document.getElementById('camera-preview');
+   bindEvents();
+   initCameraPreview();
 }
-e.listeners({'camera.ready': onCameraReady});
+e.listeners({'camera.ready': onCameraReady});

                  2. In the initCameraPreview() method, call the requestForCameraStream() method to retrieve the media stream from the camera.

                     function requestForCameraStream()
 {
-   previewInitAttemtps += 1;
-   navigator.webkitGetUserMedia({video: true, audio: true},
-                                onPreviewStream, onPreviewStreamError);
+   previewInitAttemtps += 1;
+   navigator.webkitGetUserMedia({video: true, audio: true},
+                                onPreviewStream, onPreviewStreamError);
 }

                Displaying the Preview

                -
                  -
                1. js/views/main.js Source File +
                    +
                  1. js/views/main.js Source File

                    If you successfully retrieve the media stream from the camera, use the onPreviewStream() event handler to first call the registerStream() method and then play the preview with the play() method.

                     function onPreviewStream(stream)
 {
-   previewInitAttemtps = 0;
-   cameraStream = stream;
-   cameraPreview.src = streamUrl;
-   camera.registerStream(cameraStream);
-   if (pageHelper.isPageActive(page))
-   {
-      cameraPreview.play();
-   }
+   previewInitAttemtps = 0;
+   cameraStream = stream;
+   cameraPreview.src = streamUrl;
+   camera.registerStream(cameraStream);
+   if (pageHelper.isPageActive(page))
+   {
+      cameraPreview.play();
+   }
 }
                    2. -
                  2. js/models/camera.js Source File +
                  3. js/models/camera.js Source File

                    1. In the registerStream() method, create the camera control for the media stream.

                       function registerStream(mediaStream)
 {
-   navigator.tizCamera.createCameraControl(mediaStream,
-                                           onCameraControlCreated,
-                                           onCameraControlError);
+   navigator.tizCamera.createCameraControl(mediaStream,
+                                           onCameraControlCreated,
+                                           onCameraControlError);
 }
                      2. @@ -227,9 +227,9 @@ function registerStream(mediaStream) 
                       function onCameraControlCreated(control)
 {
-   cameraControl = control;
-   initCameraSettings();
-   e.fire('camera.ready');
+   cameraControl = control;
+   initCameraSettings();
+   e.fire('camera.ready');
 }
                      @@ -237,18 +237,18 @@ function onCameraControlCreated(control) 
                       function initCameraSettings()
 {
-   var pictureFormats = null,
-       pictureSizes = null;
-   cameraSettings = storage.get(STORAGE_SETTINGS_KEY);
-   if (!cameraSettings)
-   {
-      cameraSettings = {};
-      pictureFormats = getAvailablePictureFormats();
-      cameraSettings.pictureFormat = pictureFormats[0];
-      pictureSizes = getAvailablePictureSizes();
-      cameraSettings.pictureSize = pictureSizes[0];
-      saveCameraSettings();
-   }
+   var pictureFormats = null,
+       pictureSizes = null;
+   cameraSettings = storage.get(STORAGE_SETTINGS_KEY);
+   if (!cameraSettings)
+   {
+      cameraSettings = {};
+      pictureFormats = getAvailablePictureFormats();
+      cameraSettings.pictureFormat = pictureFormats[0];
+      pictureSizes = getAvailablePictureSizes();
+      cameraSettings.pictureSize = pictureSizes[0];
+      saveCameraSettings();
+   }
 }
                    4. @@ -257,11 +257,11 @@ function initCameraSettings() 
                     function onCameraReady()
 {
-   previewInitInProgress = false;
-   if (pageHelper.isPageActive(page))
-   {
-      cameraPreview.play();
-   }
+   previewInitInProgress = false;
+   if (pageHelper.isPageActive(page))
+   {
+      cameraPreview.play();
+   }
 }
                    @@ -269,39 +269,39 @@ function onCameraReady()

                    Capturing Images

                    - +

                    This section builds upon the elements described in Managing the Camera.

                    - +

                    Initializing the Image Capture

                    -
                      +
                      1. js/views/main.js Source File

                        Set the needed variables and events for the image capture.

                         var e = req.core.event,
-    camera = req.models.camera,
-    page = null,
-    cameraPreview = null,
-    focusContainer = null,
-    focusFrame = null,
-    photoMode = true,
+    camera = req.models.camera,
+    page = null,
+    cameraPreview = null,
+    focusContainer = null,
+    focusFrame = null,
+    photoMode = true,
 
 /* Initialize the module */
 function init()
 {
-   cameraPreview = document.getElementById('camera-preview');
-   focusContainer = document.getElementById('focus-container');
-   focusFrame = document.getElementById('focus-frame');
-   bindEvents();
+   cameraPreview = document.getElementById('camera-preview');
+   focusContainer = document.getElementById('focus-container');
+   focusFrame = document.getElementById('focus-frame');
+   bindEvents();
 }
 
 e.listeners(
 {
-   'camera.shutter': onCameraShutter,
-   'camera.picture.done': onPictureDone,
-   'camera.autofocus.start': onAutoFocusStart,
-   'camera.autofocus.success': onAutoFocusSuccess,
-   'camera.autofocus.failure': onAutoFocusFailure
+   'camera.shutter': onCameraShutter,
+   'camera.picture.done': onPictureDone,
+   'camera.autofocus.start': onAutoFocusStart,
+   'camera.autofocus.success': onAutoFocusSuccess,
+   'camera.autofocus.failure': onAutoFocusFailure
 });
                        2. @@ -311,52 +311,52 @@ e.listeners( 
                         function onCameraPreviewClick()
 {
-   if (photoMode)
-   {
-      takePhoto();
-   }
-   else
-   {
-      /* Record video */
-   }
+   if (photoMode)
+   {
+      takePhoto();
+   }
+   else
+   {
+      /* Record video */
+   }
 }
 
 function takePhoto()
 {
-   camera.takePicture();
+   camera.takePicture();
 }
                      -

                      Auto-focusing an Image

                      -
                        +

                        Auto-focusing an Image

                        +
                        1. js/models/camera.js Source File

                          To capture an image, first set the needed variables and activate the auto-focus.

                           var e = req.core.event,
-    storage = req.core.storage.localstorage,
-    dateHelper = req.helpers.date,
-    PICTURE_DESTINATION_DIRECTORY = '/opt/usr/media/Images',
-    cameraControl = null,
-    picturePath = '';
+    storage = req.core.storage.localstorage,
+    dateHelper = req.helpers.date,
+    PICTURE_DESTINATION_DIRECTORY = '/opt/usr/media/Images',
+    cameraControl = null,
+    picturePath = '';
 
 function takePicture()
 {
-   if (busy)
-   {
-      return false;
-   }
-   busy = true;
-   e.fire('camera.autofocus.start');
-   if (cameraControl.autoFocus())
-   {
-      setTimeout(onAutoFocusSuccess, AUTOFOCUS_DELAY);
-   }
-   else
-   {
-      /* Error handling */
-   }
-
-   return true;
+   if (busy)
+   {
+      return false;
+   }
+   busy = true;
+   e.fire('camera.autofocus.start');
+   if (cameraControl.autoFocus())
+   {
+      setTimeout(onAutoFocusSuccess, AUTOFOCUS_DELAY);
+   }
+   else
+   {
+      /* Error handling */
+   }
+
+   return true;
 }
                          2. @@ -365,13 +365,13 @@ function takePicture() 
                           function onAutoFocusStart()
 {
-   showAutoFocus();
+   showAutoFocus();
 }
 
 function showAutoFocus()
 {
-   focusContainer.classList.remove('hidden');
-   focusFrame.classList.add('autofocus-animation');
+   focusContainer.classList.remove('hidden');
+   focusFrame.classList.add('autofocus-animation');
 }
                          @@ -380,8 +380,8 @@ function showAutoFocus() 
                           function onAutoFocusSuccess()
 {
-   e.fire('camera.autofocus.success');
-   setTimeout(startTakingPicture, TAKE_PICTURE_DELAY);
+   e.fire('camera.autofocus.success');
+   setTimeout(startTakingPicture, TAKE_PICTURE_DELAY);
 }
                          @@ -391,28 +391,28 @@ function onAutoFocusSuccess() 
                           function onAutoFocusSuccess()
 {
-   focusFrame.classList.add('autofocus-success');
+   focusFrame.classList.add('autofocus-success');
 }

                        Capturing an Image

                        -
                          +
                          1. js/models/camera.js Source File -

                            In the startTakingPicture() method, set name and path of the captured image file, and the format and size of the file. +

                            In the startTakingPicture() method, set name and path of the captured image file, and the format and size of the file. 

                             function startTakingPicture()
 {
-   var settings = {},
-       fileName = '';
-       fileName = createPictureFileName();
-   picturePath = PICTURE_DESTINATION_DIRECTORY + '/' + fileName;
-   settings.fileName = fileName;
-   settings.pictureFormat = getPictureFormat();
-   settings.pictureSize = getPictureSize();
+   var settings = {},
+       fileName = '';
+       fileName = createPictureFileName();
+   picturePath = PICTURE_DESTINATION_DIRECTORY + '/' + fileName;
+   settings.fileName = fileName;
+   settings.pictureFormat = getPictureFormat();
+   settings.pictureSize = getPictureSize();
 
-   cameraControl.image.applySettings(settings, onImageSettingsApplied,
-                                     onImageSettingsError);
+   cameraControl.image.applySettings(settings, onImageSettingsApplied,
+                                     onImageSettingsError);
 }
                            2. @@ -422,12 +422,12 @@ function startTakingPicture() 
                             function onImageSettingsApplied()
 {
-   cameraControl.image.takePicture(onPictureDone, onPictureError);
+   cameraControl.image.takePicture(onPictureDone, onPictureError);
 }
 
 function onPictureDone()
 {
-   e.fire('camera.picture.done', {path: picturePath});
+   e.fire('camera.picture.done', {path: picturePath});
 }
                            @@ -438,18 +438,18 @@ function onPictureDone() /* Called when the camera.picture.done event is fired */ function onPictureDone(ev) { -   var path = ev.detail.path; -   hideAutoFocus(); -   e.fire('views.preview.show', {picture: path}); + var path = ev.detail.path; + hideAutoFocus(); + e.fire('views.preview.show', {picture: path}); } function hideAutoFocus() { -   var classList = focusFrame.classList; -   focusContainer.classList.add('hidden'); -   classList.remove('autofocus-animation'); -   classList.remove('autofocus-success'); -   classList.remove('autofocus-failure'); + var classList = focusFrame.classList; + focusContainer.classList.add('hidden'); + classList.remove('autofocus-animation'); + classList.remove('autofocus-success'); + classList.remove('autofocus-failure'); } @@ -458,20 +458,20 @@ function hideAutoFocus() 
                             function show(ev)
 {
-   var detail = ev.detail;
-   if (detail.picture)
-   {
-      picture.src = detail.picture;
-      picture.classList.remove('hidden');
-      video.classList.add('hidden');
-   }
-   else if (detail.video)
-   {
-      /* Show recorded video preview */
-   }
+   var detail = ev.detail;
+   if (detail.picture)
+   {
+      picture.src = detail.picture;
+      picture.classList.remove('hidden');
+      video.classList.add('hidden');
+   }
+   else if (detail.video)
+   {
+      /* Show recorded video preview */
+   }
 }
 
-e.listeners({'views.preview.show': show});
+e.listeners({'views.preview.show': show});
                          @@ -479,12 +479,12 @@ e.listeners({'views.preview.show': show});

                          Recording Videos

                          - +

                          This section builds upon the elements described in Managing the Camera.

                          - - -

                          Initializing Video Recording

                          -
                            + + +

                            Initializing Video Recording

                            +
                            1. js/views/main.js Source File
                              1. @@ -493,30 +493,30 @@ e.listeners({'views.preview.show': show}); 
                                 var e = req.core.event,
-    camera = req.models.camera,
-    page = null,
-    cameraPreview = null,
-    recordProgress = null,
-    recordProgressVal = null,
-    recordProgressLabelVal = null,
-    recordProgressLabelMax = null,
-    recording = false,
-    RECORDING_INTERVAL_STEP = 100,
-    recordingInterval = null,
-    maxRecordingTimeSeconds = Math.floor(camera.MAX_RECORDING_TIME / 1000);
+    camera = req.models.camera,
+    page = null,
+    cameraPreview = null,
+    recordProgress = null,
+    recordProgressVal = null,
+    recordProgressLabelVal = null,
+    recordProgressLabelMax = null,
+    recording = false,
+    RECORDING_INTERVAL_STEP = 100,
+    recordingInterval = null,
+    maxRecordingTimeSeconds = Math.floor(camera.MAX_RECORDING_TIME / 1000);
 
 function init()
 {
-   page = document.getElementById('main');
-   cameraPreview = document.getElementById('camera-preview');
-   recordProgress = document.getElementById('record-progress');
-   recordProgressVal = document.getElementById('record-progress-val');
-   recordProgressLabelVal =
-      document.getElementById('record-progress-label-val');
-   recordProgressLabelMax =
-      document.getElementById('record-progress-label-max');
-   bindEvents();
-   initCameraPreview();
+   page = document.getElementById('main');
+   cameraPreview = document.getElementById('camera-preview');
+   recordProgress = document.getElementById('record-progress');
+   recordProgressVal = document.getElementById('record-progress-val');
+   recordProgressLabelVal =
+      document.getElementById('record-progress-label-val');
+   recordProgressLabelMax =
+      document.getElementById('record-progress-label-max');
+   bindEvents();
+   initCameraPreview();
 }
                              2. @@ -524,15 +524,15 @@ function init() 
                                 function onCameraPreviewClick()
 {
-   if (photoMode)
-   {
-      /* Capture an image */
-   }
-   else
-   {
-      toggleRecording();
-      setRecording();
-   }
+   if (photoMode)
+   {
+      /* Capture an image */
+   }
+   else
+   {
+      toggleRecording();
+      setRecording();
+   }
 }
                                3. @@ -541,47 +541,47 @@ function onCameraPreviewClick() 
                                 function toggleRecording(forceValue)
 {
-   if (forceValue !== undefined)
-   {
-      recording = !!forceValue;
-   }
-   else
-   {
-      recording = !recording;
-   }
+   if (forceValue !== undefined)
+   {
+      recording = !!forceValue;
+   }
+   else
+   {
+      recording = !recording;
+   }
 }
                              3. The setRecording() method starts or stops recording, based on the recording state. 
                                 function setRecording()
 {
-   if (recording)
-   {
-      startRecording();
-   }
-   else
-   {
-      stopRecording();
-   }
+   if (recording)
+   {
+      startRecording();
+   }
+   else
+   {
+      stopRecording();
+   }
 }
                            -

                            Starting Video Recording

                            -
                              +

                              Starting Video Recording

                              +
                              1. js/views/main.js Source File

                                1. The startRecording() method starts the recording process, and the stopRecording() method stops it.

                                   function startRecording()
 {
-   camera.startRecording();
-   resetRecordingProgress();
-   showRecordingView();
+   camera.startRecording();
+   resetRecordingProgress();
+   showRecordingView();
 }
 
 function stopRecording()
 {
-   camera.stopRecording();
+   camera.stopRecording();
 }
                                  2. @@ -591,28 +591,28 @@ function stopRecording() 
                                   function resetRecordingProgress()
 {
-   recordingTime = 0;
-   renderRecordingProgressBar();
+   recordingTime = 0;
+   renderRecordingProgressBar();
 }
 
 function renderRecordingProgressBarValue(value)
 {
-   recordProgressVal.style.width = value + 'px';
+   recordProgressVal.style.width = value + 'px';
 }
 
 function renderRecordingProgressBarLabel()
 {
-   recordProgressLabelVal.innerHTML = dateHelper.formatTime(time);
-   recordProgressLabelMax.innerHTML =
-      dateHelper.formatTime(maxRecordingTimeSeconds);
+   recordProgressLabelVal.innerHTML = dateHelper.formatTime(time);
+   recordProgressLabelMax.innerHTML =
+      dateHelper.formatTime(maxRecordingTimeSeconds);
 }
 
 function renderRecordingProgressBar()
 {
-   var parentWidth = recordProgress.clientWidth,
-       width = recordingTime / camera.MAX_RECORDING_TIME * parentWidth;
-   renderRecordingProgressBarValue(width);
-   renderRecordingProgressBarLabel();
+   var parentWidth = recordProgress.clientWidth,
+       width = recordingTime / camera.MAX_RECORDING_TIME * parentWidth;
+   renderRecordingProgressBarValue(width);
+   renderRecordingProgressBarLabel();
 }
                                  @@ -622,19 +622,19 @@ function renderRecordingProgressBar() 
                                   function showRecordingView()
 {
-   hideNavigationBtns();
-   showRecordProgress();
+   hideNavigationBtns();
+   showRecordProgress();
 }
 
 function hideNavigationBtns()
 {
-   modeBtn.classList.add('hidden');
-   settingsBtn.classList.add('hidden');
+   modeBtn.classList.add('hidden');
+   settingsBtn.classList.add('hidden');
 }
 
 function showRecordProgress()
 {
-   recordProgress.classList.remove('hidden');
+   recordProgress.classList.remove('hidden');
 }
                                2. @@ -645,40 +645,40 @@ function showRecordProgress() 
                                 function startRecording()
 {
-   var settings = {},
-       fileName = '';
-   if (busy)
-   {
-      return false;
-   }
-   busy = true;
-   fileName = createVideoFileName();
-   videoPath = VIDEO_DESTINATION_DIRECTORY + '/' + fileName;
-   settings.fileName = fileName;
-   settings.recordingFormat = getRecordingFormat();
-   cameraControl.recorder.applySettings(settings, onVideoSettingsApplied,
-                                        onVideoSettingsError);
+   var settings = {},
+       fileName = '';
+   if (busy)
+   {
+      return false;
+   }
+   busy = true;
+   fileName = createVideoFileName();
+   videoPath = VIDEO_DESTINATION_DIRECTORY + '/' + fileName;
+   settings.fileName = fileName;
+   settings.recordingFormat = getRecordingFormat();
+   cameraControl.recorder.applySettings(settings, onVideoSettingsApplied,
+                                        onVideoSettingsError);
 
-   return true;
+   return true;
 }
 
 function createVideoFileName()
 {
-   var currentDate = new Date(),
-       extension = getRecordingFormat(),
-       fileName = '';
+   var currentDate = new Date(),
+       extension = getRecordingFormat(),
+       fileName = '';
 
-   fileName =
-      dateHelper.format(currentDate, 'yyyymmdd_HHMMSS') + '.' + extension;
+   fileName =
+      dateHelper.format(currentDate, 'yyyymmdd_HHMMSS') + '.' + extension;
 
-   return fileName;
+   return fileName;
 }
                              2. When the video file parameters have been applied successfully, the onVideoSettingsApplied() event handler starts the actual recording. 
                                 function onVideoSettingsApplied()
 {
-   cameraControl.recorder.start(onRecordingStartSuccess, onRecordingStartError);
+   cameraControl.recorder.start(onRecordingStartSuccess, onRecordingStartError);
 }
                                3. @@ -689,26 +689,26 @@ function onVideoSettingsApplied() 
                                 function onRecordingStartSuccess()
 {
-   startTracingVideoLength();
-   e.fire('camera.recording.start');
+   startTracingVideoLength();
+   e.fire('camera.recording.start');
 }
 
 function startTracingVideoLength()
 {
-   videoRecordingStartTime = new Date();
-   videoLengthCheckInterval = window.setInterval(checkVideoLength,
-                                                 VIDEO_LENGTH_CHECK_INTERVAL);
+   videoRecordingStartTime = new Date();
+   videoLengthCheckInterval = window.setInterval(checkVideoLength,
+                                                 VIDEO_LENGTH_CHECK_INTERVAL);
 }
 
 function checkVideoLength()
 {
-   var currentTime = new Date();
+   var currentTime = new Date();
 
-   videoRecordingTime = currentTime - videoRecordingStartTime;
-   if (videoRecordingTime > MAX_RECORDING_TIME)
-   {
-      stopRecording();
-   }
+   videoRecordingTime = currentTime - videoRecordingStartTime;
+   if (videoRecordingTime > MAX_RECORDING_TIME)
+   {
+      stopRecording();
+   }
 }
                            1. js/views/main.js Source File @@ -716,57 +716,57 @@ function checkVideoLength() 
                               function onRecordingStart()
 {
-   setRecordingInterval();
+   setRecordingInterval();
 }
 
 function setRecordingInterval()
 {
-   recordingInterval = setInterval(updateRecordingProgress,
-                                   RECORDING_INTERVAL_STEP);
+   recordingInterval = setInterval(updateRecordingProgress,
+                                   RECORDING_INTERVAL_STEP);
 }
 
 function updateRecordingProgress()
 {
-   recordingTime = camera.getRecordingTime();
+   recordingTime = camera.getRecordingTime();
 
-   renderRecordingProgressBar();
+   renderRecordingProgressBar();
 }
 
 function renderRecordingProgressBar()
 {
-   var parentWidth = recordProgress.clientWidth,
-       width = recordingTime / camera.MAX_RECORDING_TIME * parentWidth;
-   renderRecordingProgressBarValue(width);
-   renderRecordingProgressBarLabel();
+   var parentWidth = recordProgress.clientWidth,
+       width = recordingTime / camera.MAX_RECORDING_TIME * parentWidth;
+   renderRecordingProgressBarValue(width);
+   renderRecordingProgressBarLabel();
 }
 
 function renderRecordingProgressBarValue(value)
 {
-   recordProgressVal.style.width = value + 'px';
+   recordProgressVal.style.width = value + 'px';
 }
 
 function renderRecordingProgressBarLabel()
 {
-   var time = Math.ceil(recordingTime / 1000);
+   var time = Math.ceil(recordingTime / 1000);
 
-   if (time > maxRecordingTimeSeconds)
-   {
-      time = maxRecordingTimeSeconds;
-   }
-   recordProgressLabelVal.innerHTML = dateHelper.formatTime(time);
-   recordProgressLabelMax.innerHTML = dateHelper.formatTime(maxRecordingTimeSeconds);
+   if (time > maxRecordingTimeSeconds)
+   {
+      time = maxRecordingTimeSeconds;
+   }
+   recordProgressLabelVal.innerHTML = dateHelper.formatTime(time);
+   recordProgressLabelMax.innerHTML = dateHelper.formatTime(maxRecordingTimeSeconds);
 }
                            -

                            Stopping Video Recording

                            -
                              +

                              Stopping Video Recording

                              +
                              1. js/views/main.js Source File

                                When the user taps the screen to stop the recording, the stopRecording() method calls the stopRecording() method.

                                 function stopRecording()
 {
-   camera.stopRecording();
+   camera.stopRecording();
 }
                                2. @@ -775,8 +775,8 @@ function stopRecording() 
                                 function onVideoRecordingStopSuccess()
 {
-   busy = false;
-   e.fire('camera.recording.done', {path: videoPath});
+   busy = false;
+   e.fire('camera.recording.done', {path: videoPath});
 }
                              2. js/views/main.js Source File @@ -784,15 +784,15 @@ function onVideoRecordingStopSuccess() 
                                 function onRecordingDone(ev)
 {
-   var path = ev.detail.path;
+   var path = ev.detail.path;
 
-   removeRecordingInterval();
-   toggleRecording(false);
-   updateRecordingProgress();
-   if (!exitInProgress)
-   {
-      e.fire('views.preview.show', {video: path});
-   }
+   removeRecordingInterval();
+   toggleRecording(false);
+   updateRecordingProgress();
+   if (!exitInProgress)
+   {
+      e.fire('views.preview.show', {video: path});
+   }
 }
                              3. js/views/preview.js Source File @@ -800,20 +800,20 @@ function onRecordingDone(ev) 
                                 function show(ev)
 {
-   var detail = ev.detail;
-
-   if (detail.picture)
-   {
-      /* Show captured image preview */
-   }
-   else if (detail.video)
-   {
-      foreground.classList.remove('hidden');
-      video.classList.remove('hidden');
-      picture.classList.add('hidden');
-      video.src = detail.video;
-      video.addEventListener('loadeddata', showPreviewPage);
-   }
+   var detail = ev.detail;
+
+   if (detail.picture)
+   {
+      /* Show captured image preview */
+   }
+   else if (detail.video)
+   {
+      foreground.classList.remove('hidden');
+      video.classList.remove('hidden');
+      picture.classList.add('hidden');
+      video.src = detail.video;
+      video.addEventListener('loadeddata', showPreviewPage);
+   }
 }
                                4. @@ -821,18 +821,18 @@ function show(ev)

                                Changing Settings

                                - +

                                This section builds upon the elements described in Managing the Camera.

                                - -

                                Initializing the Settings

                                -
                                  + +

                                  Initializing the Settings

                                  +
                                  1. js/views/main.js Source File

                                    When the user clicks the icon in the right top corner of the main screen, the click event opens the Settings screen.

                                     function onSettingsBtnClick()
 {
-   e.fire('views.settings.show', {photoMode: photoMode});
+   e.fire('views.settings.show', {photoMode: photoMode});
 }
                                    2. @@ -841,38 +841,38 @@ function onSettingsBtnClick() 
                                     function saveCameraSettings()
 {
-   storage.add(STORAGE_SETTINGS_KEY, cameraSettings);
+   storage.add(STORAGE_SETTINGS_KEY, cameraSettings);
 }
                                  -

                                  Setting the Image Format

                                  -
                                    +

                                    Setting the Image Format

                                    +
                                    1. js/views/pictureFormat.js Source File

                                      The renderView() method creates the content for the subscreen for setting the image file format.

                                       function renderView()
 {
-   var formats = camera.getAvailablePictureFormats(),
-       currentFormat = camera.getPictureFormat(),
-       i = 0,
-       len = formats.length,
-       content = [],
-       format = null,
-       checked = false;
-
-   for (i = 0; i < len; i += 1)
-   {
-      format = formats[i];
-      checked = currentFormat === format;
-      content.push(t.get('pictureFormatRow',
-      {
-         format: format,
-         checked: checked
-      }));
-   }
-
-   formatList.innerHTML = content.join('');
+   var formats = camera.getAvailablePictureFormats(),
+       currentFormat = camera.getPictureFormat(),
+       i = 0,
+       len = formats.length,
+       content = [],
+       format = null,
+       checked = false;
+
+   for (i = 0; i < len; i += 1)
+   {
+      format = formats[i];
+      checked = currentFormat === format;
+      content.push(t.get('pictureFormatRow',
+      {
+         format: format,
+         checked: checked
+      }));
+   }
+
+   formatList.innerHTML = content.join('');
 }
                                      2. @@ -881,7 +881,7 @@ function renderView() 
                                       function getAvailablePictureFormats()
 {
-   return cameraControl.capabilities.pictureFormats;
+   return cameraControl.capabilities.pictureFormats;
 }
                                      @@ -890,15 +890,15 @@ function getAvailablePictureFormats() 
                                       function bindEvents()
 {
-   page.addEventListener('pagebeforeshow', onPageBeforeShow);
-   formatList.addEventListener('click', onFormatListClick);
+   page.addEventListener('pagebeforeshow', onPageBeforeShow);
+   formatList.addEventListener('click', onFormatListClick);
 }
 
 function onFormatListClick()
 {
-   var input = formatList.querySelectorAll('input:checked')[0];
+   var input = formatList.querySelectorAll('input:checked')[0];
 
-   camera.setPictureFormat(input.getAttribute('data-format'));
+   camera.setPictureFormat(input.getAttribute('data-format'));
 }
                                      @@ -907,42 +907,42 @@ function onFormatListClick() 
                                       function setPictureFormat(format)
 {
-   cameraSettings.pictureFormat = format;
-   saveCameraSettings();
+   cameraSettings.pictureFormat = format;
+   saveCameraSettings();
 }
                                    -

                                    Setting the Image File Size

                                    -
                                      +

                                      Setting the Image File Size

                                      +
                                      1. js/views/pictureSize.js Source File

                                        The renderView() method creates the content for the subscreen for setting the image file size.

                                         function renderView()
 {
-   var sizes = camera.getAvailablePictureSizes(),
-       currentSize = camera.getPictureSize(),
-       i = 0,
-       len = sizes.length,
-       content = [],
-       size = null,
-       checked = false;
-
-   for (i = 0; i < len; i += 1)
-   {
-      size = sizes[i];
-      checked = currentSize.height === size.height &&
-                currentSize.width === size.width;
-      content.push(t.get('pictureSizeRow',
-      {
-         width: size.width,
-         height: size.height,
-         checked: checked
-      }));
-   }
-
-   pictureSizeList.innerHTML = content.join('');
+   var sizes = camera.getAvailablePictureSizes(),
+       currentSize = camera.getPictureSize(),
+       i = 0,
+       len = sizes.length,
+       content = [],
+       size = null,
+       checked = false;
+
+   for (i = 0; i < len; i += 1)
+   {
+      size = sizes[i];
+      checked = currentSize.height === size.height &&
+                currentSize.width === size.width;
+      content.push(t.get('pictureSizeRow',
+      {
+         width: size.width,
+         height: size.height,
+         checked: checked
+      }));
+   }
+
+   pictureSizeList.innerHTML = content.join('');
 }
                                        2. @@ -951,7 +951,7 @@ function renderView() 
                                         function getAvailablePictureSizes()
 {
-   return cameraControl.capabilities.pictureSizes;
+   return cameraControl.capabilities.pictureSizes;
 }
                                        @@ -960,15 +960,15 @@ function getAvailablePictureSizes() 
                                         function onSizeListClick()
 {
-   var input = pictureSizeList.querySelectorAll('input:checked')[0],
-       width = parseInt(input.getAttribute('data-width'), 10),
-       height = parseInt(input.getAttribute('data-height'), 10);
+   var input = pictureSizeList.querySelectorAll('input:checked')[0],
+       width = parseInt(input.getAttribute('data-width'), 10),
+       height = parseInt(input.getAttribute('data-height'), 10);
 
-   camera.setPictureSize(
-   {
-      width: width,
-      height: height
-   });
+   camera.setPictureSize(
+   {
+      width: width,
+      height: height
+   });
 }
                                        @@ -977,44 +977,44 @@ function onSizeListClick() 
                                         function setPictureSize(size)
 {
-   cameraSettings.pictureSize =
-   {
-      width: size.width,
-      height: size.height
-   };
-   saveCameraSettings();
+   cameraSettings.pictureSize =
+   {
+      width: size.width,
+      height: size.height
+   };
+   saveCameraSettings();
 }
                                      -

                                      Setting the Video Format

                                      -
                                        +

                                        Setting the Video Format

                                        +
                                        1. js/views/recordingFormat.js Source File

                                          The renderView() method creates the content for the subscreen for setting the video file format.

                                           function renderView()
 {
-   var formats = camera.getAvailableRecordingFormats(),
-       currentFormat = camera.getRecordingFormat(),
-       i = 0,
-       len = formats.length,
-       content = [],
-       format = null,
-       checked = false;
-
-   for (i = 0; i < len; i += 1)
-   {
-      format = formats[i];
-      checked = currentFormat === format;
-      content.push(t.get('recordingFormatRow',
-      {
-         format: format,
-         checked: checked
-      }));
-   }
-
-   formatList.innerHTML = content.join('');
+   var formats = camera.getAvailableRecordingFormats(),
+       currentFormat = camera.getRecordingFormat(),
+       i = 0,
+       len = formats.length,
+       content = [],
+       format = null,
+       checked = false;
+
+   for (i = 0; i < len; i += 1)
+   {
+      format = formats[i];
+      checked = currentFormat === format;
+      content.push(t.get('recordingFormatRow',
+      {
+         format: format,
+         checked: checked
+      }));
+   }
+
+   formatList.innerHTML = content.join('');
 }
                                          2. @@ -1023,7 +1023,7 @@ function renderView() 
                                           function getAvailableRecordingFormats()
 {
-   return cameraControl.capabilities.recordingFormats;
+   return cameraControl.capabilities.recordingFormats;
 }
                                          @@ -1032,9 +1032,9 @@ function getAvailableRecordingFormats() 
                                           function onFormatListClick()
 {
-   var input = formatList.querySelectorAll('input:checked')[0];
+   var input = formatList.querySelectorAll('input:checked')[0];
 
-   camera.setRecordingFormat(input.getAttribute('data-format'));
+   camera.setRecordingFormat(input.getAttribute('data-format'));
 }
                                          @@ -1043,8 +1043,8 @@ function onFormatListClick() 
                                           function setRecordingFormat(format)
 {
-   cameraSettings.recordingFormat = format;
-   saveCameraSettings();
+   cameraSettings.recordingFormat = format;
+   saveCameraSettings();
 }
                                          diff --git a/org.tizen.guides/html/web/w3c/supplement/typedarray_w.htm b/org.tizen.guides/html/web/w3c/supplement/typedarray_w.htm index 387a1fc..1fc3260 100644 --- a/org.tizen.guides/html/web/w3c/supplement/typedarray_w.htm +++ b/org.tizen.guides/html/web/w3c/supplement/typedarray_w.htm @@ -84,29 +84,29 @@
                                        2. Create a new ArrayBuffer with a specific length: 
                                           <script>
-   var log = document.getElementById("log");
+   var log = document.getElementById("log");
 
-   /* Create a 12-byte buffer */
-   var buffer = new ArrayBuffer(12);
-   var x = new Int32Array(buffer);
+   /* Create a 12-byte buffer */
+   var buffer = new ArrayBuffer(12);
+   var x = new Int32Array(buffer);
 
-   /* Check the buffer length */
-   log.innerHTML = "<div>" + buffer.byteLength + "<div>";
+   /* Check the buffer length */
+   log.innerHTML = "<div>" + buffer.byteLength + "<div>";

                                          The content of the array buffer is initialized to 0. If the requested number of bytes are not allocated, an exception is raised.

                                        3. Slice the array buffer to copy the buffer bytes and return a new array buffer: 
                                          -   /* Get slice: "1234" */
-   x[1] = 1234;
-   var slice = buffer.slice(4);
-   var y = new Int32Array(slice);
-   log.innerHTML += "<div>" + x[1] + "<div>";
-   log.innerHTML += "<div>" + y[0] + "<div>";
-
-   /* Get slice: "6789" */
-   x[1] = 6789;
-   log.innerHTML += "<div>" + x[1] + "<div>";
-   log.innerHTML += "<div>" + y[0] + "<div>";
+   /* Get slice: "1234" */
+   x[1] = 1234;
+   var slice = buffer.slice(4);
+   var y = new Int32Array(slice);
+   log.innerHTML += "<div>" + x[1] + "<div>";
+   log.innerHTML += "<div>" + y[0] + "<div>";
+
+   /* Get slice: "6789" */
+   x[1] = 6789;
+   log.innerHTML += "<div>" + x[1] + "<div>";
+   log.innerHTML += "<div>" + y[0] + "<div>";
 </script>
                                        @@ -116,8 +116,8 @@

                                        Source Code

                                        For the complete source code related to this use case, see the following file:

                                        +
                                      1. sample_1.html
                                        2. +

                                        Creating Typed Array Views

                                        @@ -145,7 +145,7 @@
        - + @@ -163,7 +163,7 @@ - + @@ -175,7 +175,7 @@ - + @@ -216,24 +216,24 @@
      51. Create new instances of the typed array view types with a general fixed-length binary buffer: 
         <script>
-   /* 8-bit 2's complement signed integer */
-   var int8 = new Int8Array(8);
-   /* 8-bit unsigned integer */
-   var uint8 = new Uint8Array(16);
-   /* 8-bit unsigned integer (clamped) */
-   var uint8Cl = new Uint8ClampedArray(32);
-   /* 16-bit 2's complement signed integer */
-   var int16 = new Int16Array(64);
-   /* 16-bit unsigned integer */
-   var uint16 = new Uint16Array(8);
-   /* 32-bit 2's complement signed integer */
-   var int32 = new Int32Array(16);
-   /* 32-bit unsigned integer */
-   var uint32 = new Uint32Array(32);
-   /* 32-bit IEEE floating point */
-   var float32 = new Float32Array(64);
-   /* 64-bit IEEE floating point */
-   var float64 = new Float64Array(8);
+   /* 8-bit 2's complement signed integer */
+   var int8 = new Int8Array(8);
+   /* 8-bit unsigned integer */
+   var uint8 = new Uint8Array(16);
+   /* 8-bit unsigned integer (clamped) */
+   var uint8Cl = new Uint8ClampedArray(32);
+   /* 16-bit 2's complement signed integer */
+   var int16 = new Int16Array(64);
+   /* 16-bit unsigned integer */
+   var uint16 = new Uint16Array(8);
+   /* 32-bit 2's complement signed integer */
+   var int32 = new Int32Array(16);
+   /* 32-bit unsigned integer */
+   var uint32 = new Uint32Array(32);
+   /* 32-bit IEEE floating point */
+   var float32 = new Float32Array(64);
+   /* 64-bit IEEE floating point */
+   var float64 = new Float64Array(8);
 </script>
        @@ -245,24 +245,24 @@
      52. Create a typed array view: 
         <script>
-   var log = document.getElementById("log");
-   /* Create an array buffer */
-   var buffer = new ArrayBuffer(12);
+   var log = document.getElementById("log");
+   /* Create an array buffer */
+   var buffer = new ArrayBuffer(12);
 
-   /* Create a typed array view that points to the array buffer */
-   var x = new Int32Array(buffer, 0, 2);
+   /* Create a typed array view that points to the array buffer */
+   var x = new Int32Array(buffer, 0, 2);

        You can use the view to establish a detailed data structure by creating the value of 32-bit signed integers in a byte-type composition element.

      53. Use the typed array view buffer: 
        -   var y = new Int32Array(x.buffer, 4, 2);
-   log.innerHTML += "<div>" + (x.buffer === y.buffer) + "<div>";
+   var y = new Int32Array(x.buffer, 4, 2);
+   log.innerHTML += "<div>" + (x.buffer === y.buffer) + "<div>";
 
-   /* Use the byteLength, length, and byteOffset properties */
-   log.innerHTML += "<div>" + x.byteLength + "<div>";
-   log.innerHTML += "<div>" + (x.length * Int32Array.BYTES_PER_ELEMENT) + "<div>";
-   log.innerHTML += "<div>" + x.byteOffset + "<div>";
+   /* Use the byteLength, length, and byteOffset properties */
+   log.innerHTML += "<div>" + x.byteLength + "<div>";
+   log.innerHTML += "<div>" + (x.length * Int32Array.BYTES_PER_ELEMENT) + "<div>";
+   log.innerHTML += "<div>" + x.byteOffset + "<div>";
 </script>
        @@ -271,24 +271,24 @@
      54. Replace the CanvasPixelArray instance with the Uint8ClampedArray instance: 
         <script>
-   var buffer = new ArrayBuffer(12);
-   var x = new Uint8ClampedArray(buffer, 4, 2);
-   log.innerHTML += "<div>[Result1]</div>";
-   log.innerHTML += "<div>" + x.byteLength + "<div>";
-   log.innerHTML += "<div>" + x.length + "<div>";
-   log.innerHTML += "<div>" + Uint8ClampedArray.BYTES_PER_ELEMENT + "<div>";
-
-   var x = new Uint8ClampedArray(10);
-   x.set([18, 93, 42], 3);
-   log.innerHTML += "<br/><div>[Result2]</div>";
-   log.innerHTML += "<div>" + x[3] + "<div>";
-   log.innerHTML += "<div>" + x[4] + "<div>";
-   log.innerHTML += "<div>" + x[5] + "<div>";
-
-   var x = new Uint8ClampedArray([0, 1, 2, 3, 4, 5]);
-   var y = x.subarray(2, 5);
-   log.innerHTML += "<br/><div>[Result3]</div>";
-   log.innerHTML += "<div>" + y.length + "<div>";
+   var buffer = new ArrayBuffer(12);
+   var x = new Uint8ClampedArray(buffer, 4, 2);
+   log.innerHTML += "<div>[Result1]</div>";
+   log.innerHTML += "<div>" + x.byteLength + "<div>";
+   log.innerHTML += "<div>" + x.length + "<div>";
+   log.innerHTML += "<div>" + Uint8ClampedArray.BYTES_PER_ELEMENT + "<div>";
+
+   var x = new Uint8ClampedArray(10);
+   x.set([18, 93, 42], 3);
+   log.innerHTML += "<br/><div>[Result2]</div>";
+   log.innerHTML += "<div>" + x[3] + "<div>";
+   log.innerHTML += "<div>" + x[4] + "<div>";
+   log.innerHTML += "<div>" + x[5] + "<div>";
+
+   var x = new Uint8ClampedArray([0, 1, 2, 3, 4, 5]);
+   var y = x.subarray(2, 5);
+   log.innerHTML += "<br/><div>[Result3]</div>";
+   log.innerHTML += "<div>" + y.length + "<div>";
 </script>
        @@ -300,17 +300,17 @@
      55. When an ArrayBuffer with heterogeneous type of data is used, you can take advantage of the DataView of the buffer: 
         <script>
-   var log = document.getElementById("log");
+   var log = document.getElementById("log");
 
-   /* Create DataView */
-   var x = new DataView(new ArrayBuffer(12), 0);
+   /* Create DataView */
+   var x = new DataView(new ArrayBuffer(12), 0);
 
-   /* Store the variable */
-   x.setFloat32(1, Math.PI);
+   /* Store the variable */
+   x.setFloat32(1, Math.PI);
 
-   /* Get the variable */
-   log.innerHTML += "<div>" + x.getFloat32(1) + "<div>";
-   log.innerHTML += "<div>" + Math.PI + "<div>";
+   /* Get the variable */
+   log.innerHTML += "<div>" + x.getFloat32(1) + "<div>";
+   log.innerHTML += "<div>" + Math.PI + "<div>";
 </script>

        The DataView stores the values of the given type at the specified byte offset from the start of the view. Moreover, alignment is not a constraint, and it can store the multi-byte values at any offset. For multi-byte values, the optional littleEndian argument indicates that the value can be stored in a big-endian or little-endian byte order. If the argument is set to false or is undefined, the value gets stored in the big-endian byte order.

        @@ -321,9 +321,9 @@

        For the complete source code related to this use case, see the following files:

        +
      56. sample_3.html
        57. +
      57. sample_4.html
        58. +

        Using Typed Arrays

        @@ -334,19 +334,19 @@
      58. For the WebGL - Khronos API (in mobile or wearable applications), import the gl.bufferData() method to set the buffer object to deliver texture data: 
         <script>
-   var textureCoords =
-      [0.0,  0.5, 0.25, 0.5, 0.25, 1.0, 0.0,  1.0, /* Front */
-       0.5,  0.5, 0.75, 0.5, 0.75, 1.0, 0.5,  1.0, /* Back */
-       0.0,  0.5, 0.25, 0.5, 0.25, 0.0, 0.0,  0.0, /* Top */
-       0.25, 0.5, 0.5,  0.5, 0.5,  0.0, 0.25, 0.0, /* Bottom */
-       0.25, 0.5, 0.5,  0.5, 0.5,  1.0, 0.25, 1.0, /* Right */
-       0.75, 0.5, 1.0,  0.5, 1.0,  1.0, 0.75, 1.0]; /* Left */
-
-   cubeVertexTextureCoordBuffer = gl.createBuffer();
-   gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexTextureCoordBuffer);
-   gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureCoords), gl.STATIC_DRAW);
-   cubeVertexTextureCoordBuffer.itemSize = 2;
-   cubeVertexTextureCoordBuffer.numItems = 24;
+   var textureCoords =
+      [0.0,  0.5, 0.25, 0.5, 0.25, 1.0, 0.0,  1.0, /* Front */
+       0.5,  0.5, 0.75, 0.5, 0.75, 1.0, 0.5,  1.0, /* Back */
+       0.0,  0.5, 0.25, 0.5, 0.25, 0.0, 0.0,  0.0, /* Top */
+       0.25, 0.5, 0.5,  0.5, 0.5,  0.0, 0.25, 0.0, /* Bottom */
+       0.25, 0.5, 0.5,  0.5, 0.5,  1.0, 0.25, 1.0, /* Right */
+       0.75, 0.5, 1.0,  0.5, 1.0,  1.0, 0.75, 1.0]; /* Left */
+
+   cubeVertexTextureCoordBuffer = gl.createBuffer();
+   gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexTextureCoordBuffer);
+   gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureCoords), gl.STATIC_DRAW);
+   cubeVertexTextureCoordBuffer.itemSize = 2;
+   cubeVertexTextureCoordBuffer.numItems = 24;
 </script>
        59. @@ -356,12 +356,12 @@
      59. Deliver the pixel expression of the canvas element: 
         <script>
-   var tempContext = canvas.getContext("2d");
-   tempContext.drawImage(picture, 0, 0, canvas.width, canvas.height);
-   var pixels = canvas.width * canvas.height * 4;
-   var canvasData =
-      tempContext.getImageData(0, 0, canvas.width, canvas.height);
-   var binaryData = canvasData.data;
+   var tempContext = canvas.getContext("2d");
+   tempContext.drawImage(picture, 0, 0, canvas.width, canvas.height);
+   var pixels = canvas.width * canvas.height * 4;
+   var canvasData =
+      tempContext.getImageData(0, 0, canvas.width, canvas.height);
+   var binaryData = canvasData.data;
 </script>
        60. @@ -375,15 +375,15 @@ 
         this.setSound = function()
 {
-   var request = new XMLHttpRequest();
-   request.open("GET", url, true);
-   request.responseType = "arraybuffer";
-
-   request.onload = function()
-   {
-      var data = request.response;
-   };
-   request.send();
+   var request = new XMLHttpRequest();
+   request.open("GET", url, true);
+   request.responseType = "arraybuffer";
+
+   request.onload = function()
+   {
+      var data = request.response;
+   };
+   request.send();
 }
        diff --git a/org.tizen.guides/html/web/w3c/supplement/webgl_w.htm b/org.tizen.guides/html/web/w3c/supplement/webgl_w.htm index 40d7f75..2c0fcf6 100644 --- a/org.tizen.guides/html/web/w3c/supplement/webgl_w.htm +++ b/org.tizen.guides/html/web/w3c/supplement/webgl_w.htm @@ -5,20 +5,20 @@ - + - WebGL - Khronos - + WebGL - Khronos + - +

        Mobile Web Wearable Web

        - +

        Dependencies

        -
        +

        WebGL - Khronos

        - +

        WebGL - Khronos is a graphics library for creating 3D visual elements in Web applications without separate plug-ins.

        - +

        This feature is supported in mobile and wearable applications only.

        - +

        WebGL is designed as a rendering context of the HTML5 <canvas> element. The WebGL context is still being developed and has not been standardized. WebGL uses 3D rendering APIs derived from OpenGL® ES 2.0, and is realized by binding shaders and OpenGL® ES Shading Language (GLSL ES) as JavaScript.

        - -

        The main features of the WebGL include:

        -
          + +

          The main features of the WebGL include:

          +
          • Importing the WebGL context

            You can use the getContext() method of the Canvas object to import the WebGL context.

            -
            • +
          • Using programs and shaders

            You can use shaders, such as the vertex shader and fragment shader, to convert shape data to display it on the screen as pixels. Shaders must be initialized and attached to programs. The vertex shader sets the final position of a vertex, and the fragment shader sets the final colors of each pixel.

            -
            • +
          • Using buffers

            A buffer is a memory block for storing temporary data. In WebGL, you must create a vertex buffer object (VBO) to store vertex attributes, such as location, color, and texture coordinates.

            @@ -78,7 +78,7 @@ The vertex shader sets the final position of a vertex, and the fragment shader s The deleteBuffer() method can be used to delete the buffer.
        - +
      60. Drawing on the screen

        You can use shader attributes to define which buffer to pass to the application, and then record the buffer in the drawing buffer to display the content on the screen.

        61. @@ -95,7 +95,7 @@ The vertex shader sets the final position of a vertex, and the fragment shader s

        You can use Z-index and matrix to create a 3D perspective.

        You can also use touch effects with textures and 3D perspectives.

        - +
      61. WebGL frameworks

        Numerous frameworks exist to easily import low-level methods to WebGL and to develop WebGL more productively.

        The three.js is one of the most widely used WebGL frameworks. It is a lightweight JavapScript library, in which many settings that need to be performed when developing WebGL are already set as basis. Consequently, three.js reduces the overlapping code due to repetitive setting works.

        @@ -104,12 +104,12 @@ The vertex shader sets the final position of a vertex, and the fragment shader s

        Importing the WebGL Context

        -

        To enhance the user experience of your application with WebGL features, you must learn to import the WebGL context from the HTML5 <canvas> element:

        -
          +

          To enhance the user experience of your application with WebGL features, you must learn to import the WebGL context from the HTML5 <canvas> element:

          +

          1. Define the <canvas> element ID and set its width and height:

             <body>
-   <canvas id="canvas" width="300" height="300"></canvas>
+   <canvas id="canvas" width="300" height="300"></canvas>
 </body>
            @@ -117,94 +117,94 @@ The vertex shader sets the final position of a vertex, and the fragment shader s Note If the width and height are not set, the default size, 300 x 150 px, is used.
        62. - +

      62. Use the getContext() method of the Canvas object to import the WebGL context:

         <script>
-   function startWegGL()
-   {
-      gl = getWebGLContext();
-   }
-
-   function getWebGLContext()
-   {
-      var webGLContext;
-      var canvas = document.getElementById("canvas");
-
-      /* Context name can differ according to the browser used */
-      /* Store the context name in an array and check its validity */
-      var names = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"];
-      for (var i = 0; i < names.length; ++i)
-      {
-         try
-         {
-            webGLContext = canvas.getContext(names[i]);
-         }
-         if (webGLContext) break;
-      }
-
-      return webGLContext;
-   }
+   function startWegGL()
+   {
+      gl = getWebGLContext();
+   }
+
+   function getWebGLContext()
+   {
+      var webGLContext;
+      var canvas = document.getElementById("canvas");
+
+      /* Context name can differ according to the browser used */
+      /* Store the context name in an array and check its validity */
+      var names = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"];
+      for (var i = 0; i < names.length; ++i)
+      {
+         try
+         {
+            webGLContext = canvas.getContext(names[i]);
+         }
+         if (webGLContext) break;
+      }
+
+      return webGLContext;
+   }
 </script>
        63. - +

        Source Code

        For the complete source code related to this use case, see the following file:

        +
      63. webgl_camera_effect.html
        64. +

        Initializing Programs and Shaders

        To enhance the user experience of your application with WebGL features, you must learn to bind the shaders and GLSL ES in WebGL by using shaders and programs: -

        -
          +

          +

          1. Define the vertex shader and fragment shader using the gl_Position and gl_FragColor variables of the OpenGL® ES Shading Language (GLSL ES):

            -<script id="vshader" type="x-shader/x-vertex">
-   attribute vec2 attVertexPos;
+<script id="vshader" type="x-shader/x-vertex">
+   attribute vec2 attVertexPos;
 
-   void main()
-   {
+   void main()
+   {
 
-      /* vec4(2D coordinates, depth, perspective) */
-      gl_Position = vec4(attVertexPos, 0, 2);
-   }
+      /* vec4(2D coordinates, depth, perspective) */
+      gl_Position = vec4(attVertexPos, 0, 2);
+   }
 </script>
 
-<script id="fshader" type="x-shader/x-fragment">
-   void main()
-   {
+<script id="fshader" type="x-shader/x-fragment">
+   void main()
+   {
 
-      /* Color stored in the gl_FragColor variable becomes the pixel color */
-      /* vec4(R, G, B, A) */
-      gl_FragColor = vec4(1, 0.5, 0.5, 1);
-   }
+      /* Color stored in the gl_FragColor variable becomes the pixel color */
+      /* vec4(R, G, B, A) */
+      gl_FragColor = vec4(1, 0.5, 0.5, 1);
+   }
 </script>
            -
            2. +

          2. Import the createShader() method to create the shaders:

             <script>
-   var vshader = gl.createShader(gl.VERTEX_SHADER);
-   var fshader = gl.createShader(gl.FRAGMENT_SHADER);
+   var vshader = gl.createShader(gl.VERTEX_SHADER);
+   var fshader = gl.createShader(gl.FRAGMENT_SHADER);

          3. Import the shaderSource() method to attach the source elements to the shaders:

            -   gl.shaderSource(vshader, document.getElementById('vshader').text);
-   gl.shaderSource(fshader, document.getElementById('fshader').text);
+   gl.shaderSource(vshader, document.getElementById('vshader').text);
+   gl.shaderSource(fshader, document.getElementById('fshader').text);

          4. Import the compileShader() method and compile the shaders:

            -   gl.compileShader(vshader);
-   gl.compileShader(fshader);
+   gl.compileShader(vshader);
+   gl.compileShader(fshader);
            @@ -215,28 +215,28 @@ The vertex shader sets the final position of a vertex, and the fragment shader s

          5. Import the createProgram() method to create a new instance of the WebGLProgram object, in which the shaders are then attached:

            -   var program = null;
-   program = gl.createProgram();
+   var program = null;
+   program = gl.createProgram();

          6. Import the attachShader() method to attach the shaders to the program:

            -   gl.attachShader(program, vshader);
-   gl.attachShader(program, fshader);
+   gl.attachShader(program, vshader);
+   gl.attachShader(program, fshader);

          7. Import the linkProgram() method to connect to the program:

            -   gl.linkProgram(program);
+   gl.linkProgram(program);

          8. Import the useProgram() method to enable WebGL to use the program:

            -   /* Shaders are loaded and used */
-   gl.useProgram(program);
+   /* Shaders are loaded and used */
+   gl.useProgram(program);
 </script>
            @@ -245,82 +245,82 @@ The vertex shader sets the final position of a vertex, and the fragment shader s After a WebGL program has been used, you can use the deleteProgram() method to delete it.
        - +

        Source Code

        For the complete source code related to this use case, see the following file:

        +
      64. webgl_circle.html
        65. +

        Initializing Buffers

        To enhance the user experience of your application with WebGL features, you must learn to create buffers, bind them, and store data in them: -

        +

        -
          +

          1. To create a triangle (shown on the left in the figure), define the coordinates of a triangle according to the WebGL coordinate system (shown on the right):

            - -

            WebGL native coordinate system

            + +

            WebGL native coordinate system

             <script>
-   var vertices =
-      [1.0,  1.0, /* p2 */
-       -1.0, 1.0, /* p1 */
-       1.0,  -1.0]; /* p4 */
+   var vertices =
+      [1.0,  1.0, /* p2 */
+       -1.0, 1.0, /* p1 */
+       1.0,  -1.0]; /* p4 */
 </script>
            -
            2. +

          2. Import the createBuffer() method to create the vertex buffer object (VBO):

             <script>
-   triangleVerticesBuffer = gl.createBuffer();
+   triangleVerticesBuffer = gl.createBuffer();

          3. Import the bindBuffer() method to bind the VBO:

            -   gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
+   gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);

          4. Import the bufferData() method to store data to the VBO:

            -   /* Convert to Float32Array format that allows the array to be used in WebGL */
-   gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+   /* Convert to Float32Array format that allows the array to be used in WebGL */
+   gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
 </script>
            5. -
          +

        The following figure shows the final triangle as it is displayed on the screen.

        -

        Figure: Triangle on the screen

        -

        Triangle on the screen

        - +

        Figure: Triangle on the screen

        +

        Triangle on the screen

        +

        Source Code

        For the complete source code related to this use case, see the following file:

        +
      65. webgl_triangle.html
        66. +

        Drawing Shapes on the Screen

        To enhance the user experience of your application with WebGL features, you must learn to display shapes on the screen using attribute array data and a drawing buffer: -

        +

        -
          +

          1. Import the getAttribLocation() method to bring the attribute location from the WebGL program:

             <script>
-   var vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
+   var vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");

            The shader is an external program that is compiled. To enable the attribute to be searched and referenced in the program, allocate it to the vertexPositionAttribute variable.

          2. Activate the attribute data array:

            -   gl.enableVertexAttribArray(vertexPositionAttribute);
+   gl.enableVertexAttribArray(vertexPositionAttribute);
            3. @@ -328,13 +328,13 @@ The vertex shader sets the final position of a vertex, and the fragment shader s

            The second argument value is the number of components per vertex. It can be 2, 3, or, in case of RGBA, 4.

            -   gl.vertexAttribPointer(vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
+   gl.vertexAttribPointer(vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);

          3. Use the drawArrays() method to send the shape to the drawing buffer:

            -   gl.drawArrays(gl.TRIANGLES, 0, 3);
+   gl.drawArrays(gl.TRIANGLES, 0, 3);
 </script>
            @@ -342,160 +342,160 @@ The vertex shader sets the final position of a vertex, and the fragment shader s

            Table: Arguments for drawing shapes

        Progress BarProgress component with the data-type="bar" option.Progress component with the data-type="bar" option.
        Scroll Handler
        Int8Array 18-bit 2's complement signed integer8-bit 2's complement signed integer signed char
        Int16Array 216-bit 2's complement signed integer16-bit 2's complement signed integer short
        Int32Array 432-bit 2's complement signed integer32-bit 2's complement signed integer int
        - - - - + + + + - - - - - - + + + + + + + - - + + + - - - + + + + - - - + + + + - - - - + + + - - - - + + + - - - + + + +
        TypeDescription

        POINTS

        TypeDescription

        POINTS

        The point type renders 1 point at a time.

        Points

         var vertices =
-   [1.0,  1.0,
-    -1.0, 1.0,
-    1.0,  -1.0,
-    -1.0, -1.0];
+   [1.0,  1.0,
+    -1.0, 1.0,
+    1.0,  -1.0,
+    -1.0, -1.0];
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl.POINTS, 0, 4);
        -

        LINES

        LINES

        In the lines type, 2 lines share the same vertex, but each is defined separately. In the example, 6 vertices are needed.

        Lines

         var vertices =
-   [-1.0, 1.0,
-    1.0,  1.0,
+   [-1.0, 1.0,
+    1.0,  1.0,
 
-    1.0,  1.0,
-    1.0,  0.0,
+    1.0,  1.0,
+    1.0,  0.0,
 
-    1.0,  -1.0,
-    -1.0, -1.0];
+    1.0,  -1.0,
+    -1.0, -1.0];
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl.LINES, 0, 6);
        -

        LINE_STRIP

        LINE_STRIP

        In the line strip type, a part of the vertex is shared. In the example, 4 vertices are needed.

        Lines strip

         var vertices =
-   [-1.0, 1.0,
-    1.0,  1.0,
-    1.0,  -1.0,
-    -1.0, -1.0];
+   [-1.0, 1.0,
+    1.0,  1.0,
+    1.0,  -1.0,
+    -1.0, -1.0];
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl. LINE_STRIP, 0, 4);
        -

        LINE_LOOP

        LINE_LOOP

        In the line loop type, the first vertex and the last vertex are connected, otherwise this type is similar to the line strip type. In the example, 4 vertices are needed.

        Line loop

         var vertices =
-   [-1.0, 1.0,
-    1.0,  1.0,
-    1.0,  -1.0,
-    -1.0, -1.0];
+   [-1.0, 1.0,
+    1.0,  1.0,
+    1.0,  -1.0,
+    -1.0, -1.0];
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl. LINE_LOOP, 0, 4);
        -

        TRIANGLES

        In the triangles type, 2 triangles are comprised of 3 vertices. In the example, 6 vertices are needed. + +

        TRIANGLES

        In the triangles type, 2 triangles are comprised of 3 vertices. In the example, 6 vertices are needed.

        Triangles

         var vertices =
-   [-1.0, 1.0,
-    1.0,  1.0,
-    0.0,  0.0,
+   [-1.0, 1.0,
+    1.0,  1.0,
+    0.0,  0.0,
 
-    0.0,  0.0,
-    -1.0, -1.0,
-    -1.0, 0.0];
+    0.0,  0.0,
+    -1.0, -1.0,
+    -1.0, 0.0];
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl. TRIANGLES, 0, 6);
        -

        TRIANGLE_STRIP

        In the triangle strip type, a triangle is created using the last 2 vertices and the next vertex. In the example, 6 vertices are needed. + +

        TRIANGLE_STRIP

        In the triangle strip type, a triangle is created using the last 2 vertices and the next vertex. In the example, 6 vertices are needed.

        Triangle strip

         var vertices =
-   [1.0, 1.0, /* p1 */
-    0.0, 1.0, /* p2 */
-    1.0, 0.0, /* p3 */
-    0.0, 0.0, /* p4 */
-    1.0, -1.0, /* p5 */
-    0.0, -1.0]; /* p6 */
+   [1.0, 1.0, /* p1 */
+    0.0, 1.0, /* p2 */
+    1.0, 0.0, /* p3 */
+    0.0, 0.0, /* p4 */
+    1.0, -1.0, /* p5 */
+    0.0, -1.0]; /* p6 */
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl. TRIANGLE_STRIP, 0, 6);
        -

        TRIANGLE_FAN

        TRIANGLE_FAN

        In the triangle fan type, the first IBO index is shared in all elements. In the example, the p0 vertex is shared by all triangles, so 4 triangles are created with 6 vertices.

        Triangle fan

         var vertices =
-   [0.0,  0.0, /* p0 */
-    1.0,  0.8, /* p1 */
-    -0.5, 1.0, /* p2 */
-    -0.8, 0.2, /* p3 */
-    -1.0, -1.0, /* p4 */
-    1.0,  -1.0]; /* p5 */
+   [0.0,  0.0, /* p0 */
+    1.0,  0.8, /* p1 */
+    -0.5, 1.0, /* p2 */
+    -0.8, 0.2, /* p3 */
+    -1.0, -1.0, /* p4 */
+    1.0,  -1.0]; /* p5 */
 
 gl.vertexAttribPointer(vertexPositionAttribute, 2,
-                       gl.FLOAT, false, 0, 0);
+                       gl.FLOAT, false, 0, 0);
 gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);
        -
        @@ -505,40 +505,40 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

        Source Code

        For the complete source code related to this use case, see the following files:

        +
      66. webgl_triangle.html
        67. +

    Setting Colors

    To enhance the user experience of your application with WebGL features, you must learn to set colors using attributes and a buffer:

    -
      +

      1. Define the vertex shader and fragment shader using the gl_Position and gl_FragColor variables of the OpenGL® ES Shading Language (GLSL ES):

        -<script id="vshader" type="x-shader/x-vertex">
-   attribute vec2 attVertexPos;
-   attribute vec4 attVertexColor;
+<script id="vshader" type="x-shader/x-vertex">
+   attribute vec2 attVertexPos;
+   attribute vec4 attVertexColor;
 
-   varying vec4 vColor;
+   varying vec4 vColor;
 
-   void main()
-   {
-      gl_Position = vec4(attVertexPos, 0, 2);
-      vColor = attVertexColor;
-   }
+   void main()
+   {
+      gl_Position = vec4(attVertexPos, 0, 2);
+      vColor = attVertexColor;
+   }
 </script>
 
-<script id="fshader" type="x-shader/x-fragment">
-   precision mediump float;
+<script id="fshader" type="x-shader/x-fragment">
+   precision mediump float;
 
-   varying vec4 vColor;
+   varying vec4 vColor;
 
-   void main()
-   {
-      gl_FragColor = vColor;
-   }
+   void main()
+   {
+      gl_FragColor = vColor;
+   }
 </script>
        2. @@ -546,60 +546,60 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

      2. Define a rectangular vertex comprised of 2 triangles:

         <script>
-   var vertices =
-      [1.0,  1.0, /* p1 */
-       -1.0, 1.0, /* p2 */
-       1.0,  -1.0, /* p3 */
-       -1.0, -1.0]; /* p4 */
+   var vertices =
+      [1.0,  1.0, /* p1 */
+       -1.0, 1.0, /* p2 */
+       1.0,  -1.0, /* p3 */
+       -1.0, -1.0]; /* p4 */
        -

        Result of the coordinates on the left

        +

        Result of the coordinates on the left

      3. Create the color buffer and render the 2 triangles using the gl.TRIANGLE_STRIP attribute:

        -   /* Define the color of each vertex as an array */
-   var colors =
-      [1.0, 0.0, 0.0, 1.0, /* Red */
-       0.0, 1.0, 0.0, 1.0, /* Green */
-       0.0, 0.0, 1.0, 1.0, /* Blue */
-       1.0, 0.0, 0.0, 1.0]; /* Red */
-
-   /* Create a buffer for storing the color value */
-   var triangleVerticesColorBuffer = gl.createBuffer();
-   /* Bind the buffer */
-   gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesColorBuffer);
-   /* Store data in the buffer */
-   gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(colors), gl.STATIC_DRAW);
-
-   /* Bring the color attribute position from the WebGlProgram instance */
-   var vertexColorAttribute = gl.getAttribLocation(program, "attVertexColor");
-   /* Activate the attribute data array */
-   gl.enableVertexAttribArray(vertexColorAttribute);
-   gl.vertexAttribPointer(vertexColorAttribute, 4, gl.FLOAT, false, 0, 0);
-
-   gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+   /* Define the color of each vertex as an array */
+   var colors =
+      [1.0, 0.0, 0.0, 1.0, /* Red */
+       0.0, 1.0, 0.0, 1.0, /* Green */
+       0.0, 0.0, 1.0, 1.0, /* Blue */
+       1.0, 0.0, 0.0, 1.0]; /* Red */
+
+   /* Create a buffer for storing the color value */
+   var triangleVerticesColorBuffer = gl.createBuffer();
+   /* Bind the buffer */
+   gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesColorBuffer);
+   /* Store data in the buffer */
+   gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(colors), gl.STATIC_DRAW);
+
+   /* Bring the color attribute position from the WebGlProgram instance */
+   var vertexColorAttribute = gl.getAttribLocation(program, "attVertexColor");
+   /* Activate the attribute data array */
+   gl.enableVertexAttribArray(vertexColorAttribute);
+   gl.vertexAttribPointer(vertexColorAttribute, 4, gl.FLOAT, false, 0, 0);
+
+   gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
 </script>
        4. -
      +

    The following figure shows the result as it is displayed on the screen.

    -

    Figure: Color on the screen

    -

    Color on the screen

    +

    Figure: Color on the screen

    +

    Color on the screen

    Source Code

    For the complete source code related to this use case, see the following file:

    - +
  • webgl_color.html
    • + +

    Setting Textures

    To enhance the user experience of your application with WebGL features, you must learn to use a texture, which is an image applied to the surface:

    -
      +

      1. Define the vertex shader and fragment shader using the gl_Position and gl_FragColor variables of the OpenGL® ES Shading Language (GLSL ES). In this example, the texture coordinate attribute is used instead of the vertex coordinate attribute.

        Set the variable to pass the texture coordinate over to the fragment shader. Define the formula for calculating the texture coordinates.

        @@ -609,27 +609,27 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6); 
    -<script id="vshader" type="x-shader/x-vertex">
-   attribute vec2 attVertexPos;
-   varying highp vec2 varTextureCoord;
-
-   void main(void)
-   {
-      gl_Position = vec4(attVertexPos, 0, 2.0);
-      varTextureCoord = 0.5 * attVertexPos.xy + 0.5;
-   }
+<script id="vshader" type="x-shader/x-vertex">
+   attribute vec2 attVertexPos;
+   varying highp vec2 varTextureCoord;
+
+   void main(void)
+   {
+      gl_Position = vec4(attVertexPos, 0, 2.0);
+      varTextureCoord = 0.5 * attVertexPos.xy + 0.5;
+   }
 </script>
 
-<script id="fshader" type="x-shader/x-fragment">
-   varying highp vec2 varTextureCoord;
-   uniform sampler2D unfSampler; /* Used to access the texture */
+<script id="fshader" type="x-shader/x-fragment">
+   varying highp vec2 varTextureCoord;
+   uniform sampler2D unfSampler; /* Used to access the texture */
 
-   void main(void)
-   {
-      /* texture2D(texture sampler, texture coordinate) */
-      gl_FragColor =
-         texture2D(unfSampler, vec2(varTextureCoord.s, varTextureCoord.t));
-   }
+   void main(void)
+   {
+      /* texture2D(texture sampler, texture coordinate) */
+      gl_FragColor =
+         texture2D(unfSampler, vec2(varTextureCoord.s, varTextureCoord.t));
+   }
 </script>
    @@ -642,7 +642,7 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

  • Create a new texture instance using the createTexture() method:

     <script>
-   var texture = gl.createTexture();
+   var texture = gl.createTexture();
    @@ -654,68 +654,68 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

  • Load the image file to be used as texture data, and bind the texture using the bindTexture() method:

    -   var textureImage = new Image();
-   textureImage.onload = function()
-   {
-      loadedTextureHandler(texture);
-   };
-   textureImage.src = "images/carp.jpg"
-
-   function loadedTextureHandler(texture)
-   {
-      /* Initialize texture */
-      gl.bindTexture(gl.TEXTURE_2D, texture);
-      gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
+   var textureImage = new Image();
+   textureImage.onload = function()
+   {
+      loadedTextureHandler(texture);
+   };
+   textureImage.src = "images/carp.jpg"
+
+   function loadedTextureHandler(texture)
+   {
+      /* Initialize texture */
+      gl.bindTexture(gl.TEXTURE_2D, texture);
+      gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);

    The image data loaded in HTML has the opposite y-axis as the webGL direction. Use the gl.UNPACK_FLIP_Y_WEBGL attribute to reverse the data and store it.

  • Use the loaded image file to fill the texture data. The texImage2D() method assigns the image to be used as a texture, and the textParameteri() method assigns a filter.

    -      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA,
-                    gl.UNSIGNED_BYTE, textureImage);
+      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA,
+                    gl.UNSIGNED_BYTE, textureImage);
 
-      /* Filter texture */
-      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
-      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+      /* Filter texture */
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
 
-      /* Wrap texture */
-      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
-      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+      /* Wrap texture */
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  • Import the unfSampler uniform location to use in the program: - + 
    -      var unfSampler = gl.getUniformLocation(program, "uSampler");
-      gl.uniform1i(unfSampler, 0);
+      var unfSampler = gl.getUniformLocation(program, "uSampler");
+      gl.uniform1i(unfSampler, 0);
  • Draw the image using the drawArrays() method: 
    -      var vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
-      gl.enableVertexAttribArray(vertexPositionAttribute);
-      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
-      gl.vertexAttribPointer(vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
+      var vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
+      gl.enableVertexAttribArray(vertexPositionAttribute);
+      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
+      gl.vertexAttribPointer(vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
 
-      gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
-   }
+      gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+   }
 </script>
    • - +

    The following figure shows the result as it is displayed on the screen.

    -

    Figure: Texture on the screen

    -

    Texture on the screen

    +

    Figure: Texture on the screen

    +

    Texture on the screen

    Source Code

    For the complete source code related to this use case, see the following files:

    +

    Creating an Animation

    @@ -725,62 +725,62 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);
  • Calculate the central point: 
     <script>
-   var r = 0.1; /* Radius */
-   var n = 50; /* Number of vertices */
-   var cx = 0; /* x axis central point */
-   var cy = 0; /* y axis central point */
-
-   /* Common coordinates for all triangles (the central point of a circle) */
-   var centerVertices = [cx, cy]; 
-   var circumVertices = [];
-   var lastVertices = [];
-   var vertices = [];
-   var angle = 0.0;
-   draw();
-
-   function draw()
-   {
-      gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); /* Clear the canvas */
-      /* Calculate the coordinate of central point to be moved to */
-      cy = cx = Math.sin(angle) * 0.9; 
-      centerVertices = [cx, cy];
-      circumVertices = [];
-      lastVertices = [];
-      vertices = [];
+   var r = 0.1; /* Radius */
+   var n = 50; /* Number of vertices */
+   var cx = 0; /* x axis central point */
+   var cy = 0; /* y axis central point */
+
+   /* Common coordinates for all triangles (the central point of a circle) */
+   var centerVertices = [cx, cy];
+   var circumVertices = [];
+   var lastVertices = [];
+   var vertices = [];
+   var angle = 0.0;
+   draw();
+
+   function draw()
+   {
+      gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); /* Clear the canvas */
+      /* Calculate the coordinate of central point to be moved to */
+      cy = cx = Math.sin(angle) * 0.9;
+      centerVertices = [cx, cy];
+      circumVertices = [];
+      lastVertices = [];
+      vertices = [];
  • Use a trigonometric function to calculate the vertex location of a regular N polygon with the central point as the center. Store the n(50) vertex coordinates using the changed central point as the center of the array. 
    -      for (var i = 0; i < n; i++)
-      {
-         circumVertices.push(cx+r * Math.cos(i/n*2 * Math.PI - Math.PI/2));
-         circumVertices.push(cy+r * Math.sin(i/n*2 * Math.PI - Math.PI/2));
-      }
-
-      lastVertices = [circumVertices[0], circumVertices[1]];
-      circumVertices = circumVertices.concat(lastVertices);
-      vertices = vertices.concat(centerVertices);
-      vertices = vertices.concat(circumVertices);
+      for (var i = 0; i < n; i++)
+      {
+         circumVertices.push(cx+r * Math.cos(i/n*2 * Math.PI - Math.PI/2));
+         circumVertices.push(cy+r * Math.sin(i/n*2 * Math.PI - Math.PI/2));
+      }
+
+      lastVertices = [circumVertices[0], circumVertices[1]];
+      circumVertices = circumVertices.concat(lastVertices);
+      vertices = vertices.concat(centerVertices);
+      vertices = vertices.concat(circumVertices);
  • Change the value of the variable in order to calculate the central point. Render the circle with the central point and vertex location, using the TRIANGLE_FAN argument that allows all triangles to share a central point to make a circle. 
    -      /* Change the angle value to change the central point coordinates */
-      angle += 0.01;
-
-      var triangleVerticesBuffer = gl.createBuffer();
-      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
-      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
-
-      var vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
-      gl.enableVertexAttribArray(vertexPositionAttribute);
-      gl.vertexAttribPointer(vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
-      gl.drawArrays(gl.TRIANGLE_FAN, 0, n + 2);
-   }
+      /* Change the angle value to change the central point coordinates */
+      angle += 0.01;
+
+      var triangleVerticesBuffer = gl.createBuffer();
+      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
+      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+
+      var vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
+      gl.enableVertexAttribArray(vertexPositionAttribute);
+      gl.vertexAttribPointer(vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
+      gl.drawArrays(gl.TRIANGLE_FAN, 0, n + 2);
+   }
  • Use the setInterval() method to set the rendering interval of the circle: 
    -   window.setInterval(function() {draw();}, 10);
+   window.setInterval(function() {draw();}, 10);
 </script>
    @@ -792,14 +792,14 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    The following figure shows the animation as it is displayed on the screen.

    -

    Figure: Animation on the screen

    -

    Animation on the screen

    +

    Figure: Animation on the screen

    +

    Animation on the screen

    Source Code

    For the complete source code related to this use case, see the following file:

    +
  • webgl_animation.html
    • +

    Creating a 3D Perspective

    @@ -809,90 +809,90 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

  • Set the vertex coordinate and color buffer values to draw 2 triangles:

     <script>
-   function setupBuffers()
-   {
-      var colors =
-         [1.0, 0.5, 0.5,
-          1.0, 0.5, 0.5,
-          1.0, 0.5, 0.5,
-
-          1.0, 0.8, 0.0,
-          1.0, 0.8, 0.0,
-          1.0, 0.8, 0.0];
-
-      triangleVerticesColorBuffer = gl.createBuffer();
-      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesColorBuffer);
-      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(colors), gl.STATIC_DRAW);
-   }
-
-   function setupVerticesBuffer()
-   {
-      var vertices =
-         [-0.5, 0.5,  0.0,
-          0.5,  -0.5, 0.0,
-          -0.5, -0.5, 0.0,
-
-          0.5,  0.5,  0.0,
-          -0.5, 0.5,  0.0,
-          0.5,  -0.5, 0.0];
-
-      triangleVerticesBuffer = gl.createBuffer();
-      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
-      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
-   }
-
-   function drawScene()
-   {
-      vertexColorAttribute = gl.getAttribLocation(program, "attVertexColor");
-      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesColorBuffer);
-      gl.enableVertexAttribArray(vertexColorAttribute);
-      gl.vertexAttribPointer(vertexColorAttribute, 3, gl.FLOAT, false, 0,0);
-
-      vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
-
-      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
-      gl.enableVertexAttribArray(vertexPositionAttribute);
-      gl.vertexAttribPointer(vertexPositionAttribute, 3, gl.FLOAT, false, 0,0);
-
-      gl.drawArrays(gl.TRIANGLES, 0, 6);
-   }
+   function setupBuffers()
+   {
+      var colors =
+         [1.0, 0.5, 0.5,
+          1.0, 0.5, 0.5,
+          1.0, 0.5, 0.5,
+
+          1.0, 0.8, 0.0,
+          1.0, 0.8, 0.0,
+          1.0, 0.8, 0.0];
+
+      triangleVerticesColorBuffer = gl.createBuffer();
+      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesColorBuffer);
+      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(colors), gl.STATIC_DRAW);
+   }
+
+   function setupVerticesBuffer()
+   {
+      var vertices =
+         [-0.5, 0.5,  0.0,
+          0.5,  -0.5, 0.0,
+          -0.5, -0.5, 0.0,
+
+          0.5,  0.5,  0.0,
+          -0.5, 0.5,  0.0,
+          0.5,  -0.5, 0.0];
+
+      triangleVerticesBuffer = gl.createBuffer();
+      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
+      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+   }
+
+   function drawScene()
+   {
+      vertexColorAttribute = gl.getAttribLocation(program, "attVertexColor");
+      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesColorBuffer);
+      gl.enableVertexAttribArray(vertexColorAttribute);
+      gl.vertexAttribPointer(vertexColorAttribute, 3, gl.FLOAT, false, 0,0);
+
+      vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
+
+      gl.bindBuffer(gl.ARRAY_BUFFER, triangleVerticesBuffer);
+      gl.enableVertexAttribArray(vertexPositionAttribute);
+      gl.vertexAttribPointer(vertexPositionAttribute, 3, gl.FLOAT, false, 0,0);
+
+      gl.drawArrays(gl.TRIANGLES, 0, 6);
+   }
 </script>
    -

    2 triangles

    +

    2 triangles

  • Define the vertex shader and fragment shader with using the gl_Position and gl_FragColor variables of the OpenGL® ES Shading Language (GLSL ES), and modify the GLSL ES variables:

    -<script id="vshader" type="x-shader/x-vertex">
-   attribute vec3 attVertexPos;
-   attribute vec3 attVertexColor;
+<script id="vshader" type="x-shader/x-vertex">
+   attribute vec3 attVertexPos;
+   attribute vec3 attVertexColor;
 
-   uniform mat4 uMVMatrix; /* Uniform variable delivered with the model view matrix */
-   uniform mat4 uPMatrix; /* Uniform variable delivered with the projection matrix */
+   uniform mat4 uMVMatrix; /* Uniform variable delivered with the model view matrix */
+   uniform mat4 uPMatrix; /* Uniform variable delivered with the projection matrix */
 
-   varying vec4 vColor;
+   varying vec4 vColor;
 
-   void main()
-   {
-      /*
-         Multiply the model view matrix and projection matrix
-         to the original coordinates
-      */
-      gl_Position = uPMatrix * uMVMatrix *  vec4(attVertexPos, 1.0);
+   void main()
+   {
+      /*
+         Multiply the model view matrix and projection matrix
+         to the original coordinates
+      */
+      gl_Position = uPMatrix * uMVMatrix *  vec4(attVertexPos, 1.0);
 
-      vColor = vec4(attVertexColor, 1.0);
-   }
+      vColor = vec4(attVertexColor, 1.0);
+   }
 </script>
 
-<script id="fshader" type="x-shader/x-fragment">
-   precision mediump float;
+<script id="fshader" type="x-shader/x-fragment">
+   precision mediump float;
 
-   varying vec4 vColor;
+   varying vec4 vColor;
 
-   void main()
-   {
-      gl_FragColor = vColor;
-   }
+   void main()
+   {
+      gl_FragColor = vColor;
+   }
 </script>
    @@ -902,25 +902,25 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

  • Edit the z coordinate of the right triangle to apply perspective:

     <script>
-   gl.viewport(0, 0, canvas.width, canvas.height);
-   mat4.perspective(45, canvas.width / canvas.height, 0.1, 100.0, pMatrix);
-   mat4.identity(mvMatrix);
-   mat4.translate(mvMatrix, [0, 0, -2.0]);
+   gl.viewport(0, 0, canvas.width, canvas.height);
+   mat4.perspective(45, canvas.width / canvas.height, 0.1, 100.0, pMatrix);
+   mat4.identity(mvMatrix);
+   mat4.translate(mvMatrix, [0, 0, -2.0]);
 </script>

  • Download the glMatrix library (gl-matrix-min.js) and include it in the HTML:

    -<script src="js/lib/gl-matrix-min.js"></script>
+<script src="js/lib/gl-matrix-min.js"></script>

  • Declare the variable to store the model view matrix and projection matrix:

     <script>
-   var mvMatrix = mat4.create();
-   var pMatrix = mat4.create();
+   var mvMatrix = mat4.create();
+   var pMatrix = mat4.create();
 </script>
    • @@ -928,32 +928,32 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

  • Check that the location of the uPMatrix and uMVMatrix uniforms can be used in program:

     <script>
-   function getMatrixUniforms()
-   {
-      pMatrixUniform = gl.getUniformLocation(program, "uPMatrix");
-      mvMatrixUniform = gl.getUniformLocation(program, "uMVMatrix");
-   }
-
-   function setMatrixUniforms()
-   {
-      gl.uniformMatrix4fv(pMatrixUniform, false, pMatrix);
-      gl.uniformMatrix4fv(mvMatrixUniform, false, mvMatrix);
-   }
+   function getMatrixUniforms()
+   {
+      pMatrixUniform = gl.getUniformLocation(program, "uPMatrix");
+      mvMatrixUniform = gl.getUniformLocation(program, "uMVMatrix");
+   }
+
+   function setMatrixUniforms()
+   {
+      gl.uniformMatrix4fv(pMatrixUniform, false, pMatrix);
+      gl.uniformMatrix4fv(mvMatrixUniform, false, mvMatrix);
+   }
 </script>

    • The following figure shows the 3D perspective as it is displayed on the screen.

    -

    Figure: 3D perspective on the screen

    -

    3D perspective on the screen

    +

    Figure: 3D perspective on the screen

    +

    3D perspective on the screen

    Source Code

    For the complete source code related to this use case, see the following files:

    +
  • gl-matrix-min.js
    • +

    Using Touch Events

    @@ -962,44 +962,44 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    1. Define the vertex shader and fragment shader using the gl_Position and gl_FragColor variables of the OpenGL® ES Shading Language (GLSL ES):

      -<script id="vshader" type="x-shader/x-vertex">
-   attribute vec3 attVertexPos; /* Vertex coordinate attribute */
-   attribute vec2 attTextureCoord; /* Texture coordinate attribute */
-
-   uniform mat4 unifMVMatrix; /* Model–view uniform */
-   uniform mat4 unifPMatrix; /* Projection matrix uniform */
-
-   /* Texture coordinate storing variable used in the fragment shader */
-   varying vec2 vTextureCoord;
-
-   void main(void)
-   {
-      /*
-         Multiply the model-view matrix and projection matrix
-         to the original coordinates to apply the 3D perspective
-      */
-      gl_Position = unifPMatrix * unifMVMatrix * vec4(attVertexPos, 1.0);
-      /* Store the texture coordinates */
-      vTextureCoord = attTextureCoord;
-   }
+<script id="vshader" type="x-shader/x-vertex">
+   attribute vec3 attVertexPos; /* Vertex coordinate attribute */
+   attribute vec2 attTextureCoord; /* Texture coordinate attribute */
+
+   uniform mat4 unifMVMatrix; /* Model–view uniform */
+   uniform mat4 unifPMatrix; /* Projection matrix uniform */
+
+   /* Texture coordinate storing variable used in the fragment shader */
+   varying vec2 vTextureCoord;
+
+   void main(void)
+   {
+      /*
+         Multiply the model-view matrix and projection matrix
+         to the original coordinates to apply the 3D perspective
+      */
+      gl_Position = unifPMatrix * unifMVMatrix * vec4(attVertexPos, 1.0);
+      /* Store the texture coordinates */
+      vTextureCoord = attTextureCoord;
+   }
 </script>
 
-<script id="fshader" type="x-shader/x-fragment">
+<script id="fshader" type="x-shader/x-fragment">
 
-   /*
-      Use a floating point arithmetic value to define
-      the display precision (highp, mediump, or lowp)
-   */
-   precision mediump float;
+   /*
+      Use a floating point arithmetic value to define
+      the display precision (highp, mediump, or lowp)
+   */
+   precision mediump float;
 
-   varying vec2 vTextureCoord;
+   varying vec2 vTextureCoord;
 
-   uniform sampler2D unifSampler; /* Handle the cube mapped texture */
+   uniform sampler2D unifSampler; /* Handle the cube mapped texture */
 
-   void main(void)
-   {
-      gl_FragColor = texture2D(unifSampler, vec2(vTextureCoord.s, vTextureCoord.t));
-   }
+   void main(void)
+   {
+      gl_FragColor = texture2D(unifSampler, vec2(vTextureCoord.s, vTextureCoord.t));
+   }
 </script>
      2. @@ -1007,34 +1007,34 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    2. Define the variables to be used and the methods to be executed when the window is loaded:

       <script>
-   var gl = null;
-   var program = null;
+   var gl = null;
+   var program = null;
 
-   var diceTexture;
-   var mvMatrix = mat4.create();
-   var pMatrix = mat4.create();
+   var diceTexture;
+   var mvMatrix = mat4.create();
+   var pMatrix = mat4.create();
 
-   var cubeVertexPositionBuffer; /* Buffer for vertex coordinate information */
-   var cubeVertexTextureCoordBuffe; /* Buffer for texture coordinate information */
-   var cubeVertexIndexBuffer; /* Buffer for index information */
+   var cubeVertexPositionBuffer; /* Buffer for vertex coordinate information */
+   var cubeVertexTextureCoordBuffe; /* Buffer for texture coordinate information */
+   var cubeVertexIndexBuffer; /* Buffer for index information */
 
-   var xRot = 30;
-   var yRot = 30;
+   var xRot = 30;
+   var yRot = 30;
 
-   window.onload = startWegGL;
+   window.onload = startWegGL;
 
-   function startWegGL()
-   {
-      gl = getWebGLContext();
-      initShaders();
-      initBuffers();
-      initTexture(drawScene);
+   function startWegGL()
+   {
+      gl = getWebGLContext();
+      initShaders();
+      initBuffers();
+      initTexture(drawScene);
 
-      gl.clearColor(0.5,0.5,0.4,1.0);
-      gl.enable(gl.DEPTH_TEST);
+      gl.clearColor(0.5,0.5,0.4,1.0);
+      gl.enable(gl.DEPTH_TEST);
 
-      initEvent();
-   }
+      initEvent();
+   }
 </script>
      3. @@ -1042,17 +1042,17 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    3. Use the getContext() method of the canvas object to import the WebGL context:

       <script>
-   function getWebGLContext()
-   {
-      canvas = document.getElementById("canvas");
-      var webGLContext = canvas.getContext("experimental-webgl");
+   function getWebGLContext()
+   {
+      canvas = document.getElementById("canvas");
+      var webGLContext = canvas.getContext("experimental-webgl");
 
-      return webGLContext;
-   }
+      return webGLContext;
+   }
 </script>
 
 <body>
-   <canvas id="canvas" width="300" height="300"></canvas>
+   <canvas id="canvas" width="300" height="300"></canvas>
 </body>
      4. @@ -1060,135 +1060,135 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    4. Create the shaders and programs using the createShader() and createProgram() methods:

       <script>
-   function initShaders()
-   {
-      var vshader = gl.createShader(gl.VERTEX_SHADER);
-      var fshader = gl.createShader(gl.FRAGMENT_SHADER);
-      gl.shaderSource(vshader, document.getElementById('vshader').text);
-      gl.shaderSource(fshader, document.getElementById('fshader').text);
-      gl.compileShader(vshader);
-      gl.compileShader(fshader);
-
-      program = gl.createProgram();
-      gl.attachShader(program, vshader);
-      gl.attachShader(program, fshader);
-      gl.linkProgram(program); /* Link to program */
-      gl.useProgram(program); /* Shaders are loaded and used */
-
-      program.vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
-      gl.enableVertexAttribArray(program.vertexPositionAttribute);
-
-      program.textureCoordAttribute =
-         gl.getAttribLocation(program, "attTextureCoord");
-      gl.enableVertexAttribArray(program.textureCoordAttribute);
-
-      program.pMatrixUniform = gl.getUniformLocation(program, "unifPMatrix");
-      program.mvMatrixUniform = gl.getUniformLocation(program, "unifMVMatrix");
+   function initShaders()
+   {
+      var vshader = gl.createShader(gl.VERTEX_SHADER);
+      var fshader = gl.createShader(gl.FRAGMENT_SHADER);
+      gl.shaderSource(vshader, document.getElementById('vshader').text);
+      gl.shaderSource(fshader, document.getElementById('fshader').text);
+      gl.compileShader(vshader);
+      gl.compileShader(fshader);
+
+      program = gl.createProgram();
+      gl.attachShader(program, vshader);
+      gl.attachShader(program, fshader);
+      gl.linkProgram(program); /* Link to program */
+      gl.useProgram(program); /* Shaders are loaded and used */
+
+      program.vertexPositionAttribute = gl.getAttribLocation(program, "attVertexPos");
+      gl.enableVertexAttribArray(program.vertexPositionAttribute);
+
+      program.textureCoordAttribute =
+         gl.getAttribLocation(program, "attTextureCoord");
+      gl.enableVertexAttribArray(program.textureCoordAttribute);
+
+      program.pMatrixUniform = gl.getUniformLocation(program, "unifPMatrix");
+      program.mvMatrixUniform = gl.getUniformLocation(program, "unifMVMatrix");
      5. -
    5. To send the loaded texture image to the shader program, and add a reference to the shader program unifSampler location: +
    6. To send the loaded texture image to the shader program, and add a reference to the shader program unifSampler location: 
      -      program.samplerUniform = gl.getUniformLocation(program, "unifSampler");
-   }
+      program.samplerUniform = gl.getUniformLocation(program, "unifSampler");
+   }

    7. Initialize the buffer:

      -   function initBuffers()
-   {
-      vertices =
-         /* Front */
-         [-1.0, -1.0, 1.0,   1.0, -1.0, 1.0,   1.0, 1.0, 1.0,   -1.0, 1.0, 1.0,
-          /* Back */
-          -1.0, -1.0, -1.0,  -1.0, 1.0, -1.0,  1.0, 1.0, -1.0,  1.0, -1.0, -1.0,
-          /* Top */
-          -1.0, 1.0, -1.0,   -1.0, 1.0, 1.0,   1.0, 1.0, 1.0,   1.0, 1.0, -1.0,
-          /* Bottom */
-          -1.0, -1.0, -1.0,  1.0, -1.0, -1.0,  1.0, -1.0, 1.0,  -1.0, -1.0, 1.0,
-          /* Right */
-          1.0, -1.0, -1.0,   1.0, 1.0, -1.0,   1.0, 1.0, 1.0,   1.0, -1.0, 1.0,
-          /* Left */
-          -1.0, -1.0, -1.0,  -1.0, -1.0, 1.0,  -1.0, 1.0, 1.0,  -1.0, 1.0, -1.0];
-      cubeVertexPositionBuffer = gl.createBuffer();
-      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexPositionBuffer);
-      /* Convert to Float32Array */
-      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
-      cubeVertexPositionBuffer.itemSize = 3;
-      cubeVertexPositionBuffer.numItems = 24;
-
-      var textureCoords =
-         [0.0, 0.5,   0.25, 0.5,  0.25, 1.0,  0.0, 1.0, /* Front */
-          0.5, 0.5,   0.75, 0.5,  0.75, 1.0,  0.5, 1.0, /* Back */
-          0.0, 0.5,   0.25, 0.5,  0.25, 0.0,  0.0, 0.0, /* Top */
-          0.25, 0.5,  0.5, 0.5,   0.5, 0.0,   0.25, 0.0, /* Bottom */
-          0.25, 0.5,  0.5, 0.5,   0.5, 1.0,   0.25, 1.0, /* Right */
-          0.75, 0.5,  1.0, 0.5,   1.0, 1.0,   0.75, 1.0]; /* Left */
-      cubeVertexTextureCoordBuffer = gl.createBuffer();
-      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexTextureCoordBuffer);
-      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureCoords),
-                    gl.STATIC_DRAW);
-      cubeVertexTextureCoordBuffer.itemSize = 2;
-      cubeVertexTextureCoordBuffer.numItems = 24;
-
-      cubeVertexIndexBuffer = gl.createBuffer();
-      gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVertexIndexBuffer);
-      var cubeVertexIndices =
-         [0,  1,  2,    0,  2,  3, /* Front */
-          4,  5,  6,    4,  6,  7, /* Back */
-          8,  9,  10,   8,  10, 11, /* Top */
-          12, 13, 14,   12, 14, 15, /* Bottom */
-          16, 17, 18,   16, 18, 19, /* Right */
-          20, 21, 22,   20, 22, 23]; /* Left */
-
-      gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(cubeVertexIndices),
-                    gl.STATIC_DRAW);
-      cubeVertexIndexBuffer.itemSize = 1;
-      cubeVertexIndexBuffer.numItems = 36;
-   }
+   function initBuffers()
+   {
+      vertices =
+         /* Front */
+         [-1.0, -1.0, 1.0,   1.0, -1.0, 1.0,   1.0, 1.0, 1.0,   -1.0, 1.0, 1.0,
+          /* Back */
+          -1.0, -1.0, -1.0,  -1.0, 1.0, -1.0,  1.0, 1.0, -1.0,  1.0, -1.0, -1.0,
+          /* Top */
+          -1.0, 1.0, -1.0,   -1.0, 1.0, 1.0,   1.0, 1.0, 1.0,   1.0, 1.0, -1.0,
+          /* Bottom */
+          -1.0, -1.0, -1.0,  1.0, -1.0, -1.0,  1.0, -1.0, 1.0,  -1.0, -1.0, 1.0,
+          /* Right */
+          1.0, -1.0, -1.0,   1.0, 1.0, -1.0,   1.0, 1.0, 1.0,   1.0, -1.0, 1.0,
+          /* Left */
+          -1.0, -1.0, -1.0,  -1.0, -1.0, 1.0,  -1.0, 1.0, 1.0,  -1.0, 1.0, -1.0];
+      cubeVertexPositionBuffer = gl.createBuffer();
+      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexPositionBuffer);
+      /* Convert to Float32Array */
+      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+      cubeVertexPositionBuffer.itemSize = 3;
+      cubeVertexPositionBuffer.numItems = 24;
+
+      var textureCoords =
+         [0.0, 0.5,   0.25, 0.5,  0.25, 1.0,  0.0, 1.0, /* Front */
+          0.5, 0.5,   0.75, 0.5,  0.75, 1.0,  0.5, 1.0, /* Back */
+          0.0, 0.5,   0.25, 0.5,  0.25, 0.0,  0.0, 0.0, /* Top */
+          0.25, 0.5,  0.5, 0.5,   0.5, 0.0,   0.25, 0.0, /* Bottom */
+          0.25, 0.5,  0.5, 0.5,   0.5, 1.0,   0.25, 1.0, /* Right */
+          0.75, 0.5,  1.0, 0.5,   1.0, 1.0,   0.75, 1.0]; /* Left */
+      cubeVertexTextureCoordBuffer = gl.createBuffer();
+      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexTextureCoordBuffer);
+      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureCoords),
+                    gl.STATIC_DRAW);
+      cubeVertexTextureCoordBuffer.itemSize = 2;
+      cubeVertexTextureCoordBuffer.numItems = 24;
+
+      cubeVertexIndexBuffer = gl.createBuffer();
+      gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVertexIndexBuffer);
+      var cubeVertexIndices =
+         [0,  1,  2,    0,  2,  3, /* Front */
+          4,  5,  6,    4,  6,  7, /* Back */
+          8,  9,  10,   8,  10, 11, /* Top */
+          12, 13, 14,   12, 14, 15, /* Bottom */
+          16, 17, 18,   16, 18, 19, /* Right */
+          20, 21, 22,   20, 22, 23]; /* Left */
+
+      gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(cubeVertexIndices),
+                    gl.STATIC_DRAW);
+      cubeVertexIndexBuffer.itemSize = 1;
+      cubeVertexIndexBuffer.numItems = 36;
+   }

    8. Initialize the WebGL texture and load the image to be used as the texture (the figure shows the coordinates of the image to be loaded):

      -   function initTexture(callback)
-   {
-      textureImage = new Image();
-      textureImage.onload = function()
-      {
-         handleLoadedTexture(textureImage)
-         if (callback) callback();
-      }
-      textureImage.src = "images/dice.gif";
-   }
-
-   function handleLoadedTexture(textureImage)
-   {
-      diceTexture = gl.createTexture();
-      gl.bindTexture(gl.TEXTURE_2D, diceTexture);
-
-      gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
-      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA,
-                    gl.UNSIGNED_BYTE, textureImage);
-
-      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-   }
+   function initTexture(callback)
+   {
+      textureImage = new Image();
+      textureImage.onload = function()
+      {
+         handleLoadedTexture(textureImage)
+         if (callback) callback();
+      }
+      textureImage.src = "images/dice.gif";
+   }
+
+   function handleLoadedTexture(textureImage)
+   {
+      diceTexture = gl.createTexture();
+      gl.bindTexture(gl.TEXTURE_2D, diceTexture);
+
+      gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
+      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA,
+                    gl.UNSIGNED_BYTE, textureImage);
+
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+   }
      -

      Image and coordinate of image to be loaded

      +

      Image and coordinate of image to be loaded

    9. Define the rendering location and canvas width and height:

      -   function drawScene()
-   {
-      gl.viewport(0, 0, canvas.width, canvas.height);
-      gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); /* Clear the canvas */
+   function drawScene()
+   {
+      gl.viewport(0, 0, canvas.width, canvas.height);
+      gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); /* Clear the canvas */
      10. -
    10. Import the mat4() method module and define it using the utility methods: +
    11. Import the mat4() method module and define it using the utility methods:
      Note @@ -1196,102 +1196,102 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6); 
      -      mat4.perspective(45, canvas.width / canvas.height, 0.1, 100.0, pMatrix);
-      mat4.identity(mvMatrix);
+      mat4.perspective(45, canvas.width / canvas.height, 0.1, 100.0, pMatrix);
+      mat4.identity(mvMatrix);
 
-      mat4.translate(mvMatrix, [0.0, 0.0, -5.0]);
+      mat4.translate(mvMatrix, [0.0, 0.0, -5.0]);
 
-      mat4.rotate(mvMatrix, xRot * Math.PI / 180, [1, 0, 0]);
-      mat4.rotate(mvMatrix, yRot * Math.PI / 180, [0, 1, 0]);
+      mat4.rotate(mvMatrix, xRot * Math.PI / 180, [1, 0, 0]);
+      mat4.rotate(mvMatrix, yRot * Math.PI / 180, [0, 1, 0]);
 
-      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexPositionBuffer);
-      gl.vertexAttribPointer(program.vertexPositionAttribute,
-                             cubeVertexPositionBuffer.itemSize,
-                             gl.FLOAT, false, 0, 0);
+      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexPositionBuffer);
+      gl.vertexAttribPointer(program.vertexPositionAttribute,
+                             cubeVertexPositionBuffer.itemSize,
+                             gl.FLOAT, false, 0, 0);
 
-      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexTextureCoordBuffer);
-      gl.vertexAttribPointer(program.textureCoordAttribute,
-                             cubeVertexTextureCoordBuffer.itemSize,
-                             gl.FLOAT, false, 0, 0);
+      gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexTextureCoordBuffer);
+      gl.vertexAttribPointer(program.textureCoordAttribute,
+                             cubeVertexTextureCoordBuffer.itemSize,
+                             gl.FLOAT, false, 0, 0);
 
-      gl.activeTexture(gl.TEXTURE0);
-      gl.bindTexture(gl.TEXTURE_2D, diceTexture);
-      gl.uniform1i(program.samplerUniform, 0);
+      gl.activeTexture(gl.TEXTURE0);
+      gl.bindTexture(gl.TEXTURE_2D, diceTexture);
+      gl.uniform1i(program.samplerUniform, 0);
 
-      gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVertexIndexBuffer);
+      gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVertexIndexBuffer);
 
-      gl.uniformMatrix4fv(program.pMatrixUniform, false, pMatrix);
-      gl.uniformMatrix4fv(program.mvMatrixUniform, false, mvMatrix);
+      gl.uniformMatrix4fv(program.pMatrixUniform, false, pMatrix);
+      gl.uniformMatrix4fv(program.mvMatrixUniform, false, mvMatrix);
 
-      gl.drawElements(gl.TRIANGLES, cubeVertexIndexBuffer.numItems,
-                      gl.UNSIGNED_SHORT, 0);
-   }
+      gl.drawElements(gl.TRIANGLES, cubeVertexIndexBuffer.numItems,
+                      gl.UNSIGNED_SHORT, 0);
+   }

    12. Add touch events:

      -   var touches;
-   function initEvent()
-   {
-      var startPosX;
-      var startPosY;
-      var movedPosX;
-      var movedPosY;
-
-      function mouseMoveHandler(e)
-      {
-         movedPosX = e.touches[0].pageX - startPosX;
-         movedPosY = e.touches[0].pageY - startPosY;
-         xRot += movedPosY * 0.05;
-         yRot += movedPosX * 0.05;
-
-         drawScene();
-      }
-
-      canvas.addEventListener('touchstart', function(e)
-         {
-            touches = e.touches.item(0);
-
-            startPosX = touches.pageX;
-            startPosY = touches.pageY;
-
-            canvas.addEventListener('touchmove', mouseMoveHandler)
-         });
-
-      canvas.addEventListener('touchend', function(e)
-         {
-            canvas.removeEventListener('touchmove', mouseMoveHandler)
-         })
-
-      canvas.addEventListener('touchend', function()
-         {
-            canvas.removeEventListener('touchmove', mouseMoveHandler)
-         });
-   }
+   var touches;
+   function initEvent()
+   {
+      var startPosX;
+      var startPosY;
+      var movedPosX;
+      var movedPosY;
+
+      function mouseMoveHandler(e)
+      {
+         movedPosX = e.touches[0].pageX - startPosX;
+         movedPosY = e.touches[0].pageY - startPosY;
+         xRot += movedPosY * 0.05;
+         yRot += movedPosX * 0.05;
+
+         drawScene();
+      }
+
+      canvas.addEventListener('touchstart', function(e)
+         {
+            touches = e.touches.item(0);
+
+            startPosX = touches.pageX;
+            startPosY = touches.pageY;
+
+            canvas.addEventListener('touchmove', mouseMoveHandler)
+         });
+
+      canvas.addEventListener('touchend', function(e)
+         {
+            canvas.removeEventListener('touchmove', mouseMoveHandler)
+         })
+
+      canvas.addEventListener('touchend', function()
+         {
+            canvas.removeEventListener('touchmove', mouseMoveHandler)
+         });
+   }
 </script>

    The following figure shows the dice as it is displayed on the screen.

    -

    Figure: Dice on the screen

    -

    Dice on the screen

    +

    Figure: Dice on the screen

    +

    Dice on the screen

    Source Code

    For the complete source code related to this use case, see the following files:

    +
  • dice.gif
    • +

    Using WebGL Frameworks

    -

    To enhance the user experience of your application with WebGL features, you must learn to use the three.js framework:

    +

    To enhance the user experience of your application with WebGL features, you must learn to use the three.js framework:

    1. Download the three.js library and included it in HTML file:

       <head>
-   <script src="js/lib/three.js"></script>
+   <script src="js/lib/three.js"></script>
 </head>
      2. @@ -1299,62 +1299,62 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    2. Set the area to allocate the <canvas> element in HTML, and to adjust the camera and light settings:

       <body>
-   <div>
-      <span id='webGLContainer'></span>
-      <span>
-         <table style='padding: 0px; background: black' border="1"
-                cellspacing="0" cellpadding="5">
-            <tr>
-               <td colspan="2" class="hd"><b>directionalLight</b></td>
-            </tr>
-            <tr>
-               <td align='right'>X:</td>
-               <td width='150px'>
-                  <input id="slider-lx" type="range"
-                         min="-1" max="1" step="0.01"/>
-               </td>
-            </tr>
-            <tr>
-               <td align='right'>Y:</td>
-               <td width='150px'>
-                  <input id="slider-ly" type="range"
-                         min="-1" max="1" step="0.01"/>
-               </td>
-            </tr>
-            <tr>
-               <td align='right'>Z:</td>
-               <td width='150px'>
-                  <input id="slider-lz" type="range"
-                         min="-1" max="1" step="0.01"/>
-               </td>
-            </tr>
-            <tr>
-               <td colspan="2" class="hd"><b>Camera</b></td>
-            </tr>
-            <tr>
-               <td align='right'>Z:</td>
-               <td width='150px'>
-                  <input id="slider-cz" type="range"
-                         min="300" max="800" step="10"/>
-               </td>
-            </tr>
-            <tr>
-               <td align='right'>rotate-X:</td>
-               <td width='150px'>
-                  <input id="slider-cax" type="range"
-                         min="-0.5" max="0.5" step="0.01"/>
-               </td>
-            </tr>
-            <tr>
-               <td align='right'>rotate-Y:</td>
-               <td width='150px'>
-                  <input id="slider-cay" type="range"
-                         min="-0.5" max="0.5" step="0.01"/>
-               </td>
-            </tr>
-         </table>
-      </span>
-   </div>
+   <div>
+      <span id='webGLContainer'></span>
+      <span>
+         <table style='padding: 0px; background: black' border="1"
+                cellspacing="0" cellpadding="5">
+            <tr>
+               <td colspan="2" class="hd"><b>directionalLight</b></td>
+            </tr>
+            <tr>
+               <td align='right'>X:</td>
+               <td width='150px'>
+                  <input id="slider-lx" type="range"
+                         min="-1" max="1" step="0.01"/>
+               </td>
+            </tr>
+            <tr>
+               <td align='right'>Y:</td>
+               <td width='150px'>
+                  <input id="slider-ly" type="range"
+                         min="-1" max="1" step="0.01"/>
+               </td>
+            </tr>
+            <tr>
+               <td align='right'>Z:</td>
+               <td width='150px'>
+                  <input id="slider-lz" type="range"
+                         min="-1" max="1" step="0.01"/>
+               </td>
+            </tr>
+            <tr>
+               <td colspan="2" class="hd"><b>Camera</b></td>
+            </tr>
+            <tr>
+               <td align='right'>Z:</td>
+               <td width='150px'>
+                  <input id="slider-cz" type="range"
+                         min="300" max="800" step="10"/>
+               </td>
+            </tr>
+            <tr>
+               <td align='right'>rotate-X:</td>
+               <td width='150px'>
+                  <input id="slider-cax" type="range"
+                         min="-0.5" max="0.5" step="0.01"/>
+               </td>
+            </tr>
+            <tr>
+               <td align='right'>rotate-Y:</td>
+               <td width='150px'>
+                  <input id="slider-cay" type="range"
+                         min="-0.5" max="0.5" step="0.01"/>
+               </td>
+            </tr>
+         </table>
+      </span>
+   </div>
 </body>
      3. @@ -1362,53 +1362,53 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    3. Define the variables to be used and the methods to be executed when the window is loaded. Once the window load is complete, import the startWebGl() method.

       <script>
-   var canvasWidth = 250; /* Canvas width */
-   var canvasHeight = 250; /* Canvas height */
-
-   var renderer = null; /* Variable containing the WebGLRenderer object */
-   var camera = null; /* Variable containing the PerspectiveCamera object */
-   var scene = null; /* Variable containing the Scene object */
-
-   /*
-      Object type variable containing, for example,
-      light and mesh information
-   */
-   var components = {};
-
-   window.onload = startWegGL;
-
-   function startWegGL()
-   {
-      setupWebGLRenderer();
-      setupCamera();
-      setupScene();
-
-      animate();
-      manipulate();
-   }
+   var canvasWidth = 250; /* Canvas width */
+   var canvasHeight = 250; /* Canvas height */
+
+   var renderer = null; /* Variable containing the WebGLRenderer object */
+   var camera = null; /* Variable containing the PerspectiveCamera object */
+   var scene = null; /* Variable containing the Scene object */
+
+   /*
+      Object type variable containing, for example,
+      light and mesh information
+   */
+   var components = {};
+
+   window.onload = startWegGL;
+
+   function startWegGL()
+   {
+      setupWebGLRenderer();
+      setupCamera();
+      setupScene();
+
+      animate();
+      manipulate();
+   }

    4. Create a new WebGLRenderer instance and, after setting the canvas size, add the domElement to the designated HTML location:

      -   function setupWebGLRenderer()
-   {
-      renderer = new THREE.WebGLRenderer();
-      renderer.setSize(canvasWidth, canvasHeight);
-
-      /* Add the canvas element to HTML */
-      document.getElementById('webGLContainer').appendChild(renderer.domElement);
-   }
+   function setupWebGLRenderer()
+   {
+      renderer = new THREE.WebGLRenderer();
+      renderer.setSize(canvasWidth, canvasHeight);
+
+      /* Add the canvas element to HTML */
+      document.getElementById('webGLContainer').appendChild(renderer.domElement);
+   }

    5. Create a new PerspectiveCamera instance:

      -   function setupCamera()
-   {
-      camera = new THREE.PerspectiveCamera(45, canvasWidth / canvasHeight, 1, 1000);
-      camera.position.z = 500;
-   }
+   function setupCamera()
+   {
+      camera = new THREE.PerspectiveCamera(45, canvasWidth / canvasHeight, 1, 1000);
+      camera.position.z = 500;
+   }
      @@ -1419,184 +1419,184 @@ gl.drawArrays(gl. TRIANGLE_FAN, 0, 6);

    6. Create a new Scene instance and create the mesh and light elements using the createMeshs() and setupLight() methods:

      -   function setupScene()
-   {
-      scene = new THREE.Scene();
-      createMeshs();
-      setupLight();
-
-      /* 
-         Circulate components and add the mesh
-         and light elements to the scene object
-      */
-      for (n in components)
-      {
-         scene.add(components[n]);
-      }
-   }
-
-   function createMeshs()
-   {
-      /* Create the cube mesh */
-      components.cubeMesh = (function()
-      {
-         var cube =
-            new THREE.Mesh(new THREE.CubeGeometry(100, 100, 100),
-                           new THREE.MeshLambertMaterial({color: new THREE.Color(0xff8080)}));
-         cube.overdraw = true;
-         cube.rotation.x = Math.PI * 0.1;
-         cube.position.x = -50;
-
-         return cube;
-      })();
-
-      /* Create the sphere mesh */
-      components.sphereMesh = (function()
-      {
-         var sphere =
-            new THREE.Mesh(new THREE.SphereGeometry(50, 40, 40),
-                           new THREE.MeshLambertMaterial({color: new THREE.Color(0xff8080)}));
-         sphere.overdraw = true;
-         sphere.position.x = 50;
-         sphere.position.z = 50;
-
-         return sphere;
-      })();
-
-      /* Create the plane mesh */
-      components.planeMesh = (function()
-      {
-         var plane =
-            new THREE.Mesh(new THREE.PlaneGeometry(300, 300, 10,0),
-                           new THREE.MeshLambertMaterial({color:'red'}));
-         plane.overdraw = true;
-         plane.position.y = -100;
-         plane.rotation.x = Math.PI * -0.4;
-
-         return plane;
-      })();
-   }
-
-   function setupLight()
-   {
-      /* Create a new DirectionalLight instance */
-      var directionalLight = new THREE.DirectionalLight(0xffffff);
-      /* Set the DirectionalLight location */
-      directionalLight.position.set(0, 0, 1).normalize();
-      /* Set directionalLight as a component element */
-      components.directionalLight = directionalLight;
-
-      /* Create a new AmbientLight instance and set it as a component element */
-      components.ambientLight = new THREE.AmbientLight(0x915656);
-   }
+   function setupScene()
+   {
+      scene = new THREE.Scene();
+      createMeshs();
+      setupLight();
+
+      /*
+         Circulate components and add the mesh
+         and light elements to the scene object
+      */
+      for (n in components)
+      {
+         scene.add(components[n]);
+      }
+   }
+
+   function createMeshs()
+   {
+      /* Create the cube mesh */
+      components.cubeMesh = (function()
+      {
+         var cube =
+            new THREE.Mesh(new THREE.CubeGeometry(100, 100, 100),
+                           new THREE.MeshLambertMaterial({color: new THREE.Color(0xff8080)}));
+         cube.overdraw = true;
+         cube.rotation.x = Math.PI * 0.1;
+         cube.position.x = -50;
+
+         return cube;
+      })();
+
+      /* Create the sphere mesh */
+      components.sphereMesh = (function()
+      {
+         var sphere =
+            new THREE.Mesh(new THREE.SphereGeometry(50, 40, 40),
+                           new THREE.MeshLambertMaterial({color: new THREE.Color(0xff8080)}));
+         sphere.overdraw = true;
+         sphere.position.x = 50;
+         sphere.position.z = 50;
+
+         return sphere;
+      })();
+
+      /* Create the plane mesh */
+      components.planeMesh = (function()
+      {
+         var plane =
+            new THREE.Mesh(new THREE.PlaneGeometry(300, 300, 10,0),
+                           new THREE.MeshLambertMaterial({color:'red'}));
+         plane.overdraw = true;
+         plane.position.y = -100;
+         plane.rotation.x = Math.PI * -0.4;
+
+         return plane;
+      })();
+   }
+
+   function setupLight()
+   {
+      /* Create a new DirectionalLight instance */
+      var directionalLight = new THREE.DirectionalLight(0xffffff);
+      /* Set the DirectionalLight location */
+      directionalLight.position.set(0, 0, 1).normalize();
+      /* Set directionalLight as a component element */
+      components.directionalLight = directionalLight;
+
+      /* Create a new AmbientLight instance and set it as a component element */
+      components.ambientLight = new THREE.AmbientLight(0x915656);
+   }

    7. Add an animation:

      -   function animate()
-   {
-      var speed= 0.2;
-      var lastTime = 0;
-      var angle = 0.0;
-
-      (function moveWebGLObject()
-      {
-         /* Update */
-         var time = (new Date()).getTime();
-         var timeDiff = time - lastTime;
-         var angleChange = speed * timeDiff * 2 * Math.PI / 1000;
-         components.cubeMesh.rotation.x =
-            components.cubeMesh.rotation.z =
-            components.cubeMesh.rotation.y += angleChange;
-
-         var range = Math.sin(angle);
-         if (range < 0)
-         {
-            range *=-1;
-         }
-         components.sphereMesh.position.y = range * 200 - 50;
-
-         lastTime = time;
-
-         /* Render */
-         renderer.render(scene, camera);
-
-         /* Request a new frame */
-         requestAnimationFrame(function()
-         {
-            moveWebGLObject();
-         });
-
-         angle += 0.03;
-      })();
-   }
+   function animate()
+   {
+      var speed= 0.2;
+      var lastTime = 0;
+      var angle = 0.0;
+
+      (function moveWebGLObject()
+      {
+         /* Update */
+         var time = (new Date()).getTime();
+         var timeDiff = time - lastTime;
+         var angleChange = speed * timeDiff * 2 * Math.PI / 1000;
+         components.cubeMesh.rotation.x =
+            components.cubeMesh.rotation.z =
+            components.cubeMesh.rotation.y += angleChange;
+
+         var range = Math.sin(angle);
+         if (range < 0)
+         {
+            range *=-1;
+         }
+         components.sphereMesh.position.y = range * 200 - 50;
+
+         lastTime = time;
+
+         /* Render */
+         renderer.render(scene, camera);
+
+         /* Request a new frame */
+         requestAnimationFrame(function()
+         {
+            moveWebGLObject();
+         });
+
+         angle += 0.03;
+      })();
+   }

    8. Adjust the camera and light location using events in the manipulate() method:

      -   function manipulate()
-   {
-      /*
-         Search for the HTML <input type='range'> element
-         as the ID value and store it in the variable
-      */
-      var sliderLx = document.getElementById('slider-lx');
-      var sliderLy = document.getElementById('slider-ly');
-      var sliderLz = document.getElementById('slider-lz');
-
-      var sliderCz = document.getElementById('slider-cz');
-
-      var sliderCax = document.getElementById('slider-cax');
-      var sliderCay = document.getElementById('slider-cay');
-
-      /* Add an event listener to each <input type='range'> element */
-      sliderLx.addEventListener('change', function(){changeLightDirection(this,"x")});
-      sliderLy.addEventListener('change', function(){changeLightDirection(this,"y")});
-      sliderLz.addEventListener('change', function(){changeLightDirection(this,"z")});
-
-      sliderCz.addEventListener('change', function(){changeCameraDirection(this,"z")});
-
-      sliderCax.addEventListener('change', function(){changeCameraAngle(this,"x")});
-      sliderCay.addEventListener('change', function(){changeCameraAngle(this,"y")});
-
-      /*
-         When a change occurs, a related event is fired,
-         and the axis parameter is handled
-      */
-
-      function changeLightDirection(target, axis)
-      {
-         components.directionalLight.position[axis] = target.value;
-         components.directionalLight.position.set(components.directionalLight.position.x,
-                                                  components.directionalLight.position.y,
-                                                  components.directionalLight.position.z).normalize();
-      }
-
-      function changeCameraDirection(target, axis)
-      {
-         camera.position[axis] = target.value;
-      }
-
-      function changeCameraAngle(target, axis)
-      {
-         camera.rotation[axis] = target.value;
-      }
-   }
+   function manipulate()
+   {
+      /*
+         Search for the HTML <input type='range'> element
+         as the ID value and store it in the variable
+      */
+      var sliderLx = document.getElementById('slider-lx');
+      var sliderLy = document.getElementById('slider-ly');
+      var sliderLz = document.getElementById('slider-lz');
+
+      var sliderCz = document.getElementById('slider-cz');
+
+      var sliderCax = document.getElementById('slider-cax');
+      var sliderCay = document.getElementById('slider-cay');
+
+      /* Add an event listener to each <input type='range'> element */
+      sliderLx.addEventListener('change', function(){changeLightDirection(this,"x")});
+      sliderLy.addEventListener('change', function(){changeLightDirection(this,"y")});
+      sliderLz.addEventListener('change', function(){changeLightDirection(this,"z")});
+
+      sliderCz.addEventListener('change', function(){changeCameraDirection(this,"z")});
+
+      sliderCax.addEventListener('change', function(){changeCameraAngle(this,"x")});
+      sliderCay.addEventListener('change', function(){changeCameraAngle(this,"y")});
+
+      /*
+         When a change occurs, a related event is fired,
+         and the axis parameter is handled
+      */
+
+      function changeLightDirection(target, axis)
+      {
+         components.directionalLight.position[axis] = target.value;
+         components.directionalLight.position.set(components.directionalLight.position.x,
+                                                  components.directionalLight.position.y,
+                                                  components.directionalLight.position.z).normalize();
+      }
+
+      function changeCameraDirection(target, axis)
+      {
+         camera.position[axis] = target.value;
+      }
+
+      function changeCameraAngle(target, axis)
+      {
+         camera.rotation[axis] = target.value;
+      }
+   }
 </script>

    The following figure shows the final result as it is displayed on the screen.

    -

    Figure: Final result

    +

    Figure: Final result

    Final result

    Source Code

    For the complete source code related to this use case, see the following files:

    +
  • three.js
    • + diff --git a/org.tizen.guides/html/web/w3c/ui/animation_w.htm b/org.tizen.guides/html/web/w3c/ui/animation_w.htm index 6acda33..443a5f1 100644 --- a/org.tizen.guides/html/web/w3c/ui/animation_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/animation_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - + +

    CSS Animations Module (Level 3)

    @@ -48,7 +48,7 @@

    Animations (like transitions) change the presentational value of the CSS properties over time. The principal difference between animations and transitions is that while transitions are triggered implicitly when property values change, animations are explicitly executed when the animation properties are applied. This means that for animations, you must use animation keyframes to define explicit values for the properties being animated.

    This feature is supported in mobile and wearable applications only.

    - +

    The main features of the CSS Animations Module Level 3 API include:

      @@ -65,21 +65,21 @@

      If the animation only has one set of changes over its whole iteration, the rule values can be assigned with a from {} to {} rule, where from is the beginning of the animation at 0% and to is the end at 100%. If there are multiple changes required, you can define their exact time periods using multiple <number>% {} rules that together cover the entire animation iteration from 0% to 100%.

      The following code snippet demonstrates how to use keyframes:

      -<style type="text/css">
-
-   @-webkit-keyframes boxani
-   {
-      from {left: 0; top: 0;}
-      to {left: 100px; top: 100px;}
-   }
-   @-webkit-keyframes boxani_case01
-   {
-      0% {left: 0; top: 0;}
-      25% {left: 100px; top: 0;}
-      50% {left: 100px; top: 100px;}
-      75% {left: 0; top: 100px;}
-      100% {left: 0; top: 0;}
-   }
+<style type="text/css">
+
+   @-webkit-keyframes boxani
+   {
+      from {left: 0; top: 0;}
+      to {left: 100px; top: 100px;}
+   }
+   @-webkit-keyframes boxani_case01
+   {
+      0% {left: 0; top: 0;}
+      25% {left: 100px; top: 0;}
+      50% {left: 100px; top: 100px;}
+      75% {left: 0; top: 100px;}
+      100% {left: 0; top: 0;}
+   }
 
 </style>
      @@ -123,40 +123,40 @@ 
       <head>
-   <style type="text/css">
-      .box
-      {
-         -webkit-animation-name: boxani;
-         -webkit-animation-duration: 5s;
-         -webkit-animation-iteration-count: infinite;
-         -webkit-animation-timing-function: linear;
-         -webkit-animation-direction: normal;
-         -webkit-animation-delay: 1s;
-         -webkit-animation-fill-mode: none;
-      }
-
-      .box.case01: hover
-      {
-         -webkit-animation-play-state: paused;
-         -webkit-animation-fill-mode: forwards;
-      }
-   </style>
+   <style type="text/css">
+      .box
+      {
+         -webkit-animation-name: boxani;
+         -webkit-animation-duration: 5s;
+         -webkit-animation-iteration-count: infinite;
+         -webkit-animation-timing-function: linear;
+         -webkit-animation-direction: normal;
+         -webkit-animation-delay: 1s;
+         -webkit-animation-fill-mode: none;
+      }
+
+      .box.case01: hover
+      {
+         -webkit-animation-play-state: paused;
+         -webkit-animation-fill-mode: forwards;
+      }
+   </style>
 </head>
 
 <body>
-   <h1>animation-name</h1>
-   <div class="boxarea">
-      <div class="box">
-         <p>animate</p>
-         <p>animation-name: boxani;</p>
-      </div>
-   </div>
-   <div class="boxarea">
-      <div class="box case01">
-         <p>animate</p>
-         <p>animation-name: boxani_case01;</p>
-      </div>
-   </div>
+   <h1>animation-name</h1>
+   <div class="boxarea">
+      <div class="box">
+         <p>animate</p>
+         <p>animation-name: boxani;</p>
+      </div>
+   </div>
+   <div class="boxarea">
+      <div class="box case01">
+         <p>animate</p>
+         <p>animation-name: boxani_case01;</p>
+      </div>
+   </div>
 </body>
      @@ -164,16 +164,16 @@ Note The hover pseudo class in Tizen maintains a mouseover state when an element is tapped, and becomes a mouseout state when another element is tapped.
    - +

    The animation property allows you to define all the animation properties in a shorthand mode in the order of animation-name | animation-duration | animation-timing-function | animation-delay | animation-iteration-count | animation-direction | animation-fill-mode. If you omit a property value, a default value is used instead.

    -<style type="text/css">
-   .box
-   {
-      width: 150px; height: 100px; background: Coral; position: relative;
-      -webkit-animation: boxani 3s ease 1s infinite alternate backwards;
-   }
+<style type="text/css">
+   .box
+   {
+      width: 150px; height: 100px; background: Coral; position: relative;
+      -webkit-animation: boxani 3s ease 1s infinite alternate backwards;
+   }
 </style>
    @@ -190,40 +190,40 @@

    Creating a Logo Animation

    - +

    To enhance the user experience of your application, you must learn to create a logo animation, where element properties can be assigned and changed for each element and keyframe. The logo animation is similar to the animation that appears when a Tizen device (or the emulator) is switched on:

    -
      +
      1. No elements are initially shown on the screen.
      2. The Tizen logo gradually appears in the middle of the screen, and as it moves to the right, it becomes smaller.
        3. -
      3. Each letter in the word "TIZEN" consecutively comes in from the left of the screen and moves to the right to its correct location.
        4. +
      4. Each letter in the word "TIZEN" consecutively comes in from the left of the screen and moves to the right to its correct location.
      -

      Figure: Logo animation (in mobile applications only)

      -

      Logo animation

      +

      Figure: Logo animation (in mobile applications only)

      +

      Logo animation

      To create a logo animation:

      1. Create the HTML layout for the animation. To be able to manage the movement of each animation part separately, you must define individual elements for each part. 
        -<div class="animation-holder">
-   <span class="tizen-txt t"></span>
-   <span class="tizen-txt i"></span>
-   <span class="tizen-txt z"></span>
-   <span class="tizen-txt e"></span>
-   <span class="tizen-txt n"></span>
-   <span class="tizen-txt tm"></span>
-   <span class="tizen-logo"></span>
+<div class="animation-holder">
+   <span class="tizen-txt t"></span>
+   <span class="tizen-txt i"></span>
+   <span class="tizen-txt z"></span>
+   <span class="tizen-txt e"></span>
+   <span class="tizen-txt n"></span>
+   <span class="tizen-txt tm"></span>
+   <span class="tizen-logo"></span>
 </div>
      2. Define the basic style for the animation: 
         .example-body {width: 320px; height: 480px; background: #000; margin: 0 auto;
-               position: relative; border: 2px solid #fff; overflow: hidden;}
+               position: relative; border: 2px solid #fff; overflow: hidden;}
 .animation-holder {width: 280px; height: 88px; position: absolute;
-                   left: 50%; top: 50%; margin: -54px 0 0 -140px;}
+                   left: 50%; top: 50%; margin: -54px 0 0 -140px;}
 
 .tizen-txt, .tizen-logo {position: absolute; display: block;
-                         background-repeat: no-repeat; background-position: 50% 50%}
+                         background-repeat: no-repeat; background-position: 50% 50%}
 .tizen-txt.t {width: 48px; height: 56px; background-image: url(images/txt_t.png);}
 .tizen-txt.i {width: 15px; height: 56px; background-image: url(images/txt_i.png);}
 .tizen-txt.z {width: 46px; height: 56px; background-image: url(images/txt_z.png);}
@@ -231,7 +231,7 @@
 .tizen-txt.n {width: 54px; height: 58px; background-image: url(images/txt_n.png);}
 .tizen-txt.tm {width: 11px; height: 6px; background-image: url(images/txt_tm.png);}
 .tizen-logo {width: 220px; height: 211px; left: 30px; top: -61px;
-             background-image: url(images/logo_tizen.png); background-size: 100% 100%;}
+             background-image: url(images/logo_tizen.png); background-size: 100% 100%;}
      3. Create the animation: @@ -241,9 +241,9 @@ 
         .tizen-txt, .tizen-logo
 {
-   -webkit-animation-duration: 7s;
-   -webkit-animation-iteration-count: infinite;
-   -webkit-animation-direction: alternate;
+   -webkit-animation-duration: 7s;
+   -webkit-animation-iteration-count: infinite;
+   -webkit-animation-direction: alternate;
 }
        4. @@ -251,15 +251,15 @@
        • During the first 25% of the animation total playing time (7 seconds), the transparency disappears and the Tizen logo appears.
        • During the 25 - 50% of the playing time, the logo size becomes smaller as the width and height values are reduced, and due to the left and top value, the logo is positioned to the top right corner of the screen.
          • -
        • During the 50 - 100% of the playing time, the values do not change, and the logo remains in its new position.
          • -
        +
      4. During the 50 - 100% of the playing time, the values do not change, and the logo remains in its new position.
        5. + 
         @-webkit-keyframes tizen-logo
 {
-   0% {width: 220px; height: 211px; left: 30px; top: -61px; opacity: 0;}
-   25% {width: 220px; height: 211px; left: 30px; top: -61px; opacity: 1;}
-   50% {left: 247px; top: 0px; width: 33px; height: 32px; opacity: 1;}
-   100% {left: 247px; top: 0px; width: 33px; height: 32px; opacity: 1;}
+   0% {width: 220px; height: 211px; left: 30px; top: -61px; opacity: 0;}
+   25% {width: 220px; height: 211px; left: 30px; top: -61px; opacity: 1;}
+   50% {left: 247px; top: 0px; width: 33px; height: 32px; opacity: 1;}
+   100% {left: 247px; top: 0px; width: 33px; height: 32px; opacity: 1;}
 }
        @@ -268,7 +268,7 @@ If the 100% keyframe is not defined, the animation is executed based on the original properties, and the logo size increases to its original size at the end.
    -
  • Create the keyframes to implement the flow for each letter in the word "TIZEN": +
  • Create the keyframes to implement the flow for each letter in the word "TIZEN":
    • To hide the letter initially, the property has been assigned outside the screen at the 0% keyframe. To allow the Tizen logo to appear first, the first letter is introduced at the 30% keyframe.
    • To create a slight collision animation, the letter element moves to -10 px of the final value at the 40% keyframe before reaching its final 0 px value at the 45% keyframe.
      • @@ -280,21 +280,21 @@ <!--Letter T--> @-webkit-keyframes tizen-txt-t { -   0% {left: 340px; top: 31px;} -   30% {left: 340px; top: 31px; animation-timing-function: ease-in;} -   40% {left: -10px; top: 31px; animation-timing-function: ease-out;} -   45% {left: 0; top: 31px;} -   100% {left: 0; top: 31px;} + 0% {left: 340px; top: 31px;} + 30% {left: 340px; top: 31px; animation-timing-function: ease-in;} + 40% {left: -10px; top: 31px; animation-timing-function: ease-out;} + 45% {left: 0; top: 31px;} + 100% {left: 0; top: 31px;} } <!--Letter I--> @-webkit-keyframes tizen-txt-i { -   0% {left: 340px; top: 31px;} -   40% {left: 340px; top: 31px; animation-timing-function: ease-in;} -   50% {left: 47px; top: 31px; animation-timing-function: ease-out;} -   55% {left: 57px; top: 31px;} -   100% {left: 57px; top: 31px;} + 0% {left: 340px; top: 31px;} + 40% {left: 340px; top: 31px; animation-timing-function: ease-in;} + 50% {left: 47px; top: 31px; animation-timing-function: ease-out;} + 55% {left: 57px; top: 31px;} + 100% {left: 57px; top: 31px;} } <!--Remaining letters--> @@ -304,11 +304,11 @@ 
       .tizen-txt.t
 {
-   -webkit-animation-name: tizen-txt-t;
+   -webkit-animation-name: tizen-txt-t;
 }
 .tizen-txt.i
 {
-   -webkit-animation-name: tizen-txt-i;
+   -webkit-animation-name: tizen-txt-i;
 }
      diff --git a/org.tizen.guides/html/web/w3c/ui/background_w.htm b/org.tizen.guides/html/web/w3c/ui/background_w.htm index ab4612f..c99e8f3 100644 --- a/org.tizen.guides/html/web/w3c/ui/background_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/background_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - + +

    • CSS Backgrounds and Borders Module (Level 3)

    @@ -54,9 +54,9 @@
  • Creating backgrounds

    To enhance the application further, you can create a multilayer background with the parallax effect.

    • - -

    Defining Background Properties

    - + +

    Defining Background Properties

    +

    When creating a background for an element, you can use the following properties:

    • background-color @@ -81,7 +81,7 @@

      The following image shows a simple background color (top left), a background image (top right), multiple images with a solid black border (bottom left), and an element with shading and a solid black border with rounded corners (bottom right). The background image at top right is automatically repeated to cover the entire background, while the images at bottom left are not repeated due to the background-repeat property value.

      -

      Figure: Background examples

      +

      Figure: Background examples

      Background examples

      The following code snippet demonstrates how to set the background color, images, borders, and shadings.

      @@ -89,41 +89,41 @@ <!--Background color--> #one { -   width: 180px; -   height: 40px; -   background-color: lightblue; + width: 180px; + height: 40px; + background-color: lightblue; } <!--Background image--> #one { -   width: 200px; -   height: 100px; -   background-color: #00F; -   background-image: url(t3.png); + width: 200px; + height: 100px; + background-color: #00F; + background-image: url(t3.png); } <!--Multiple images--> #multi { -   width: 155px; -   height: 100px; -   border: 1px solid #000; -   background-color: #87CEFA; -   background-image: url(t1.png), url(t2.png), url(t3.png); -   background-position: center center, 20% 100%, top left; -   background-repeat: no-repeat; + width: 155px; + height: 100px; + border: 1px solid #000; + background-color: #87CEFA; + background-image: url(t1.png), url(t2.png), url(t3.png); + background-position: center center, 20% 100%, top left; + background-repeat: no-repeat; } <!--Shading and border with rounded corners--> #shading { -   width: 160px; -   height: 40px; -   border: 1px solid #000; -   border-radius: 20px; -   background-color: #88f; -   box-shadow: #888 10px 10px; + width: 160px; + height: 40px; + border: 1px solid #000; + border-radius: 20px; + background-color: #88f; + box-shadow: #888 10px 10px; } @@ -131,17 +131,17 @@

      To enhance the user experience of your application, you must learn to create a multilayer background with the parallax effect using the CSS box model. The background consists of 3 images on separate layers, and 2 of the layers can be moved over each other.

      -

      Figure: Background with the parallax effect

      -

      Background with the parallax effect

      +

      Figure: Background with the parallax effect

      +

      Background with the parallax effect

      1. Prepare 3 images (tizen.png, tizen2.png, and dot.png), each with a transparent background.

        tizen.png, tizen2.png, and dot.png images

        2. -
      2. Create a div element with id="parallelexample" and a slider input element with the minimum, maximum, and initial value: +
      3. Create a div element with id="parallelexample" and a slider input element with the minimum, maximum, and initial value: 
        -<div id="parallelexample"></div>
-<input id="position" type="range" min="1" max="200" value="50">
+<div id="parallelexample"></div>
+<input id="position" type="range" min="1" max="200" value="50">
      4. Define the needed styles for the div element in the <head> section using the parallelexample ID. @@ -149,30 +149,30 @@ 
         #parallelexample
 {
-   width: 300px;
-   height: 300px;
-   background-image: url(tizen2_32.png), url(tizen3_32.png), url(dot.png);
-   background-position: 6.25em 8em, 3.125em 4em, center top;
-   background-repeat: repeat, repeat, repeat;
-   border: 1px solid black;
-   margin: 0px auto;
+   width: 300px;
+   height: 300px;
+   background-image: url(tizen2_32.png), url(tizen3_32.png), url(dot.png);
+   background-position: 6.25em 8em, 3.125em 4em, center top;
+   background-repeat: repeat, repeat, repeat;
+   border: 1px solid black;
+   margin: 0px auto;
 }
      5. To create the parallax effect, create a method that moves the background layers by changing the horizontal position values of the images in the div element. To determine the position value change, add an onchange event handler for the slider to determine the change based on the slider handle movement. 
         function moveLayers()
 {
-   /* Get slider value */
-   var poz = document.getElementById('position');
-   /* Get the div element */
-   var example = document.getElementById('ParallaxExamle');
-   /* Add the event handler */
-   poz.onchange = function()
-   {
-      var layer1 = this.value/8, layer2 = this.value/16;
-      example.style.backgroundPosition =
-         layer1 +'em 8em, ' + layer2 + 'em 4em, center top';
-   }
+   /* Get slider value */
+   var poz = document.getElementById('position');
+   /* Get the div element */
+   var example = document.getElementById('ParallaxExamle');
+   /* Add the event handler */
+   poz.onchange = function()
+   {
+      var layer1 = this.value/8, layer2 = this.value/16;
+      example.style.backgroundPosition =
+         layer1 +'em 8em, ' + layer2 + 'em 4em, center top';
+   }
 }

      Source Code

      @@ -183,8 +183,8 @@ function moveLayers()
    • tizen2_32_s.png
    • tizen3_32.png
    - - + +
    diff --git a/org.tizen.guides/html/web/w3c/ui/basic_ui_w.htm b/org.tizen.guides/html/web/w3c/ui/basic_ui_w.htm index 64e59a2..8c830e8 100644 --- a/org.tizen.guides/html/web/w3c/ui/basic_ui_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/basic_ui_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - + +

    CSS Basic User Interface Module (Level 3)

    @@ -72,7 +72,7 @@

    Using Pseudo-element Selectors

    - +

    To enhance the user experience of your application, you must learn how to use pseudo-element selectors:

    1. Use the pseudo-classes, such as :enabled and :disabled, to add different styles based on the state of the DOM elements:

      @@ -86,30 +86,30 @@ input: disabled {border: 1px solid red} In the versions prior to CSS3, pseudo-elements, such as :hover, :active, and :focus, were used, and required an attribute selector. Since the :enabled and :disabled classes are not influenced by the display and visibility attributes, they improve the accessibility.
    -
  • To control the state of the HTML5 Web Forms (in mobile or wearable applications), use the :in-range and :out-of-range pseudo-classes. +
  • To control the state of the HTML5 Web Forms (in mobile or wearable applications), use the :in-range and :out-of-range pseudo-classes.

    They check for any values that have exceeded the inserted range. (The following figure applies to mobile applications only.)

     <!--HTML-->
-<input type="number" step="10" min="10" max="100"/>
+<input type="number" step="10" min="10" max="100"/>
 
     <!--CSS-->
-input[type="number"]: in-range {border: 3px solid blue; width: 90%}
-input[type="number"]: out-of-range {border: 3px solid red; width: 90%}
+input[type="number"]: in-range {border: 3px solid blue; width: 90%}
+input[type="number"]: out-of-range {border: 3px solid red; width: 90%}

    Element ranges (in mobile applications only)

  • To apply different styles to required input items and option items, use the :required and :optional pseudo-classes. (The following figure applies to mobile applications only.) 
     <!--HTML-->
 <fieldset>
-   <legend>required and optional</legend>
-   <label>email: <input type="email" required ></label>
-   <label>password:
-      <input type="Password" placeholder="required area" required >
-   </label>
-
-   <label>date: <input type="date" placeholder="You know what to do, huh?"></label>
-   <textarea placeholder="Comment"></textarea>
+   <legend>required and optional</legend>
+   <label>email: <input type="email" required ></label>
+   <label>password:
+      <input type="Password" placeholder="required area" required >
+   </label>
+
+   <label>date: <input type="date" placeholder="You know what to do, huh?"></label>
+   <textarea placeholder="Comment"></textarea>
 </fieldset>
 
    @@ -125,10 +125,10 @@ input: optional, textarea: optional {border: 1px solid #777}
 	
  • range.html
    • 
 	
  • required_and_optional.html
    • 
  
-			
+
 
    Using Box Model Properties
    
-				
-
    To enhance the user experience of your application, you must learn how to use box model properties:
     
+
+
    To enhance the user experience of your application, you must learn how to use box model properties:
    
 
 
    
 	Note
@@ -151,19 +151,19 @@ div.border-box: before {height: 40px}
 .outline-offset: before {outline-offset: 35px}
    • -
  • To handle text that exceeds the area of the box model, use the text-overflow property. The text-overflow: ellipsis property is used to indicate the text exceeded the padding area as '...'. +
  • To handle text that exceeds the area of the box model, use the text-overflow property. The text-overflow: ellipsis property is used to indicate the text exceeded the padding area as '...'. 
     div
 {
-   width: 250px;
-   margin: 20px auto;
-   padding: 20px 30px;
-   background-color: #eee;
-   color: #333;
-   border: 5px solid #333;
-   font-weight: bold;
-   overflow: hidden;
-   white-space: nowrap;
+   width: 250px;
+   margin: 20px auto;
+   padding: 20px 30px;
+   background-color: #eee;
+   color: #333;
+   border: 5px solid #333;
+   font-weight: bold;
+   overflow: hidden;
+   white-space: nowrap;
 }
 
 .clip {text-overflow: clip}
@@ -182,7 +182,7 @@ div
 	
  • outline_property.html
    • 
 	
  • text_overflow_property.html
    • 
  
-		
+
 
 
 
diff --git a/org.tizen.guides/html/web/w3c/ui/clipboard_mw.htm b/org.tizen.guides/html/web/w3c/ui/clipboard_mw.htm
index ca77116..cdb36c8 100644
--- a/org.tizen.guides/html/web/w3c/ui/clipboard_mw.htm
+++ b/org.tizen.guides/html/web/w3c/ui/clipboard_mw.htm
@@ -40,8 +40,8 @@
 
 
    
 
    Clipboard API and events
    
-  
-  
+
+
 
    The clipboard and events feature is used for cutting, copying, and pasting content to easily transfer it between Web applications.
    
 
 
    This feature is supported in mobile applications only.
    
@@ -56,30 +56,30 @@
 
    You can fire the paste event to retrieve data from the clipboard and insert it into a document. The data is retrieved in the format most appropriate to the assigned context.
    • - +

    The most common way of providing clipboard features in an application is to create an editable element, and allow the user to copy content and then paste it into the editable element.

    - +

    Copying Content

    -

    To enhance the user experience of your application with clipboard operations, you must learn to use the copy event:

    +

    To enhance the user experience of your application with clipboard operations, you must learn to use the copy event:

    1. Add an event listener to detect the copy event: 
       <script>
-   document.addEventListener("copy", function(e)
-      {
-         copyHandler(e);
-      }, false);
+   document.addEventListener("copy", function(e)
+      {
+         copyHandler(e);
+      }, false);

    2. When you start copying, the copy event is fired and the copyHandler() method is called.

      Stop the system clipboard basic operation and set the range you want to copy:

      -   function copyHandler(e)
-   {
-      e.preventDefault();
+   function copyHandler(e)
+   {
+      e.preventDefault();
 
-      var range = window.getSelection();
+      var range = window.getSelection();
      @@ -87,10 +87,10 @@ If the current selection is not influenced and there is no selected range, the clipboard imports the setData() method. The copied content cannot be edited apart from adding a DataTransferItemList item.
      3. -
    3. Store the data of the selected range: +
    4. Store the data of the selected range: 
      -      e.clipboardData.setData("text/plain", range);
-   };
+      e.clipboardData.setData("text/plain", range);
+   };
 </script>
      5. @@ -99,37 +99,37 @@

      For the complete source code related to this use case, see the following file:

      +

      Cutting Content

      -

      To enhance the user experience of your application with clipboard operations, you must learn to use the cut event:

      +

      To enhance the user experience of your application with clipboard operations, you must learn to use the cut event:

      1. Add an event listener to detect the cut event: 
         <script>
-   document.addEventListener("cut", function(e)
-      {
-         cutHandler(e);
-      }, false);
+   document.addEventListener("cut", function(e)
+      {
+         cutHandler(e);
+      }, false);

      2. When you start cutting, the cut event is fired and the cutHandler() method is called.

        Stop the system clipboard basic operation and set the range you want to cut:

        -   function cutHandler(e)
-   {
-      e.preventDefault();
+   function cutHandler(e)
+   {
+      e.preventDefault();
 
-      var range = window.getSelection();
+      var range = window.getSelection();
        3. -
      3. Store the data of the selected range: +
      4. Store the data of the selected range: 
        -      e.clipboardData.setData("text/plain", range);
-   };
+      e.clipboardData.setData("text/plain", range);
+   };
 </script>
        @@ -144,33 +144,33 @@

        For the complete source code related to this use case, see the following file:

        +

        Pasting Content

        -

        To enhance the user experience of your application with clipboard operations, you must learn to use the paste event:

        +

        To enhance the user experience of your application with clipboard operations, you must learn to use the paste event:

        1. Add an event listener to detect the paste event: 
           <script>
-   document.addEventListener("paste", function(e)
-      {
-         pasteHandler(e);
-      }, false);
+   document.addEventListener("paste", function(e)
+      {
+         pasteHandler(e);
+      }, false);

        2. When you start pasting, the paste event is fired and the pasteHandler() method is called.

          Stop the system clipboard basic operation:

          -   function pasteHandler(e)
-   {
-      e.preventDefault();
+   function pasteHandler(e)
+   {
+      e.preventDefault();
        3. Paste the clipboard data to the target using the getData() method: 
          -      pasteTarget.innerHTML = e.clipboardData.getData("text/plain");
-   };
+      pasteTarget.innerHTML = e.clipboardData.getData("text/plain");
+   };
 </script>
          4. @@ -180,40 +180,40 @@

          For the complete source code related to this use case, see the following file:

          +

          Copying and Pasting Content into an Editable Element

          -

          To enhance the user experience of your application with clipboard operations, you must learn to copy content and paste it in an editable HTML element:

          +

          To enhance the user experience of your application with clipboard operations, you must learn to copy content and paste it in an editable HTML element:

          1. Define the editable element into which copied data is to be pasted:

             <head>
-   <style>
-      .log {border: 1px solid #d9d9d9; margin: 10px; padding: 5px;}
-      .target {border: 1px solid #36c; margin: 10px; padding: 5px;}
-   </style>
+   <style>
+      .log {border: 1px solid #d9d9d9; margin: 10px; padding: 5px;}
+      .target {border: 1px solid #36c; margin: 10px; padding: 5px;}
+   </style>
 </head>
 <body>
-   <h1>Clipboard API</h1>
-   <div style="width: 300px; height: 100px;
-               border: 1px solid #d9d9d9" contenteditable >
-      Edit Section
-   </div>
-   <div  class="target">
-      <h4>Target Element</h4>
-      <p id="target contenteditable">Paste content</p>
-   </div>
-   <div id="ev-log" class="log">Event log</div>
-   <div contenteditable>
-      This section is informative
-      This specification defines the common clipboard operations of cutting,
-      copying and pasting, in such a way that they are exposed to Web Applications
-      and can be adapted to provide advanced functionalities.
-      Its goal is to provide for compatibility where possible
-      with existing implementations.
-   </div>
+   <h1>Clipboard API</h1>
+   <div style="width: 300px; height: 100px;
+               border: 1px solid #d9d9d9" contenteditable >
+      Edit Section
+   </div>
+   <div  class="target">
+      <h4>Target Element</h4>
+      <p id="target contenteditable">Paste content</p>
+   </div>
+   <div id="ev-log" class="log">Event log</div>
+   <div contenteditable>
+      This section is informative
+      This specification defines the common clipboard operations of cutting,
+      copying and pasting, in such a way that they are exposed to Web Applications
+      and can be adapted to provide advanced functionalities.
+      Its goal is to provide for compatibility where possible
+      with existing implementations.
+   </div>
 <body>
            2. @@ -221,46 +221,46 @@

          2. Add event listeners to detect the copy and paste events:

             <script>
-   var pasteTarget = document.getElementById("target");
-   var evLogBox = document.getElementById("ev-log");
-
-   document.addEventListener("copy", function(e)
-      {
-         copyHandler(e);
-      }, false);
-
-   document.addEventListener("paste", function(e)
-      {
-         pasteHandler(e);
-      }, false);
+   var pasteTarget = document.getElementById("target");
+   var evLogBox = document.getElementById("ev-log");
+
+   document.addEventListener("copy", function(e)
+      {
+         copyHandler(e);
+      }, false);
+
+   document.addEventListener("paste", function(e)
+      {
+         pasteHandler(e);
+      }, false);
          3. When the copy event occurs, stop the system clipboard basic operation and set the range you want to copy: 
            -   function copyHandler(e)
-   {
-      e.preventDefault();
+   function copyHandler(e)
+   {
+      e.preventDefault();
 
-      var range = window.getSelection();
+      var range = window.getSelection();
            4. -
          4. Store the data of the selected range: +
          5. Store the data of the selected range: 
            -      e.clipboardData.setData("text/plain", range);
-      evLogBox.innerHTML = "Event log: copy";
-   };
+      e.clipboardData.setData("text/plain", range);
+      evLogBox.innerHTML = "Event log: copy";
+   };
          6. When the paste event occurs, stop the system clipboard basic operation and paste the clipboard data to the target using the getData() method: 
            -   function pasteHandler(e)
-   {
-      e.preventDefault();
+   function pasteHandler(e)
+   {
+      e.preventDefault();
 
-      pasteTarget.innerHTML = e.clipboardData.getData("text/plain");
-      evLogBox.innerHTML = "Event log: paste";
-   };
+      pasteTarget.innerHTML = e.clipboardData.getData("text/plain");
+      evLogBox.innerHTML = "Event log: paste";
+   };
 </script>
            7. @@ -273,7 +273,7 @@

            For the complete source code related to this use case, see the following file:

            + diff --git a/org.tizen.guides/html/web/w3c/ui/color_w.htm b/org.tizen.guides/html/web/w3c/ui/color_w.htm index 78fe55b..8124f84 100644 --- a/org.tizen.guides/html/web/w3c/ui/color_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/color_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - + +

    CSS Color Module (Level 3)

    @@ -57,27 +57,27 @@
  • RGB values
    • In hexadecimal notation -

      The format is '#' followed by either 3 or 6 hexadecimal characters. The 3-digit RGB notation (#rgb) is converted into a 6-digit form (#rrggbb) by replicating digits. For example, #fc0 expands to #ffcc00.

      • +

      The format is '#' followed by either 3 or 6 hexadecimal characters. The 3-digit RGB notation (#rgb) is converted into a 6-digit form (#rrggbb) by replicating digits. For example, #fc0 expands to #ffcc00.

    • In functional notation -

      The format is 'rgb(' followed by a comma-separated list of 3 numerical values (integer or percentage) followed by ')'. The integer value 255 corresponds to 100%, and to F or FF in a hexadecimal notation: rgb(255, 255, 255) = rgb(100%, 100%, 100%) = #FFF. White space characters are allowed around the numerical values. +

      The format is 'rgb(' followed by a comma-separated list of 3 numerical values (integer or percentage) followed by ')'. The integer value 255 corresponds to 100%, and to F or FF in a hexadecimal notation: rgb(255, 255, 255) = rgb(100%, 100%, 100%) = #FFF. White space characters are allowed around the numerical values.

  • RGBA values -

    The RGB color model is extended to include "alpha" to allow the color opacity to be specified. The RGBA values are defined using functional notation where the final value is the alpha (range from 0.1 to 1). For example: rgba(255, 0, 0, 0.7).

    +

    The RGB color model is extended to include "alpha" to allow the color opacity to be specified. The RGBA values are defined using functional notation where the final value is the alpha (range from 0.1 to 1). For example: rgba(255, 0, 0, 0.7).

    • -
  • HSL value -

    You can use numerical hue-saturation-lightness (HSL) colors as an alternative to numerical RGB colors. The HSL colors are encoded as a triple (hue, saturation, lightness). The hue is represented as the angle of the color circle, where by definition red=0°=360° and other colors are spread around the circle. The saturation and lightness are represented as percentages, where 100% is full saturation or black lightness, and 0% is a shade of gray or white lightness. 50% lightness is "normal". For example: hsl(0, 100%, 50%). +

  • HSL value +

    You can use numerical hue-saturation-lightness (HSL) colors as an alternative to numerical RGB colors. The HSL colors are encoded as a triple (hue, saturation, lightness). The hue is represented as the angle of the color circle, where by definition red=0°=360° and other colors are spread around the circle. The saturation and lightness are represented as percentages, where 100% is full saturation or black lightness, and 0% is a shade of gray or white lightness. 50% lightness is "normal". For example: hsl(0, 100%, 50%).

  • HSLA value -

    The HSL color model is extended to include "alpha" to allow the color opacity to be specified. The HSLA values are defined using the HSL notation where a final alpha value is added (range from 0.1 to 1). For example: hsla(120, 100%, 50%, 0.8).

    • +

    The HSL color model is extended to include "alpha" to allow the color opacity to be specified. The HSLA values are defined using the HSL notation where a final alpha value is added (range from 0.1 to 1). For example: hsla(120, 100%, 50%, 0.8).

    Note - The CSS2 System Color values have been deprecated in favor of the CSS3 UI 'appearance' property. + The CSS2 System Color values have been deprecated in favor of the CSS3 UI 'appearance' property.
    - +

    Specifying a Color for an Element

    To define a color for an element, you can use various color formats in the CSS properties:

    @@ -86,41 +86,41 @@ <!--Keywords--> #one { -   color: blue; -   background: white; -   border: 1px solid springgreen; + color: blue; + background: white; + border: 1px solid springgreen; } #one span { -   background: currentColor; + background: currentColor; } #one span.hide { -   color: transparent; + color: transparent; } <!--RGB--> #two { -    color: #ff0000; + color: #ff0000; } <!--RGBA--> #three { -   color: rgba(100%, 0, 0, 0.5); + color: rgba(100%, 0, 0, 0.5); } <!--HSL--> #four { -   color: hsl(0, 100%, 50%); + color: hsl(0, 100%, 50%); } <!--HSLA--> #five { -   color: hsla(0, 100%, 50%, 0.5); + color: hsla(0, 100%, 50%, 0.5); } @@ -134,7 +134,7 @@
  • hsla_color.html
  • rgb_color.html
  • rgba_color.html
    • -
  • transparent.html
    • +
  • transparent.html
    • @@ -142,7 +142,7 @@

    To enhance the user experience of your application, you must learn to create a HSLA color generator to set the color value for an element in the HSLA format.

    -

    Figure: HSLA color generator

    +

    Figure: HSLA color generator

    HSLA color generator

    @@ -155,60 +155,60 @@

    The range should be 0.1 - 1, but the minimum value of the min attribute is 0 so the value can be divided by 10.

    -<div id="color-generator">
-   <div id="text-box"></div>
-   <div id="color-box"></div>
+<div id="color-generator">
+   <div id="text-box"></div>
+   <div id="color-box"></div>
 
-   <label>Hue</label>
-   <input id="hue" value="0" type="range" min="0" max="360">
+   <label>Hue</label>
+   <input id="hue" value="0" type="range" min="0" max="360">
 
-   <label>Saturation</label>
-   <input id="saturation" value="100" type="range" min="0" max="100">
+   <label>Saturation</label>
+   <input id="saturation" value="100" type="range" min="0" max="100">
 
-   <label>Lightness</label>
-   <input id="lightness" value="50" type="range" min="0" max="100">
+   <label>Lightness</label>
+   <input id="lightness" value="50" type="range" min="0" max="100">
 
-   <label>Alpha</label>
-   <input id="alpha" value="10" type="range" min="0" max="10">
+   <label>Alpha</label>
+   <input id="alpha" value="10" type="range" min="0" max="10">
 </div>
  • Obtain the values from the slider inputs with the getElementById() method. Remember to divide the alpha value by 10 to reach the correct range of 0.1 - 1. 
    -var h = document.getElementById('hue').value,
-    s = document.getElementById('saturation').value,
-    l = document.getElementById('lightness').value,
-    a = document.getElementById('alpha').value / 10;
+var h = document.getElementById('hue').value,
+    s = document.getElementById('saturation').value,
+    l = document.getElementById('lightness').value,
+    a = document.getElementById('alpha').value / 10;
  • Set the HSLA text and the color of the color box by defining the color from the inputs in the HSL and HSLA formats.

    If the alpha is 1, the HSL format is displayed. Otherwise, the HSLA format is used.

     /* Define formats */
-hsl = 'hsl(' + h + ', ' + s + '%, ' + l + '%)';
-hsla = 'hsla(' + h + ', ' + s + '%, ' + l + '%, ' + a + ')';
+hsl = 'hsl(' + h + ', ' + s + '%, ' + l + '%)';
+hsla = 'hsla(' + h + ', ' + s + '%, ' + l + '%, ' + a + ')';
 
 /* Set the color of the box */
-cBox = document.querySelector('#color-box'),
+cBox = document.querySelector('#color-box'),
 
 /* Set the text */
-tBox = document.querySelector('#text-box');
+tBox = document.querySelector('#text-box');
  • Add an event handler to the input sliders to change the displayed text and color box color when the slider values change. 
    -var inputs = document.querySelectorAll('#color-generator input[type=range]');
+var inputs = document.querySelectorAll('#color-generator input[type=range]');
 
 for (i = 0; i < inputs.length; i++)
 {
-   inputs[i].onchange = function()
-   {
-      /* Show color */
-   }
+   inputs[i].onchange = function()
+   {
+      /* Show color */
+   }
 }

    • Source Code

    For the complete source code related to this use case, see the following file:

    diff --git a/org.tizen.guides/html/web/w3c/ui/drag_drop_mw.htm b/org.tizen.guides/html/web/w3c/ui/drag_drop_mw.htm index f4947aa..ea16184 100644 --- a/org.tizen.guides/html/web/w3c/ui/drag_drop_mw.htm +++ b/org.tizen.guides/html/web/w3c/ui/drag_drop_mw.htm @@ -38,7 +38,7 @@

    HTML5 Drag and Drop

    - +

    HTML5 drag and drop activates through event-based JavaScript and added attributes.

    @@ -48,7 +48,7 @@ The main features of the HTML5 Drag and drop API include:

    • Using drag and drop -

      To make an element draggable, add the draggable="true" attribute to it. Only elements thus defined as draggable can generate drag and drop events.

      +

      To make an element draggable, add the draggable="true" attribute to it. Only elements thus defined as draggable can generate drag and drop events.

      A drag and drop requires a source, target, and data. It is used through the following events:

      • dragstart
      • drag
        • @@ -74,15 +74,15 @@ The main features of the HTML5 Drag and drop API include:
          -

        1. Define the draggable elements by adding the draggable="true" attribute to them:

          +

        2. Define the draggable elements by adding the draggable="true" attribute to them:

           <h1>Drag and drop tutorial</h1>
-<div class="example_body">
-   <div id="drag-list">
-      <div class="drag-row" draggable="true">1</div>
-      <div class="drag-row" draggable="true">2</div>
-   </div>
-   <div>Drag state: <span id="log"></span></div>
+<div class="example_body">
+   <div id="drag-list">
+      <div class="drag-row" draggable="true">1</div>
+      <div class="drag-row" draggable="true">2</div>
+   </div>
+   <div>Drag state: <span id="log"></span></div>
 </div>
          3. @@ -90,19 +90,19 @@ The main features of the HTML5 Drag and drop API include:
        3. Add event listeners for the various drag and drop events: 
           <script>
-   var cols = document.querySelectorAll('#drag-list_.drag-row');
-   var colsLength = cols.length;
-
-   for (var i = 0; i < colsLength; i++)
-   {
-      cols[i].addEventListener('dragstart', dragStart, false);
-      cols[i].addEventListener('drag', dragIng, false);
-      cols[i].addEventListener('dragenter', dragEnter, false);
-      cols[i].addEventListener('dragover', dragOver, false);
-      cols[i].addEventListener('dragleave', dragLeave, false);
-      cols[i].addEventListener('drop', dragDrop, false);
-      cols[i].addEventListener('dragend', dragEnd, false);
-   };
+   var cols = document.querySelectorAll('#drag-list_.drag-row');
+   var colsLength = cols.length;
+
+   for (var i = 0; i < colsLength; i++)
+   {
+      cols[i].addEventListener('dragstart', dragStart, false);
+      cols[i].addEventListener('drag', dragIng, false);
+      cols[i].addEventListener('dragenter', dragEnter, false);
+      cols[i].addEventListener('dragover', dragOver, false);
+      cols[i].addEventListener('dragleave', dragLeave, false);
+      cols[i].addEventListener('drop', dragDrop, false);
+      cols[i].addEventListener('dragend', dragEnd, false);
+   };
 </script>
          4. @@ -111,39 +111,39 @@ The main features of the HTML5 Drag and drop API include: 
           function dragStart(e)
 {
-   log.innerHTML = "dragStart";
+   log.innerHTML = "dragStart";
 };
 
 function dragIng(e)
 {
-   log.innerHTML = "drag";
+   log.innerHTML = "drag";
 };
 
 function dragOver(e)
 {
-   e.preventDefault();
-   log.innerHTML = "dragOver";
+   e.preventDefault();
+   log.innerHTML = "dragOver";
 };
 
 function dragEnter(e)
 {
-   log.innerHTML = "dragEnter";
+   log.innerHTML = "dragEnter";
 };
 
 function dragLeave(e)
 {
-   log.innerHTML = "dragLeave";
+   log.innerHTML = "dragLeave";
 };
 
 function dragDrop(e)
 {
-   e.stopPropagation();
-   log.innerHTML = "dragDrop";
+   e.stopPropagation();
+   log.innerHTML = "dragDrop";
 };
 
 function dragEnd(e)
 {
-   log.innerHTML = "dragEnd";
+   log.innerHTML = "dragEnd";
 };
          @@ -160,38 +160,38 @@ function dragEnd(e)

          Learning how to transfer data in a simple drag and drop puzzle is a basic user interaction skill:

            -
          1. Define the draggable elements by adding the draggable="true" attribute to them. +
          2. Define the draggable elements by adding the draggable="true" attribute to them.

            In this example, the Tizen logo image has been divided and allocated randomly. Each imager part is defined as draggable, so that the user can rearrange the image parts in the correct order.

             <h1>Drag and drop tutorial</h1>
-<div class="example_body">
-   <div>Drag state: <span id="log"></span></div>
-   <div class="holder">
-      <div>
-         <img src="images/logo.png">
-         <p class="txt">Complete the puzzle to see a picture</p>
-      </div>
-      <ul id="puzzle">
-         <li class="puzzle-piece" draggable="true">
-            <img src="images/puzz_06.png">
-         </li>
-         <li class="puzzle-piece" draggable="true">
-            <img src="images/puzz_02.png">
-         </li>
-         <li class="puzzle-piece" draggable="true">
-            <img src="images/puzz_04.png">
-         </li>
-         <li class="puzzle-piece" draggable="true">
-            <img src="images/puzz_05.png">
-         </li>
-         <li class="puzzle-piece" draggable="true">
-            <img src="images/puzz_01.png">
-         </li>
-         <li class="puzzle-piece" draggable="true">
-            <img src="images/puzz_03.png">
-         </li>
-      </ul>
-   </div>
+<div class="example_body">
+   <div>Drag state: <span id="log"></span></div>
+   <div class="holder">
+      <div>
+         <img src="images/logo.png">
+         <p class="txt">Complete the puzzle to see a picture</p>
+      </div>
+      <ul id="puzzle">
+         <li class="puzzle-piece" draggable="true">
+            <img src="images/puzz_06.png">
+         </li>
+         <li class="puzzle-piece" draggable="true">
+            <img src="images/puzz_02.png">
+         </li>
+         <li class="puzzle-piece" draggable="true">
+            <img src="images/puzz_04.png">
+         </li>
+         <li class="puzzle-piece" draggable="true">
+            <img src="images/puzz_05.png">
+         </li>
+         <li class="puzzle-piece" draggable="true">
+            <img src="images/puzz_01.png">
+         </li>
+         <li class="puzzle-piece" draggable="true">
+            <img src="images/puzz_03.png">
+         </li>
+      </ul>
+   </div>
 </div>
            3. @@ -199,15 +199,15 @@ function dragEnd(e)
          3. Add event listeners for the dragover, dragleave, dragstart, and drop events: 
             <script>
-   var cols = document.querySelectorAll('#puzzle_.puzzle-piece');
-   var colsLength = cols.length;
-   for (var i = 0; i < colsLength; i++)
-   {
-      cols[i].addEventListener('dragstart', dragStartHandler, false);
-      cols[i].addEventListener('dragover', dragOverHandler, false);
-      cols[i].addEventListener('dragleave', dragLeaveHandler, false);
-      cols[i].addEventListener('drop', dragDropHandler, false);
-   };
+   var cols = document.querySelectorAll('#puzzle_.puzzle-piece');
+   var colsLength = cols.length;
+   for (var i = 0; i < colsLength; i++)
+   {
+      cols[i].addEventListener('dragstart', dragStartHandler, false);
+      cols[i].addEventListener('dragover', dragOverHandler, false);
+      cols[i].addEventListener('dragleave', dragLeaveHandler, false);
+      cols[i].addEventListener('drop', dragDropHandler, false);
+   };
 </script>
            4. @@ -224,59 +224,59 @@ var dragElem = null; 
             function dragStartHandler(e)
 {
-   /* Set data */
-   dragElem = this;
-   e.dataTransfer.effectAllowed = 'move';
-   e.dataTransfer.setData('text/html', this.innerHTML);
-   this.classList.add('over');
-   for (var i = 0; i < colsLength; i++)
-   {
-      cols[i].classList.add('start');
-   };
+   /* Set data */
+   dragElem = this;
+   e.dataTransfer.effectAllowed = 'move';
+   e.dataTransfer.setData('text/html', this.innerHTML);
+   this.classList.add('over');
+   for (var i = 0; i < colsLength; i++)
+   {
+      cols[i].classList.add('start');
+   };
 };
 function dragDropHandler(e)
 {
-   /* Get data */
-   dragElem.innerHTML = this.innerHTML;
-   this.innerHTML = e.dataTransfer.getData('text/html');
-   for (var i = 0; i < colsLength; i++)
-   {
-      cols[i].className = "puzzle-piece";
-   };
-   /* Check key */
-   puzzleCheck();
+   /* Get data */
+   dragElem.innerHTML = this.innerHTML;
+   this.innerHTML = e.dataTransfer.getData('text/html');
+   for (var i = 0; i < colsLength; i++)
+   {
+      cols[i].className = "puzzle-piece";
+   };
+   /* Check key */
+   puzzleCheck();
 };
          4. Check the completion of the puzzle by making a user key using a simple array, and comparing the user key against the puzzle key (correct answer): 
            -var puzzleKey = ["01", "02", "03", "04", "05", "06"];
+var puzzleKey = ["01", "02", "03", "04", "05", "06"];
 var puzzleArray = [];
 
 function puzzleCheck()
 {
-   /* Initialize the user key */
-   puzzleArray = [];
-   /* Insert the keys in the array */
-   for (var i = 0; i < colsLength; i++)
-   {
-      puzzleArray.push(cols[i].children[0].getAttribute('src').substring(12, 14));
-   };
-   originKey = puzzleKey.join();
-   userKey = puzzleArray.join();
-
-   if (originKey === userKey)
-   {
-      alert("Success !");
-   };
+   /* Initialize the user key */
+   puzzleArray = [];
+   /* Insert the keys in the array */
+   for (var i = 0; i < colsLength; i++)
+   {
+      puzzleArray.push(cols[i].children[0].getAttribute('src').substring(12, 14));
+   };
+   originKey = puzzleKey.join();
+   userKey = puzzleArray.join();
+
+   if (originKey === userKey)
+   {
+      alert("Success !");
+   };
 };
        -

        Figure: Drag and drop puzzle

        +

        Figure: Drag and drop puzzle

        Drag and drop puzzle

        Drag and drop puzzle

        Source Code

        diff --git a/org.tizen.guides/html/web/w3c/ui/flexible_w.htm b/org.tizen.guides/html/web/w3c/ui/flexible_w.htm index fc97f70..4375e7c 100644 --- a/org.tizen.guides/html/web/w3c/ui/flexible_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/flexible_w.htm @@ -5,20 +5,20 @@ - + - CSS Flexible Box Layout Module - + CSS Flexible Box Layout Module + - + +

    CSS Flexible Box Layout Module

    @@ -64,14 +64,14 @@
  • Assign the area (flex container) where the flexible box layout is applied by using the display: flex property: 
     <style>
-   .flex_container {display: -webkit-flex}
+   .flex_container {display: -webkit-flex}
 </style>
 
-<div class="flex_container">
-   <div class="flex_item">A</div>
-   <div class="flex_item">B</div>
-   <div class="flex_item">C</div>
-   <div class="flex_item">D</div>
+<div class="flex_container">
+   <div class="flex_item">A</div>
+   <div class="flex_item">B</div>
+   <div class="flex_item">C</div>
+   <div class="flex_item">D</div>
 <div>
    @@ -128,7 +128,7 @@

    • The following figure shows examples of flex containers and how their flex items have been aligned.

    -

    Figure: Flex container properties (in mobile applications only)

    +

    Figure: Flex container properties (in mobile applications only)

    Flex container properties (in mobile applications only)

    Source Code

    @@ -138,24 +138,24 @@
  • flex_container_properties_3.html
  • flex_container_properties_4.html
  • flex_container_properties_5.html
    • -
  • flex_container_properties_6.html
    • +
  • flex_container_properties_6.html
    • - +

    Using the Flex Items

    - +

    To enhance the user experience of your application, you must learn how to assign size and alignment to the flex items:

    1. Assign the area (flex container) where the flexible box layout is applied, and define the flex items for it: 
       <style>
-   .flex_container {display: -webkit-flex}
+   .flex_container {display: -webkit-flex}
 </style>
 
-<div class="flex_container">
-   <div class="flex_item">A</div>
-   <div class="flex_item">B</div>
-   <div class="flex_item">C</div>
+<div class="flex_container">
+   <div class="flex_item">A</div>
+   <div class="flex_item">B</div>
+   <div class="flex_item">C</div>
 <div>
      2. @@ -172,7 +172,7 @@
    2. flex property is a shorthand expression defining the flex item size handling:
        -
      • flex-grow: Sets whether the spaces between flex items are filled.
        • +
      • flex-grow: Sets whether the spaces between flex items are filled.
      • flex-shrink: Sets whether the width of the flex items is reduced according to the size of the flex container.
      • flex-basis: Sets the default width of the relevant flex items.
    @@ -184,37 +184,37 @@

    For the complete source code related to this use case, see the following files:

    - +

    Creating a Flexible Layout with CSS3

    To enhance the user experience of your application, you must learn how to create flexible box layout:

    1. Define the HTML content for the flexible layout. In this example, create 2 articles areas, 1 for a text list and 1 for an icon list: 
      -<div class="container">
-   <article class="events">
-      <h2>UPCOMING EVENTS</h2>
-      <ul>
-         <li>
-            <div class="date"><span>APR</span><br/> 15</div>
-            <p class="title">
-               Linux Foundation Collaboration Summit
-               <span class="local">San Francisco, CA</span>
-            </p>
-         </li>
-         <!--Other text items-->
-      </ul>
-   </article>
-   <article class="schedule">
-      <h2>SCHEDULE</h2>
-      <div class="img_list">
-         <img src="folder.png" alt="folder">
-         <img src="alert.png" alt="alert">
-         <!--Other icons-->
-      </div>
-   </article>
+<div class="container">
+   <article class="events">
+      <h2>UPCOMING EVENTS</h2>
+      <ul>
+         <li>
+            <div class="date"><span>APR</span><br/> 15</div>
+            <p class="title">
+               Linux Foundation Collaboration Summit
+               <span class="local">San Francisco, CA</span>
+            </p>
+         </li>
+         <!--Other text items-->
+      </ul>
+   </article>
+   <article class="schedule">
+      <h2>SCHEDULE</h2>
+      <div class="img_list">
+         <img src="folder.png" alt="folder">
+         <img src="alert.png" alt="alert">
+         <!--Other icons-->
+      </div>
+   </article>
 </div>
      2. @@ -226,46 +226,46 @@ <!--Font style for the article area titles--> .container .events > h2, .container .schedule > h2 { -   padding: 10px 20px; -   text-shadow: 1px 1px 2px #fff, -1px -1px 2px #000; + padding: 10px 20px; + text-shadow: 1px 1px 2px #fff, -1px -1px 2px #000; } <!--List styles--> .container .events > ul, .container .schedule .img_list { -   height: 100%; -   padding: 10px; + height: 100%; + padding: 10px; } <!--Text style for the text list item title--> .container .events > ul > li .title { -   color: #51809e; -   text-shadow: 1px 1px 2px #000; + color: #51809e; + text-shadow: 1px 1px 2px #000; } <!--Text style for the text list item location info--> .container .events > ul > li .title .local { -   text-indent: 10px; -   text-shadow: 0 0 0 #fff; + text-indent: 10px; + text-shadow: 0 0 0 #fff; } <!--Styles for the text list item date box--> .container .events > ul > li .date { -   text-align: center; + text-align: center; } .container .events > ul > li .date { -   background-color: #ddd; -   border-radius: 10px; -   box-shadow: inset -2px -2px 4px rgba(0, 0, 0, .5); + background-color: #ddd; + border-radius: 10px; + box-shadow: inset -2px -2px 4px rgba(0, 0, 0, .5); } .container .events > ul > li .date > span { -   background-color: #fff; -   border-radius: 5px; + background-color: #fff; + border-radius: 5px; }

      Article areas with styles defined (in mobile applications only)

      @@ -282,25 +282,25 @@ <!--Flexible alignment of text list--> .container .events > ul > li { -   display: -webkit-flex; -   -webkit-align-items: center; + display: -webkit-flex; + -webkit-align-items: center; } .container .events > ul > li: first-child { -   margin-top: 0; + margin-top: 0; } .container .events > ul > li .date { -   -webkit-flex: 0 0 20%; -   text-align: center; + -webkit-flex: 0 0 20%; + text-align: center; } <!--Flexible alignment of icon list--> .container .schedule .img_list { -   display: -webkit-flex; -   -webkit-justify-content: space-between; + display: -webkit-flex; + -webkit-justify-content: space-between; }

      Article areas with a flexible box layout defined (in mobile applications only)

      @@ -310,17 +310,17 @@ 
       @media screen and (min-width: 390px)
 {
-   .container .schedule .img_list
-   {
-      display: -webkit-flex;
-      -webkit-flex-wrap: wrap;
-      -webkit-justify-content: space-between;
-      -webkit-align-content: space-around;
-   }
-
-   .container {display: -webkit-flex;}
-   .container > * {-webkit-align-content: center;}
-   .container article {height: 250px;}
+   .container .schedule .img_list
+   {
+      display: -webkit-flex;
+      -webkit-flex-wrap: wrap;
+      -webkit-justify-content: space-between;
+      -webkit-align-content: space-around;
+   }
+
+   .container {display: -webkit-flex;}
+   .container > * {-webkit-align-content: center;}
+   .container article {height: 250px;}
 }

      Article areas with a flexible box layout for small screens (in mobile applications only)

      @@ -333,9 +333,9 @@
    2. flexible_layout_1.html
    3. flexible_layout_2.html
    4. alert.png
      5. -
    5. folder.png
      6. +
    6. folder.png
      7. - + diff --git a/org.tizen.guides/html/web/w3c/ui/font_w.htm b/org.tizen.guides/html/web/w3c/ui/font_w.htm index a4ce433..9d56306 100644 --- a/org.tizen.guides/html/web/w3c/ui/font_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/font_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - +

      Mobile Web Wearable Web

      - +

      Dependencies

      -
      +

    CSS Fonts Module (Level 3)

    @@ -47,13 +47,13 @@

    The new text features in CSS Fonts Module Level 3 API include:

      -
    • Font properties +
    • Font properties

      You can use CSS font properties, such as font-style, font-weight, font-variant, font-size, and font-family, to modify the appearance of text.

      • -
    +

    Manipulating Fonts

    - +

    To enhance the user experience of your application, you must learn to handle fonts using CSS font properties:

      @@ -61,16 +61,16 @@ 
       <head>
-   <style>
-      p:nth-child(1) em{font-style: normal}
-      p:nth-child(2) em{font-style: italic}
-      p:nth-child(3) em{font-style: oblique}
-   </style>
+   <style>
+      p:nth-child(1) em{font-style: normal}
+      p:nth-child(2) em{font-style: italic}
+      p:nth-child(3) em{font-style: oblique}
+   </style>
 </head>
 <body>
-   <p>font-style: <em>normal</em></p>
-   <p>font-style: <em>italic</em></p>
-   <p>font-style: <em>oblique</em></p>
+   <p>font-style: <em>normal</em></p>
+   <p>font-style: <em>italic</em></p>
+   <p>font-style: <em>oblique</em></p>
 </body>
      @@ -81,20 +81,20 @@ which controls the weight of the text:

       <head>
-   <style>
-      p:nth-child(1) {font-weight: normal}
-      p:nth-child(2) {font-weight: bold}
-      p:nth-child(3) {font-weight: 300}
-      p:nth-child(4) {font-weight: 500}
-      p:nth-child(5) {font-weight: 700}
-   </style>
+   <style>
+      p:nth-child(1) {font-weight: normal}
+      p:nth-child(2) {font-weight: bold}
+      p:nth-child(3) {font-weight: 300}
+      p:nth-child(4) {font-weight: 500}
+      p:nth-child(5) {font-weight: 700}
+   </style>
 </head>
 <body>
-   <p>font-weight: <em>normal</em></p>
-   <p>font-weight: <em>bold</em></p>
-   <p>font-weight: <em>300</em></p>
-   <p>font-weight: <em>500</em></p>
-   <p>font-weight: <em>700</em></p>
+   <p>font-weight: <em>normal</em></p>
+   <p>font-weight: <em>bold</em></p>
+   <p>font-weight: <em>300</em></p>
+   <p>font-weight: <em>500</em></p>
+   <p>font-weight: <em>700</em></p>
 </body>
      @@ -104,14 +104,14 @@ which controls the weight of the text:

      change the font to, for example, use small capital letters: 
       <head>
-   <style>
-      p:nth-child(1) {font-variant: normal}
-      p:nth-child(2) {font-variant: small-caps}
-   </style>
+   <style>
+      p:nth-child(1) {font-variant: normal}
+      p:nth-child(2) {font-variant: small-caps}
+   </style>
 </head>
 <body>
-   <p>font-variant: <em>normal</em></p>
-   <p>font-variant: <em>small-caps</em></p>
+   <p>font-variant: <em>normal</em></p>
+   <p>font-variant: <em>small-caps</em></p>
 </body>
      @@ -120,14 +120,14 @@ change the font to, for example, use small capital letters:
    1. Define the font-size property, which controls the size of the font: 
       <head>
-   <style>
-      p:nth-child(1) {font-size: 150%}
-      p:nth-child(2) {font-size: 1.2em}
-   </style>
+   <style>
+      p:nth-child(1) {font-size: 150%}
+      p:nth-child(2) {font-size: 1.2em}
+   </style>
 </head>
 <body>
-   <p>font-size: <em>150%</em></p>
-   <p>font-size: <em>1.2em</em></p>
+   <p>font-size: <em>150%</em></p>
+   <p>font-size: <em>1.2em</em></p>
 </body>
 </html>
      @@ -136,16 +136,16 @@ change the font to, for example, use small capital letters:
    2. Define the line-height property, which controls the height of a text line: 
       <head>
-   <style>
-      p:nth-child(1) {line-height: 1}
-      p:nth-child(2) {line-height: 1.5}
-      p:nth-child(3) {line-height: 5}
-   </style>
+   <style>
+      p:nth-child(1) {line-height: 1}
+      p:nth-child(2) {line-height: 1.5}
+      p:nth-child(3) {line-height: 5}
+   </style>
 </head>
 <body>
-   <p>line-height: <em>1</em></p>
-   <p>line-height: <em>1.5</em></p>
-   <p>line-height: <em>5</em></p>
+   <p>line-height: <em>1</em></p>
+   <p>line-height: <em>1.5</em></p>
+   <p>line-height: <em>5</em></p>
 </body>
      @@ -155,28 +155,28 @@ change the font to, for example, use small capital letters:

      If the assigned font is not installed on the target, a different font is obtained based on the user system.

       <head>
-   <style>
-      p:nth-child(1) {font-family: serif}
-      p:nth-child(2) {font-family: sans-serif}
-      p:nth-child(3) {font-family: monospace}
-      p:nth-child(4) {font-family: cursive}
-      p:nth-child(5) {font-family: fantasy}
-      p:nth-child(6) {font-family: 'Arial Black', sans-serif}
-      p:nth-child(7) {font-family: Tahoma, sans-serif}
-      p:nth-child(8) {font-family: Verdana, sans-serif}
-      p:nth-child(9) {font-family: Arial, sans-serif}
-   </style>
+   <style>
+      p:nth-child(1) {font-family: serif}
+      p:nth-child(2) {font-family: sans-serif}
+      p:nth-child(3) {font-family: monospace}
+      p:nth-child(4) {font-family: cursive}
+      p:nth-child(5) {font-family: fantasy}
+      p:nth-child(6) {font-family: 'Arial Black', sans-serif}
+      p:nth-child(7) {font-family: Tahoma, sans-serif}
+      p:nth-child(8) {font-family: Verdana, sans-serif}
+      p:nth-child(9) {font-family: Arial, sans-serif}
+   </style>
 </head>
 <body>
-   <p>font-family: <em>serif</em></p>
-   <p>font-family: <em>sans-serif</em></p>
-   <p>font-family: <em>monospace</em></p>
-   <p>font-family: <em>cursive</em></p>
-   <p>font-family: <em>fantasy</em></p>
-   <p>font-family: <em>'Arial Black', sans-serif</em></p>
-   <p>font-family: <em>Tahoma, sans-serif</em></p>
-   <p>font-family: <em>Verdana, sans-serif</em></p>
-   <p>font-family: <em>Arial, sans-serif</em></p>
+   <p>font-family: <em>serif</em></p>
+   <p>font-family: <em>sans-serif</em></p>
+   <p>font-family: <em>monospace</em></p>
+   <p>font-family: <em>cursive</em></p>
+   <p>font-family: <em>fantasy</em></p>
+   <p>font-family: <em>'Arial Black', sans-serif</em></p>
+   <p>font-family: <em>Tahoma, sans-serif</em></p>
+   <p>font-family: <em>Verdana, sans-serif</em></p>
+   <p>font-family: <em>Arial, sans-serif</em></p>
 </body>
 </html>
      @@ -191,7 +191,7 @@ change the font to, for example, use small capital letters:
      Note For a complete list of CSS Fonts Module Level 3 font properties (in mobile or wearable applications) and their possible values, see the Property index. -
      +
    diff --git a/org.tizen.guides/html/web/w3c/ui/frame_flattening_mw.htm b/org.tizen.guides/html/web/w3c/ui/frame_flattening_mw.htm index d7b1a62..ec4d2f5 100644 --- a/org.tizen.guides/html/web/w3c/ui/frame_flattening_mw.htm +++ b/org.tizen.guides/html/web/w3c/ui/frame_flattening_mw.htm @@ -5,14 +5,14 @@ - + - Frame Flattening - + Frame Flattening + @@ -26,19 +26,19 @@
  • Tizen 2.4 and Higher for Mobile
    • -
    +

    Frame Flattening

    -

    In the Tizen WebKit, content placed within the <frame> and <iframe> tags is expanded automatically according to the content size. This enables users to view the whole content at once without scrolling.

    - +

    In the Tizen WebKit, content placed within the <frame> and <iframe> tags is expanded automatically according to the content size. This enables users to view the whole content at once without scrolling.

    +

    This feature is supported in mobile applications only.

    - -

    The Tizen WebKit supports this feature since scrolling through small subframes on small screen devices is a tedious task and, occasionally, causes confusion between scrolling subframes and scrolling the Web page itself.

    -

    To implement scrollable content in the Tizen WebKit, use the CSS overflow: scroll or webkit-overflow-scrolling: touch property instead of iframe.

    - + +

    The Tizen WebKit supports this feature since scrolling through small subframes on small screen devices is a tedious task and, occasionally, causes confusion between scrolling subframes and scrolling the Web page itself.

    +

    To implement scrollable content in the Tizen WebKit, use the CSS overflow: scroll or webkit-overflow-scrolling: touch property instead of iframe.

    +
    diff --git a/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm b/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm index 2e8894d..b330253 100644 --- a/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm @@ -5,20 +5,20 @@ - + - HTML5 Forms - + HTML5 Forms + - + +
    -

    HTML5 Forms

    +

    HTML5 Forms

    The HTML5 forms provide a convenient way to create consistent screens in your application for accepting user input.

    @@ -54,43 +54,43 @@

    With HTML5 forms, you can use new elements, input element types, and input element attributes.

    Creating a Basic Login Form

    - -

    To create simple user input forms, you must learn to use the HTML5 features in Web forms:

    + +

    To create simple user input forms, you must learn to use the HTML5 features in Web forms:

    1. Create a simple form where the user can enter their login details (email address and password):

      -<form action="" method="">
-   <label>email: <input type="text"/></label>
-   <label>password: <input type="password"/></label>
+<form action="" method="">
+   <label>email: <input type="text"/></label>
+   <label>password: <input type="password"/></label>
 
-   <input type="submit" value="Login"/>
+   <input type="submit" value="Login"/>
 </form>

    2. To check the validity of the entered email address automatically, add the required attribute to the input element with the email type:

      -<label>email: <input type="email" required /></label>
+<label>email: <input type="email" required /></label>

    3. Define the password field as mandatory by using the required attribute in that input element too:

      -<label>password: <input type="password" required /></label>
+<label>password: <input type="password" required /></label>

    4. Because a device has limited space on the screen, remove the field labels and replace them with hint texts using the placeholder attribute:

      -<input type="email" placeholder="e-mail address" required />
-<input type="password" placeholder="password" required />
+<input type="email" placeholder="e-mail address" required />
+<input type="password" placeholder="password" required />

    The final form that checks the email validity and requires the mandatory password input is complete:

    -<form action="" method="">
-   <fieldset>
-      <legend>Login</legend>
-      <input type="email" placeholder="e-mail address" required />
-      <input type="password" placeholder="password" required />
-   </fieldset>
-
-   <input type="submit" value="Login"/>
+<form action="" method="">
+   <fieldset>
+      <legend>Login</legend>
+      <input type="email" placeholder="e-mail address" required />
+      <input type="password" placeholder="password" required />
+   </fieldset>
+
+   <input type="submit" value="Login"/>
 </form>
    @@ -99,28 +99,28 @@ - +

    Creating an Advanced Login Form

    - -

    To create advanced user input forms, you must learn to use the HTML5 features in Web forms:

    - + +

    To create advanced user input forms, you must learn to use the HTML5 features in Web forms:

    +

    1. Create a login form that checks the email validity and requires the mandatory password input:

      -<form action="" method="">
-   <fieldset>
-      <legend>Login</legend>
-      <input type="email" placeholder="e-mail address" required />
-      <input type="password" placeholder="password" required />
-   </fieldset>
-
-   <input type="submit" value="Login"/>
+<form action="" method="">
+   <fieldset>
+      <legend>Login</legend>
+      <input type="email" placeholder="e-mail address" required />
+      <input type="password" placeholder="password" required />
+   </fieldset>
+
+   <input type="submit" value="Login"/>
 </form>

    2. When the form page is loaded on the screen, put the focus automatically to the email field by using the autofocus attribute:

      -<input type="email" placeholder="e-mail address" required autofocus />
+<input type="email" placeholder="e-mail address" required autofocus />
    3. @@ -128,58 +128,58 @@

      You can apply the autocomplete attribute to a specific field by adding it to the appropriate input element. If you add it to the form element, it applies to all child elements within the form.

      -<form action="" method="" autocomplete="on">
+<form action="" method="" autocomplete="on">

    4. In general, apply the autocomplete attribute to the form element, and then separately set it to off for those fields that must not use it.

      In the following example, the password field must not use autocomplete, to prevent unauthorized access by any user.

      -<input type="password" placeholder="password" required autocomplete="off"/>
+<input type="password" placeholder="password" required autocomplete="off"/>

    5. Protect the password with private and public key pair using the keygen element.

      -

      The element is used to transform the data sent from the connected form to a pair of encrypted keys using the RSA (Rivest Shamir Adleman) method. When the input data is sent from the form, the private key is saved in the local computer, and the public key is delivered to the server. Only if the keys match, the login process proceeds forwards.

      +

      The element is used to transform the data sent from the connected form to a pair of encrypted keys using the RSA (Rivest Shamir Adleman) method. When the input data is sent from the form, the private key is saved in the local computer, and the public key is delivered to the server. Only if the keys match, the login process proceeds forwards.

      -<keygen name="keyvalue">
+<keygen name="keyvalue">

    6. Use the pattern attribute to perform a validity check that ensures that the password field value matches the given regular expression. The required attribute is used to ensure that the field value must be entered and then the validity check can be performed.

      -

      In the following example, the password only accepts numbers and letters of the alphabet. If an invalid value is entered, the login cannot proceed.

      +

      In the following example, the password only accepts numbers and letters of the alphabet. If an invalid value is entered, the login cannot proceed.

      -<input type="password" placeholder="password" required
-       pattern="[a-zA-Z]+[0-9]+[a-zA-Z0-9]*|[0-9]+[a-zA-Z]+[a-zA-Z0-9]*"
-       autocomplete="off"/>
+<input type="password" placeholder="password" required
+       pattern="[a-zA-Z]+[0-9]+[a-zA-Z0-9]*|[0-9]+[a-zA-Z]+[a-zA-Z0-9]*"
+       autocomplete="off"/>

    7. Define the required length of the password within the pattern attribute.

      -

      In the following example, the password must be 6 to 12 characters long.

      +

      In the following example, the password must be 6 to 12 characters long.

      -<input type="password" placeholder="password" required
-       pattern="(?=([a-zA-Z]+[0-9]+[a-zA-Z0-9]*|[0-9]+[a-zA-Z]+[a-zA-Z0-9]*)).{6,12}"
-       autocomplete="off"/>
+<input type="password" placeholder="password" required
+       pattern="(?=([a-zA-Z]+[0-9]+[a-zA-Z0-9]*|[0-9]+[a-zA-Z]+[a-zA-Z0-9]*)).{6,12}"
+       autocomplete="off"/>

    The final form with autofocus and autocomplete features, strengthened security, and password value requirements is complete:

    -<form action="" method="" autocomplete="on">
-   <fieldset>
-      <legend>Login</legend>
-      <input type="email" placeholder="e-mail address" required autofocus />
-      <input type="password" placeholder="password" required
-             pattern="(?=([a-zA-Z]+[0-9]+[a-zA-Z0-9]*|[0-9]+[a-zA-Z]+[a-zA-Z0-9]*)).{6,12}"
-             autocomplete="off"/>
-   </fieldset>
-
-   <keygen name="keyvalue">
-
-   <input type="submit" value="Login"/>
+<form action="" method="" autocomplete="on">
+   <fieldset>
+      <legend>Login</legend>
+      <input type="email" placeholder="e-mail address" required autofocus />
+      <input type="password" placeholder="password" required
+             pattern="(?=([a-zA-Z]+[0-9]+[a-zA-Z0-9]*|[0-9]+[a-zA-Z]+[a-zA-Z0-9]*)).{6,12}"
+             autocomplete="off"/>
+   </fieldset>
+
+   <keygen name="keyvalue">
+
+   <input type="submit" value="Login"/>
 </form>
    - +

    New HTML5 Elements

    The following table lists the new elements available for your forms in HTML5. For a complete source code, see elements.html.

    @@ -198,22 +198,22 @@

    In Tizen, the value selected in the datalist element can be edited.

    -<input type="text" list="search"/>
-<datalist id="search">
-   <option value="Tomato">Tomato</option>
-   <option value="banana">banana</option>
-   <option value="Watermelon">Watermelon</option>
+<input type="text" list="search"/>
+<datalist id="search">
+   <option value="Tomato">Tomato</option>
+   <option value="banana">banana</option>
+   <option value="Watermelon">Watermelon</option>
 </datalist>
    keygen - Defines a control for generating a public-private key pair and for submitting the public key from that key pair. The element creates an encrypted key with the value of the name attribute, saves it in the user's computer and Web server, and activates the next procedure when the 2 values match. + Defines a control for generating a public-private key pair and for submitting the public key from that key pair. The element creates an encrypted key with the value of the name attribute, saves it in the user's computer and Web server, and activates the next procedure when the 2 values match. 
    -<label>user:<input type="text" name="user_name"/></label>
-<label>keygen:<keygen name="keygen"/></label>
+<label>user:<input type="text" name="user_name"/></label>
+<label>keygen:<keygen name="keygen"/></label>
    @@ -223,8 +223,8 @@ Represents a scalar measurement within a known range (the distribution of the assigned range), or a fractional value. 
    -<meter value="75" min="0" max="100" low="60" high="80" optimum="81">
-   75/100
+<meter value="75" min="0" max="100" low="60" high="80" optimum="81">
+   75/100
 </meter>
    @@ -235,11 +235,11 @@ Represents the result of a calculation. The element generally shows the calculated result of the value that the user has entered, and is used within the form element. 
    -<fieldset onsubmit="return false"
-          oninput="foobar.value = parseInt(foo.value) * parseInt(bar.value)">
-   <input type="number" id="foo" name="foo"/> *
-   <input type="number" id="bar" name="bar"/> =
-   <output for="foo bar" name="foobar"></output>
+<fieldset onsubmit="return false"
+          oninput="foobar.value = parseInt(foo.value) * parseInt(bar.value)">
+   <input type="number" id="foo" name="foo"/> *
+   <input type="number" id="bar" name="bar"/> =
+   <output for="foo bar" name="foobar"></output>
 </fieldset>
    @@ -250,8 +250,8 @@ 
    -<progress value="75" max="100">
-   75/100
+<progress value="75" max="100">
+   75/100
 </progress>
    @@ -275,18 +275,18 @@ 
    -<input type="color"
-       value="#ff0000"/>
-<input type="datetime"
-       value="2012-12-12T03:30Z"/>
-<input type="email"
-       required />
-<input type="number"
-       step="3"/>
-<input type="range"
-       min="1" max="10"/>
-<input type="tel"/>
-<input type="url"/>
+<input type="color"
+       value="#ff0000"/>
+<input type="datetime"
+       value="2012-12-12T03:30Z"/>
+<input type="email"
+       required />
+<input type="number"
+       step="3"/>
+<input type="range"
+       min="1" max="10"/>
+<input type="tel"/>
+<input type="url"/>
    @@ -312,7 +312,7 @@ email Enter an email address with the email keyboard. -

    If the required attribute is used, the system checks whether the input format is in line with the ABNF regular expression (1*(atext / ".") "@" ldh-str 1*("." ldh-str)).

    +

    If the required attribute is used, the system checks whether the input format is in line with the ABNF regular expression (1*(atext / ".") "@" ldh-str 1*("." ldh-str)).

    @@ -372,15 +372,15 @@ autocomplete - Prefilling feature, which helps the users by, for example, prefilling the user's address based on earlier user input. -

    The text used by the user before (such as an input element) is listed in a datalist form. The attribute can be used in all form elements, and is activated if the value is "on" and deactivated if the value is "off".

    + Prefilling feature, which helps the users by, for example, prefilling the user's address based on earlier user input. +

    The text used by the user before (such as an input element) is listed in a datalist form. The attribute can be used in all form elements, and is activated if the value is "on" and deactivated if the value is "off".

    -<input type="range" min="1" max="10"/>
-<input type="tel" pattern="[0-9]+" required />
-<input placeholder="You know what to do, huh?"/>
-<input type="number" step="3"/>
+<input type="range" min="1" max="10"/>
+<input type="tel" pattern="[0-9]+" required />
+<input placeholder="You know what to do, huh?"/>
+<input type="number" step="3"/>
    @@ -391,7 +391,7 @@ pattern - Regular expression against which the control's value is checked. + Regular expression against which the control's value is checked.

    The attribute can be used to check the validity of the form data. During service, a guide requiring the input format from the user is necessary.

    diff --git a/org.tizen.guides/html/web/w3c/ui/html_priority_w.htm b/org.tizen.guides/html/web/w3c/ui/html_priority_w.htm index 4a27ead..51e3eef 100644 --- a/org.tizen.guides/html/web/w3c/ui/html_priority_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/html_priority_w.htm @@ -5,20 +5,20 @@ - + - HTML Priorities - + HTML Priorities + - + +
    -

    HTML Priorities

    +

    HTML Priorities

    The HTML markup is not as important as before, because JavaScript APIs can be used to create various functionalities. For example, graphics APIs (in mobile or wearable applications) can be used for making games, media APIs (in mobile or wearable applications) for creating video chats, and communication APIs (in mobile or wearable applications) for various types of messaging. However, HTML remains the basis of Web applications, and it is useful to be familiar with its behavior.

    @@ -63,8 +63,8 @@ <!DOCTYPE html> <!--Prior to HTML5--> -<!DOCTYPE html PUBLIC "{HTML Version Information}" - "{DTD (Document Type Definition) file link defined by Rule in HTML DOM}"> +<!DOCTYPE html PUBLIC "{HTML Version Information}" + "{DTD (Document Type Definition) file link defined by Rule in HTML DOM}">

    HTML DOM Tree

    @@ -76,12 +76,12 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <!--Content-->
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <!--Content-->
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -92,17 +92,17 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="utf-8"/>
-      <title>
-         Tizen (in mobile applications) or Tizen Wearable (in wearable applications)
-      </title>
-      <link rel="stylesheet" href="css/style.css"/>
-      <script src="/common/js/ui.js"></script>
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <meta charset="utf-8"/>
+      <title>
+         Tizen (in mobile applications) or Tizen Wearable (in wearable applications)
+      </title>
+      <link rel="stylesheet" href="css/style.css"/>
+      <script src="/common/js/ui.js"></script>
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -128,33 +128,33 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <!--Content-->
-   </head>
-   <body>
-      <section id="tizen_wrap">
-         <header>
-            <h1>
-               Tizen Web App (in mobile applications)
-               or Tizen Wearable Web App (in wearable applications)
-            </h1>
-         </header>
-         <section id="contents">
-            <!--Content-->
-         </section>
-         <footer>
-            <p>&copy; All rights reserved.</p>
-         </footer>
-      </section>
-   </body>
+   <head>
+      <!--Content-->
+   </head>
+   <body>
+      <section id="tizen_wrap">
+         <header>
+            <h1>
+               Tizen Web App (in mobile applications)
+               or Tizen Wearable Web App (in wearable applications)
+            </h1>
+         </header>
+         <section id="contents">
+            <!--Content-->
+         </section>
+         <footer>
+            <p>&copy; All rights reserved.</p>
+         </footer>
+      </section>
+   </body>
 </html>
    - +

    CSS Rule Priorities

    The basic rule of HTML, CSS, and JavaScript is that the code is applied from the top to the bottom of the document. Sometimes the lack of understanding of the CSS rule priorities can cause a result you do not expect.

    The following figure illustrates this problem in mobile applications by applying a font color to a black background.

    -

    Figure: Expected and actual result of applying a font color (in mobile applications only)

    +

    Figure: Expected and actual result of applying a font color (in mobile applications only)

    Expected and actual result of applying a font color (in mobile applications only)

    Basic CSS Rules

    @@ -180,14 +180,14 @@ p {color: blue} 
     <body>
-   <p id="target" class="target">Hello World</p>
+   <p id="target" class="target">Hello World</p>
 </body>
 
 <style>
-   p#target {color: black} /* Specificity: 101 */
-   p#target {color: red} /* Specificity: 101 */
-   p.target {color: blue} /* Specificity: 11 */
-   p {color: tomato} /* Specificity: 1 */
+   p#target {color: black} /* Specificity: 101 */
+   p#target {color: red} /* Specificity: 101 */
+   p.target {color: blue} /* Specificity: 11 */
+   p {color: tomato} /* Specificity: 1 */
 </style>
 <!--Red color is applied-->
    @@ -195,14 +195,14 @@ p {color: blue}
  • When the !important attribute is used, it has the highest priority: 
     <body>
-   <p id="target" class="target">Hello World</p>
+   <p id="target" class="target">Hello World</p>
 </body>
 
 <style>
-   p#target {color: black !important}
-   p#target {color: red}
-   p.target {color: blue}
-   p {color: tomato}
+   p#target {color: black !important}
+   p#target {color: red}
+   p.target {color: blue}
+   p {color: tomato}
 </style>
 <!--Black color is applied-->
    @@ -235,25 +235,25 @@ body .contents {color: #999;} 
     <!DOCTYPE html>
 <html>
-   <head>
-      <!--Link in head-->
-      <link rel="stylesheet" href="css/style.css"/>
-
-      <!--Style tag in head-->
-      <style>
-         p {color: tomato}
-      </style>
-
-      <!--@import in CSS area-->
-      <style>
-         @import url("css/style.css");
-      </style>
-   </head>
-
-   <body>
-      <!--Style attribute in HTML element-->
-      <p style="color: red">Hello World</p>
-   </body>
+   <head>
+      <!--Link in head-->
+      <link rel="stylesheet" href="css/style.css"/>
+
+      <!--Style tag in head-->
+      <style>
+         p {color: tomato}
+      </style>
+
+      <!--@import in CSS area-->
+      <style>
+         @import url("css/style.css");
+      </style>
+   </head>
+
+   <body>
+      <!--Style attribute in HTML element-->
+      <p style="color: red">Hello World</p>
+   </body>
 </html>

    However, the priority order of the elements is as follows:

    @@ -275,7 +275,7 @@ body .contents {color: #999;} Using the @import attribute gives the same result as connecting an external file, but it does not function correctly in older browsers (IE 5.5 and below).
    • -

    Figure: Using the @import attribute

    +

    Figure: Using the @import attribute

    Using the @import attribute

    The markup in the corresponding files is as follows:

    @@ -283,22 +283,22 @@ body .contents {color: #999;}
  • In the HTML code: 
     <head>
-   <link rel="stylesheet" href="css/style.css"/>
+   <link rel="stylesheet" href="css/style.css"/>
 </head>
  • In the style.css file: 
    -@import url("priorities1.css");
+@import url("priorities1.css");
 
-p: after {content: " : linked in head"}
+p: after {content: " : linked in head"}
    -

    Figure: Result of linking the @import attribute

    +

    Figure: Result of linking the @import attribute

    Result of linking the @import attribute

  • In the priorities1.css file: 
    -p: after {content: " : Using @import in CSS area"}
+p: after {content: " : Using @import in CSS area"}
    -

    Figure: Result of using the @import attribute in the CSS area

    +

    Figure: Result of using the @import attribute in the CSS area

    Result of using the @import attribute in the CSS area

    • @@ -319,19 +319,19 @@ p: after {content: " : Using @import in CSS area"}

    The following example shows how you can use JavaScript with HTML either by linking to a JavaScript file, or embedding it directly in the HTML code:

     /* Linking from HTML */
-<script src="js/main.js"></script>
+<script src="js/main.js"></script>
 
 /* Direct use in HTML */
 <script>
-   var obj = document.querySelector(".animated");
+   var obj = document.querySelector(".animated");
 
-   function animate()
-   {
-      /* Execute */
-   };
+   function animate()
+   {
+      /* Execute */
+   };
 
-   /* Call the animation function when the event is fired */
-   webkitRequestAnimationFrame(animate);
+   /* Call the animation function when the event is fired */
+   webkitRequestAnimationFrame(animate);
 </script>

    Both ways described above give the same result in behavior. However, the position of the JavaScript code affects the order in which the methods are called.

    @@ -340,7 +340,7 @@ p: after {content: " : Using @import in CSS area"} Note Previously, adding JavaScript code within head tag was recommended because it is easy to maintain. Currently, adding it to the end of the body and executing it after parsing the HTML document is common.
    - +

    JavaScript Events

    JavaScript generally calls a method when a specific event is fired. More than 70 types of events, such as onload and onclick are available.

    @@ -349,15 +349,15 @@ p: after {content: " : Using @import in CSS area"} 
     <!--HTML-->
-<body onload="touchEventHandler()">
+<body onload="touchEventHandler()">
 
 <script>
-   /* JavaScript */
-   /* Directly assigning */
-   window.onload = touchEventHandler; /* Assigns the name of the subject method */
+   /* JavaScript */
+   /* Directly assigning */
+   window.onload = touchEventHandler; /* Assigns the name of the subject method */
 
-   /* Event listener (W3C standard) */
-   document.addEventListener("touchstart", touchEventHandler, false);
+   /* Event listener (W3C standard) */
+   document.addEventListener("touchstart", touchEventHandler, false);
 </script>

    Prefer using W3C standard event listener methods. The inline JavaScript code applied directly to an HTML tag is difficult to maintain. Assigning a method directly to an event is also difficult when passing parameters, as the method needs to be assigned for every event.

    @@ -380,18 +380,18 @@ p: after {content: " : Using @import in CSS area"}
  • To use JavaScript code in the <head> element, place the relevant JavaScript content in a <script> tag: 
     <head>
-   <script src="js/jquery_1.9.0_min.js"></script>
-   <script>
-      window.onload = function()
-      {
-         testLog('head onload');
-      };
-
-      $(document).ready(function()
-      {
-         testLog('head ready');
-      });
-   </script>
+   <script src="js/jquery_1.9.0_min.js"></script>
+   <script>
+      window.onload = function()
+      {
+         testLog('head onload');
+      };
+
+      $(document).ready(function()
+      {
+         testLog('head ready');
+      });
+   </script>
 </head>
    @@ -400,31 +400,31 @@ p: after {content: " : Using @import in CSS area"}
  • To use JavaScript code in the <body> element, place the relevant JavaScript content in a <script> tag: 
     <body>
-   <script src="js/jquery_1.9.0_min.js"></script>
-   <script>
-      function testLog(txt)
-      {
-         var logText = document.querySelector('.log');
-         logText.innerHTML += '<li>JavaScript in HTML ' + txt + '</li>';
-      };
-
-      window.onload = function()
-      {
-         testLog('body onload');
-      };
-
-      $(document).ready(function()
-      {
-         testLog('body ready');
-      });
-
-      testLog('body');
-
-      (function()
-      {
-         testLog('body anonymous function');
-      }();
-   </script>
+   <script src="js/jquery_1.9.0_min.js"></script>
+   <script>
+      function testLog(txt)
+      {
+         var logText = document.querySelector('.log');
+         logText.innerHTML += '<li>JavaScript in HTML ' + txt + '</li>';
+      };
+
+      window.onload = function()
+      {
+         testLog('body onload');
+      };
+
+      $(document).ready(function()
+      {
+         testLog('body ready');
+      });
+
+      testLog('body');
+
+      (function()
+      {
+         testLog('body anonymous function');
+      }();
+   </script>
 </body>

    The JavaScript code within the <body> element is sent to Interpreter. The anonymous method is immediately executed, and the HTML DOM structure is set up. The methods in the $(document).ready() method and in the onload event are executed in the stored order.

    @@ -434,7 +434,7 @@ p: after {content: " : Using @import in CSS area"} Note jQuery has to be called from both the <head> and <body> elements. The logText variable has to be called from the <body> element. The method connected to the onload event in the <head> element is not executed.
    • - +
    diff --git a/org.tizen.guides/html/web/w3c/ui/media_query_w.htm b/org.tizen.guides/html/web/w3c/ui/media_query_w.htm index 7038fb0..9a6746d 100644 --- a/org.tizen.guides/html/web/w3c/ui/media_query_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/media_query_w.htm @@ -5,20 +5,20 @@ - + - Media Queries - + Media Queries + - + +

    Media Queries

    - +

    Media queries allow you to apply the CSS differently according to conditions based on the media type (type of device) and media features (viewport status). Previously, you were able to use the media type only and create Web services with fixed layouts. However, smart phones, tablets, and other devices with various resolutions require a liquid layout. HTML5 now makes various characteristics and conditional defining possible, and can be used to implement responsive Web design (RWD), which is a liquid layout that mainly reacts according to the device resolution.

    This feature is supported in mobile and wearable applications only.

    @@ -71,7 +71,7 @@
  • In HTML

    You can directly import the CSS file that matches the condition:

    -<link rel="stylesheet" media="all and (max-width: 480px)" href="example.css">
+<link rel="stylesheet" media="all and (max-width: 480px)" href="example.css">
    @@ -93,7 +93,7 @@ 
     @media not screen and (min-width: 320px), screen and (max-width: 480px)
 {
-   .example: after {content: "width: 320px ~ 480px"}
+   .example: after {content: "width: 320px ~ 480px"}
 }
    • @@ -102,33 +102,33 @@ 
     @media all and (min-width: 320px) and (max-width: 480px)
 {
-   .example: after {content: "width: 320px ~ 480px"}
+   .example: after {content: "width: 320px ~ 480px"}
 }
  • Device and viewport height -

    The height attribute refers to restoring the viewport's height, and the device-height attribute refers to restoring the resolution set in the device.

    -

    The same difference applies to the width and aspect-ratio attributes, which can assign 'device-'.

    +

    The height attribute refers to restoring the viewport's height, and the device-height attribute refers to restoring the resolution set in the device.

    +

    The same difference applies to the width and aspect-ratio attributes, which can assign 'device-'.

     @media screen and (min-device-height: 700px)
 {
-   .example: after {content: "min-device-height"}
+   .example: after {content: "min-device-height"}
 }
 @media screen and (min-height: 550px)
 {
-   .example: after {content: "min-height"}
+   .example: after {content: "min-height"}
 }
    -

    In the above example, a device with the width-height resolution of 480/720 has the {content: "min-height"} rule applied as a priority in a portrait screen, but the {content "min-device-height"} rule applied in a landscape screen.

    +

    In the above example, a device with the width-height resolution of 480/720 has the {content: "min-height"} rule applied as a priority in a portrait screen, but the {content "min-device-height"} rule applied in a landscape screen.

  • Device aspect ratio

    You can use the device-aspect-ratio attribute to check the width-length ratio (aspect ratio) of the printing device.

     @media all and (device-aspect-ratio: 9/16) and (orientation: portrait),
-       all and (device-aspect-ratio: 2/3) and (orientation: portrait)
+       all and (device-aspect-ratio: 2/3) and (orientation: portrait)
 {
-   .example: after {content: "aspect-ratio, portrait"}
+   .example: after {content: "aspect-ratio, portrait"}
 }
    @@ -157,14 +157,14 @@

    To apply media query, consider an example with the following files:

     <!--example.html-->
-<link rel="stylesheet" media="all and (max-width: 768px)" href="c.css">
-<link rel="stylesheet" media="all and (max-width: 768px)" href="a.css">
-<link rel="stylesheet" media="all and (min-width: 768px)" href="b.css">
+<link rel="stylesheet" media="all and (max-width: 768px)" href="c.css">
+<link rel="stylesheet" media="all and (max-width: 768px)" href="a.css">
+<link rel="stylesheet" media="all and (min-width: 768px)" href="b.css">
 <style>
-   @media all and (max-width: 400px)
-   {
-      .example: after {content: "In HTML head"}
-   }
+   @media all and (max-width: 400px)
+   {
+      .example: after {content: "In HTML head"}
+   }
 </style>
 
 <!--a.css-->
@@ -172,21 +172,21 @@ body {background-color: #ccc}
 
 @media screen and (max-width: 480px)
 {
-   .example: after {content:"a.css : width: ~ 480px"}
+   .example: after {content:"a.css : width: ~ 480px"}
 }
 @media screen and (min-width: 480px) and (max-width: 768px)
 {
-   .example: after {content: "a.css : width: 480px ~ 768px"}
+   .example: after {content: "a.css : width: 480px ~ 768px"}
 }
 
 <!--b.css-->
-@import url("c.css");
+@import url("c.css");
 
 body {background-color: #333; color: #fff}
 
 @media screen and (min-width: 768px) and (max-width: 1024px)
 {
-   .example: after {content: "b.css : width: 768px ~ 1024px"}
+   .example: after {content: "b.css : width: 768px ~ 1024px"}
 }
 
 <!--c.css-->
@@ -194,11 +194,11 @@ body {background-color: tomato}
 
 @media screen and (min-width: 768px) and (max-width: 1024px)
 {
-   .example: after {content: "c.css : width: 768px ~ 1024px"}
+   .example: after {content: "c.css : width: 768px ~ 1024px"}
 }
 @media screen and (min-width: 1024px) and (max-width: 1280px)
 {
-   .example: after {content: "c.css : width: 1024px ~ 1280px"}
+   .example: after {content: "c.css : width: 1024px ~ 1280px"}
 }
    @@ -206,23 +206,23 @@ body {background-color: tomato}
    • If the viewport is 320 px:
        -
      • The a.css file is applied (based on content: "a.css : width: ~ 480px").
        • +
      • The a.css file is applied (based on content: "a.css : width: ~ 480px").
      • The c.css and b.css files are not imported.
        • -
      • CSS is applied instead of the HTML <head> (the a.css file has higher priority than content: "In HTML head").
        • +
      • CSS is applied instead of the HTML <head> (the a.css file has higher priority than content: "In HTML head").
    • If the viewport is 700 px: -

      • The a.css file is applied (based on content: "a.css : width: 480px ~ 768px").

        • +

        • The a.css file is applied (based on content: "a.css : width: 480px ~ 768px").

        • The c.css and b.css files are not imported.
      • If the viewport is 900 px:
        • The b.css file is imported.
          • -
        • c.css is applied (based on content: "c.css : width: 768px ~ 1024px").
          • +
        • c.css is applied (based on content: "c.css : width: 768px ~ 1024px").
        • The a.css file is not imported.
          • -
        • The b.css file is applied (based on content: "b.css : width: 768px ~ 1024px").
          • +
        • The b.css file is applied (based on content: "b.css : width: 768px ~ 1024px").
      - - + +

      Creating a Liquid Layout

      To enhance the user experience of your application, you must learn to define media queries to determine the styles to be used in the Web document. This example creates a simple Web document with a liquid layout that organically changes according to the device resolution to show the optimized layout on both portrait and landscape modes.

      @@ -231,41 +231,41 @@ body {background-color: tomato}
    • Define a page with title and content elements: 
       <header>
-   <h1>Media queries tutorial</h1>
-   <h1><img src="logo.png" alt="Tizen"></h1>
+   <h1>Media queries tutorial</h1>
+   <h1><img src="logo.png" alt="Tizen"></h1>
 </header>
-<div class="container">
-   <section class="contents">
-      <h2>Section Title</h2>
-      <p class="desc">
-         The quick brown fox jumps over a lazy dog.  The quick brown...
-      </p>
-   </section>
-   <aside>
-      Aside
-   </aside>
+<div class="container">
+   <section class="contents">
+      <h2>Section Title</h2>
+      <p class="desc">
+         The quick brown fox jumps over a lazy dog.  The quick brown...
+      </p>
+   </section>
+   <aside>
+      Aside
+   </aside>
 </div>
    • Define basic styles for the page, using a flexible box (in mobile or wearable applications) and multi-column (in mobile applications only) layout with 2 columns. (The following figure applies to mobile applications only.) 
       .container
 {
-   display: -webkit-flex;
+   display: -webkit-flex;
 }
 .container aside
 {
-   -webkit-flex: 1 0 20%;
+   -webkit-flex: 1 0 20%;
 }
 .contents
 {
-   -webkit-columns: 5em 3;
-   -webkit-column-rule: 1px solid #999;
-   -webkit-column-gap: 2em;
-   -webkit-flex: 1 1 auto;
+   -webkit-columns: 5em 3;
+   -webkit-column-rule: 1px solid #999;
+   -webkit-column-gap: 2em;
+   -webkit-flex: 1 1 auto;
 }
 .contents h2
 {
-   -webkit-column-span: all;
+   -webkit-column-span: all;
 }
      @@ -279,16 +279,16 @@ body {background-color: tomato} 
       @media all and (max-width: 480px) and (orientation: portrait)
 {
-   .contents {-webkit-columns: 1;}
+   .contents {-webkit-columns: 1;}
 }
 @media all and (min-width: 480px) and (max-width: 768px)
 {
-   .contents {-webkit-columns: 2;}
-   .container {display: -webkit-flex;}
+   .contents {-webkit-columns: 2;}
+   .container {display: -webkit-flex;}
 }

      With the above media query, the normal resolution has 2 columns (shown on the right in the figure), while in a smaller resolution in a portrait mode only 1 column is used (shown on the left). (The following figure applies to mobile applications only.)

      -

      Liquid layout example (in mobile applications only)

      +

      Liquid layout example (in mobile applications only)

    • If you need to define specific styles for a certain resolution range, simply add more media queries. However, too many conditions make the maintenance harder, so carefully consider what kind of resolution ranges you need. @@ -298,7 +298,7 @@ body {background-color: tomato} 

       <!--Portrait mode of a smart phone-->
 @media screen and (max-width: 480px)
-              and (orientation: portrait) {<!--Specific layout-->}
+              and (orientation: portrait) {<!--Specific layout-->}
 
 <!--Landscape mode of a smart phone and a small tablet-->
 @media screen and (min-width: 480px) and (max-width: 768px) {<!--Specific layout-->}
@@ -318,7 +318,7 @@ body {background-color: tomato}
 	
    • liquid_layout_2.html
      • 
 	
    • logo.png
      •
    - +
    • diff --git a/org.tizen.guides/html/web/w3c/ui/multi_mw.htm b/org.tizen.guides/html/web/w3c/ui/multi_mw.htm index 8a2d3cd..25c68f2 100644 --- a/org.tizen.guides/html/web/w3c/ui/multi_mw.htm +++ b/org.tizen.guides/html/web/w3c/ui/multi_mw.htm @@ -5,20 +5,20 @@ - + - CSS Multi-column Layout Module - + CSS Multi-column Layout Module + - + +

    CSS Multi-column Layout Module

    - +

    You can arrange the screen content into columns. Using the CSS column- properties, the content elements can flow between columns when the column height or number changes. You can use the properties alone to create a basic layout, or add JavaScript code to make the layout dynamic.

    This feature is supported in mobile applications only.

    - +

    You can manage the following column-related features:

    • Setting the column number and width
      • @@ -62,7 +62,7 @@ Note Up to Tizen 2.2, most CSS properties and values used in Tizen required the -webkit- prefix. To ensure future compatibility, these properties can now be used with or without the prefix.
    - +

    Setting the Column Number and Width

    When the layout is set to a constant number of columns using the column-count (or -webkit-column-count) property, the column width is set to fill the available horizontal space.

    @@ -71,14 +71,14 @@ 
     article
 {
-   column-count: 4;
-   -webkit-column-count: 4;
-   margin: 10px;
+   column-count: 4;
+   -webkit-column-count: 4;
+   margin: 10px;
 }
    -

    Figure: 4 columns on different resolution displays

    -

    4 columns on different resolution displays

    +

    Figure: 4 columns on different resolution displays

    +

    4 columns on different resolution displays

    The column-width (or -webkit-column-width) property sets the base column width.

    In the following code snippet and figure, the column width is set to 153 px, but the effective column width is 288 px for a 480 x 800 display (shown on the left) and 154 px for a 720 x 1280 display (shown on the right). The parameter sets the column to at least the defined width, but not wider than the available display space or twice the defined width. The actual column width is calculated using a pseudo-algorithm.

    @@ -87,18 +87,18 @@ article 
     article
 {
-   width: 90vw;
-   height: 90vh;
-   column-width: 153px;
-   -webkit-column-width: 153px;
-   margin: 5vw;
-   background: #c3c8ca;
-   overflow: scroll;
+   width: 90vw;
+   height: 90vh;
+   column-width: 153px;
+   -webkit-column-width: 153px;
+   margin: 5vw;
+   background: #c3c8ca;
+   overflow: scroll;
 }
    -

    Figure: Column width 153 px on different resolution displays

    -

    Column width 153 px on different resolution displays

    +

    Figure: Column width 153 px on different resolution displays

    +

    Column width 153 px on different resolution displays

    Setting the Column Gap

    The column-gap (or -webkit-column-gap) property sets the distance between columns. The property affects the column width, as the column width, gap, and margins all take available space. In the following code snippet and figure, the column gap is set to 17 px.

    @@ -106,18 +106,18 @@ article 
     article
 {
-   height: 303px;
-   column-width: 153px;
-   -webkit-column-width: 153px;
-   column-gap: 17px;
-   -webkit-column-gap: 17px;
-   margin: 7px;
-   padding: 3px;
-   background: #c3c8ca;
+   height: 303px;
+   column-width: 153px;
+   -webkit-column-width: 153px;
+   column-gap: 17px;
+   -webkit-column-gap: 17px;
+   margin: 7px;
+   padding: 3px;
+   background: #c3c8ca;
 }
    -

    Figure: Column gap

    +

    Figure: Column gap

    Column gap

    Setting the Column Rule

    @@ -129,13 +129,13 @@ article 
     article
 {
-   -webkit-column-rule-width: 5px;
-   -webkit-column-rule-color: rgb(92, 203, 246);
-   -webkit-column-rule-style: solid;
+   -webkit-column-rule-width: 5px;
+   -webkit-column-rule-color: rgb(92, 203, 246);
+   -webkit-column-rule-style: solid;
 }
    -

    Figure: Column rule

    +

    Figure: Column rule

    Column rule

    @@ -156,12 +156,12 @@ article 
     article.left header
 {
-   column-span: all;
-   -webkit-column-span: all;
+   column-span: all;
+   -webkit-column-span: all;
 }
    -

    Figure: Column span

    +

    Figure: Column span

    Column span

    Setting the Column Break

    @@ -172,12 +172,12 @@ article.left header 
     article.lower section
 {
-   break-before: always;
-   -webkit-column-break-before: always;
+   break-before: always;
+   -webkit-column-break-before: always;
 }
    -

    Figure: Column break

    +

    Figure: Column break

    Column break

    Creating a Basic Layout

    @@ -189,32 +189,32 @@ article.lower section

    Create the HTML layout, defining separate sections for the column content and including an image file:

     <body>
-   <article id="article">
-      <section>
-         <header>
-            <h1>Section 1</h1>
-         </header>
-         <p>Lorem ipsum dolor (...), id.</p>
-         <img src="images/pinwheel_green.png" alt="">
-         <p>Maecenas at (...)tortor.</p>
-      </section>
-      <section>
-         <header>
-            <h1>Section 2</h1>
-         </header>
-         <img src="images/Tizen_Pinwheel_Secondary_Confetti.png" alt="">
-         <p>Nullam bibendum (...) Curabitur.</p>
-         <img src="images/Tizen_WhiteFold_4.png" alt="">
-      </section>
-      <section>
-         <header>
-            <h1>Section 3</h1>
-         </header>
-         <p>Sed sagittis, (...) Vivamus sed est sit amet.</p>
-         <img id="figure" src="images/pinwheel_yellow.png" alt="">
-         <p>Pellentesque habitant (...). Duis lobortis, nibh.</p>
-      </section>
-   </article>
+   <article id="article">
+      <section>
+         <header>
+            <h1>Section 1</h1>
+         </header>
+         <p>Lorem ipsum dolor (...), id.</p>
+         <img src="images/pinwheel_green.png" alt="">
+         <p>Maecenas at (...)tortor.</p>
+      </section>
+      <section>
+         <header>
+            <h1>Section 2</h1>
+         </header>
+         <img src="images/Tizen_Pinwheel_Secondary_Confetti.png" alt="">
+         <p>Nullam bibendum (...) Curabitur.</p>
+         <img src="images/Tizen_WhiteFold_4.png" alt="">
+      </section>
+      <section>
+         <header>
+            <h1>Section 3</h1>
+         </header>
+         <p>Sed sagittis, (...) Vivamus sed est sit amet.</p>
+         <img id="figure" src="images/pinwheel_yellow.png" alt="">
+         <p>Pellentesque habitant (...). Duis lobortis, nibh.</p>
+      </section>
+   </article>
 </body>
    @@ -226,13 +226,13 @@ article.lower section 
     article
 {
-   width: 80vw;
-   column-width: 119px;
-   -webkit-column-width: 119px;
+   width: 80vw;
+   column-width: 119px;
+   -webkit-column-width: 119px;
 
-   margin: 2vh 5vw;
-   padding: 2vh 5vw;
-   background: #c3c8ca;
+   margin: 2vh 5vw;
+   padding: 2vh 5vw;
+   background: #c3c8ca;

    The column-width property defines the default column width but the visible width is not always similar. An algorithm calculates the width according to available space. Normally, a column has a different display width from the one set in the property because as the columns are sized to fill all available space.

    @@ -241,8 +241,8 @@ article

  • Use the column-gap (or -webkit-column-gap) property to set the distance between columns:

    -   column-gap: 10px;
-   -webkit-column-gap: 10px;
+   column-gap: 10px;
+   -webkit-column-gap: 10px;
  • @@ -250,12 +250,12 @@ article

    Use the column-rule (or -webkit-column-rule) property to draw a vertical line between columns. Define the width, color, and style of the rule:

    -   -webkit-column-rule-width: 1px;
-   -webkit-column-rule-color: #677784;
-   -webkit-column-rule-style: solid;
-   column-rule-width: 1px;
-   column-rule-color: #677784;
-   column-rule-style: solid;
+   -webkit-column-rule-width: 1px;
+   -webkit-column-rule-color: #677784;
+   -webkit-column-rule-style: solid;
+   column-rule-width: 1px;
+   column-rule-color: #677784;
+   column-rule-style: solid;
 }
    @@ -265,18 +265,18 @@ article

    The following figure shows the layout with the column-rule width set to 40 px and the column-gap set to 10 px.

    -

    Figure: Column settings

    +

    Figure: Column settings

    Column settings

  • -

    Define the footer element with the display height set to 5/100 and padding set to 2 * 2vh:

    +

    Define the footer element with the display height set to 5/100 and padding set to 2 * 2vh:

     footer
 {
-   padding: 2vh;
-   height: 5vh;
-   background: rgba(103, 119, 132, 0.2);
+   padding: 2vh;
+   height: 5vh;
+   background: rgba(103, 119, 132, 0.2);
 }
    • @@ -286,9 +286,9 @@ footer 
     article>section
 {
-   border-bottom: 1px solid #d8d9d4;
-   padding: 4px 0;
-   text-align: center;
+   border-bottom: 1px solid #d8d9d4;
+   padding: 4px 0;
+   text-align: center;
 }
    @@ -299,24 +299,24 @@ article>section 
     img
 {
-   display: block;
-   margin: 4px auto;
+   display: block;
+   margin: 4px auto;
 }
 
 #figure
 {
-   float: right;	
-   margin: 4px;
+   float: right;
+   margin: 4px;
 }

    The following figures illustrate the created layout in different display sizes and orientations.

    -

    Figure: Basic layout on a 480 x 800 display

    +

    Figure: Basic layout on a 480 x 800 display

    Basic layout on a 480 x 800 display

    -

    Figure: Basic layout on a 720 x 1280 display

    +

    Figure: Basic layout on a 720 x 1280 display

    Basic layout on a 720 x 1280 display

    Source Code

    @@ -329,23 +329,23 @@ img
  • Tizen_Pinwheel_Secondary_Confetti.png
  • Tizen_WhiteFold_4.png
    • - +

    Creating a Layout with Dynamic Content

    - +

    To enhance the user experience of your application by providing a consistent behavior across a wide range of displays with different resolution and orientation, you must learn to create a layout displaying a varying amount of content using CSS:

    1. Create the HTML layout. The article element displays the columns, and the nav element contains buttons to add and remove content in the columns.

       <body>
-   <article id="article">
-   </article>
-   <nav>
-      <a id="addSections" href="#">Add images</a>
-      <input type="number" id="howMany" value="3"/>
-      <a id="removeGroup" href="#">Remove last Group</a>
-   </nav>
-   <footer> Multicolumn Layout Tutorial 02</footer>
+   <article id="article">
+   </article>
+   <nav>
+      <a id="addSections" href="#">Add images</a>
+      <input type="number" id="howMany" value="3"/>
+      <a id="removeGroup" href="#">Remove last Group</a>
+   </nav>
+   <footer> Multicolumn Layout Tutorial 02</footer>
 </body>
      2. @@ -356,11 +356,11 @@ img 
       body
 {
-   display: flex;
-   display: -webkit-flex;
-   flex-direction: column;
-   -webkit-flex-direction: column;
-   background: #fefffa;
+   display: flex;
+   display: -webkit-flex;
+   flex-direction: column;
+   -webkit-flex-direction: column;
+   background: #fefffa;
 }
      @@ -370,22 +370,22 @@ body 
       nav
 {
-   height: 20vh;
-   padding-left: 20%;
-   padding-top: 10px;
-   display: flex;
-   display: -webkit-flex;
-   flex-flow: row wrap;
-   -webkit-flex-flow: row wrap;
-   flex: none;
-   -webkit-flex: none;
-   justify-content: space-around;
-   -webkit-justify-content: space-around;
-   align-items: center;
-   -webkit-align-items: center;
-   background: url(../images/white_logo.png) no-repeat;
-   background-position: 2%;
-   background-size: auto 70%;
+   height: 20vh;
+   padding-left: 20%;
+   padding-top: 10px;
+   display: flex;
+   display: -webkit-flex;
+   flex-flow: row wrap;
+   -webkit-flex-flow: row wrap;
+   flex: none;
+   -webkit-flex: none;
+   justify-content: space-around;
+   -webkit-justify-content: space-around;
+   align-items: center;
+   -webkit-align-items: center;
+   background: url(../images/white_logo.png) no-repeat;
+   background-position: 2%;
+   background-size: auto 70%;
 }
      @@ -394,12 +394,12 @@ nav 
       nav a
 {
-   margin: 3px;
-   border-radius: 5px;
-   padding: 5px 15px;
-   background: rgba(103, 119, 132, 0.2);
-   text-align: center;
-   font-weight: bold;
+   margin: 3px;
+   border-radius: 5px;
+   padding: 5px 15px;
+   background: rgba(103, 119, 132, 0.2);
+   text-align: center;
+   font-weight: bold;
 }

      When the user taps the Add images button, the images and their descriptions are displayed.

      @@ -409,8 +409,8 @@ nav a 
       nav input
 {
-   width: 50px;
-   height: 2em;
+   width: 50px;
+   height: 2em;
 }
      @@ -419,12 +419,12 @@ nav input 
       article
 {
-   width: 90vw;
-   column-width: 136px;
-   -webkit-column-width: 136px;
-   margin: 1vh 2vh;
-   padding: 1vh;
-   background: #c3c8ca;
+   width: 90vw;
+   column-width: 136px;
+   -webkit-column-width: 136px;
+   margin: 1vh 2vh;
+   padding: 1vh;
+   background: #c3c8ca;
 }
      @@ -433,8 +433,8 @@ article 
       article img
 {
-   margin: 0 auto;
-   display: block;
+   margin: 0 auto;
+   display: block;
 }
      @@ -443,12 +443,12 @@ article img 
       article>h1
 {
-   background: rgba(103, 119, 132, 0.5);
-   padding: 4px;
-   text-align: center;
-   color: #eed484;
-   column-span: all;
-   -webkit-column-span: all;
+   background: rgba(103, 119, 132, 0.5);
+   padding: 4px;
+   text-align: center;
+   color: #eed484;
+   column-span: all;
+   -webkit-column-span: all;
 }

      As a result, the h1 elements are spread across the columns. When the column-span property is used, you cannot have more columns than can fit in the available horizontal space.

      @@ -458,11 +458,11 @@ article>h1 
       article>section
 {
-   break-inside: avoid;
-   -webkit-column-break-inside: avoid;
-   border-bottom: 1px solid #d8d9d4;
-   padding: 4px 0;
-   text-align: center;
+   break-inside: avoid;
+   -webkit-column-break-inside: avoid;
+   border-bottom: 1px solid #d8d9d4;
+   padding: 4px 0;
+   text-align: center;
 }
      @@ -471,9 +471,9 @@ article>section 
       footer
 {
-   padding: 2vh;
-   height: 5vh;
-   background: rgba(103, 119, 132, 0.2);
+   padding: 2vh;
+   height: 5vh;
+   background: rgba(103, 119, 132, 0.2);
 }
      @@ -485,10 +485,10 @@ footer

      Declare a variable for the images. Elements included in the variable amount to data displayed in a column layout, such as a newsfeed:

       var images =
-   ["images/pinwheel_green.png",
-    "images/Tizen_Pinwheel_Secondary_Confetti.png",
-    "images/Tizen_WhiteFold_4.png",
-    "images/pinwheel_yellow.png"];
+   ["images/pinwheel_green.png",
+    "images/Tizen_Pinwheel_Secondary_Confetti.png",
+    "images/Tizen_WhiteFold_4.png",
+    "images/pinwheel_yellow.png"];
    2. @@ -503,22 +503,22 @@ var howManyInput; 
       window.onload = function()
 {
-   addGroup(4);
-   howManyInput = document.getElementById('howMany');
-   var addBtn = document.getElementById('addSections');
-   addBtn.onclick = function()
-   {
-      addGroup(howManyInput.value);
-
-      return false;
-   };
-   var removeBtn = document.getElementById('removeGroup');
-   removeBtn.onclick = function()
-   {
-      removeGroup();
-
-      return false;
-   };
+   addGroup(4);
+   howManyInput = document.getElementById('howMany');
+   var addBtn = document.getElementById('addSections');
+   addBtn.onclick = function()
+   {
+      addGroup(howManyInput.value);
+
+      return false;
+   };
+   var removeBtn = document.getElementById('removeGroup');
+   removeBtn.onclick = function()
+   {
+      removeGroup();
+
+      return false;
+   };
 };
      3. @@ -529,18 +529,18 @@ window.onload = function() 
       function addGroup(howMany)
 {
-   var h1No = document.querySelectorAll('article>h1').length + 1;
-   var newHTML = "<h1>Group " + h1No + "</h1>";
-   var i;
-
-   for (i = 0; i < howMany; ++i)
-   {
-      newHTML += "<section><img alt='' src='";
-      newHTML += images[Math.floor(Math.random() * 4)];
-      newHTML += "'>Lorem ipsum dolor sit amet diam sodales rutrum.</section>";
-   }
-   var art = document.getElementById("article");
-   art.innerHTML += newHTML;
+   var h1No = document.querySelectorAll('article>h1').length + 1;
+   var newHTML = "<h1>Group " + h1No + "</h1>";
+   var i;
+
+   for (i = 0; i < howMany; ++i)
+   {
+      newHTML += "<section><img alt='' src='";
+      newHTML += images[Math.floor(Math.random() * 4)];
+      newHTML += "'>Lorem ipsum dolor sit amet diam sodales rutrum.</section>";
+   }
+   var art = document.getElementById("article");
+   art.innerHTML += newHTML;
 }
      @@ -549,14 +549,14 @@ function addGroup(howMany) 
       function removeGroup()
 {
-   var all = document.querySelectorAll('article>h1');
-   var last = all.length - 1;
-   if (last < 0)
-   {
-      return;
-   }
-   removeNextSibling(all[last].nextSibling);
-   all[last].parentElement.removeChild(all[last]);
+   var all = document.querySelectorAll('article>h1');
+   var last = all.length - 1;
+   if (last < 0)
+   {
+      return;
+   }
+   removeNextSibling(all[last].nextSibling);
+   all[last].parentElement.removeChild(all[last]);
 }
      @@ -564,10 +564,10 @@ function removeGroup()

    The following figures illustrate the created layout in different display sizes and orientations.

    -

    Figure: Dynamic layout on a 480 x 800 display

    +

    Figure: Dynamic layout on a 480 x 800 display

    Dynamic layout on a 480 x 800 display

    -

    Figure: Dynamic layout on a 720 x 1280 display

    +

    Figure: Dynamic layout on a 720 x 1280 display

    Dynamic layout on a 720 x 1280 display

    Source Code

    For the complete source code related to this use case, see the following files:

    @@ -581,8 +581,8 @@ function removeGroup()
  • Tizen_WhiteFold_4.png
  • white_logo.png
    • - - + +
    diff --git a/org.tizen.guides/html/web/w3c/ui/multiple_screens_mw.htm b/org.tizen.guides/html/web/w3c/ui/multiple_screens_mw.htm index 9488da1..4a1f5b4 100644 --- a/org.tizen.guides/html/web/w3c/ui/multiple_screens_mw.htm +++ b/org.tizen.guides/html/web/w3c/ui/multiple_screens_mw.htm @@ -36,7 +36,7 @@

    Multiple Screen Support

    - +

    Tizen is available in various devices which support different screen sizes and resolutions. When developing Tizen Web applications, you must take this into account if you want your application to function well in various device models.

    This feature is supported in mobile applications only.

    @@ -66,17 +66,17 @@
  • Determine the CSS layout to be used based on the screen width.

    • UI Scalability

    -

    With UI scalability, you can support multiple screen resolutions in a single Tizen Web application. Tizen automatically converts and translates the size and position values that are defined in the application's logical resolution to the physical resolution at runtime. The Tizen Advanced UI (TAU) uses the viewport meta tag to fit the Web page into the device screen, and the rem unit to determine the size of the Tizen Web UI components.

    +

    With UI scalability, you can support multiple screen resolutions in a single Tizen Web application. Tizen automatically converts and translates the size and position values that are defined in the application's logical resolution to the physical resolution at runtime. The Tizen Advanced UI (TAU) uses the viewport meta tag to fit the Web page into the device screen, and the rem unit to determine the size of the Tizen Web UI components.

    Setting the Viewport

    Tizen devices support a variety of screen resolutions and dots per inch (DPI) values. If the viewport meta tag is not defined, TAU uses the default viewport width and scale factor. This ensures that Web content layout varies between different screen resolutions.

    In the following example, the viewport width is set to device-width, which is determined by the width of the Tizen device. The device-width value is retrieved to set similar virtual DPI values and to display UI components with similar physical sizes across all devices. (TAU uses the example value by default, if no other viewport value is defined.)

    -<meta name="viewport"
-      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+<meta name="viewport"
+      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

    If the viewport width is set to device-width, the width and scale factor values are calculated by the Web browser. The following table shows different layout sizes and scale factors of the Tizen Web site (http://tizen.org) on different devices with the viewport width set to device-width.

    -<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    Table: Layout size and scale factor

    @@ -121,49 +121,49 @@

    Configuring the Viewport

    To use UI scalability in your application, set the viewport meta tag while creating a Web application project in the Tizen Studio. To configure the viewport in the Tizen Web applications, add the viewport meta tag in the <head> section of the index.html file:

    -<meta name="viewport"
-      content="width=device-width, initial-scale=1.0,
-               minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+<meta name="viewport"
+      content="width=device-width, initial-scale=1.0,
+               minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

    Optimizing Resources

    By default, the Tizen Advanced UI (TAU) consists of the HD Web winsets. The winset scale is lowered for lower screen resolution devices. To optimize resources for different screen resolutions and devices, use the CSS media query for different resolutions available in Tizen. You can use CSS media queries in the HTML or CSS files.

    In the HTML file:

    -<link media="only screen and (min-resolution: 320dpi)"
-      href="high-quality-images.css" type= "text/css" rel="stylesheet">
+<link media="only screen and (min-resolution: 320dpi)"
+      href="high-quality-images.css" type= "text/css" rel="stylesheet">

    In the CSS file:

     @media screen and (max-resolution: 159dpi)
 {
-   <!--Set styles-->
+   <!--Set styles-->
 }
 
 @media screen and (min-resolution: 160dpi and max-resolution: 239dpi)
 {
-   <!--Set styles-->
+   <!--Set styles-->
 }
 
 @media screen and (min-resolution: 240dpi and max-resolution: 319dpi)
 {
-   <!--Set styles-->
+   <!--Set styles-->
 }
 
 @media screen and (min-resolution: 320dpi)
 {
-   <!--Set styles-->
+   <!--Set styles-->
 }

    You can also set different layout and resources for the portrait and landscape views in the CSS file:

     @media screen and (orientation: portrait)
 {
-   <!--Set styles-->
+   <!--Set styles-->
 }
 
 @media screen and (orientation: landscape)
 {
-   <!--Set styles-->
+   <!--Set styles-->
 }

    Creating Screen Resolution-independent UI

    @@ -190,15 +190,15 @@

    An image can be added to an application using the HTML img tag, or CSS background property as shown in the following example:

     <!--HTML-->
-<img src="images/sample.jpg" alt="sample image"/>
+<img src="images/sample.jpg" alt="sample image"/>
 
 <!--CSS-->
 .photo
 {
-   background: url(../images/sample.jpg) 0 0 no-repeat;
-   background-size: 100%;
-   width: 100%;
-   height: 200px;
+   background: url(../images/sample.jpg) 0 0 no-repeat;
+   background-size: 100%;
+   width: 100%;
+   height: 200px;
 }

    In terms of performance, there is no difference between the options.

    @@ -209,7 +209,7 @@ 
     img
 {
-   max-width: 100%;
+   max-width: 100%;
 }
    @@ -220,18 +220,18 @@ img 
     .prev_icon, .next_icon
 {
-   padding-left: 30px;
-   height: 30px;
-   line-height: 30px;
-   font-size: 1.2em;
-   background-repeat: no-repeat;
-   background-position: 0 50%;
-   background-size: auto 20px;
+   padding-left: 30px;
+   height: 30px;
+   line-height: 30px;
+   font-size: 1.2em;
+   background-repeat: no-repeat;
+   background-position: 0 50%;
+   background-size: auto 20px;
 }
 
 .prev_icon.icon1
 {
-   background-image: url(../images/page_navi_arrow_left_01.png);
+   background-image: url(../images/page_navi_arrow_left_01.png);
 }
    @@ -245,18 +245,18 @@ img 
     .prev_icon, .next_icon
 {
-   background-size: 20px auto; <!--Full HD Display-->
-   background-image: url(../images/page_navi_arrow.png);
+   background-size: 20px auto; <!--Full HD Display-->
+   background-image: url(../images/page_navi_arrow.png);
 }
 
 .prev_icon.icon1
 {
-   background-position: 0 0;
+   background-position: 0 0;
 }
 
 .prev_icon.icon2
 {
-   background-position: 0 -50px;
+   background-position: 0 -50px;
 }

    Figure: Network speed when using sprite images

    @@ -308,12 +308,12 @@ Network: Used until the animation is stopped.

    The following example shows how JavaScript animation can be implemented:

     <script>
-   var obj = document.querySelector(".animated img"), flag = 0;
-   function animate()
-   {
-      obj.src = './images/sprite_' + ((flag++) % 10) + '.png';
-   };
-   setInterval(animate, 100);
+   var obj = document.querySelector(".animated img"), flag = 0;
+   function animate()
+   {
+      obj.src = './images/sprite_' + ((flag++) % 10) + '.png';
+   };
+   setInterval(animate, 100);
 </script>
    @@ -321,14 +321,14 @@ Network: Used until the animation is stopped. 
     <script>
-   var obj = document.querySelector(".animated img"), flag = 0, i = 0;
-   function animate()
-   {
-      if (!(i % 6)) obj.src = './images/sprite_' + ((flag++) % 10) + '.png';
-         i++;
-      -webkit-RequestAnimationFrame(animate);
-   };
-   -webkit-RequestAnimationFrame(animate);
+   var obj = document.querySelector(".animated img"), flag = 0, i = 0;
+   function animate()
+   {
+      if (!(i % 6)) obj.src = './images/sprite_' + ((flag++) % 10) + '.png';
+         i++;
+      -webkit-RequestAnimationFrame(animate);
+   };
+   -webkit-RequestAnimationFrame(animate);
 </script>
    @@ -350,19 +350,19 @@ Network: 9 ~ 21 ms

    The following example shows how CSS3 animation can be implemented:

     <style>
-   .css_animation
-   {
-      width: 50px;
-      height: 70px;
-      background-image: url(../images/sprite.png);
-      -webkit-animation: cssAni .8s steps(10) infinite;
-   }
-
-   @-webkit-keyframes cssAni
-   {
-      from {background-position: 0px;}
-      to {background-position: -500px;}
-   }
+   .css_animation
+   {
+      width: 50px;
+      height: 70px;
+      background-image: url(../images/sprite.png);
+      -webkit-animation: cssAni .8s steps(10) infinite;
+   }
+
+   @-webkit-keyframes cssAni
+   {
+      from {background-position: 0px;}
+      to {background-position: -500px;}
+   }
 </style>
    diff --git a/org.tizen.guides/html/web/w3c/ui/selector_w.htm b/org.tizen.guides/html/web/w3c/ui/selector_w.htm index c3f8d51..7ab9165 100644 --- a/org.tizen.guides/html/web/w3c/ui/selector_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/selector_w.htm @@ -66,90 +66,90 @@
  • To select the first matching element found in the child nodes, use the querySelector() method with CSS selectors. You get the same result as when using the getElementById(), getElementsByTagName(), and getElementsByClassName() methods. 
     /* First <td> element in the document */
-var obj1 = document.getElementsByTagName('td')[0];
+var obj1 = document.getElementsByTagName('td')[0];
 /* Element with the ID #foo */
-var obj2 = document.getElementById('foo');
+var obj2 = document.getElementById('foo');
 /* First element in the bar class */
-var obj3 = document.getElementsByClassName('bar')[0];
+var obj3 = document.getElementsByClassName('bar')[0];
 
-var obj4 = document.querySelector('td'); /* Same as obj1 */
-var obj5 = document.querySelector('#foo'); /* Same as obj2 */ 
-var obj6 = document.querySelector('.bar'); /* Same as obj3 */
+var obj4 = document.querySelector('td'); /* Same as obj1 */
+var obj5 = document.querySelector('#foo'); /* Same as obj2 */
+var obj6 = document.querySelector('.bar'); /* Same as obj3 */

    The querySelector() method returns the first matching element node within the subtrees of the context node. If no matching element is found, the method returns null.

  • You can use the CSS selectors to ensure that elements with complex structures can be easily selected.

    For example, the following example selects the last element among the child nodes of the second <tr> element, which is a child of the <tbody> element in the second <table> element of the document.

     var obj =
-   document.querySelector('table:nth-child(2) tbody > tr:nth-child(2) :last-child');
+   document.querySelector('table:nth-child(2) tbody > tr:nth-child(2) :last-child');
  • You can use method chaining to select an element: 
    -var obj = document.querySelector('table:nth-child(2)');
-var targetObj = obj.querySelector('tbody > tr:nth-child(2) :last-child');
+var obj = document.querySelector('table:nth-child(2)');
+var targetObj = obj.querySelector('tbody > tr:nth-child(2) :last-child');
    • -

    Figure: Single node selection (in mobile applications only)

    -

    Single node selection (in mobile applications only)

    +

    Figure: Single node selection (in mobile applications only)

    +

    Single node selection (in mobile applications only)

    Source Code

    For the complete source code related to this use case, see the following file:

    - +

    Selecting Multiple Nodes

    To enhance the user experience of your application, you must learn to use selectors to handle page elements, and to select multiple nodes in a node list:

    1. Select an element in the node list using the querySelector() method: 
      -var obj = document.querySelector('table:nth-child(2)');
+var obj = document.querySelector('table:nth-child(2)');

      The querySelector() method returns the first matching element node within the subtrees of the context node. If no matching element is found, the method returns null. The query above selects the second <table> element in the document as a single element.

    2. Select multiple elements in the node list using the querySelectorAll() method, and define a variable to represent the length of the targetObj node list: 
      -var targetObj = obj.querySelectorAll('thead th, tbody td');
+var targetObj = obj.querySelectorAll('thead th, tbody td');
 var i = targetObj.length;

      The querySelectorAll() method returns an array containing all of the matching element nodes within the subtrees of the context node, in the document order, and saves the elements in a node list. If there are no matching nodes, the method returns an empty array. The query above selects the <th> elements in the table head and the <td> elements in the table body.

      -
      3. +
    3. Apply a defined style to all elements stored in the targetObj node list: 
       while (0 < i)
 {
-   i--;
-   targetObj[i].style.backgroundColor = 'orange';
-   targetObj[i].textContent = 'Exam 3' + i;
+   i--;
+   targetObj[i].style.backgroundColor = 'orange';
+   targetObj[i].textContent = 'Exam 3' + i;
 }
    -

    Figure: Multiple node selection (in mobile applications only)

    +

    Figure: Multiple node selection (in mobile applications only)

    Multiple node selection (in mobile applications only)

    Source Code

    For the complete source code related to this use case, see the following file:

    - +

    Creating an Accordion Menu

    - +

    To enhance the user experience of your application, you must learn to retrieve element nodes from the DOM tree to create a simple accordion menu.

    The accordion menu is created using the CSS3 Basic User Interface Module Level 3 API (in mobile or wearable applications). When a title is touched, the relevant content is shown, and other content is hidden.

      -
    1. Create the HTML layout: +
    2. Create the HTML layout: 
      -<ul class="accordion">
-   <li>
-      <p class="title current">Title 1<p>
-      <div>contents 1</div>
-   </li>
-   <li>
-      <p class="title">Title 2</p>
-      <div>contents 2</div>
-   </li>
-   <!--Other list elements-->
+<ul class="accordion">
+   <li>
+      <p class="title current">Title 1<p>
+      <div>contents 1</div>
+   </li>
+   <li>
+      <p class="title">Title 2</p>
+      <div>contents 2</div>
+   </li>
+   <!--Other list elements-->
 </ul>
      3. @@ -157,66 +157,66 @@ while (0 < i) 
       .accordion  > li  > div
 {
-   padding: 0 15px;
-
-   <!--Assign time for CSS transformation-->
-   -webkit-transition: all .5s;
-   opacity: 0;
-   height: 0;
-   box-shadow: inset 1px 1px 4px rgba(0, 0, 0, .5);
-   line-height: 2;
+   padding: 0 15px;
+
+   <!--Assign time for CSS transformation-->
+   -webkit-transition: all .5s;
+   opacity: 0;
+   height: 0;
+   box-shadow: inset 1px 1px 4px rgba(0, 0, 0, .5);
+   line-height: 2;
 }
 <!--Assign styles to be applied in case the current class is added to p.title-->
 .accordion  > li  > p.current
 {
-   background: -webkit-linear-gradient(top, #666, #000);
-   color: #fff;
+   background: -webkit-linear-gradient(top, #666, #000);
+   color: #fff;
 }
 .accordion > li > p.current + div
 {
-   opacity: 1;
-   height: 200px;
+   opacity: 1;
+   height: 200px;
 }
    3. Use the querySelector() and querySelectorAll() methods to change the class of the subject in the elements where the event is fired: 
       var testAccordion = function(obj)
 {
-   var targetObj = document.querySelector(obj);
-   var targetLength = document.querySelectorAll(obj + 'li').length;
-
-   /* In case the elements are not selected */
-   if (targetLength <= 0)
-      return false;
-
-   targetObj.onclick = function(e)
-   {
-      var that = e.target;
-
-      /* In case the e.target class is not title */
-      if ((that.className !== 'title'))
-         return false;
-
-      for (var i = 0; i < targetLength; i++)
-      {
-         /*
-            Change all classes of the 'li p' elements
-            at the bottom of .accordion to title
-         */
-         targetObj.querySelectorAll('li p')[i].className = 'title';
-      }
-      /* Define the e.target class as current */
-      that.className += 'current';
-   }
+   var targetObj = document.querySelector(obj);
+   var targetLength = document.querySelectorAll(obj + 'li').length;
+
+   /* In case the elements are not selected */
+   if (targetLength <= 0)
+      return false;
+
+   targetObj.onclick = function(e)
+   {
+      var that = e.target;
+
+      /* In case the e.target class is not title */
+      if ((that.className !== 'title'))
+         return false;
+
+      for (var i = 0; i < targetLength; i++)
+      {
+         /*
+            Change all classes of the 'li p' elements
+            at the bottom of .accordion to title
+         */
+         targetObj.querySelectorAll('li p')[i].className = 'title';
+      }
+      /* Define the e.target class as current */
+      that.className += 'current';
+   }
 }
    4. Define the elements that use the accordion menu: 
      -testAccordion('.accordion');
+testAccordion('.accordion');
    -

    Figure: Accordion menu (in mobile applications only)

    +

    Figure: Accordion menu (in mobile applications only)

    Accordion menu (in mobile applications only)

    Source Code

    For the complete source code related to this use case, see the following file:

    diff --git a/org.tizen.guides/html/web/w3c/ui/session_history_w.htm b/org.tizen.guides/html/web/w3c/ui/session_history_w.htm index ce978c5..1068c75 100644 --- a/org.tizen.guides/html/web/w3c/ui/session_history_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/session_history_w.htm @@ -42,11 +42,11 @@

    HTML5 Session History

    - -

    You can manage the session history of browsing contexts. The history interface is used to save in the session history the page information that has been read by the user. You can also use the state object to directly store the page information which has already been analyzed in the URL, or general information which is not stored in the URL (such as location, or the scroll state of the page or a certain DOM element).

    - + +

    You can manage the session history of browsing contexts. The history interface is used to save in the session history the page information that has been read by the user. You can also use the state object to directly store the page information which has already been analyzed in the URL, or general information which is not stored in the URL (such as location, or the scroll state of the page or a certain DOM element).

    +

    This feature is supported in mobile and wearable applications only.

    - +

    The main features of the HTML5 session history of browsing contexts API include:

    • Adding entries to the session history @@ -59,14 +59,14 @@ references the information stored with the pushState() or rep

    Managing Session History Entries

    - -

    Learning how to manage the session history enhances the user browsing experience in your application:

    + +

    Learning how to manage the session history enhances the user browsing experience in your application:

    1. To add an entry to the session history, use the pushState() method of the history interface: 
       <script>
-   history.pushState({index: currentIndex}, document.title);
+   history.pushState({index: currentIndex}, document.title);
 </script>
      @@ -79,8 +79,8 @@ references the information stored with the pushState() or rep
    2. To update the entry details, use the replaceState() method: 
       <script>
-   history.replaceState({index: currentIndex}, document.title,
-                        '#page' + currentIndex);
+   history.replaceState({index: currentIndex}, document.title,
+                        '#page' + currentIndex);
 </script>

      The replaceState() method uses the same parameters as the pushState() method. The history_sample.html is the url parameter, which refers to the address of the page that is to be changed.

      @@ -90,37 +90,37 @@ references the information stored with the pushState() or rep
      1. Implement a page with the Prev and Next buttons: 
        -<nav class="paging">
-   <a href="#">Prev</a>
-   <a href="#">Next</a>
+<nav class="paging">
+   <a href="#">Prev</a>
+   <a href="#">Next</a>
 </nav>
 <p>Current Index: <output> </output></p>
 
-<a href="http://tizen.org/">Tizen.org</a>
+<a href="http://tizen.org/">Tizen.org</a>
      2. When the user clicks the buttons, the current index value (representing page numbers) is changed and stored in the state object of the history interface: 
         var currentIndex = 0;
-var prev = document.querySelector('.paging > a:nth-child(1)');
-var next = document.querySelector('.paging > a:nth-child(2)');
+var prev = document.querySelector('.paging > a:nth-child(1)');
+var next = document.querySelector('.paging > a:nth-child(2)');
 
 /* Prev button click event */
 prev.onclick = function()
 {
-   currentIndex -= 1;
-   setState(currentIndex);
+   currentIndex -= 1;
+   setState(currentIndex);
 
-   return false;
+   return false;
 };
 
 /* Next button click event */
 next.onclick = function()
 {
-   currentIndex += 1;
-   setState(currentIndex);
+   currentIndex += 1;
+   setState(currentIndex);
 
-   return false;
+   return false;
 };
        3. @@ -129,16 +129,16 @@ next.onclick = function() 
         function setState(currentIndex)
 {
-   if (history.state)
-   {
-      history.replaceState({index: currentIndex}, document.title,
-                           '#page' + currentIndex);
-   }
-   else
-   {
-      history.pushState({index: currentIndex}, document.title);
-   }
-   output.textContent = currentIndex;
+   if (history.state)
+   {
+      history.replaceState({index: currentIndex}, document.title,
+                           '#page' + currentIndex);
+   }
+   else
+   {
+      history.pushState({index: currentIndex}, document.title);
+   }
+   output.textContent = currentIndex;
 }
        @@ -152,24 +152,24 @@ function setState(currentIndex)

        Detecting Session History Changes

        - -

        Learning how to track session history changes enhances the user browsing experience in your application:

        - + +

        Learning how to track session history changes enhances the user browsing experience in your application:

        +
        1. A page with data stored in the session history fires a popstate event when the page is loaded (for example, because it is refreshed or moved to from the previous page).

          Register the event listener:

          -window.addEventListener("popstate", foo, false);
+window.addEventListener("popstate", foo, false);
        2. Define the event handler for the event. You can use the data stored in the state object to retrieve the correct location on the page to be loaded. 
          -var output = document.querySelector('output');
+var output = document.querySelector('output');
 
 window.onpopstate = function()
 {
-   currentIndex = history.state.index;
-   output.textContent = currentIndex;
+   currentIndex = history.state.index;
+   output.textContent = currentIndex;
 }

          In the snippet above, when a popstate event is fired, it saves the index value stored in the state object to the currentIndex variable, and outputs the <output> element from the correct index location. @@ -180,7 +180,7 @@ window.onpopstate = function()

          For the complete source code related to this use case, see the following file:

          + diff --git a/org.tizen.guides/html/web/w3c/ui/text_module_w.htm b/org.tizen.guides/html/web/w3c/ui/text_module_w.htm index ffae5be..3acd94a 100644 --- a/org.tizen.guides/html/web/w3c/ui/text_module_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/text_module_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - +

          Mobile Web Wearable Web

          - +

          Dependencies

          -
          +

    CSS Text Module (Level 3)

    @@ -50,10 +50,10 @@
  • Text properties

    You can use CSS text properties, such as text-transform, text-align, text-indent, letter-spacing, and word-spacing, to manipulate and transform text.

    • - +

    Manipulating Text

    - +

    To enhance the user experience of your application, you must learn to handle line breaking, justification, alignment, white space handling, and text transformations using CSS text properties:

      @@ -61,20 +61,20 @@ 
       <head>
-   <style>
-      p:nth-child(1) {text-transform: none;}
-      p:nth-child(2) {text-transform: capitalize;}
-      p:nth-child(3) {text-transform: uppercase;}
-      p:nth-child(4) {text-transform: lowercase;}
-      p:nth-child(5) {text-transform: full-width;}
-   </style>
+   <style>
+      p:nth-child(1) {text-transform: none;}
+      p:nth-child(2) {text-transform: capitalize;}
+      p:nth-child(3) {text-transform: uppercase;}
+      p:nth-child(4) {text-transform: lowercase;}
+      p:nth-child(5) {text-transform: full-width;}
+   </style>
 </head>
 <body>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
 </body>
      @@ -84,14 +84,14 @@ 
       <head>
-   <style>
-      p:nth-child(1) {text-align: start;}
-      p:nth-child(2) {text-align: end;}
-      p:nth-child(3) {text-align: left;}
-      p:nth-child(4) {text-align: right;}
-      p:nth-child(5) {text-align: center;}
-      p:nth-child(6) {text-align: justify;}
-   </style>
+   <style>
+      p:nth-child(1) {text-align: start;}
+      p:nth-child(2) {text-align: end;}
+      p:nth-child(3) {text-align: left;}
+      p:nth-child(4) {text-align: right;}
+      p:nth-child(5) {text-align: center;}
+      p:nth-child(6) {text-align: justify;}
+   </style>
 </head>
      @@ -101,13 +101,13 @@ 
       <head>
-   <style>
-      p:nth-child(1) {text-indent: 0}
-      p:nth-child(2) {text-indent: 1em}
-      p:nth-child(3) {text-indent: -1em}
-      p:nth-child(4) {text-indent: 5%}
-      p:nth-child(5) {text-indent: -5%}
-   </style>
+   <style>
+      p:nth-child(1) {text-indent: 0}
+      p:nth-child(2) {text-indent: 1em}
+      p:nth-child(3) {text-indent: -1em}
+      p:nth-child(4) {text-indent: 5%}
+      p:nth-child(5) {text-indent: -5%}
+   </style>
 </head>
      @@ -116,10 +116,10 @@
    1. Define the letter-spacing property, which controls the letter spacing: 
       <head>
-   <style>
-      p:nth-child(1) {letter-spacing: .5em}
-      p:nth-child(2) {letter-spacing: -.1em}
-   </style>
+   <style>
+      p:nth-child(1) {letter-spacing: .5em}
+      p:nth-child(2) {letter-spacing: -.1em}
+   </style>
 </head>
      @@ -128,10 +128,10 @@
    2. Define the word-spacing property, which controls the space between words: 
       <head>
-   <style>
-      p:nth-child(1) {word-spacing: 1em}
-      p:nth-child(2) {word-spacing: -.1em}
-   </style>
+   <style>
+      p:nth-child(1) {word-spacing: 1em}
+      p:nth-child(2) {word-spacing: -.1em}
+   </style>
 </head>
      @@ -140,11 +140,11 @@
    3. Define the word-break property, which determines the line breaking rules for non-CJK (Chinese, Japanese, and Korean) scripts: 
       <head>
-   <style>
-      p:nth-child(1) {word-break: normal}
-      p:nth-child(2) {word-break: keep-all}
-      p:nth-child(3) {word-break: break-all}
-   </style>
+   <style>
+      p:nth-child(1) {word-break: normal}
+      p:nth-child(2) {word-break: keep-all}
+      p:nth-child(3) {word-break: break-all}
+   </style>
 </head>
      @@ -153,25 +153,25 @@
    4. Define the white-space property, which determines the handling of empty space within an element: 
       <head>
-   <style>
-      p:nth-child(1) {white-space: normal}
-      p:nth-child(2) {white-space: pre}
-      p:nth-child(3) {white-space: nowrap}
-      p:nth-child(4) {white-space: pre-wrap}
-      p:nth-child(5) {white-space: pre-line}
-   </style>
+   <style>
+      p:nth-child(1) {white-space: normal}
+      p:nth-child(2) {white-space: pre}
+      p:nth-child(3) {white-space: nowrap}
+      p:nth-child(4) {white-space: pre-wrap}
+      p:nth-child(5) {white-space: pre-line}
+   </style>
 </head>
 <body>
-   <p>The quick brown fox jumps
-   over a lazy dog.</p>
-   <p>The quick brown fox jumps
-   over a lazy dog.</p>
-   <p>The quick brown fox jumps
-   over a lazy dog.</p>
-   <p>The quick brown fox jumps
-   over a lazy dog.</p>
-   <p>The quick brown fox jumps
-   over a lazy dog.</p>
+   <p>The quick brown fox jumps
+   over a lazy dog.</p>
+   <p>The quick brown fox jumps
+   over a lazy dog.</p>
+   <p>The quick brown fox jumps
+   over a lazy dog.</p>
+   <p>The quick brown fox jumps
+   over a lazy dog.</p>
+   <p>The quick brown fox jumps
+   over a lazy dog.</p>
 </body>
 </html>
      @@ -181,12 +181,12 @@
    5. Define the text-shadow property, which adds a shadow effect to text: 
       <head>
-   <style>
-      p:nth-child(1) {text-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, .7)}
-      p:nth-child(2) {text-shadow: -0.2em 0.2em 0.2em #000, 0.2em -0.2em 0.2em #f00}
-      p:nth-child(3) {color: #fff; text-shadow: 0 0 .7em #000;}
-      p:nth-child(4) {color: #fff; text-shadow: 0 0 1px #f00;}
-   </style>
+   <style>
+      p:nth-child(1) {text-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, .7)}
+      p:nth-child(2) {text-shadow: -0.2em 0.2em 0.2em #000, 0.2em -0.2em 0.2em #f00}
+      p:nth-child(3) {color: #fff; text-shadow: 0 0 .7em #000;}
+      p:nth-child(4) {color: #fff; text-shadow: 0 0 1px #f00;}
+   </style>
 </head>
      @@ -195,18 +195,18 @@
    6. Define the word-wrap and overflow-wrap properties, which control forced line breaks when the length of a word is longer than the area where it is displayed: 
       <head>
-   <style>
-      p:nth-child(1) {word-wrap: normal}
-      p:nth-child(2) {word-wrap: break-word}
-      p:nth-child(3) {overflow-wrap: normal}
-      p:nth-child(4) {overflow-wrap: break-word}
-   </style>
+   <style>
+      p:nth-child(1) {word-wrap: normal}
+      p:nth-child(2) {word-wrap: break-word}
+      p:nth-child(3) {overflow-wrap: normal}
+      p:nth-child(4) {overflow-wrap: break-word}
+   </style>
 </head>
 <body>
-   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
-   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
-   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
-   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
+   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
+   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
+   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
+   <p>The quick brown foxxxxxxxxxxxxxxxxxxxxxxxx jumps over a lazy dog.</p>
 </body>
      diff --git a/org.tizen.guides/html/web/w3c/ui/transform_w.htm b/org.tizen.guides/html/web/w3c/ui/transform_w.htm index 479c468..951ff09 100644 --- a/org.tizen.guides/html/web/w3c/ui/transform_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/transform_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - + +

    CSS Transforms

    @@ -51,7 +51,7 @@

    Transforms allow you to modify the coordinate space where each element is positioned. The elements can be translated, rotated, and scaled in 2- or 3-dimensional space. According to the API, the coordinate system is a visual formatting model, and positions and sizes in the coordinate space are expressed in pixels, starting in the origin of point with positive values proceeding to the right and down.

    This feature is supported in mobile and wearable applications only.

    - +

    The main features of the CSS Transforms API include:

      @@ -92,44 +92,44 @@ 
       <head>
-   <style type="text/css">
-      .box
-      {
-         transform: rotate(30deg);
-         transform-origin: 30% 30%;
-         perspective: 220;
-         animation: trans-ani 10s infinite linear;
-         backface-visibility: visible;
-
-         /* Chrome and Safari browsers */
-         -webkit-transform: rotate(30deg);
-         -webkit-transform-origin: 30% 30%;
-         -webkit-perspective: 220;
-         -webkit-animation: trans-ani 10s infinite linear;
-         -webkit-backface-visibility: visible;
-      }
-      .box.case01
-      {
-         transform-style: preserve-3d;
-         perspective-origin: 30% 30%;
-
-         /* Chrome and Safari browsers */
-         -webkit-transform-style: preserve-3d;
-         -webkit-perspective-origin: 30% 30%;
-      }
-   </style>
+   <style type="text/css">
+      .box
+      {
+         transform: rotate(30deg);
+         transform-origin: 30% 30%;
+         perspective: 220;
+         animation: trans-ani 10s infinite linear;
+         backface-visibility: visible;
+
+         /* Chrome and Safari browsers */
+         -webkit-transform: rotate(30deg);
+         -webkit-transform-origin: 30% 30%;
+         -webkit-perspective: 220;
+         -webkit-animation: trans-ani 10s infinite linear;
+         -webkit-backface-visibility: visible;
+      }
+      .box.case01
+      {
+         transform-style: preserve-3d;
+         perspective-origin: 30% 30%;
+
+         /* Chrome and Safari browsers */
+         -webkit-transform-style: preserve-3d;
+         -webkit-perspective-origin: 30% 30%;
+      }
+   </style>
 </head>
 <body>
-   <h1>transform-origin</h1>
-   <div class="boxarea">
-      <div class="box">
-         <p>transform</p>
-         <p>transform-origin: 30% 30%;</p>
-      </div>
-      <div class="box case01">
-         <p>box</p>
-      </div>
-   </div>
+   <h1>transform-origin</h1>
+   <div class="boxarea">
+      <div class="box">
+         <p>transform</p>
+         <p>transform-origin: 30% 30%;</p>
+      </div>
+      <div class="box case01">
+         <p>box</p>
+      </div>
+   </div>
 </body>
      @@ -143,50 +143,50 @@ 
       <head>
-   <style type="text/css">
-      .box-translate
-      {
-         transform: translate(30px, 30px);
-         -webkit-transform: translate(30px, 30px);
-      }
-
-      .box-scale
-      {
-         transform: scale(1.2, 1.2);
-         -webkit-transform: scale(1.2, 1.2);
-      }
-
-      .box-rotate
-      {
-         transform: rotate(45deg);
-         -webkit-transform: rotate(45deg);
-      }
-
-      .box-skew
-      {
-         transform: skew(20deg, 20deg);
-         -webkit-transform: skew(20deg, 20deg);
-      }
-
-      .box-matrix
-      {
-         transform: matrix(0.8, 0.5, 0.9, 0.9, 0, 0);
-         -webkit-transform: matrix(0.8, 0.5, 0.9, 0.9, 0, 0);
-      }
-   </style>
+   <style type="text/css">
+      .box-translate
+      {
+         transform: translate(30px, 30px);
+         -webkit-transform: translate(30px, 30px);
+      }
+
+      .box-scale
+      {
+         transform: scale(1.2, 1.2);
+         -webkit-transform: scale(1.2, 1.2);
+      }
+
+      .box-rotate
+      {
+         transform: rotate(45deg);
+         -webkit-transform: rotate(45deg);
+      }
+
+      .box-skew
+      {
+         transform: skew(20deg, 20deg);
+         -webkit-transform: skew(20deg, 20deg);
+      }
+
+      .box-matrix
+      {
+         transform: matrix(0.8, 0.5, 0.9, 0.9, 0, 0);
+         -webkit-transform: matrix(0.8, 0.5, 0.9, 0.9, 0, 0);
+      }
+   </style>
 </head>
 <body>
-   <h1>2d transform</h1>
-   <h2>translate</h2>
-   <div class="boxarea">
-      <div class="box no-transform">
-         <p>Original</p>
-      </div>
-      <div class="box transformed box-translate">
-         <p>transform</p>
-         <p>transform: translate(30px, 30px);</p>
-      </div>
-   </div>
+   <h1>2d transform</h1>
+   <h2>translate</h2>
+   <div class="boxarea">
+      <div class="box no-transform">
+         <p>Original</p>
+      </div>
+      <div class="box transformed box-translate">
+         <p>transform</p>
+         <p>transform: translate(30px, 30px);</p>
+      </div>
+   </div>
 </body>
      @@ -195,81 +195,81 @@
    • If a transform method is used together with the perspective property, the z axis is emphasized.
    • The X, Y, and Z values of the translate3d(), scale3d(), and rotate3d() methods can be expressed in individual methods.
    • In the rotate3d(number, number, number, angle) method, the element rotates according to the assigned parameter (angle) with the X, Y, and Z directional vectors as the center. Each vector can be expressed as an individual method: for example, the rotateX(<angle>) and rotate3d(1, 0, 0, <angle>) methods perform the same task.
      • -
    +

    The following code snippet demonstrates how to implement a 3D transform. For a complete source code, see 3d_transform.html.

     <head>
-   <style type="text/css">
-      .first-transform {opacity: .5; background: #3399cc;}
-      .transformed {opacity: .8;}
-      /* translate3d */
-      .box-translate3d: hover .first-transform
-      {
-         transform: translate3d(-5px, -5px, -60px) rotateY(70deg);
-         -webkit-transform: translate3d(-5px, -5px, -60px) rotateY(70deg);
-      }
-      .box-translate3d: hover .transformed
-      {
-         transform: translate3d(15px, 15px, 60px) rotateY(70deg);
-         -webkit-transform: translate3d(15px, 15px, 60px) rotateY(70deg);
-      }
-      /* scale3d */
-      .box-scale3d: hover .first-transform
-      {
-         transform: scale3d(1, 1, 1) rotateY(70deg);
-         -webkit-transform: scale3d(1, 1, 1) rotateY(70deg);
-      }
-      .box-scale3d: hover .transformed
-      {
-         transform: scale3d(0.6, 0.6, 2) rotateY(70deg);
-         -webkit-transform: scale3d(0.6, 0.6, 2) rotateY(70deg);
-      }
-      /* rotate3d */
-      .box-rotate3d: hover .first-transform
-      {
-         transform: rotate3d(-1, -1, -1, 110deg);
-         -webkit-transform: rotate3d(-1, -1, -1, 110deg);
-      }
-      .box-rotate3d: hover .transformed
-      {
-         transform: rotate3d(1, 1, 1, 110deg);
-         -webkit-transform: rotate3d(1, 1, 1, 110deg);
-      }
-      /* matrix3d */
-      .box-matrix3d: hover .first-transform
-      {
-         transform: matrix3d(0.3, 0.2, -0.9, 0, 0.2, 0.8, 0.2, 0, 0.6, 0,
-                             0.4, 0, 0, 0, 0, 1);
-         -webkit-transform: matrix3d(0.3, 0.2, -0.9, 0, 0.2, 0.8, 0.2, 0, 0.6,
-                                     0, 0.4, 0, 0, 0, 0, 1);
-      }
-      .box-matrix3d: hover .transformed
-      {
-         transform: matrix3d(0.4, -0.5, 0.8, 0, 0.2, 0.8, 0.2, 0, -0.6, 0, 0.4,
-                             0, 0, 0, 0, 1);
-         -webkit-transform: matrix3d(0.4, -0.5, 0.8, 0, 0.2, 0.8, 0.2, 0, -0.6,
-                                     0, 0.4, 0, 0, 0, 0, 1);
-      }
-   </style>
+   <style type="text/css">
+      .first-transform {opacity: .5; background: #3399cc;}
+      .transformed {opacity: .8;}
+      /* translate3d */
+      .box-translate3d: hover .first-transform
+      {
+         transform: translate3d(-5px, -5px, -60px) rotateY(70deg);
+         -webkit-transform: translate3d(-5px, -5px, -60px) rotateY(70deg);
+      }
+      .box-translate3d: hover .transformed
+      {
+         transform: translate3d(15px, 15px, 60px) rotateY(70deg);
+         -webkit-transform: translate3d(15px, 15px, 60px) rotateY(70deg);
+      }
+      /* scale3d */
+      .box-scale3d: hover .first-transform
+      {
+         transform: scale3d(1, 1, 1) rotateY(70deg);
+         -webkit-transform: scale3d(1, 1, 1) rotateY(70deg);
+      }
+      .box-scale3d: hover .transformed
+      {
+         transform: scale3d(0.6, 0.6, 2) rotateY(70deg);
+         -webkit-transform: scale3d(0.6, 0.6, 2) rotateY(70deg);
+      }
+      /* rotate3d */
+      .box-rotate3d: hover .first-transform
+      {
+         transform: rotate3d(-1, -1, -1, 110deg);
+         -webkit-transform: rotate3d(-1, -1, -1, 110deg);
+      }
+      .box-rotate3d: hover .transformed
+      {
+         transform: rotate3d(1, 1, 1, 110deg);
+         -webkit-transform: rotate3d(1, 1, 1, 110deg);
+      }
+      /* matrix3d */
+      .box-matrix3d: hover .first-transform
+      {
+         transform: matrix3d(0.3, 0.2, -0.9, 0, 0.2, 0.8, 0.2, 0, 0.6, 0,
+                             0.4, 0, 0, 0, 0, 1);
+         -webkit-transform: matrix3d(0.3, 0.2, -0.9, 0, 0.2, 0.8, 0.2, 0, 0.6,
+                                     0, 0.4, 0, 0, 0, 0, 1);
+      }
+      .box-matrix3d: hover .transformed
+      {
+         transform: matrix3d(0.4, -0.5, 0.8, 0, 0.2, 0.8, 0.2, 0, -0.6, 0, 0.4,
+                             0, 0, 0, 0, 1);
+         -webkit-transform: matrix3d(0.4, -0.5, 0.8, 0, 0.2, 0.8, 0.2, 0, -0.6,
+                                     0, 0.4, 0, 0, 0, 0, 1);
+      }
+   </style>
 </head>
 <body>
-   <h1>3D transform</h1>
-   <h2></h2>
-   <p><strong>First box value:</strong>
-      transform: translate3d(-5px, -5px, -60px) rotateY(70deg);
-   </p>
-   <p><strong>Second box value:</strong>
-      transform: translate3d(15px, 15px, 60px) rotateY(70deg);
-   </p>
-   <div class="boxarea box-translate3d">
-      <div class="box first-transform">
-         First box
-      </div>
-      <div class="box transformed">
-         <p>Second Box</p>
-         Mouse over or tab here to animate
-      </div>
-   </div>
+   <h1>3D transform</h1>
+   <h2></h2>
+   <p><strong>First box value:</strong>
+      transform: translate3d(-5px, -5px, -60px) rotateY(70deg);
+   </p>
+   <p><strong>Second box value:</strong>
+      transform: translate3d(15px, 15px, 60px) rotateY(70deg);
+   </p>
+   <div class="boxarea box-translate3d">
+      <div class="box first-transform">
+         First box
+      </div>
+      <div class="box transformed">
+         <p>Second Box</p>
+         Mouse over or tab here to animate
+      </div>
+   </div>
 </body>
    @@ -280,25 +280,25 @@
    • As in the original animation, no elements are initially shown on the screen.
      • -
    • The Tizen logo gradually appears in the middle of the screen, and as it moves to the right, it becomes smaller. With the transform property, the logo is made to rotate.
      • -
    • Each letter in the word "TIZEN" consecutively comes in from the left of the screen and moves to the right to its correct location. With the transform property, the letters are translated in the 3D space and rotated around the Y axis.
      • +
    • The Tizen logo gradually appears in the middle of the screen, and as it moves to the right, it becomes smaller. With the transform property, the logo is made to rotate.
      • +
    • Each letter in the word "TIZEN" consecutively comes in from the left of the screen and moves to the right to its correct location. With the transform property, the letters are translated in the 3D space and rotated around the Y axis.
    -

    Figure: Tizen logo to be transformed

    +

    Figure: Tizen logo to be transformed

    Tizen logo to be transformed

    1. Create the HTML layout to control the movement of each individual animation element: 
      -<div class="animation-holder">
-   <span class="tizen-txt t"></span>
-   <span class="tizen-txt i"></span>
-   <span class="tizen-txt z"></span>
-   <span class="tizen-txt e"></span>
-   <span class="tizen-txt n"></span>
-   <span class="tizen-txt tm"></span>
-   <span class="tizen-logo"></span>
+<div class="animation-holder">
+   <span class="tizen-txt t"></span>
+   <span class="tizen-txt i"></span>
+   <span class="tizen-txt z"></span>
+   <span class="tizen-txt e"></span>
+   <span class="tizen-txt n"></span>
+   <span class="tizen-txt tm"></span>
+   <span class="tizen-logo"></span>
 </div>
      2. @@ -306,78 +306,78 @@ 
       .animation-holder
 {
-   -webkit-perspective: 1000px;
-   height: 88px;
-   left: 50%;
-   margin: -54px 0px 0px -140px;
-   position: absolute;
-   top: 50%;
-   width: 280px;
+   -webkit-perspective: 1000px;
+   height: 88px;
+   left: 50%;
+   margin: -54px 0px 0px -140px;
+   position: absolute;
+   top: 50%;
+   width: 280px;
 }
 .tizen-txt,
 .tizen-logo
 {
-   background-position: 50% 50%;
-   background-repeat: no-repeat;
-   display: block;
-   position: absolute;
+   background-position: 50% 50%;
+   background-repeat: no-repeat;
+   display: block;
+   position: absolute;
 }
 .tizen-txt.t
 {
-   background-image: url("images/txt_t.png");
-   height: 56px;
-   left: 0px;
-   top: 31px;
-   width: 48px;
+   background-image: url("images/txt_t.png");
+   height: 56px;
+   left: 0px;
+   top: 31px;
+   width: 48px;
 }
    2. Create the animation:
      1. -

        Assign keyframes for the logo element to transform it. In order to rotate the logo, use the -webkit-transform: rotate() method, which defines the angle of the rotation. +

        Assign keyframes for the logo element to transform it. In order to rotate the logo, use the -webkit-transform: rotate() method, which defines the angle of the rotation. 

         @-webkit-keyframes tizen-logo
 {
-   0%
-   {
-      -webkit-animation-timing-function: ease-in;
-      height: 211px;
-      left: 30px;
-      opacity: 0;
-      top: -61px;
-      -webkit-transform: rotate(0deg);
-      width: 220px;
-   }
-   30%
-   {
-      -webkit-animation-timing-function: ease-out;
-      height: 211px;
-      left: 30px;
-      opacity: 1;
-      top: -61px;
-      -webkit-transform: rotate(720deg);
-      width: 220px;
-   }
-   50%
-   {
-      height: 32px;
-      left: 247px;
-      opacity: 1;
-      top: 0;
-      -webkit-transform: rotate(1440deg);
-      width: 33px;
-   }
-   100%
-   {
-      height: 32px;
-      left: 247px;
-      opacity: 1;
-      top: 0;
-      -webkit-transform: rotate(1440deg);
-      width: 33px;
-   }
+   0%
+   {
+      -webkit-animation-timing-function: ease-in;
+      height: 211px;
+      left: 30px;
+      opacity: 0;
+      top: -61px;
+      -webkit-transform: rotate(0deg);
+      width: 220px;
+   }
+   30%
+   {
+      -webkit-animation-timing-function: ease-out;
+      height: 211px;
+      left: 30px;
+      opacity: 1;
+      top: -61px;
+      -webkit-transform: rotate(720deg);
+      width: 220px;
+   }
+   50%
+   {
+      height: 32px;
+      left: 247px;
+      opacity: 1;
+      top: 0;
+      -webkit-transform: rotate(1440deg);
+      width: 33px;
+   }
+   100%
+   {
+      height: 32px;
+      left: 247px;
+      opacity: 1;
+      top: 0;
+      -webkit-transform: rotate(1440deg);
+      width: 33px;
+   }
 }
        @@ -386,36 +386,36 @@ For a rotation, the image has to be carefully created to ensure the correct end result. The rotation occurs with the center of the element as the center. If the rotation center must be moved because the image center is not aligned, use the transform-origin property to adjust the rotation location.
    -
  • Create the keyframes for the first letter in the word "TIZEN". In the animation, due to the translate3d() and rotateY() methods, each letter transforms slightly from the right to the left as it comes in. +
  • Create the keyframes for the first letter in the word "TIZEN". In the animation, due to the translate3d() and rotateY() methods, each letter transforms slightly from the right to the left as it comes in.

    Animation

     @-webkit-keyframes tizen-txt-t
 {
-   0%
-   {
-      opacity: 0;
-      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
-   }
-   30%
-   {
-      opacity: 0;
-      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
-   }
-   35%
-   {
-      opacity: 1;
-      -webkit-transform: translate3d(0, 0, 0) rotateY(0deg);
-   }
-   100% {}
+   0%
+   {
+      opacity: 0;
+      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
+   }
+   30%
+   {
+      opacity: 0;
+      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
+   }
+   35%
+   {
+      opacity: 1;
+      -webkit-transform: translate3d(0, 0, 0) rotateY(0deg);
+   }
+   100% {}
 }
  • To emphasize the fact that the letters are being created on the right, change the location of the transform. If the transform-origin property is declared for the entire animation element, the logo rotation changes. Consequently, you must only declared it for the letters. 
     .tizen-txt
 {
-   -webkit-transform-origin: 100% 50%;
+   -webkit-transform-origin: 100% 50%;
 }
    • @@ -423,22 +423,22 @@ 
     @-webkit-keyframes tizen-txt-i
 {
-   0%
-   {
-      opacity: 0;
-      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
-   }
-   32%
-   {
-      opacity: 0;
-      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
-   }
-   37%
-   {
-      opacity: 1;
-      -webkit-transform: translateX(0) rotateY(0deg);
-   }
-    100% {}
+   0%
+   {
+      opacity: 0;
+      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
+   }
+   32%
+   {
+      opacity: 0;
+      -webkit-transform: translate3d(20px, 0, -200px) rotateY(90deg);
+   }
+   37%
+   {
+      opacity: 1;
+      -webkit-transform: translateX(0) rotateY(0deg);
+   }
+    100% {}
 }
    @@ -446,7 +446,7 @@

    The following figure shows the full Tizen logo animation with the transform properties.

    -

    Figure: Full Tizen logo animation

    +

    Figure: Full Tizen logo animation

    Full Tizen logo animation

    Source Code

    @@ -461,25 +461,25 @@
  • txt_tm.png
  • txt_z.png
    • - +

    Creating Fade Animation Effects

    - - + +

    To enhance the user experience of your application, you must learn to use fade animation effects.

    The modal layer pop-up can be used to, for example, show enlarged thumbnail images or notice messages. The modal layer pop-up has the following basic properties:

    • If an event is fired, it gradually becomes visible. This is known as the Fade In effect.
      • -
    • The existing background is covered with a translucent layer to make the user focus on the pop-up.
      • +
    • The existing background is covered with a translucent layer to make the user focus on the pop-up.
    • When the pop-up is closed, it gradually becomes transparent. This is known as the Fade Out effect.
    -

    Figure: Fade effect

    +

    Figure: Fade effect

    Fade effect

    You can control UI events and change the DOM elements in the following ways:

    • Events can be controlled with JavaScript, and DOM elements can be devised with CSS.
      • -
    • You can use JavaScript frameworks, such as jQuery, Prototype, and Dojo.
      • +
    • You can use JavaScript frameworks, such as jQuery, Prototype, and Dojo.

    To create fade effects:

    @@ -490,47 +490,47 @@ 
     (function($)
 {
-   function showModalPopup(url)
-   {
-      $('body').append('<div class="mask"></div>'); /* Mask in body appended */
-      $('.mask').css({'height': $(window).height()}); /* Mask area set */
-
-      /* Target layer position set */
-      $(url).css(
-      {
-         'top': ($(window).height()/2 + $(document).scrollTop()
-                 - $(url).height()/2) + 'px',
-         'left': ($(window).width()/2 + $(document).scrollLeft()
-                  - $(url).width()/2) + 'px'
-      });
-
-      /* Fade effect */
-      $('.mask').fadeTo('slow', 0.7);
-      $(url).fadeTo('slow', 1);
-   };
-
-   $('.layerpopupActive a').on('click', function()
-      {
-         var targetUrl = $(this).attr('href');
-
-         showModalPopup(targetUrl);
-
-         return false;
-      });
-
-   /* End processing - Fade Out effect */
-
-   $('body').on('click', function(e)
-      {
-         if (e.target.className === 'mask')
-         {
-            $('.layerpop').fadeOut();
-            $('.mask').fadeOut(400, function()
-               {
-                  $('.mask').remove();
-               });
-         };
-      });
+   function showModalPopup(url)
+   {
+      $('body').append('<div class="mask"></div>'); /* Mask in body appended */
+      $('.mask').css({'height': $(window).height()}); /* Mask area set */
+
+      /* Target layer position set */
+      $(url).css(
+      {
+         'top': ($(window).height()/2 + $(document).scrollTop()
+                 - $(url).height()/2) + 'px',
+         'left': ($(window).width()/2 + $(document).scrollLeft()
+                  - $(url).width()/2) + 'px'
+      });
+
+      /* Fade effect */
+      $('.mask').fadeTo('slow', 0.7);
+      $(url).fadeTo('slow', 1);
+   };
+
+   $('.layerpopupActive a').on('click', function()
+      {
+         var targetUrl = $(this).attr('href');
+
+         showModalPopup(targetUrl);
+
+         return false;
+      });
+
+   /* End processing - Fade Out effect */
+
+   $('body').on('click', function(e)
+      {
+         if (e.target.className === 'mask')
+         {
+            $('.layerpop').fadeOut();
+            $('.mask').fadeOut(400, function()
+               {
+                  $('.mask').remove();
+               });
+         };
+      });
 })(jQuery);
    @@ -541,8 +541,8 @@
  • The layer is painted once again according to the change of value. This is a CPU operation.
    • -

    Steps a and c incur CPU tasks, which affect performance the most.

    -

    In case of step a, only 2 layers are created, but as the number of layers created increases, the efficiency of page rendering work drops. In case of step c as well, the more steps it undergoes, the slower the rendering becomes.

    +

    Steps a and c incur CPU tasks, which affect performance the most.

    +

    In case of step a, only 2 layers are created, but as the number of layers created increases, the efficiency of page rendering work drops. In case of step c as well, the more steps it undergoes, the slower the rendering becomes.

    In certain browsers, even if the style of just 1 layer is changed, the entire document is repainted. As the repainting takes only a moment, any animation effects that are supposed to happen cannot be executed in such a short time. This issue occurs frequently in Android™ with severe fragmentation.

    @@ -562,34 +562,34 @@ <!--CSS--> .mask { -   opacity: 0; -   z-index: -1; -   -webkit-transition: all 400ms ease-in-out; + opacity: 0; + z-index: -1; + -webkit-transition: all 400ms ease-in-out; } .mask.active { -   opacity: .7; -   z-index: 498; + opacity: .7; + z-index: 498; } <!--Layer pop-up public styles--> .layerpop { -   opacity: 0; -   z-index: -1; -   -webkit-transition: all 300ms ease-in-out; + opacity: 0; + z-index: -1; + -webkit-transition: all 300ms ease-in-out; } .layerpop.active { -   opacity: 1; -   z-index: 499; + opacity: 1; + z-index: 499; } /* JavaScript */ function showModalPopup(url) { -   url.className += 'active'; + url.className += 'active'; } @@ -598,17 +598,17 @@ function showModalPopup(url)

    There can be a difference in performance depending on how the modal layer pop-up is used.

    The following figures illustrate the difference in event performance, when using JavaScript and CSS3.

    -

    Figure: Event performance using JavaScript

    +

    Figure: Event performance using JavaScript

    Events using JavaScript

    -

    Figure: Event performance using CSS3

    +

    Figure: Event performance using CSS3

    Events using CSS3

    The following figures illustrate the difference in memory performance, when using JavaScript and CSS3.

    -

    Figure: Memory performance using JavaScript

    +

    Figure: Memory performance using JavaScript

    Memory when using JavaScript

    -

    Figure: Memory performance using CSS3

    +

    Figure: Memory performance using CSS3

    Memory when using CSS3

    When the styles are applied using JavaScript, the UI thread is used to create the pop-up. The UI thread increases the usage of CPU memory in proportion to the number of pop-ups used.

    @@ -624,15 +624,15 @@ function showModalPopup(url)

    Using Hardware Acceleration

    - +

    The rendering performance of a Web application depends on both the Tizen platform and application design.

    In hardware acceleration, GPU is used to perform a method faster than is possible if the application is running on the CPU. It enhances the rendering performance in the dynamic objects used in Web applications.

    - +

    Using CSS Transition and 3D Transform

    To improve the rendering performance, separate moving elements to independent layers as much as possible. You can use CSS transition with the -webkit-transition CSS attribute, or 3D transform with the -webkit-transform attribute. For the best performance, set the -webkit-transform attribute to the 3D type.

    In all the following examples, a blue box moves from top left to bottom right for a second.

    -

    Figure: Blue box

    -

    Blue box

    +

    Figure: Blue box

    +

    Blue box

    • Use CPU painting: @@ -641,79 +641,79 @@ function showModalPopup(url)
    • Construct the blue box and set its position on the screen: 
       <!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-   <head>
-      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-      <title>JavaScript transition sample</title>
-      <style>
-         #box
-         {
-            position: absolute;
-            width: 100px;
-            height: 100px;
-            background-color: blue;
-            left: 0px;
-            top: 50px;
-         }
-      </style>
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+      <title>JavaScript transition sample</title>
+      <style>
+         #box
+         {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            background-color: blue;
+            left: 0px;
+            top: 50px;
+         }
+      </style>

    • Perform CPU painting for a moving element at a rate of 1 frame per 16 ms (62.5 frames per second) using the setTimeout() method:

      -      <script>
-         var delta = 0;
-         function startTransition()
-         {
-            process();
-         }
-         function process()
-         {
-            document.getElementById('box').style.left = delta + "px";
-            document.getElementById('box').style.top = delta + 50 + "px";
-            delta += 4;
-            if (delta <= 200)
-               setTimeout(function() {process();}, 16);
-         }
-      </script>
-   </head>
-   <body>
-      <div id='box' onclick='startTransition()'>click me!</div>
-   </body>
+      <script>
+         var delta = 0;
+         function startTransition()
+         {
+            process();
+         }
+         function process()
+         {
+            document.getElementById('box').style.left = delta + "px";
+            document.getElementById('box').style.top = delta + 50 + "px";
+            delta += 4;
+            if (delta <= 200)
+               setTimeout(function() {process();}, 16);
+         }
+      </script>
+   </head>
+   <body>
+      <div id='box' onclick='startTransition()'>click me!</div>
+   </body>
 </html>
    • Use CSS transition:

      Separate a moving element to an independent layer with the -webkit-transition CSS attribute. This approach uses hardware acceleration, and can enhance performance while an element is moving.

       <!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-   <head>
-      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-      <title>-webkit-transition sample</title>
-      <style>
-         #box
-         {
-            position: absolute;
-            width: 100px;
-            height: 100px;
-            left: 0px;
-            top: 50px;
-            background-color: blue;
-            -webkit-transition-duration: 1s;
-            -webkit-transition-timing-function: linear;
-         }
-      </style>
-      <script>
-         function startTransition()
-         {
-            document.getElementById('box').style.webkitTransform =
-               "translate(200px, 200px)";
-         }
-      </script>
-   </head>
-   <body>
-      <div id='box' onclick='startTransition()'>click me!</div>
-   </body>
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+      <title>-webkit-transition sample</title>
+      <style>
+         #box
+         {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            left: 0px;
+            top: 50px;
+            background-color: blue;
+            -webkit-transition-duration: 1s;
+            -webkit-transition-timing-function: linear;
+         }
+      </style>
+      <script>
+         function startTransition()
+         {
+            document.getElementById('box').style.webkitTransform =
+               "translate(200px, 200px)";
+         }
+      </script>
+   </head>
+   <body>
+      <div id='box' onclick='startTransition()'>click me!</div>
+   </body>
 </html>
      • @@ -721,35 +721,35 @@ function showModalPopup(url)

      Use the -webkit-transform: translate3d 3D transform attribute. The element is separated to an independent layer and uses hardware acceleration irrespective of its movement:

       <!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-   <head>
-      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-      <title>-webkit-transition with translate3d sample</title>
-      <style>
-         #box
-         {
-            position: absolute;
-            width: 100px;
-            height: 100px;
-            left: 0px;
-            top: 50px;
-            background-color: blue;
-            -webkit-transform: translate3d(0, 0, 0);
-            -webkit-transition-duration: 1s;
-            -webkit-transition-timing-function: linear;
-         }
-      </style>
-      <script>
-         function startTransition()
-         {
-            document.getElementById('box').style.webkitTransform =
-               "translate3d(200px, 200px, 0px)";
-         }
-      </script>
-   </head>
-   <body>
-      <div id='box' onclick='startTransition()'>click me!<p></div>
-   </body>
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+      <title>-webkit-transition with translate3d sample</title>
+      <style>
+         #box
+         {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            left: 0px;
+            top: 50px;
+            background-color: blue;
+            -webkit-transform: translate3d(0, 0, 0);
+            -webkit-transition-duration: 1s;
+            -webkit-transition-timing-function: linear;
+         }
+      </style>
+      <script>
+         function startTransition()
+         {
+            document.getElementById('box').style.webkitTransform =
+               "translate3d(200px, 200px, 0px)";
+         }
+      </script>
+   </head>
+   <body>
+      <div id='box' onclick='startTransition()'>click me!<p></div>
+   </body>
 </html>
      @@ -759,11 +759,11 @@ function showModalPopup(url) 
       #scroll_area
 {
-   overflow: scroll;
-   -webkit-overflow-scrolling: touch;
+   overflow: scroll;
+   -webkit-overflow-scrolling: touch;
 }
      - + diff --git a/org.tizen.guides/html/web/w3c/ui/transition_w.htm b/org.tizen.guides/html/web/w3c/ui/transition_w.htm index 2a57d5a..730ba65 100644 --- a/org.tizen.guides/html/web/w3c/ui/transition_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/transition_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - +

      Mobile Web Wearable Web

      - + -
      +

    CSS Transitions Module (Level 3)

    @@ -57,11 +57,11 @@
  • Using hardware acceleration

    You can improve the rendering performance of the application by enabling hardware acceleration.

    • - +

    When using the CSS transition properties, the Tizen browser requires the -webkit- prefix.

    -

    Defining Transition Properties

    - +

    Defining Transition Properties

    +

    You can define various properties to control the element transitions:

      @@ -83,31 +83,31 @@ 
       <head>
-   <style type="text/css">
-      body{font-size: 12px}
-
-      .box
-      {
-         -webkit-transition-property: width;
-         -webkit-transition-duration: 2s;
-         -webkit-transition-timing-function: ease;
-         -webkit-transition-delay: 0.5s;
-      }
-
-      .box: hover
-      {
-         width: 300px;
-         height: 200px;
-         background: CornflowerBlue;
-      }
-   </style>
+   <style type="text/css">
+      body{font-size: 12px}
+
+      .box
+      {
+         -webkit-transition-property: width;
+         -webkit-transition-duration: 2s;
+         -webkit-transition-timing-function: ease;
+         -webkit-transition-delay: 0.5s;
+      }
+
+      .box: hover
+      {
+         width: 300px;
+         height: 200px;
+         background: CornflowerBlue;
+      }
+   </style>
 </head>
 <body>
-   <h1>CSS transitions tutorial</h1>
-   <div class="box">
-      <p>Mouse over or tap here to animate</p>
-      <p>transition-property: width, height, background</p>
-   </div>
+   <h1>CSS transitions tutorial</h1>
+   <div class="box">
+      <p>Mouse over or tap here to animate</p>
+      <p>transition-property: width, height, background</p>
+   </div>
 </body>
      @@ -119,11 +119,11 @@

      The transition property allows you to define all the transition properties in a shorthand mode in the order of transition-property | transition-duration | transition-timing-function | transition-delay. If you omit a property value, a default value is used instead.

      -<style type="text/css">
-   .box
-   {
-      -webkit-transition: width 1s ease 1s;
-   }
+<style type="text/css">
+   .box
+   {
+      -webkit-transition: width 1s ease 1s;
+   }
 </style>
      @@ -131,20 +131,20 @@

      Modifying Element Properties

      - -

      To enhance the user experience of your application, you must learn to use transitions to change element property values naturally. This example uses a partial section of the http://tizen.org Web site, where the current "UPCOMING EVENTS" area only has the text-decoration: underline property in a mouseover state (the text gets underlined when the mouse hovers over it). To improve the effects, the example adds various transitions properties in this area.

      +

      To enhance the user experience of your application, you must learn to use transitions to change element property values naturally. This example uses a partial section of the http://tizen.org Web site, where the current "UPCOMING EVENTS" area only has the text-decoration: underline property in a mouseover state (the text gets underlined when the mouse hovers over it). To improve the effects, the example adds various transitions properties in this area.

      -

      Figure: Tizen site section to be transitioned

      + +

      Figure: Tizen site section to be transitioned

      Tizen site section to be transitioned

      - -

      1. Add a background color change to the "UPCOMING EVENTS" area during a mouseover state:

        + +

        1. Add a background color change to the "UPCOMING EVENTS" area during a mouseover state:

          1. Originally, the area on the site is defined as follows:

            -<h2 class="block-title">Upcoming Events</h2>
+<h2 class="block-title">Upcoming Events</h2>
            @@ -153,7 +153,7 @@ 
             .block-title
 {
-   -webkit-transition: all 2s ease;
+   -webkit-transition: all 2s ease;
 }

            The all value in the transition property means that the transition effect applies to all CSS properties of the element.

            @@ -167,7 +167,7 @@

            Due to the CSS characteristics, adding a class through an event allows immediate rendering in the screen.

          -

          When the mouse is moved over the "UPCOMING EVENTS" area, the background color changes.

          +

          When the mouse is moved over the "UPCOMING EVENTS" area, the background color changes.

          Background color change

          2. @@ -180,7 +180,7 @@ 
           .location, .date, .location .anibg, h3 > a, .day > span
 {
-   -webkit-transition: all 1s ease;
+   -webkit-transition: all 1s ease;
 }
          @@ -201,19 +201,19 @@

        2. Add the empty element:

          -<div class="location">San Francisco, CA<span class="anibg"></span></div>
+<div class="location">San Francisco, CA<span class="anibg"></span></div>

        3. Create the effect using the width value of the added element:

           .location {position: relative; z-index: 3; margin-top: 3px;}
 .location .anibg
 {
-   position: absolute;
-   left: -3px; top: 0;
-   display: block;
-   width: 0; height: 100%;
-   background: #000;
-   z-index: -1;
+   position: absolute;
+   left: -3px; top: 0;
+   display: block;
+   width: 0; height: 100%;
+   background: #000;
+   z-index: -1;
 }
          @@ -222,7 +222,7 @@ 
           .location, .date, .location .anibg, h3 > a, .day > span
 {
-   -webkit-transition: all 1s ease;
+   -webkit-transition: all 1s ease;
 }
 
 .event-info: hover .location {color: #fff;}
@@ -238,18 +238,18 @@
  
          For the complete source code related to this use case, see the following file:
          
    
-		
+
    +

    Using Hardware Acceleration

    - +

    The rendering performance of a Web application depends on both the Tizen platform and application design.

    In hardware acceleration, GPU is used to perform a function faster than is possible if the application is running on the CPU. It enhances the rendering performance in the dynamic objects used in Web applications.

    - +

    Using CSS Transition and 3D Transform

    To improve the rendering performance, separate moving elements to independent layers as much as possible. You can use CSS transition with the -webkit-transition CSS attribute, or 3D transform with the -webkit-transform attribute. For the best performance, set the -webkit-transform attribute to the 3D type.

    In all the following examples, a blue box moves from top left to bottom right for a second.

    -

    Figure: Blue box

    -

    Blue box

    +

    Figure: Blue box

    +

    Blue box

    • Use CPU painting: @@ -258,79 +258,79 @@
    • Construct the blue box and set its position on the screen: 
       <!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-   <head>
-      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-      <title>JavaScript transition sample</title>
-      <style>
-         #box
-         {
-            position: absolute;
-            width: 100px;
-            height: 100px;
-            background-color: blue;
-            left: 0px;
-            top: 50px;
-         }
-      </style>
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+      <title>JavaScript transition sample</title>
+      <style>
+         #box
+         {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            background-color: blue;
+            left: 0px;
+            top: 50px;
+         }
+      </style>

    • Perform CPU painting for a moving element at a rate of 1 frame per 16 ms (62.5 frames per second) using the setTimeout() method:

      -      <script>
-         var delta = 0;
-         function startTransition()
-         {
-            process();
-         }
-         function process()
-         {
-            document.getElementById('box').style.left = delta + "px";
-            document.getElementById('box').style.top = delta + 50 + "px";
-            delta += 4;
-            if (delta <= 200)
-               setTimeout(function() {process();}, 16);
-         }
-      </script>
-   </head>
-   <body>
-      <div id='box' onclick='startTransition()'>click me!</div>
-   </body>
+      <script>
+         var delta = 0;
+         function startTransition()
+         {
+            process();
+         }
+         function process()
+         {
+            document.getElementById('box').style.left = delta + "px";
+            document.getElementById('box').style.top = delta + 50 + "px";
+            delta += 4;
+            if (delta <= 200)
+               setTimeout(function() {process();}, 16);
+         }
+      </script>
+   </head>
+   <body>
+      <div id='box' onclick='startTransition()'>click me!</div>
+   </body>
 </html>
    • Use CSS transition:

      Separate a moving element to an independent layer with the -webkit-transition CSS attribute. This approach uses hardware acceleration, and can enhance performance while an element is moving.

       <!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-   <head>
-      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-      <title>-webkit-transition sample</title>
-      <style>
-         #box
-         {
-            position: absolute;
-            width: 100px;
-            height: 100px;
-            left: 0px;
-            top: 50px;
-            background-color: blue;
-            -webkit-transition-duration: 1s;
-            -webkit-transition-timing-function: linear;
-         }
-      </style>
-      <script>
-         function startTransition()
-         {
-            document.getElementById('box').style.webkitTransform =
-               "translate(200px, 200px)";
-         }
-      </script>
-   </head>
-   <body>
-      <div id='box' onclick='startTransition()'>click me!</div>
-   </body>
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+      <title>-webkit-transition sample</title>
+      <style>
+         #box
+         {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            left: 0px;
+            top: 50px;
+            background-color: blue;
+            -webkit-transition-duration: 1s;
+            -webkit-transition-timing-function: linear;
+         }
+      </style>
+      <script>
+         function startTransition()
+         {
+            document.getElementById('box').style.webkitTransform =
+               "translate(200px, 200px)";
+         }
+      </script>
+   </head>
+   <body>
+      <div id='box' onclick='startTransition()'>click me!</div>
+   </body>
 </html>
      • @@ -338,35 +338,35 @@

      Use the -webkit-transform: translate3d 3D transform attribute. The element is separated to an independent layer and uses hardware acceleration irrespective of its movement:

       <!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-   <head>
-      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-      <title>-webkit-transition with translate3d sample</title>
-      <style>
-         #box
-         {
-            position: absolute;
-            width: 100px;
-            height: 100px;
-            left: 0px;
-            top: 50px;
-            background-color: blue;
-            -webkit-transform: translate3d(0, 0, 0);
-            -webkit-transition-duration: 1s;
-            -webkit-transition-timing-function: linear;
-         }
-      </style>
-      <script>
-         function startTransition()
-         {
-            document.getElementById('box').style.webkitTransform =
-               "translate3d(200px, 200px, 0px)";
-         }
-      </script>
-   </head>
-   <body>
-      <div id='box' onclick='startTransition()'>click me!<p></div>
-   </body>
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+      <title>-webkit-transition with translate3d sample</title>
+      <style>
+         #box
+         {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            left: 0px;
+            top: 50px;
+            background-color: blue;
+            -webkit-transform: translate3d(0, 0, 0);
+            -webkit-transition-duration: 1s;
+            -webkit-transition-timing-function: linear;
+         }
+      </style>
+      <script>
+         function startTransition()
+         {
+            document.getElementById('box').style.webkitTransform =
+               "translate3d(200px, 200px, 0px)";
+         }
+      </script>
+   </head>
+   <body>
+      <div id='box' onclick='startTransition()'>click me!<p></div>
+   </body>
 </html>
      @@ -376,8 +376,8 @@ 
       #scroll_area
 {
-   overflow: scroll;
-   -webkit-overflow-scrolling: touch;
+   overflow: scroll;
+   -webkit-overflow-scrolling: touch;
 }
      diff --git a/org.tizen.guides/html/web/w3c/ui/ui_guide_w.htm b/org.tizen.guides/html/web/w3c/ui/ui_guide_w.htm index fd24d7c..c2d62d8 100644 --- a/org.tizen.guides/html/web/w3c/ui/ui_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/ui_guide_w.htm @@ -5,15 +5,15 @@ - + - User Interface - + User Interface + - +
    -
    - +
    +
    -

    User Interface

    +

    User Interface

    The W3C specifications provide HTML and CSS, which are the core technologies for building Web pages and Web applications. With HTML, you can define the structure of the application screens, while CSS allows you to define the look and feel of the screens.

    @@ -43,19 +43,19 @@
    • -HTML features +HTML features

      HTML is the language for describing the structure of the Web pages.

      • HTML Priorities in mobile and wearable applications only

        Enables you to use CSS and JavaScript code effectively with HTML elements.

        • - +
      • HTML5 Forms in mobile and wearable applications only

        Enables you to easily implement Web forms for user input using HTML5 elements.

        • - +
      • Selectors API (Level 1 and 2) in mobile and wearable applications only -

        Enables you to select element nodes in the DOM tree by matching them against a group of selectors.

        • +

        Enables you to select element nodes in the DOM tree by matching them against a group of selectors.

      • Media Queries in mobile and wearable applications only

        Enables you to define media features for specific output devices using the CSS media queries.

        • @@ -68,13 +68,13 @@
      • Frame Flattening in mobile applications only

        Allows you to improve the scrollability of small screens.

        • - +
      • HTML5 Session History in mobile and wearable applications only -

        Enables you to manage the browsing history of a device.

        • +

        Enables you to manage the browsing history of a device.

      • Clipboard API and events in mobile applications only

        Enables you to copy content and paste it in an editable area.

        • - +
      • HTML5 Drag and Drop in mobile applications only

        Enables you to create and manage draggable elements and implement drag events.

      @@ -82,61 +82,61 @@
    • -CSS features +CSS features

      CSS is the language for describing the presentation of the Web pages, including colors, layout, and fonts.

      • CSS Transforms in mobile and wearable applications only

        Enables you to move, rotate, stretch, and scale elements using the CSS3 transform property.

        • - +
      • CSS Animations Module (Level 3) in mobile and wearable applications only

        Enables you to create animations using the CSS3 animation property.

        • - +
      • CSS Transitions Module (Level 3) in mobile and wearable applications only

        Enables you to add effects when changing the style of an element using the CSS3 transition property.

        • - +
      • CSS Color Module (Level 3) in mobile and wearable applications only

        Enables you to specify the color and opacity of HTML elements using CSS properties.

        • - +
      • CSS Backgrounds and Borders Module (Level 3) in mobile and wearable applications only

        Enables you to specify the border and background styles of HTML elements using CSS properties.

        • - +
      • CSS Flexible Box Layout Module in mobile and wearable applications only

        Enables you to create flexible layouts for Web applications.

        • - +
      • CSS Multi-column Layout Module in mobile applications only

        Enables you to create multi-column layouts for Web applications.

        • - +
      • CSS Text Module (Level 3) in mobile and wearable applications only -

        Enables you to apply various text effects.

        • - +

        Enables you to apply various text effects.

        +
      • CSS Basic User Interface Module (Level 3) in mobile and wearable applications only

        Enables you to apply styles to HTML documents.

        • - +
      • CSS Fonts Module (Level 3) in mobile and wearable applications only -

        Enables you to change the text fonts.

        • - +

        Enables you to change the text fonts.

        +
      • WOFF File Format (1.0) in mobile and wearable applications only -

        Enables you to encode and decode font data easily.

        • +

        Enables you to encode and decode font data easily.

    • -Designing for multiple screens +Designing for multiple screens

      Tizen supports various device types with several different screen sizes.

      To provide optimal user experiences, it is important to design your application to support different screen sizes. In addition to different devices, you must also consider system configuration changes, such as the default home screen layout and system fonts after OS upgrades, since they can change the size of the viewable content screen. Such changes affect the application layout, and can lead to an undesirable UI design layout. Use the following topics to design your application to be highly flexible and adaptive against these possibilities.

      • Multiple UI Layouts in wearable applications only

        Allows you to design your application layout so that your application can run on multiple Tizen devices.

        • - +
      • Multiple Screen Support in mobile applications only

        Allows you to create an application that is both scalable and adaptive to multiple screen resolutions.

      • CSS Fonts Module (Level 3) in mobile and wearable applications only

        Enables you to define the font-face and font-family, to avoid layout incompatibility due to the default system font changes after OS upgrades.

        • -
      +
    - +
    diff --git a/org.tizen.guides/html/web/w3c/ui/ui_layout_ww.htm b/org.tizen.guides/html/web/w3c/ui/ui_layout_ww.htm index 7764d0f..906a1fb 100644 --- a/org.tizen.guides/html/web/w3c/ui/ui_layout_ww.htm +++ b/org.tizen.guides/html/web/w3c/ui/ui_layout_ww.htm @@ -5,20 +5,20 @@ - + - Multiple UI Layouts - + Multiple UI Layouts + - +

    Wearable Web

    - +

    Dependencies

    -
    +

    Multiple UI Layouts

    - +

    To ensure the largest possible market for your application, you have to design your application layout so that your application can run on multiple Tizen devices.

    This feature is supported in wearable applications only.

    - -

    Although the Web was originally designed to structure documents for large-scaled Internet world, with CSS (Cascading Style Sheet), JavaScript, and various device APIs, it is quickly evolving to a complete runtime environment for applications. In addition, its W3C open development model and the flexibility of its CSS-based presentation make it every developer's choice as the next development platform. CSS is the key technology for flexible presentation, and it is used to describe the look and formatting of HTML documents. The role of CSS is to determine how the logical structure of the document is displayed to the user.

    + +

    Although the Web was originally designed to structure documents for large-scaled Internet world, with CSS (Cascading Style Sheet), JavaScript, and various device APIs, it is quickly evolving to a complete runtime environment for applications. In addition, its W3C open development model and the flexibility of its CSS-based presentation make it every developer's choice as the next development platform. CSS is the key technology for flexible presentation, and it is used to describe the look and formatting of HTML documents. The role of CSS is to determine how the logical structure of the document is displayed to the user.

    The Tizen Web engine provides the basic mechanisms for fitting the application content to the target screen. However, to ensure that the application runs well on multiple devices, you must understand those mechanisms in detail. In general, select a relative layout rather than a fixed layout, because a relative layout helps to maintain usability even when the application runs on unexpected devices. To enhance usability even further, use different layouts for each device category.

    @@ -47,37 +47,37 @@
    • You can use a single layout and take advantage of the auto-fitting mechanism of the Tizen Web engine to ensure that a single layout covers multiple devices.
    • You can use multiple layouts to define a separate optimal layout for each device category.
    -

    Single Layout for Multiple Devices

    +

    Single Layout for Multiple Devices

    A typical application developer designs an optimized UI for a target device with a fixed layout and high-quality resources. This approach usually results in a nice look for the end user, but can sometimes result in an ugly layout, which makes the application unusable. And this unfortunate result can occur merely due to a change in the device form factor.

    Since the presentation and business logic are strictly separated in a Web application, it handles the device form factor change better than native applications. One single layout, taking advantage of Web technology, can ensure usability even on multiple devices with different form factors.

    -

    To design applications with a single layout, you must consider the following issues:

    +

    To design applications with a single layout, you must consider the following issues:

    -
      -
    • Viewport and other meta tags
      • -
    • Relative layout
      • -
    • Header and footer position
      • + - +

      For a complete application layout that considers all the above issues, see Single Layout Example.

      - -

      Viewport and Other Meta Tags

      - + +

      Viewport and Other Meta Tags

      +

      The viewport is a screen area that the Web engine displays in the UI and, in the Web world, the viewport meta tag is used to inform the Web engine that this content is written for a specific form factor, such as device width. The viewport meta tag was introduced by Apple to fill the screen resolution gap between initial Smartphone (for example, 320 px) and PC (for example, 980 px). Basically, the viewport meta tag helps the Web engine to determine the scale factor for the content on the current device.

      To use the tag in an HTML file, set its name and content:

      -<meta name="viewport" content="XXX">
-
      +<meta name="viewport" content="XXX"> +

      As shown in the following code snippet, use the viewport meta tag to tell the Web engine which device width is targeted by the application. The Web engine can estimate the scale factor based on the target content size and the real screen width. For example, usually almost all wearable applications have the following viewport meta tag, which sets the viewport width to the appropriate size based on each device:

      -<meta name="viewport" content="width=device-width, user-scalable=no">
-
      +<meta name="viewport" content="width=device-width, user-scalable=no"> +

      If you want to set your content layout to the target width of 320 px on every wearable device, use the following meta tag:

      -<meta name="viewport" content="width=320">
+<meta name="viewport" content="width=320">

      The viewport meta tag has other properties, such as height, initial-scale, minimum-scale, maximum-scale, and user-scalable. However, do not use those properties unless you understand their exact meaning. Wrong values can cause the Web engine to incorrectly fit the application content to the current device.

      @@ -87,97 +87,97 @@

      The relative layout concept means that the element size of all content is set as a relative unit (such as percentage), and not as absolute values (such as pixels or points). In responsive Web design, this concept is also known as fluid grid (for more information, search for responsive web design in your Web browser). To achieve a layout that works on multiple devices, you only need to know about relative layout, not all the other concepts of responsive Web design.

      To implementing a relative layout, you only have to set the width and height of each element as a percentage, as shown in the following example and figure. In the example, the width and height of the number_pad element is set to 100% and 70%, not 320 px and 224 px.

      -

      Figure: 320x320 calculator

      +

      Figure: 320x320 calculator

      number_pad {width: 100%; height: 70%;}

      -

      320x320 calculator

      +

      320x320 calculator

      An application with this relative layout is auto-fitted when it runs on an unexpected device, such as the device with a 360x480 resolution shown in the following figure. Even though this adjusted layout may not be as good as the original, it is good enough, since it shows a usable application UI.

      - -

      Figure: 360x480 calculator with a relative layout

      -

      360x480 calculator with a relative layout

      + +

      Figure: 360x480 calculator with a relative layout

      +

      360x480 calculator with a relative layout

      The following figure shows what happens if you use an absolute 320x320 layout. The presentation is definitely ugly (with an empty white space at the bottom) and usability reduced, although the calculation logic itself still works.

      Figure: 360x480 calculator with an absolute 320x320 layout

      -

      number_pad {width: 320px; height: 224px;}

      - - -

      360x480 calculator with an absolute 320x320 layout

      +

      number_pad {width: 320px; height: 224px;}

      + + +

      360x480 calculator with an absolute 320x320 layout

      While the content layout itself becomes the application UI layout on a Web page, a typical wearable application layout consists of a header area, content area, and footer area. With this trend, many wearable Web applications are designed by separating the 3 areas explicitly.

      -

      Figure: Typical wearable Web application layout

      -

      Typical wearable Web application layout

      +

      Figure: Typical wearable Web application layout

      +

      Typical wearable Web application layout

      Not setting the place of the header and footer areas clearly can easily cause problems for your layout. In case of the header, the side-effect is relatively small. However, a wrongly defined footer area can be quite visible and lead to poor usability. The following figure shows the original layout of a pedometer application that consists of a header, content, and footer, with a Stop button set in the footer area.

      -

      Figure: 320x320 sample Web application

      -

      320x320 sample Web application

      +

      Figure: 320x320 sample Web application

      +

      320x320 sample Web application

      -

      In this case, if the position of the footer is not defined explicitly or if the position and bottom properties do not have proper values, an ugly layout can be displayed on an unexpected device, such as the 360x480 screen shown in the following figure.

      -

      Figure: Layout on 360x480

      -

      Layout on 360x480

      +

      In this case, if the position of the footer is not defined explicitly or if the position and bottom properties do not have proper values, an ugly layout can be displayed on an unexpected device, such as the 360x480 screen shown in the following figure.

      +

      Figure: Layout on 360x480

      +

      Layout on 360x480

      -

      To make the layout correct, define the position property as fixed and set the bottom property explicitly as 0 px:

      +

      To make the layout correct, define the position property as fixed and set the bottom property explicitly as 0 px:

       .footer {position: fixed; bottom: 0px;}
      - +

      The following figure shows the same Web application running on the unexpected device after the footer properties are defined properly. With the correct values, the Web application is usable even on a new target, not planned during the development phase. Note that if a relative layout is also applied to the content area, the result is an even better layout and further improved usability.

      -

      Figure: Usable layout on 360x480

      -

      Usable layout on 360x480

      +

      Figure: Usable layout on 360x480

      +

      Usable layout on 360x480

      Flexible Media

      - +

      One of key elements used in the content area is a media element, including image and video. As all other elements, the media elements also must be placed within a relative layout to allow the application flexibly handle resolution changes. When such relative sizing is applied to a media element, it is called flexible media in responsive Web design.

      The main issue when making a media element size relative is to ensure that the usable ratio does not change. The following figure shows a video element that works on both 320x320 and 360x480 resolutions, even though the aspect ratio of the screen is changed and scaled up. Basically, when handling media elements, you want to keep the size or ratio of the element the same as in the initially targeted device, even when displayed using a different resolution and aspect ratio. To achieve this, set the width and height properties of the media element with percentage and the auto keyword.

      -

      Figure: Flexible media on 320x320 and 360x480

      +

      Figure: Flexible media on 320x320 and 360x480

      .video iframe {width: 100%; height: auto;}

      -

      Flexible media on 320x320 and 360x480

      +

      Flexible media on 320x320 and 360x480

      + -

      The following figure shows an example of wrong usage, where usability decreases as the video element is simply scaled up based on the aspect ratio change. If you set the video element size using a fixed size like this, you get no benefit from the increased resolution, and the layout on the whole screen becomes inharmonious, decreasing usability.

      -

      Figure: Fixed size media element

      +

      Figure: Fixed size media element

      .video iframe {width: 320px; height: 240px;}

      -

      Fixed size media element

      +

      Fixed size media element

      Single Layout Example

      - +

      This section illustrates a complete application layout that takes advantage of the issues discussed in previous sections. In particular, it shows how to set the viewport properly to help the Web engine scaling mechanism and how to create a CSS-based layout.

      - - + +

      First of all, set the targeted size of the content area as 320 px in the viewport meta tag, and disable the user-scalable property, as shown in the following code snippet.

       <html>
-   <head>
-      <link href="css/style.css" rel="stylesheet" type="text/css">
-      <meta name="viewport" content="width=320px, user-scalable=no"/>
-   </head>
-   <body>
-      <main>
-         <div class="tile left">
-            <div id="box1" class="box"></div>
-         </div>
-         <div class="tile right">
-            <div id="box2" class="box"></div>
-         </div>
-         <div class="tile left">
-            <div id="box3" class="box"></div>
-         </div>
-         <div class="tile right">
-            <div id="box4" class="box"></div>
-         </div>
-      </main>
-   </body>
+   <head>
+      <link href="css/style.css" rel="stylesheet" type="text/css">
+      <meta name="viewport" content="width=320px, user-scalable=no"/>
+   </head>
+   <body>
+      <main>
+         <div class="tile left">
+            <div id="box1" class="box"></div>
+         </div>
+         <div class="tile right">
+            <div id="box2" class="box"></div>
+         </div>
+         <div class="tile left">
+            <div id="box3" class="box"></div>
+         </div>
+         <div class="tile right">
+            <div id="box4" class="box"></div>
+         </div>
+      </main>
+   </body>
 </html>
      -

      In the above HTML code, the content area consists of 4 <div> box elements, and their UI layout is described in the style.css file. The following CSS code programs the layout and the specific box element styles that were defined in the HTML file.

      +

      In the above HTML code, the content area consists of 4 <div> box elements, and their UI layout is described in the style.css file. The following CSS code programs the layout and the specific box element styles that were defined in the HTML file.

      The code snippet shows that the content size is set to be same as the viewport size. Each box is filled with a different color and placed so that it fills a quarter of the content area. Because each box size is defined with the width and height of 100%, the relative size of each box element remains the same even if the viewport size changes.

      @@ -192,27 +192,27 @@ html, body {width: 100%; height: 100%; overflow-x: hidden;}
 #box4 {background-color: rgb(192, 161, 246);}
 .tile
 {
-   width: 50%;
-   height: 50%;
-   float: left;
+   width: 50%;
+   height: 50%;
+   float: left;
 }
 .left {padding: 10px 5px 5px 10px;}
 .right {padding: 10px 10px 5px 5px;}
 
 .box
 {
-   width: 100%;
-   height: 100%;
+   width: 100%;
+   height: 100%;
 }
      -

      The following figure shows a final view when the 320 px is set as a target device in the HTML file. As defined in the CSS file, the content area fills the whole screen, 320x320 pixels, and the 4 box elements equally divide the area.

      - -

      Figure: Original layout on a target device

      +

      The following figure shows a final view when the 320 px is set as a target device in the HTML file. As defined in the CSS file, the content area fills the whole screen, 320x320 pixels, and the 4 box elements equally divide the area.

      + +

      Figure: Original layout on a target device

      Original layout on a target device

      The following figure shows that the relative layout and scaling are correctly applied even when the same application is run on a mobile device with the aspect ratio of 16:9.

      -

      Figure: Scaled layout on a 16:9 mobile device

      +

      Figure: Scaled layout on a 16:9 mobile device

      Scaled layout on a 16:9 mobile device

      The following code snippet shows an example where the background color is replaced with an image while the layout is exactly same as in the 4 box example. The following figures show how the layout including media elements (such as images) functions exactly like the basic box layout.

      @@ -228,68 +228,68 @@ html, body {width: 100%; height: 100%; overflow-x: hidden;} #box4 {background-color: rgb(192, 161, 246);} .tile { -   width: 50%; -   height: 50%; -   float: left; + width: 50%; + height: 50%; + float: left; } .left {padding: 10px 5px 5px 10px;} .right {padding: 10px 10px 5px 5px;} .box { -   width: 100%; -   height: 100%; -   padding: 20px; -   background: no-repeat center; -   background-size: 100% 100%; + width: 100%; + height: 100%; + padding: 20px; + background: no-repeat center; + background-size: 100% 100%; } -#box1 {background-image: url('../a.png');} -#box2 {background-image: url('../b.png');} -#box3 {background-image: url('../c.png');} -#box4 {background-image: url('../d.png');} +#box1 {background-image: url('../a.png');} +#box2 {background-image: url('../b.png');} +#box3 {background-image: url('../c.png');} +#box4 {background-image: url('../d.png');} - +

      Figure: Image-based layout on a target device

      Image-based layout on a target device

      Figure: Image-based scaled layout on a 16:9 mobile device

      -

      Image-based scaled layout on a 16:9 mobile device

      +

      Image-based scaled layout on a 16:9 mobile device

      + +

      Multiple Layouts for Multiple Devices

      -

      Multiple Layouts for Multiple Devices

      -

      In many cases, the desired end result for your application can be achieved using scaling and a relative layout within a single layout. However, this approach does not always provide the best quality for the end user.

      You can support the best possible layout and usability with some additional development efforts. For instance, you can create an application which, on a tablet, shows the main information (watch face) and also delivers more meaningful information (calendar), while on a watch device the same application only displays the main information (watch face). This kind of end result, as shown in the following figure, cannot be achieved by only scaling up the whole layout of the watch device.

      -

      Figure: Application for a watch and tablet

      -

      Application for a watch and tablet

      +

      Figure: Application for a watch and tablet

      +

      Application for a watch and tablet

      -

      W3C CSS3 Media Queries already support the majority of techniques needed to provide category-based layouts. To support the optimal layout using CSS techniques and design applications with multiple layouts, you must consider the following issues:

      +

      W3C CSS3 Media Queries already support the majority of techniques needed to provide category-based layouts. To support the optimal layout using CSS techniques and design applications with multiple layouts, you must consider the following issues:

      -
        + - -

        Since the 2.3.1 version, Tizen also supports a special media query feature to provide device shape-based layouts. If you want to create an application for both square-shaped and circular-shaped devices, you can easily migrate your application to support both shapes.

        -

        Figure: Application for a square and circular device

        -

        Application for a square and circular device

        - -

        Viewport Setting for Multiple Layouts

        -

        The difference between multiple and single layouts is that, in the multiple layouts, the content width of the viewport meta tag is set to "device-width". This sets the layout viewport width to the ideal viewport width and tells the Web engine that the application adapts to the device width. In short, the "device-width" setting is needed to create an adaptive and responsive Web application.

        +

        Since the 2.3.1 version, Tizen also supports a special media query feature to provide device shape-based layouts. If you want to create an application for both square-shaped and circular-shaped devices, you can easily migrate your application to support both shapes.

        +

        Figure: Application for a square and circular device

        +

        Application for a square and circular device

        + + +

        Viewport Setting for Multiple Layouts

        +

        The difference between multiple and single layouts is that, in the multiple layouts, the content width of the viewport meta tag is set to "device-width". This sets the layout viewport width to the ideal viewport width and tells the Web engine that the application adapts to the device width. In short, the "device-width" setting is needed to create an adaptive and responsive Web application.

        To use the meta tag in an HTML file, set its name and content: 

        -<meta name="viewport" content="width=device-width, user-scalable=no">
+<meta name="viewport" content="width=device-width, user-scalable=no">

        Category Classification

        - +

        When creating multiple layouts, you must first configure the layout categories. In other words, a classifying category is needed to fit the layout on the current executable environment. Media queries are supported in CSS3 to give Web application information to the executable environment.

        W3C Media Queries

        @@ -318,78 +318,78 @@ html, body {width: 100%; height: 100%; overflow-x: hidden;} @media screen and (min-width: 500px) {...} -

        The following table lists the CSS media features, which you can use to specify the layout utilizing the media queries.

        - +

        The following table lists the CSS media features, which you can use to specify the layout utilizing the media queries.

        +

        Table: Media features

        - - - + + + - - - - + + + + - - + + - - + + - - - - + + + + - + - - - + + + - - + + - + - - + + - + - - + + - + - - + + - + - - + + - + - - + + - - - + + +
        Feature
        Feature Value Min/MaxDescription
        colorDescription
        color integer yesNumber of bits per a color component
        Number of bits per a color component
        color-index Number of entries in the color lookup table
        device-aspect-ratio
        device-aspect-ratio integer/integerAspect ratio
        device-heightAspect ratio
        device-height lengthOutput device heightOutput device height
        device-widthOutput device width
        device-widthOutput device width
        grid
        grid integer noSet to true for a grid-based deviceSet to true for a grid-based device
        height
        height length yesRendering surface heightRendering surface height
        monochrome
        monochrome integerNumber of bits per pixel in a monochrome frame bufferNumber of bits per pixel in a monochrome frame buffer
        resolution
        resolution resolution (dpi or dpcm)ResolutionResolution
        scan
        scan progressive or interlaced noScanning process of the tv media typesScanning process of the tv media types
        width
        width length yesRendering surface width
        Rendering surface width
        - +

        Tizen Specialized Media Query

        Tizen supports a special media query feature for a circular device shape. The following table lists the supported media features.

        @@ -397,49 +397,49 @@ html, body {width: 100%; height: 100%; overflow-x: hidden;} Note This feature is supported since 2.3.1.
    - +

    Table: Tizen specialized media feature

    - - - + + + - - - - - - + + + + + + - + - - + +
    Feature
    Feature Value Min/MaxDescription
    -tizen-geometric-shape"rectangle" | "circle"Description
    -tizen-geometric-shape"rectangle" | "circle" NoDevice shapeDevice shape

    You can combine this media query feature with the W3C type in your code. The final view shows the layout inside {...} to the end user:

     @media all and (-tizen-geometric-shape: circle) {...}
    - - + +

    Classification for Display Modes

    The display mode can be classified as portrait or landscape for a rectangle-shaped device, or circular for a circular device.

    Portrait and Landscape

    -

    You can configure the device landscape and portrait mode using the device-aspect-ratio attribute in media queries. This approach is already commonly used in creating mobile Web applications. The following example shows how the max-device-aspect-ratio feature is used.

    -

    If you use the orientation: portrait/landscape feature, the layout can change unexpectedly when the virtual keypad is displayed. To avoid the problem, use the device-aspect-ratio to configure the portrait and landscape mode.

    +

    You can configure the device landscape and portrait mode using the device-aspect-ratio attribute in media queries. This approach is already commonly used in creating mobile Web applications. The following example shows how the max-device-aspect-ratio feature is used.

    +

    If you use the orientation: portrait/landscape feature, the layout can change unexpectedly when the virtual keypad is displayed. To avoid the problem, use the device-aspect-ratio to configure the portrait and landscape mode.

     @media screen and (max-width: 320px) and (max-device-aspect-ratio: 1/1)
 {
-   <!--For portrait mode-->
+   <!--For portrait mode-->
 }
 @media screen and (max-width: 640px) and (min-device-aspect-ratio: 11/10)
 {
-   <!--For landscape mode-->
+   <!--For landscape mode-->
 }
    @@ -455,11 +455,11 @@ html, body {width: 100%; height: 100%; overflow-x: hidden;} 
     @media all and (-tizen-geometric-shape: circle)
 {
-   <!--For a circular device-->
+   <!--For a circular device-->
 }
    -

    Application Migration to a Circular Device

    +

    Application Migration to a Circular Device

    This section illustrates an example for how you can migrate a basic application from a rectangular device (such as Gear 2 or Gear S) to a circular device. Use this example as the best practice to improve your layout.

    @@ -467,95 +467,95 @@ html, body {width: 100%; height: 100%; overflow-x: hidden;} 
     <!--HTML code-->
-<section id="main">
-   <header>HEADER</header>
-   <article id="content">
-      <ul>
-         <li>List Item 1</li>
-         <li>List Item 2</li>
-         <li>List Item 3</li>
-         <li>List Item 4</li>
-         <li>List Item 5</li>
-         <li>List Item 6</li>
-         <li>List Item 7</li>
-         <li>List Item 8</li>
-         <li>List Item 9</li>
-         <li>List Item 10</li>
-      </ul>
-   </article>
-   <footer>FOOTER</footer>
+<section id="main">
+   <header>HEADER</header>
+   <article id="content">
+      <ul>
+         <li>List Item 1</li>
+         <li>List Item 2</li>
+         <li>List Item 3</li>
+         <li>List Item 4</li>
+         <li>List Item 5</li>
+         <li>List Item 6</li>
+         <li>List Item 7</li>
+         <li>List Item 8</li>
+         <li>List Item 9</li>
+         <li>List Item 10</li>
+      </ul>
+   </article>
+   <footer>FOOTER</footer>
 </section>
 
 <!--CSS code-->
 html, body
 {
-   height: 100%;
-   width: 100%;
-   padding: 0;
-   margin: 0;
-   font-size: 24px;
-   overflow: hidden;
+   height: 100%;
+   width: 100%;
+   padding: 0;
+   margin: 0;
+   font-size: 24px;
+   overflow: hidden;
 }
 
 section
 {
-   width: 100%;
-   height: 100%;
-   overflow: auto;
-   padding: 70px 0;
+   width: 100%;
+   height: 100%;
+   overflow: auto;
+   padding: 70px 0;
 }
 
 header, footer
 {
-   width: 100%;
-   height: 70px;
-   min-height: 70px;
-   line-height: 70px;
-   font-size: 30px;
-   text-align: center;
-   position: fixed;
+   width: 100%;
+   height: 70px;
+   min-height: 70px;
+   line-height: 70px;
+   font-size: 30px;
+   text-align: center;
+   position: fixed;
 }
 
 header
 {
-   top: 0;
+   top: 0;
 }
 
 footer
 {
-   bottom: 0;
+   bottom: 0;
 }
 
 article ul li
 {
-   border-top: 1px solid rgba(52, 52, 52, 1);
-   padding: 15px 20px;
-   color: rgba(209, 209, 209, 1);
-   font-size: 40px;
+   border-top: 1px solid rgba(52, 52, 52, 1);
+   padding: 15px 20px;
+   color: rgba(209, 209, 209, 1);
+   font-size: 40px;
 }
 
 article ul li:first
 {
-   border-top: 0 none;
+   border-top: 0 none;
 }

    To migrate the application, use the following steps:

    -
      +
      1. Use a relative layout.

        To achieve a responsive layout for different devices, implement a relative layout. Simply set the width: 100% attribute to the layout elements in the CSS code:

         section
 {
-   width: 100%;
-   height: 100%;
+   width: 100%;
+   height: 100%;
 }
 
 header, footer
 {
-   width: 100%;
+   width: 100%;
 }
        @@ -566,26 +566,26 @@ header, footer
      2. Set extra spaces both at the top and bottom. -

        During the migration, you can see how a certain portion of the rectangle view is covered over by the circular view, especially the header and the footer. To make them fully and consistently visible in the circular view, provide a "padding" space at the top and bottom of the page. In the following example migrating to a circular gear device from a rectangular Gear S, extra 77 px padding is used:

        +

        During the migration, you can see how a certain portion of the rectangle view is covered over by the circular view, especially the header and the footer. To make them fully and consistently visible in the circular view, provide a "padding" space at the top and bottom of the page. In the following example migrating to a circular gear device from a rectangular Gear S, extra 77 px padding is used:

         @media all and (-tizen-geometric-shape: circle)
 {
-   section {padding: 77px 0;}
+   section {padding: 77px 0;}
 }
        -

        Figure: Top and bottom padding

        -

        Top and bottom padding

        +

        Figure: Top and bottom padding

        +

        Top and bottom padding

      3. Set the header and footer position.

        After setting the top and bottom padding, set the header and footer position for scrolling in the circular view.

        For a rectangular device with a lengthwise screen, especially Gear S, the best option is to make only the content area scrollable.

        -

        Figure: Scrolling with a rectangular screen

        +

        Figure: Scrolling with a rectangular screen

        Scrolling with a rectangular screen

        In a circular screen, it is better to make the whole page scrollable, including the top and bottom space.

        -

        Figure: Scrolling with a circular screen

        +

        Figure: Scrolling with a circular screen

        Scrolling with a circular screen

        To implement the header and footer position, use the CSS position attribute:

        @@ -593,52 +593,52 @@ header, footer <!--Rectangular device--> header, footer { -   position: fixed; + position: fixed; } <!--Circular device--> @media all and (-tizen-geometric-shape: circle) { -   header, footer -   { -      position: static; -   } + header, footer + { + position: static; + } }
      4. Move the display to the initial position. -

        To provide a better user experience, show the entire display at the beginning, including the "top padding" space. A few seconds after the application launch, move the display back to its initial position, where the header is placed on the top without any space between itself and the edge of the screen. When the display moves like this, the users can perceive the existence of the top space.

        +

        To provide a better user experience, show the entire display at the beginning, including the "top padding" space. A few seconds after the application launch, move the display back to its initial position, where the header is placed on the top without any space between itself and the edge of the screen. When the display moves like this, the users can perceive the existence of the top space.

        -

        Figure: Moving to the initial position

        +

        Figure: Moving to the initial position

        Moving to the initial position

        The scroll move requires several lines of JavaScript code. In the following sample, the few (N) seconds is set to 1500 ms, but you can change the value as needed.

         (function initScrollPosition()
 {
-   var SCROLL_DELAY_TIME = 1500,
-       page = document.getElementById("main"),
-       scrollPosition =
-          window.parseInt(window.getComputedStyle(page)["padding-top"]),
-       initScrollTimeoutId = null,
-       mql = window.matchMedia("(-tizen-geometric-shape: circle)");
-
-   /* Effect is applied to a circular device only, so use a media query */
-   if (mql.matches)
-   {
-      page.addEventListener("scroll", function clearInitScrollCallback()
-         {
-            window.clearTimeout(initScrollTimeoutId);
-            page.removeEventListener("scroll", clearInitScrollCallback, false);
-         }, false);
-
-      initScrollTimeoutId = window.setTimeout(function()
-         {
-            page.scrollTop = scrollPosition;
-         }, SCROLL_DELAY_TIME);
-   }
+   var SCROLL_DELAY_TIME = 1500,
+       page = document.getElementById("main"),
+       scrollPosition =
+          window.parseInt(window.getComputedStyle(page)["padding-top"]),
+       initScrollTimeoutId = null,
+       mql = window.matchMedia("(-tizen-geometric-shape: circle)");
+
+   /* Effect is applied to a circular device only, so use a media query */
+   if (mql.matches)
+   {
+      page.addEventListener("scroll", function clearInitScrollCallback()
+         {
+            window.clearTimeout(initScrollTimeoutId);
+            page.removeEventListener("scroll", clearInitScrollCallback, false);
+         }, false);
+
+      initScrollTimeoutId = window.setTimeout(function()
+         {
+            page.scrollTop = scrollPosition;
+         }, SCROLL_DELAY_TIME);
+   }
 }());
        @@ -646,23 +646,23 @@ header, footer
      5. Set extra attributes for a better view.

        Extra attributes are not mandatory in the migration process, but they can be helpful for a better application view.

        -

        Sometimes changing the layout of the basic elements is not enough to achieve a user-friendly view, and changes in other elements' layout are needed too. For example, consider setting the text-align: center attribute for the header and list items in the circular view (this attribute is already defined in the above circular screenshots). If the list is aligned to left in a circular view, the list items may not be all visible when placed out of the middle space.

        +

        Sometimes changing the layout of the basic elements is not enough to achieve a user-friendly view, and changes in other elements' layout are needed too. For example, consider setting the text-align: center attribute for the header and list items in the circular view (this attribute is already defined in the above circular screenshots). If the list is aligned to left in a circular view, the list items may not be all visible when placed out of the middle space.

         <!--Common style for header and footer text-->
 header, footer
 {
-   text-align: center;
+   text-align: center;
 }
 
 <!--In a circular screen, list item has a center position-->
 @media all and (-tizen-geometric-shape: circle)
 {
-   article ul li
-   {
-      text-align: center;
-      line-height: 60px;
-   }
+   article ul li
+   {
+      text-align: center;
+      line-height: 60px;
+   }
 }
        6. diff --git a/org.tizen.guides/html/web/w3c/ui/woff_w.htm b/org.tizen.guides/html/web/w3c/ui/woff_w.htm index 781b967..27220a6 100644 --- a/org.tizen.guides/html/web/w3c/ui/woff_w.htm +++ b/org.tizen.guides/html/web/w3c/ui/woff_w.htm @@ -5,7 +5,7 @@ - + @@ -14,12 +14,12 @@ - +

        Mobile Web Wearable Web

        - +

        Dependencies

        -
        +

    WOFF File Format (1.0)

    @@ -48,12 +48,12 @@

    The new text features in WOFF File Format 1.0 include:

      -
    • WOFF file format 1.0 +
    • WOFF file format 1.0

      WOFF (Web Open Font Format) is a packaging format used to decode and restore font data according to the @font-face rule to display it identically with the input font. The @font-face rule is a CSS rule that allows linking to fonts and finding a suitable font to display if the original font is not available. You can use WOFF within a Web page.

      • -
    +

    Using the WOFF File Format

    - +

    To enhance the user experience of your application, you must learn to use the WOFF (Web Open Font Format) file format 1.0, which is a W3C standard font packaging format used in Web pages:

      @@ -73,44 +73,44 @@

      Define the rules with in a <style> element in the <head> section of a Web page:

       <head>
-   <style>
-   @font-face
-   {
-      font-family: MuseoSans;
-      src: local('MuseoSans'),
-           url('https://www.tizen.org/sites/all/themes/tizen_theme/webfonts/244CBE_1_0.woff') format('woff');
-   }
-
-   @font-face
-   {
-      font-family: MuseoSans;
-      font-weight: bold;
-      src: local('MuseoSans'),
-           url('https://www.tizen.org/sites/all/themes/tizen_theme/webfonts/244CBE_0_0.woff') format('woff');
-   }
-
-   @font-face
-   {
-      font-family: MuseoSans;
-      font-weight: 900;
-      src: local('MuseoSans'),
-           url('https://www.tizen.org/sites/all/themes/tizen_theme/webfonts/244CBE_2_0.woff') format('woff');
-   }
-
-   p:nth-child(2) {font-family: MuseoSans}
-   p:nth-child(3) {font-family: MuseoSans; font-weight: bold;}
-   p:nth-child(4) {font-family: MuseoSans; font-weight: 900;}
-   </style>
+   <style>
+   @font-face
+   {
+      font-family: MuseoSans;
+      src: local('MuseoSans'),
+           url('https://www.tizen.org/sites/all/themes/tizen_theme/webfonts/244CBE_1_0.woff') format('woff');
+   }
+
+   @font-face
+   {
+      font-family: MuseoSans;
+      font-weight: bold;
+      src: local('MuseoSans'),
+           url('https://www.tizen.org/sites/all/themes/tizen_theme/webfonts/244CBE_0_0.woff') format('woff');
+   }
+
+   @font-face
+   {
+      font-family: MuseoSans;
+      font-weight: 900;
+      src: local('MuseoSans'),
+           url('https://www.tizen.org/sites/all/themes/tizen_theme/webfonts/244CBE_2_0.woff') format('woff');
+   }
+
+   p:nth-child(2) {font-family: MuseoSans}
+   p:nth-child(3) {font-family: MuseoSans; font-weight: bold;}
+   p:nth-child(4) {font-family: MuseoSans; font-weight: 900;}
+   </style>
 </head>
    1. In the <body> section, create <p> elements containing text in which the font rules are implemented: 
       <body>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
-   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
+   <p>The quick brown fox jumps over a lazy dog.</p>
 </body>
 </html>
      @@ -118,7 +118,7 @@

    Figure: Implementing the @font-face rules (in mobile applications only)

    Implementing the @font-face rules (in mobile applications only)

    - + diff --git a/org.tizen.guides/html/web/w3c/useful/performance_w.htm b/org.tizen.guides/html/web/w3c/useful/performance_w.htm index 2172a5b..841f856 100644 --- a/org.tizen.guides/html/web/w3c/useful/performance_w.htm +++ b/org.tizen.guides/html/web/w3c/useful/performance_w.htm @@ -5,20 +5,20 @@ - + - Performance Improvement - + Performance Improvement + - +

    Wearable Web

    - +

    Dependencies

    -
    +
    - +

    Performance Improvement

    - +

    With the following instructions, you can improve the performance of your wearable Web applications. The instructions summarize some representative tips that are frequently used in the Web community.

    -

    This feature is supported in wearable applications only.

    +

    This feature is supported in wearable applications only.

    For more detailed and comprehensive information, study the following documentation:

      @@ -75,13 +75,13 @@ var globalVar; test: function() { -   var one = globalVar + 1; (X) -   var two = globalVar + 2; (X) -   var ratio = -      window.innerWidth / (window.innerHeight + window.innerWidth); (X) + var one = globalVar + 1; (X) + var two = globalVar + 2; (X) + var ratio = + window.innerWidth / (window.innerHeight + window.innerWidth); (X) } - + After @@ -89,11 +89,11 @@ test: function() 
       test: function()
 {
-   var global = globalVar;  (O)
-   var one = global + 1;
-   screenHeight = window.innerHeight; (O)
-   screenWidth= window.innerWidth; (O)
-   var ratio = screenWidth / (screenHeight + screenWidth);
+   var global = globalVar;  (O)
+   var one = global + 1;
+   screenHeight = window.innerHeight; (O)
+   screenWidth= window.innerWidth; (O)
+   var ratio = screenWidth / (screenHeight + screenWidth);
 }
      @@ -104,7 +104,7 @@ test: function() Tip To minimize the property access time:
      • Property depth: the deeper the property hierarchy is, the more search time is requires (object.name < object.name.name).
        • -
      • Property notation: dot notation is faster than associate notation in Webkit (object.name < object ["name"]).
      +
    • Property notation: dot notation is faster than associate notation in Webkit (object.name < object ["name"]).

    Improving the Event Handler Response Time

    @@ -120,14 +120,14 @@ test: function() Before 
    -document.getElementById('a').onclick = function()
+document.getElementById('a').onclick = function()
 {
-   alert('<a> clicked!!');
+   alert('<a> clicked!!');
 }
 
-document.getElementById('div').onclick = function()
+document.getElementById('div').onclick = function()
 {
-   alert('<div> clicked!!');
+   alert('<div> clicked!!');
 }
    @@ -139,15 +139,15 @@ document.getElementById('div').onclick = function() 
     document.getElementById('ul').onclick = function()
 {
-   var target = e.target;
-   if (target.nodeName == 'a')
-   {
-      alert('<a> clicked!!');
-   }
-   else if (target.nodeName == 'div')
-   {
-      alert('<div> clicked!');
-   }
+   var target = e.target;
+   if (target.nodeName == 'a')
+   {
+      alert('<a> clicked!!');
+   }
+   else if (target.nodeName == 'div')
+   {
+      alert('<div> clicked!');
+   }
 }
    @@ -165,7 +165,7 @@ document.getElementById('ul').onclick = function() Removing an unused property 
    -var myApp = {prop: "myprop"};
+var myApp = {prop: "myprop"};
 delete myApp.prop;
    @@ -173,20 +173,20 @@ delete myApp.prop; Removing an unused DOM element 
    -var el= $('#myelem');
+var el= $('#myelem');
 el.parentNode.removeChild(el);
    - +

    Minimizing the Document Flow

    The layout of the Web application is maintained in Webkit as a DOM tree. The CSS style is applied to the DOM tree and produces the render tree that contains the rendering information for the real screen. The user sees the result of painting the render tree. The following figure shows the overall rendering flow that happens in the Webkit layout engine.

    -

    Figure: Webkit rendering flow

    +

    Figure: Webkit rendering flow

    Webkit rendering flow

    -

    You can improve performance by designing your application to avoid unnecessary rendering. Minimizing the chances of DOM tree changes is a key to optimizing Web application performance, because usually the rendering needs to be done whenever the DOM tree is changed (this situation is called "document reflow" - Webkit needs to recalculate the position of elements in the document after a DOM change).

    +

    You can improve performance by designing your application to avoid unnecessary rendering. Minimizing the chances of DOM tree changes is a key to optimizing Web application performance, because usually the rendering needs to be done whenever the DOM tree is changed (this situation is called "document reflow" - Webkit needs to recalculate the position of elements in the document after a DOM change).

    The document reflow happens:

      @@ -202,7 +202,7 @@ el.parentNode.removeChild(el);
      • Manipulate tables separately from the DOM tree.

        The intuitive way to manipulate table values is to directly access and modify each value. However, this approach results in very poor performance, since every change of every value leads to a DOM change (often causing a document reflow). To avoid this problem, separate the table from the DOM tree and make changes on the detached table only. After the changes, attach the changed table to the original DOM tree. The end result is the same, but the performance difference is significant.

        -

        The following example illustrates the issue.

        +

        The following example illustrates the issue.

        Table: Example of manipulating tables

        @@ -215,10 +215,10 @@ table.addLotsAndLotsOfRows(); - + @@ -259,20 +259,20 @@ aDiv.style.height = newHeight + 'px'; /* Write */ 
         var newWidth = aDiv.offsetWidth + 10; /* Read */
 var newHeight = aDiv.offsetHeight + 10; /* Read */
-aDiv.style.width = newWidth + 'px'; /* Write */
-aDiv.style.height = newHeight + 'px'; /* Write */
+aDiv.style.width = newWidth + 'px'; /* Write */
+aDiv.style.height = newHeight + 'px'; /* Write */
        -
        Manipulating table nodes without document reflow 
        -var table = $('#some-table');
+var table = $('#some-table');
 var parent = table.parent();
 table.remove();
 table.addLotsAndLotsOfRows();
@@ -248,9 +248,9 @@ parent.append(table);
 				
         var newWidth = aDiv.offsetWidth + 10; /* Read */
-aDiv.style.width = newWidth + 'px'; /* Write */
+aDiv.style.width = newWidth + 'px'; /* Write */
 var newHeight = aDiv.offsetHeight + 10; /* Read */
-aDiv.style.height = newHeight + 'px'; /* Write */
+aDiv.style.height = newHeight + 'px'; /* Write */
      +

    Improving the Application Launch Time

    -

    The basic principle of improving the launch time of a Web application is simply to "show first page as fast as possible and do nothing but UI rendering". To apply this principle:

    +

    The basic principle of improving the launch time of a Web application is simply to "show first page as fast as possible and do nothing but UI rendering". To apply this principle:

    • Reduce the number of files. -

      The intuition behind the rule to reducing the number of files can be expressed as "less files > less file operations > faster load". As shown in the following table, you can reduce 3 JavaScript files to just 1 while keeping the same content.

      +

      The intuition behind the rule to reducing the number of files can be expressed as "less files > less file operations > faster load". As shown in the following table, you can reduce 3 JavaScript files to just 1 while keeping the same content.

      In case of large-scale Web applications, 1 application can contain 20-30 or even more JavaScript files, and concatenating the JavaScript can make the initial file operations significantly faster, eventually leading to a faster launch time.

      Table: Example of reducing the number of files

      @@ -282,16 +282,16 @@ aDiv.style.height = newHeight + 'px'; /* Write */ Separating JavaScript files 
      -<script src="foo1.js"></script>
-<script src="foo2.js"></script>
-<script src="foo3.js"></script>
+<script src="foo1.js"></script>
+<script src="foo2.js"></script>
+<script src="foo3.js"></script>
      Concatenating JavaScript files 
      -<script src="foo.js"></script>
+<script src="foo.js"></script>
 <!--foo.js contains foo1.js, foo2.js, and foo3.js-->
      @@ -311,7 +311,7 @@ aDiv.style.height = newHeight + 'px'; /* Write */

      Take advantage of a useful technique called deferring loading. The UI component creation starts at the DOMContentLoad time, and at this time all the DOM elements in the first page (index.html) are constructed. Of course, images and other resources are not yet loaded at this stage.

      Often the first page can contain unnecessary elements, and consequently slow down the DOM construction. To avoid the problem, construct the first page to contain only the necessary elements to show the first scene, and put the rest of the pages in another HTML file. Similarly, if you do not need some JavaScript functionality on the first page, load the related JavaScript files only after the first page is loaded.

    - +
    diff --git a/org.tizen.guides/html/web/w3c/useful/sound_policy_w.htm b/org.tizen.guides/html/web/w3c/useful/sound_policy_w.htm index cfa6cf4..e2ef5c1 100644 --- a/org.tizen.guides/html/web/w3c/useful/sound_policy_w.htm +++ b/org.tizen.guides/html/web/w3c/useful/sound_policy_w.htm @@ -5,38 +5,38 @@ - + - Tizen WebKit Tap Sound Policy + Tizen WebKit Tap Sound Policy - +

    Mobile Web

    - +

    Dependencies

    • Tizen 2.4 and Higher for Mobile
    -
    +

    Tizen WebKit Tap Sound Policy

    - +

    To provide responsiveness on user interaction, Tizen WebKit plays sounds when a user taps an element and specific conditions are fulfilled.

    -

    This feature is supported in mobile applications only.

    +

    This feature is supported in mobile applications only.

    Sound is not played in case of a tap event for:

      @@ -60,7 +60,7 @@
  • HTML <textarea> elements
    • - +

    Sound is played in case of a tap event for:

    • HTML <a> elements with the href attribute
      • diff --git a/org.tizen.guides/html/web/w3c/useful/useful_guide_w.htm b/org.tizen.guides/html/web/w3c/useful/useful_guide_w.htm index 27e770a..f871d73 100644 --- a/org.tizen.guides/html/web/w3c/useful/useful_guide_w.htm +++ b/org.tizen.guides/html/web/w3c/useful/useful_guide_w.htm @@ -5,20 +5,20 @@ - + - Useful Guides for W3C/HTML5 Features - + Useful Guides for W3C/HTML5 Features + - +

      Mobile Web Wearable Web

      - +

      Dependencies

        @@ -26,21 +26,21 @@
      • Tizen 2.3.1 and Higher for Wearable
      -
      +
    - -

    Useful Guides for W3C/HTML5 Features

    - + +

    Useful Guides for W3C/HTML5 Features

    +

    Useful guides for W3C/HTML5 features include information on W3C features related to various APIs:

    -
      +
      • Tizen WebKit Tap Sound Policy in mobile applications only -

        Allows you to play sounds to provide responsiveness on user interaction.

        • +

        Allows you to play sounds to provide responsiveness on user interaction.

      • Performance Improvement in wearable applications only

        Allows you to improve the performance of Tizen Web applications.

        • -
      - +
    +
    diff --git a/org.tizen.guides/html/web/w3c/w3c_cover_w.htm b/org.tizen.guides/html/web/w3c/w3c_cover_w.htm index 1605cc0..126e151 100644 --- a/org.tizen.guides/html/web/w3c/w3c_cover_w.htm +++ b/org.tizen.guides/html/web/w3c/w3c_cover_w.htm @@ -5,13 +5,13 @@ - + - W3C/HTML5/Supplementary Features + W3C/HTML5/Supplementary Features @@ -27,7 +27,7 @@
  • Tizen 2.3.1 and Higher for Wearable
    • -
    +

    W3C/HTML5/Supplementary Features

    @@ -52,7 +52,7 @@
  • Performance and Optimization

    You can use Web workers to run scripts in the background. To manage application performance further, you can control the animation rate and page visibility.

  • Location -

    You can determine the geographical position of the device using various positioning methods, such as the Global Positioning System (GPS) and network positioning system. You can retrieve the user position only once, or continue to receive updates to see how the position changes.

    • +

    You can determine the geographical position of the device using various positioning methods, such as the Global Positioning System (GPS) and network positioning system. You can retrieve the user position only once, or continue to receive updates to see how the position changes.

  • Useful Guides for W3C/HTML5 Features

    You can use common W3C features to play sounds to provide responsiveness on user interaction, and to improve the performance of wearable Web applications.

  • Supplementary Features @@ -61,7 +61,7 @@

    You can create a visual outlook for the UI application to ensure the best possible user experience. The Tizen platform provides the W3C/HTML5 UI toolkit framework for developing a Web application.

    • - +
    diff --git a/org.tizen.studio/html/common_tools/certificate_registration.htm b/org.tizen.studio/html/common_tools/certificate_registration.htm index b387983..26118f4 100644 --- a/org.tizen.studio/html/common_tools/certificate_registration.htm +++ b/org.tizen.studio/html/common_tools/certificate_registration.htm @@ -51,14 +51,14 @@

    Creating the Certificate Profile

    You can create a new certificate profile with the Certificate Manager. To run the Certificate Manager, in the Tizen Studio menu, select Tools > Certificate Manager.

    -

    Figure: Certificate Manager

    +

    Figure: Certificate Manager

    Certificate Manager

    In the Certificate Manager, click the plus icon (Plus icon) to create a new profile.

    -

    Figure: Creating a new certificate profile

    +

    Figure: Creating a new certificate profile

    Creating a new certificate profile

    You can create a new certificate profile with the creation wizard.

    -

    Figure: Creation wizard

    +

    Figure: Creation wizard

    Creation wizard

    Adding the Author and Distributor Certificates

    @@ -78,20 +78,20 @@

    Managing the Certificate Profile

    You can also view, edit, and remove the certificate profiles you have created.

    -

    Figure: Managing certificate profiles

    +

    Figure: Managing certificate profiles

    Managing certificate profiles

    To manage a certificate profile:

    • Click the info icon (Info) to see detailed information of the certificate. -

      Figure: Certificate information

      +

      Figure: Certificate information

      Certificate information

    • Click the pencil icon (Pencil) to change the author or distributor certificate of the selected certificate profile. -

      Figure: Changing the certificate

      +

      Figure: Changing the certificate

      Changing the certificate

    • Click the trash icon (Trash) to remove the selected certificate profile. -

      Figure: Removing the certificate profile

      +

      Figure: Removing the certificate profile

      Removing the certificate profile

    • The active profile is used when you package your application. Click the check icon to set the selected certificate profile as active. diff --git a/org.tizen.studio/html/common_tools/command_line_interface.htm b/org.tizen.studio/html/common_tools/command_line_interface.htm index 0e35c96..7740608 100644 --- a/org.tizen.studio/html/common_tools/command_line_interface.htm +++ b/org.tizen.studio/html/common_tools/command_line_interface.htm @@ -5,7 +5,7 @@ - + @@ -20,7 +20,7 @@

      Mobile Wearable

      - +

      Dependencies

        @@ -58,7 +58,7 @@ export PATH=$PATH:$<TIZEN_STUDIO>/tools/ide/bin/

        Setting Configuration Options

        The command displays, sets, replaces, and removes CLI configuration options. The CLI configuration keys are:

        - +
        • default.build.architecture=<x86|arm>: Sets the default executable architecture type.
        • default.build.compiler=<llvm|gcc>: Sets the default compiler.
          • @@ -101,7 +101,7 @@ tizen cli-config [options]
          • Display a list of all configurations for which values are set.

            Windows®, Ubuntu, and Mac OS® X:

            - + 
             > tizen cli-config -l
 default.build.architecture=x86
@@ -113,9 +113,9 @@ default.sdb.timeout=60000
 
          • Set a profiles.xml path globally.
 	
            Windows®:
            
 
            -> tizen cli-config –g "default.profiles.path=C:\Users\workspace\.metadata\.plugins\org.tizen.common.sign\profiles.xml"
+> tizen cli-config –g "default.profiles.path=C:\Users\workspace\.metadata\.plugins\org.tizen.common.sign\profiles.xml"
 
            
-	
+
 	
            Ubuntu and Mac OS® X:
            
 
             $ tizen cli-config –g default.profiles.path=~/workspace/.metadata/.plugins/org.tizen.common.sign/profiles.xml
@@ -155,10 +155,10 @@ tizen list <option>
  
 
 
            Examples:
            
-
               
+
                
    
              • List all native application templates.
    
                Windows®, Ubuntu, and Mac OS® X:
                
-   
+
 
                 > tizen list native-project
 
@@ -173,7 +173,7 @@ wearable-2.3		shared_library
    
                • 
    
              • List rootstraps.
    
                Windows®, Ubuntu, and Mac OS® X:
                
-   
+
 
                 > tizen list rootstrap
 [ROOTSTRAP] 			[INFORMATION]
@@ -205,7 +205,7 @@ tizen create <sub-command> [options]
  native-project [options] or web-project [options]
  Create the Tizen native or Web project.

                
 	Options are:
-	
                   
+	
                    
 		
                  • -p, --profile: Specifies the profile name.
                    • 
 		
                  • -t, --template: Specifies the template name.
                    • 
 		
                  • -n, --name: Specifies the project name.
                    • 
@@ -216,7 +216,7 @@ tizen create <sub-command> [options]
 
 
 
                    Examples:
                    
-
                       
+
                        
    
                      • Create the template project based on the basic Tizen mobile UI project.
    
                        Windows®:
                        
 
@@ -254,7 +254,7 @@ tizen <sub-command> [options]
  build-native [options]
  Build the Tizen native project.

                        
 	Options are:
-	
                           
+	
                            
 		
                          • -a, --arch: Specifies the architecture type: x86 (default) or arm
                            • 
 		
                          • -c, --compiler: Specifies the compiler to build: llvm (default) or gcc
                            • 
 		
                          • -C, --configuration: Specifies the build configuration: Debug (default) or Release
                            • 
@@ -268,7 +268,7 @@ tizen <sub-command> [options]
  build-web [options]
  Build the Tizen Web project.

                            
 	Options are:
-	
                               
+	
                                
 		
                              • -e, --exclude: Specifies a list of exclude files by patterns. By default, the following resources are excluded: .build/*, .build, .sign/*, .sign, webUnitTest/*, webUnitTest, .externalToolBuilders/*, .externalToolBuilders, .buildResult/*, .buildResult, .settings/*, .settings, .package/*, .package, .tproject, .project, .sdk_delta.info, .rds_delta, *.wgt, .tizen-ui-builder-tool.xml
                                • 
 		
                              • -euf, --exclude-uifw: Specifies whether to exclude the Tizen Web UI framework, and use the Tizen UI framework in the target. This option is only used for applications using the Tizen UI framework.
                                • 
 		
                              • -out, --output: Sets the output directory name. If you omit this option, the .buildResult directory is created under the project directory by default.
                                • 
@@ -280,7 +280,7 @@ tizen <sub-command> [options]
 
 
 
                                Examples:
                                
-
                                   
+
                                    
    
                                  • Build the native project with the x86, llvm, and Debug options.
    
                                    Windows®:
                                    
 
@@ -351,7 +351,7 @@ tizen clean [-- <project directory>]
 
 
 
                                    Examples:
                                    
-
                                       
+
                                        
    
                                      • Clean the project.
    
                                        Windows®:
                                        
 
@@ -393,15 +393,15 @@ tizen certificate [options]
 
 
  -c, --country <country code>
- Specifies the user's country code, which consists of 2 letters.
+ Specifies the user's country code, which consists of 2 letters.
 
 
  -s, --state <state>
- Specifies the user's state.
+ Specifies the user's state.
 
 
  -ct, --city <city>
- Specifies the user's city.
+ Specifies the user's city.
 
 
  -o, --organization <organization>
@@ -409,7 +409,7 @@ tizen certificate [options]
 
 
  -u, --unit <unit>
- Specifies the user's organization unit.
+ Specifies the user's organization unit.
 
 
  -n, --name <name>
@@ -433,45 +433,45 @@ tizen certificate [options]
 
 
 
                                        Examples:
                                        
-
                                           
+
                                            
    
                                          • Generate a certificate.
    
                                            Windows®:
                                            
 
 
                                            -> tizen certificate -a MyTizen -p 1234 -c KR -s Seoul -ct Gangnamgu -o Tizen –u Development -n "Gildong Hong" -e gildonghong@example.org -f mycert
+> tizen certificate -a MyTizen -p 1234 -c KR -s Seoul -ct Gangnamgu -o Tizen –u Development -n "Gildong Hong" -e gildonghong@example.org -f mycert
 Generating a certificate with
-    File name = mycert
-    Container Password = ****
-    Alias = MyTizen
-    Key Password = ****
-    Country = KR
-    State = Seoul
-    City = Gangnamgu
-    Name = Gildong Hong
-    Organization = Tizen
-    Organization Unit = Develop
-    E-mail = gildonghong@example.org
-'mycert' has been generated in 'C:\tizen-sdk-data\keystore\author'.
+    File name = mycert
+    Container Password = ****
+    Alias = MyTizen
+    Key Password = ****
+    Country = KR
+    State = Seoul
+    City = Gangnamgu
+    Name = Gildong Hong
+    Organization = Tizen
+    Organization Unit = Develop
+    E-mail = gildonghong@example.org
+'mycert' has been generated in 'C:\tizen-sdk-data\keystore\author'.
 
                                            
 
 	
                                            Ubuntu and Mac OS® X:
                                            
 
 
                                             $ tizen certificate -a MyTizen -p 1234 -c KR -s Seoul -ct Gangnamgu -o Tizen –u
-Development -n "Gildong Hong" -e gildonghong@example.org -f mycert
+Development -n "Gildong Hong" -e gildonghong@example.org -f mycert
 Generating a certificate with
-    File name = mycert
-    Container Password = ****
-    Alias = MyTizen
-    Key Password = ****
-    Country = KR
-    State = Seoul
-    City = Gangnamgu
-    Name = Gildong Hong
-    Organization = Tizen
-    Organization Unit = Develop
-    E-mail = gildonghong@example.org
-'mycert' has been generated in '~/tizen-sdk-data/keystore/author'.
+    File name = mycert
+    Container Password = ****
+    Alias = MyTizen
+    Key Password = ****
+    Country = KR
+    State = Seoul
+    City = Gangnamgu
+    Name = Gildong Hong
+    Organization = Tizen
+    Organization Unit = Develop
+    E-mail = gildonghong@example.org
+'mycert' has been generated in '~/tizen-sdk-data/keystore/author'.
 
                                            
    
                                            • 
 
                                          
@@ -496,7 +496,7 @@ tizen security-profiles <sub-command> [options]
  add [options]
  Adds the specified security profile, which can contain several certificates.

                                          
 	Options are:
-	
                                             
+	
                                              
 		
                                            • -n, --name: Specifies the name of the security profile to add.
                                              • 
 		
                                            • -a, --path: Specifies the directory path where the author certificate file is located. The format of the certificate is PKCS#12, and the file extension is .p12.
                                              • 
 		
                                            • -p, --password: Specifies the password used to access the author certificate.
                                              • 
@@ -514,7 +514,7 @@ tizen security-profiles <sub-command> [options]
  list [options]
  Displays security profiles. If you specify the name of the security profile, the detailed information of the specified security profile is displayed.

                                              
 	Options are:
-	
                                                 
+	
                                                  
 		
                                                • -n, --name: Specifies the name of the security profile to list. If you skip this option, a set of the security profile names in the profiles.xml file is displayed.
                                                  • 
 		
                                                • --: Specifies the directory path where the profiles.xml file is located.
                                                  • 
 	
                                                
@@ -524,7 +524,7 @@ tizen security-profiles <sub-command> [options]
  remove [options]
  Removes the specified security profile.

                                                
 	Options are:
-	
                                                   
+	
                                                    
 		
                                                  • -n, --name: Specifies the name of the security profile to remove.
                                                    • 
 		
                                                  • --: Specifies the directory path where the profiles.xml file is located.
                                                    • 
 	
                                                  
@@ -533,7 +533,7 @@ tizen security-profiles <sub-command> [options]
 
 
 
                                                  Examples:
                                                  
-
                                                     
+
                                                      
    
                                                    • Add a new security profile.
    
                                                      Windows®:
                                                      
 
@@ -546,10 +546,10 @@ distributor1 path: C:\tizen-sdk\tools\certificate-generator\certificates\distrib
 distributor1 password: *************************
 distributor1 CA path: C:\tizen-sdk\tools\certificate-generator\certificates\distributor\tizen-distributor-ca.cer
 
-In Configuration, Set a default profile path to 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
-Wrote to 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
-Succeed to add 'MyProfile' profile.
-If want to sign by this, add the file of security profiles in CLI configuration like 'tizen cli-config "default.profiles.path=C:\tizen-sdk-data\ide\keystore\profiles.xml"'.
+In Configuration, Set a default profile path to 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
+Wrote to 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
+Succeed to add 'MyProfile' profile.
+If want to sign by this, add the file of security profiles in CLI configuration like 'tizen cli-config "default.profiles.path=C:\tizen-sdk-data\ide\keystore\profiles.xml"'.
 
                
 
 	
                Ubuntu and Mac OS® X:
                
@@ -563,10 +563,10 @@ distributor1 path: ~/tizen-sdk/tools/certificate-generator/certificates/distribu
 distributor1 password: *************************
 distributor1 CA path: ~/tizen-sdk/tools/certificate-generator/certificates/distributor/tizen-distributor-ca.cer
 
-In Configuration, Set a default profile path to '~/tizen-sdk-data/ide/keystore/profiles.xml'.
-Wrote to '~/tizen-sdk-data/ide/keystore/profiles.xml'.
-Succeed to add 'MyProfile' profile.
-If want to sign by this, add the file of security profiles in CLI configuration like 'tizen cli-config "default.profiles.path=~/tizen-sdk-data/ide/keystore/profiles.xml"'.
+In Configuration, Set a default profile path to '~/tizen-sdk-data/ide/keystore/profiles.xml'.
+Wrote to '~/tizen-sdk-data/ide/keystore/profiles.xml'.
+Succeed to add 'MyProfile' profile.
+If want to sign by this, add the file of security profiles in CLI configuration like 'tizen cli-config "default.profiles.path=~/tizen-sdk-data/ide/keystore/profiles.xml"'.
 
            
    
            • 
    
          • Display the security profile list.
@@ -574,7 +574,7 @@ If want to sign by this, add the file of security profiles in CLI configuration
 
 
             > tizen security-profiles list
-Loaded in 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
+Loaded in 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
 ========================================
 Name
 ========================================
@@ -585,7 +585,7 @@ MyProfile
 
 
             $ tizen security-profiles list
-Loaded in '~/tizen-sdk-data/ide/keystore/profiles.xml'.
+Loaded in '~/tizen-sdk-data/ide/keystore/profiles.xml'.
 ========================================
 Name
 ========================================
@@ -597,9 +597,9 @@ MyProfile
 
 
             > tizen security-profiles list –n MyProfile
-Loaded in 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
+Loaded in 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
 ========================================
-'MyProfile' profile information
+'MyProfile' profile information
 ========================================
 author path: C:\tizen-sdk-data\keystore\author\mycert.p12
 author password: ****
@@ -612,9 +612,9 @@ distributor1 CA path: C:\tizen-sdk\tools\certificate-generator\certificates\dist
 
 
             $ tizen security-profiles list –n MyProfile
-Loaded in '~/tizen-sdk-data/ide/keystore/profiles.xml'.
+Loaded in '~/tizen-sdk-data/ide/keystore/profiles.xml'.
 ========================================
-'MyProfile' profile information
+'MyProfile' profile information
 ========================================
 author path: ~/tizen-sdk-data/keystore/author/mycert.p12
 author password: ****
@@ -628,18 +628,18 @@ distributor1 CA path: ~/tizen-sdk/tools/certificate-generator/certificates/distr
 
 
             > tizen security-profiles remove
-Loaded in 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
-Wrote to 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
-Succeed to remove 'MyProfile' profile
+Loaded in 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
+Wrote to 'C:\tizen-sdk-data\ide\keystore\profiles.xml'.
+Succeed to remove 'MyProfile' profile
 
            
 
 	
            Ubuntu and Mac OS® X:
            
 
 
             $ tizen security-profiles remove
-Loaded in '~/tizen-sdk-data/ide/keystore/profiles.xml'.
-Wrote to '~/tizen-sdk-data/ide/keystore/profiles.xml'.
-Succeed to remove 'MyProfile' profile
+Loaded in '~/tizen-sdk-data/ide/keystore/profiles.xml'.
+Wrote to '~/tizen-sdk-data/ide/keystore/profiles.xml'.
+Succeed to remove 'MyProfile' profile
 
            
    
            •
          @@ -679,7 +679,7 @@ tizen package [options]

          Examples:

          -
            +
            • Package the project.

              Windows®:

              @@ -689,18 +689,18 @@ Initialize... OK Copying files... OK Signing... OK Zip path: C:\Users\workspace\basic\Debug\org.tizen.basic-1.0.0-i386.tpk -    adding: bin/ (in=0) (out=0) (stored 0%) -    adding: bin/basic (in=11422) (out=4939) (deflated 57%) -    adding: tizen-manifest.xml (in=428) (out=247) (deflated 42%) -    adding: lib/ (in=0) (out=0) (stored 0%) -    adding: signature1.xml (in=4254) (out=1971) (deflated 54%) -    adding: shared/ (in=0) (out=0) (stored 0%) -    adding: shared/data/ (in=0) (out=0) (stored 0%) -    adding: shared/trusted/ (in=0) (out=0) (stored 0%) -    adding: shared/res/ (in=0) (out=0) (stored 0%) -    adding: shared/res/basic.png (in=57662) (out=18633) (deflated 68%) -    adding: author-signature.xml (in=4132) (out=2174) (deflated 47%) -    adding: res/ (in=0) (out=0) (stored 0%) + adding: bin/ (in=0) (out=0) (stored 0%) + adding: bin/basic (in=11422) (out=4939) (deflated 57%) + adding: tizen-manifest.xml (in=428) (out=247) (deflated 42%) + adding: lib/ (in=0) (out=0) (stored 0%) + adding: signature1.xml (in=4254) (out=1971) (deflated 54%) + adding: shared/ (in=0) (out=0) (stored 0%) + adding: shared/data/ (in=0) (out=0) (stored 0%) + adding: shared/trusted/ (in=0) (out=0) (stored 0%) + adding: shared/res/ (in=0) (out=0) (stored 0%) + adding: shared/res/basic.png (in=57662) (out=18633) (deflated 68%) + adding: author-signature.xml (in=4132) (out=2174) (deflated 47%) + adding: res/ (in=0) (out=0) (stored 0%) total bytes=77898, compressed=27964 -> 64% savings Zipping... OK Package File Location: C:\Users\workspace\basic\Debug\org.tizen.basic-1.0.0-i386.tpk @@ -714,25 +714,25 @@ Initialize... OK Copying files... OK Signing... OK Zip path: ~/workspace/basic/Debug/org.tizen.basic-1.0.0-i386.tpk -    adding: bin/ (in=0) (out=0) (stored 0%) -    adding: bin/basic (in=11422) (out=4939) (deflated 57%) -    adding: tizen-manifest.xml (in=428) (out=247) (deflated 42%) -    adding: lib/ (in=0) (out=0) (stored 0%) -    adding: signature1.xml (in=4254) (out=1971) (deflated 54%) -    adding: shared/ (in=0) (out=0) (stored 0%) -    adding: shared/data/ (in=0) (out=0) (stored 0%) -    adding: shared/trusted/ (in=0) (out=0) (stored 0%) -    adding: shared/res/ (in=0) (out=0) (stored 0%) -    adding: shared/res/basic.png (in=57662) (out=18633) (deflated 68%) -    adding: author-signature.xml (in=4132) (out=2174) (deflated 47%) -    adding: res/ (in=0) (out=0) (stored 0%) + adding: bin/ (in=0) (out=0) (stored 0%) + adding: bin/basic (in=11422) (out=4939) (deflated 57%) + adding: tizen-manifest.xml (in=428) (out=247) (deflated 42%) + adding: lib/ (in=0) (out=0) (stored 0%) + adding: signature1.xml (in=4254) (out=1971) (deflated 54%) + adding: shared/ (in=0) (out=0) (stored 0%) + adding: shared/data/ (in=0) (out=0) (stored 0%) + adding: shared/trusted/ (in=0) (out=0) (stored 0%) + adding: shared/res/ (in=0) (out=0) (stored 0%) + adding: shared/res/basic.png (in=57662) (out=18633) (deflated 68%) + adding: author-signature.xml (in=4132) (out=2174) (deflated 47%) + adding: res/ (in=0) (out=0) (stored 0%) total bytes=77898, compressed=27964 -> 64% savings Zipping... OK Package File Location: ~/workspace/basic/Debug/org.tizen.basic-1.0.0-i386.tpk
            -
              +
              • Re-sign the package.

                Windows®:

                @@ -825,13 +825,13 @@ tizen build-app [options] [args specified with JSON-like format] 
                 build: [
-    {
-        name: <build alias>,
-        targets: [<project directories in workspace separated by commas>],
-        methods: [<build methods separated by commas>],
-        output: <build output path>,
-        multitask: <cout of processes>
-    }
+    {
+        name: <build alias>,
+        targets: [<project directories in workspace separated by commas>],
+        methods: [<build methods separated by commas>],
+        output: <build output path>,
+        multitask: <cout of processes>
+    }
 ]
                @@ -841,15 +841,15 @@ build: [ 
                 method: [
-    {
-        name: <method name>,
-        compiler: <compiler name, such as GCC, LLVM>,
-        rootstraps: [
-            {name: <ID of a dependent project>, platform: <platform name>, arch: <architecture>}
-        ],
-        predefines: [<predefined build macros separated by commas>],
-        configs: [<build config>]
-    }
+    {
+        name: <method name>,
+        compiler: <compiler name, such as GCC, LLVM>,
+        rootstraps: [
+            {name: <ID of a dependent project>, platform: <platform name>, arch: <architecture>}
+        ],
+        predefines: [<predefined build macros separated by commas>],
+        configs: [<build config>]
+    }
 ]
                @@ -859,12 +859,12 @@ method: [ 
                 package: [
-    {
-        name: <package name>,
-        type: <package type, such as .tpk, .wgt>,
-        targets: [< build file or project directories in workspace separated by commas>],
-        output: <package file path>
-    }
+    {
+        name: <package name>,
+        type: <package type, such as .tpk, .wgt>,
+        targets: [< build file or project directories in workspace separated by commas>],
+        output: <package file path>
+    }
 ]
                @@ -872,7 +872,7 @@ package: [

                Examples:

                -
                  +
                  • Package the Web multi application.

                    Windows®, Ubuntu, and Mac OS® X:

                    @@ -881,7 +881,7 @@ package: [
                  -
                    +
                    • Package the native multi package with the debug and release build configurations.

                      Windows®, Ubuntu, and Mac OS® X:

                      @@ -927,7 +927,7 @@ tizen install [options]

                      Examples:

                      -
                        +
                        • Install the basic application, whose package name is org.tizen.basic-1.0.0-i386.tpk, on the emulator-26101.

                          Windows®:

                          @@ -974,7 +974,7 @@ tizen run [options]

                          Examples:

                          -
                            +
                            • Run the basic application, whose package ID is org.tizen.basic, on the emulator-26101.

                              Windows®, Ubuntu, and Mac OS® X:

                              @@ -1016,7 +1016,7 @@ tizen uninstall [options]

                              Examples:

                              -
                                +
                                • Uninstall the basic application, whose package ID is org.tizen.basic, from the emulator-26101.

                                  Windows®, Ubuntu, and Mac OS® X:

                                  @@ -1041,7 +1041,7 @@ cli-config, list, create, build-native, build-web, clean, certificate, security-

                                  Examples:

                                  -
                                    +
                                    • Display the manual for the create command.

                                      Windows®, Ubuntu, and Mac OS® X:

                                      @@ -1053,28 +1053,28 @@ tizen create Creates a Tizen native project. Syntax: -    tizen create native-project [options] + tizen create native-project [options] Options: -    -p, --profile <profile name> -        Specifies the profile name. -    -t, --template <template name> -        Specifies the template name. -    -n, --name <project name> -        Specifies the project name. -    -- <destination directory> -        Specifies the destination directory where the project is created. + -p, --profile <profile name> + Specifies the profile name. + -t, --template <template name> + Specifies the template name. + -n, --name <project name> + Specifies the project name. + -- <destination directory> + Specifies the destination directory where the project is created. Examples: -    Creates the template project based on the basic Tizen mobile UI project: -        Windows®: -            > tizen.bat create native-project -p mobile-2.4 -t basic-ui -n basic -- -                C:\Users\workspace -                >cd C:\Users\workspace\basic -        Ubuntu and Mac OS® X: -                $ tizen create native-project -p mobile-2.4 -t basic-ui -n basic -- /ho -                me/workspace -                $ cd /home/workspace/basic + Creates the template project based on the basic Tizen mobile UI project: + Windows®: + > tizen.bat create native-project -p mobile-2.4 -t basic-ui -n basic -- + C:\Users\workspace + >cd C:\Users\workspace\basic + Ubuntu and Mac OS® X: + $ tizen create native-project -p mobile-2.4 -t basic-ui -n basic -- /ho + me/workspace + $ cd /home/workspace/basic
                                    @@ -1089,7 +1089,7 @@ tizen version

                                    Examples:

                                    -
                                      +
                                      • Display the CLI version number.

                                        Windows®, Ubuntu, and Mac OS® X:

                                        diff --git a/org.tizen.studio/html/common_tools/connection_explorer_view.htm b/org.tizen.studio/html/common_tools/connection_explorer_view.htm index 4dcf753..ac1fc0d 100644 --- a/org.tizen.studio/html/common_tools/connection_explorer_view.htm +++ b/org.tizen.studio/html/common_tools/connection_explorer_view.htm @@ -5,22 +5,22 @@ - + - Managing and Connecting Devices for Testing + Managing and Connecting Devices for Testing - + @@ -39,8 +39,8 @@

                                        Managing and Connecting Devices for Testing

                                        The Connection Explorer view shows the devices connected to the system. A list of connected devices is available after connecting a device or launching a Tizen emulator with a tree view. The Connection Explorer view provides the following actions for the connected devices:

                                        - -
                                          + +
                                          • Show a list of connected devices and connects devices for running and debugging the application
                                          • Provide file operations on connected devices
                                          • Send or receive files between the Project Explorer and Connection Explorer views by dragging and dropping
                                            • @@ -48,15 +48,15 @@
                                          • Launch the Emulator Manager to handle the multiple instances of the emulator
                                          -

                                          Figure: Connection Explorer view

                                          -

                                          Connection Explorer view

                                          - +

                                          Figure: Connection Explorer view

                                          +

                                          Connection Explorer view

                                          +

                                          Running and Debugging the Application with Devices

                                          You can test Tizen applications with connected devices using the following ways:

                                          - -
                                            + +
                                            • Testing applications on a physical device connected to the host system: -
                                                +
                                                1. Connect your device to the host system by using a USB connector. The device icon (Device icon) is displayed in the Connection Explorer view.
                                                2. Select the device in the Connection Explorer view. It is ready to be run and used to test your project.
                                                @@ -70,16 +70,16 @@
                                              1. Testing applications on a remote device

                                                To connect to the remote device:

                                                -
                                                  +
                                                  1. In the Connection Explorer view toolbar, click the Remote Device Manager icon Remote Device Manager icon.

                                                    When the Remote Device Manager is launched, it automatically starts to scan nearby remote devices

                                                    -
                                                      -
                                                    • If a remote device exists on the host system's subnet, the remote device information is registered to the Remote Device Manager automatically.
                                                      • +
                                                        +
                                                      • If a remote device exists on the host system's subnet, the remote device information is registered to the Remote Device Manager automatically.
                                                      • To add remote device information, click New.

                                                        In a dialog box, enter the Name, IP, and Port of the remote device.

                                                        To modify the remote device information later on, select the device in the Remote Device Manager, click Edit, and modify the Name, IP, and Port in a dialog box.

                                                        • -
                                                      +
                                                  2. In the Remote Device Manager, select a remote device.
                                                  3. Click Connect.
                                                    4. @@ -87,20 +87,20 @@

                                                  When testing is finished, disconnect the remote device by selecting the device in the Remote Device Manager and clicking Disconnect. To remove the remote device from the Remote Device Manager, select the device in the Remote Device Manager and click Delete.

                                            - +

                                            Transferring Files to Devices

                                            You can transfer files between the connected devices and the host system:

                                            -
                                              +
                                              • To transfer a file from a connected device to the host file system, pull the selected file to the desired host system path.
                                              • To transfer a file from the host file system to a connected device, push the selected file to the desired connected device path.
                                                • -
                                              +

                                            Configuring Preferences

                                            You can set the following preferences for the Connection Explorer view:

                                            -
                                              +
                                              • Change the Emulator Manager path
                                              • Set the file transfer timeout value
                                                • -
                                              +

                                            To see the preferences, go to Window > Preferences > Tizen Studio > Tools > Connection Explorer.

                                            diff --git a/org.tizen.studio/html/common_tools/da_advanced.htm b/org.tizen.studio/html/common_tools/da_advanced.htm index 7b843a5..9cb1503 100644 --- a/org.tizen.studio/html/common_tools/da_advanced.htm +++ b/org.tizen.studio/html/common_tools/da_advanced.htm @@ -49,8 +49,8 @@

                                            You can create markers at specific times and analyze the time between the markers:

                                            1. Create the markers by double-clicking a chart or detail table view that has a timestamp.
                                              2. -
                                            2. Right-click between the markers, and select Range Analysis. -

                                              The table data is updated based on the range inspection results.

                                              3. +
                                            3. Right-click between the markers, and select Range Analysis. +

                                              The table data is updated based on the range inspection results.

                                            Figure: Range inspection with markers

                                            Range inspection with markers

                                            @@ -81,7 +81,7 @@
                                          • RAM
                                          • Binary Information
                                          -

                                          Figure: Target dialog

                                          +

                                          Figure: Target dialog

                                          Target dialog

                                        @@ -91,7 +91,7 @@
                                      • You can save the analysis result to a zip file.

                                        Figure: Saving data

                                        Saving data

                                        -
                                        • +
                                      • You can load the analysis result from the zip file. After loading, the chart and table data are updated from the loaded data.

                                        Figure: Loading data

                                        Loading data

                                        @@ -242,37 +242,37 @@ 
                                         Usage: dacli.jar <command> [options ...]
 List of commands:
-    devices : show list of connected devices and emulators
-        -u                           show list of devices where tracing is running
-    apps <ip:port|serial> : show list of applications of specified target
-    start <ip:port|serial> : start tracing on specified target for specified 
-                             application using selected tracing features
-        -a <application>             application to trace
-        -o <output filename>         redirect tracing output to file
-        -C,--cpu-usage <arg>         select cpu usage tracing
-                                     Possible arguments: usage, core, frequency, all
-                                     If no arguments provided - 'all' is selected
-        -M,--memory <arg>            select memory tracing
-                                     Possible arguments: system, process, heap, all
-                                     If no arguments provided - 'process,system' is selected
-        -F,--file <arg>              select file tracing
-                                     Possible arguments: io, analysis, all
-                                     If no arguments provided - 'all' is selected
-        -G,--graphics <arg>          select graphics tracing
-                                     Possible arguments: opengl, all
-                                     If no arguments provided - 'all' is selected
-        -N,--network <arg>           select network tracing
-                                     Possible arguments: io, analysis, all
-                                     If no arguments provided - 'all' is selected
-        -T,--thread-analysis         Select thread analysis tracing
-        -U,--ui-event                Select ui event tracing
-        -P,--peripheral-status       Select peripheral status tracing
-        -E,--power-estimation        Select power estimation tracing
-        -S <period>                  Enable screenshots capturing periodically
-        -s,                          Enable screenshots capturing on scene transition
-    stop <ip:port|serial> : stop currently running tracing process on specified 
-        device
-    version : print information about version
+    devices : show list of connected devices and emulators
+        -u                           show list of devices where tracing is running
+    apps <ip:port|serial> : show list of applications of specified target
+    start <ip:port|serial> : start tracing on specified target for specified
+                             application using selected tracing features
+        -a <application>             application to trace
+        -o <output filename>         redirect tracing output to file
+        -C,--cpu-usage <arg>         select cpu usage tracing
+                                     Possible arguments: usage, core, frequency, all
+                                     If no arguments provided - 'all' is selected
+        -M,--memory <arg>            select memory tracing
+                                     Possible arguments: system, process, heap, all
+                                     If no arguments provided - 'process,system' is selected
+        -F,--file <arg>              select file tracing
+                                     Possible arguments: io, analysis, all
+                                     If no arguments provided - 'all' is selected
+        -G,--graphics <arg>          select graphics tracing
+                                     Possible arguments: opengl, all
+                                     If no arguments provided - 'all' is selected
+        -N,--network <arg>           select network tracing
+                                     Possible arguments: io, analysis, all
+                                     If no arguments provided - 'all' is selected
+        -T,--thread-analysis         Select thread analysis tracing
+        -U,--ui-event                Select ui event tracing
+        -P,--peripheral-status       Select peripheral status tracing
+        -E,--power-estimation        Select power estimation tracing
+        -S <period>                  Enable screenshots capturing periodically
+        -s,                          Enable screenshots capturing on scene transition
+    stop <ip:port|serial> : stop currently running tracing process on specified
+        device
+    version : print information about version

                                        Environment Setup

                                        @@ -308,12 +308,12 @@ export PATH=$PATH:<path-to-tizen-studio>/tools/dynamic-analyzer/ 
                                         $ ./dacli.jar devices
 List of connected devices:
-    <Device Name> <Serial Number>
-    m-0818-1      emulator-26101
+    <Device Name> <Serial Number>
+    m-0818-1      emulator-26101

                                        Take note of the device serial number. It is used to specify the device in other Dynamic Analyzer CLI commands.

                                        -
                                        • +
                                      • apps

                                        The command shows a list of installed applications on a specified device.

                                        Command syntax:

                                        @@ -327,12 +327,12 @@ apps <ip:port|serial> 
                                         $ ./dacli.jar apps emulator-26101
 List of installed applications:
-    <Package Name>                 : <Application Name>
-    org.tizen.camera-app           : Camera
-    org.tizen.calendar             : Calendar
-    org.tizen.contacts             : Contacts
-    org.tizen.gallery              : Gallery
-    org.tizen.browser              : Internet
+    <Package Name>                 : <Application Name>
+    org.tizen.camera-app           : Camera
+    org.tizen.calendar             : Calendar
+    org.tizen.contacts             : Contacts
+    org.tizen.gallery              : Gallery
+    org.tizen.browser              : Internet

                                        Take note of your application name. It is used to specify the application in other Dynamic Analyzer CLI commands. If you cannot find your application, make sure it has been installed (for example, from the Tizen Studio).

                                        @@ -351,7 +351,7 @@ start <ip:port|serial> -a <application> <features> [options… 
                                         $ ./dacli.jar start emulator-26101 -a Camera -C
 DA tracing started.
-Run "dacli stop emulator-26101" to finish it.
+Run "dacli stop emulator-26101" to finish it.

                                        You can specify the -o option to customize the tracing result location.

                                        • @@ -431,4 +431,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + diff --git a/org.tizen.studio/html/common_tools/da_common.htm b/org.tizen.studio/html/common_tools/da_common.htm index 3827b73..220cc44 100644 --- a/org.tizen.studio/html/common_tools/da_common.htm +++ b/org.tizen.studio/html/common_tools/da_common.htm @@ -5,22 +5,22 @@ - + - Handling Common Dynamic Analyzer Tasks + Handling Common Dynamic Analyzer Tasks - +

                                        Mobile Wearable

                                        - +

                                        Dependencies

                                        @@ -119,7 +119,7 @@

                                        Figure: Toolbar

                                        Toolbar

                                          - +
                                        1. Target combo: Select the target device.
                                        2. Application combo: Select the target application.
                                        3. Start/Stop trace button: Start or stop the trace.
                                          4. @@ -131,7 +131,7 @@

                                        Page Tabs

                                        -

                                        The Dynamic Analyzer separates the detailed features into various page tags. Most traces are done with the Timeline tab. However, there are separate tabs, for example, for the memory allocation, OpenGL, and thread synchronization analysis.

                                        +

                                        The Dynamic Analyzer separates the detailed features into various page tags. Most traces are done with the Timeline tab. However, there are separate tabs, for example, for the memory allocation, OpenGL, and thread synchronization analysis.

                                        Chart View

                                        Each feature has a chart that displays the analysis results. The charts are represented in various forms, such as areas, lines, bars, and points.

                                        @@ -219,14 +219,14 @@

                                        Function Profiling Table

                                        The Function Profiling table shows the method usage information of an application. The information is divided into 2 units:

                                        -
                                          +
                                          • Application directory contains the methods that are created in the application code.
                                          • Dependent library directory contains the methods that are used in the application code.

                                          The table contains the following columns:

                                          -
                                            +
                                            • Library or function name: Library unit (application or dependent), the binary/library name, and the method name in a tree format
                                            • Exclusive CPU time: Exclusive CPU time in seconds
                                            • Exclusive CPU rate: Exclusive CPU rate in percentages
                                              • @@ -245,7 +245,7 @@

                                              Failed API Table

                                              The Failed API table contains the following columns:

                                              -
                                                +
                                                • Time: Timestamp
                                                • API: Name of the failed API or function
                                                • Parameter: Parameter
                                                  • @@ -261,7 +261,7 @@

                                                  Warning Table

                                                  The Warning table contains the following columns:

                                                  -
                                                    +
                                                    • Category: Warning category
                                                    • PID: PID
                                                    • Warning: Warning message
                                                      • diff --git a/org.tizen.studio/html/common_tools/da_file.htm b/org.tizen.studio/html/common_tools/da_file.htm index aff808c..3e01918 100644 --- a/org.tizen.studio/html/common_tools/da_file.htm +++ b/org.tizen.studio/html/common_tools/da_file.htm @@ -15,12 +15,12 @@ - +

                                                      Mobile Wearable

                                                      - +

                                                      Dependencies

                                                        @@ -49,8 +49,8 @@

                                                        Figure: File analysis

                                                        File analysis

                                                        - - + +

                                                        Together, the views show the following information:

                                                        • Name and location of the file
                                                          • @@ -67,12 +67,12 @@
                                                        • A non-target file is the opposite of the target file. For example, if you are only interested in internal calls, files that include direct calls are non-target files.
                                                        - +

                                                        File Chart

                                                        The file chart has a separated child and parent chart. There can be only 1 parent chart of each file, whereas multiple child charts are supported. Multiple child charts are separated by PID and TID. The parent chart records all the operations performed by the child charts.

                                                        Figure: File chart

                                                        -

                                                        File chart

                                                        +

                                                        File chart

                                                        The file chart shows the following information:

                                                          @@ -82,13 +82,13 @@
                                                        • Aqua area indicates the open area of the file. (B)
                                                        -
                                                      • The upper side lines displayed on the child chart indicate the time of locking the file: +
                                                      • The upper side lines displayed on the child chart indicate the time of locking the file:
                                                        • Violet area indicates the lock area of the file. (D)
                                                        • Purple area indicates the lock waiting of the file. (E)
                                                        • -
                                                      • The lower side lines displayed on the child chart indicate the time of reading and writing the file: +
                                                      • The lower side lines displayed on the child chart indicate the time of reading and writing the file:
                                                        • Sky blue area or line indicates the write or read area of the file. (C)
                                                        • Blue area or line indicates the concurrent writing or reading of the file without the lock.
                                                          • diff --git a/org.tizen.studio/html/common_tools/da_memory.htm b/org.tizen.studio/html/common_tools/da_memory.htm index 377a029..51957fd 100644 --- a/org.tizen.studio/html/common_tools/da_memory.htm +++ b/org.tizen.studio/html/common_tools/da_memory.htm @@ -15,12 +15,12 @@ - +

                                                          Mobile Wearable

                                                          - +

                                                          Dependencies

                                                            @@ -61,7 +61,7 @@
                                                            • System Memory chart

                                                              You can check the memory size of the system and process.

                                                              - +

                                                              Figure: System Memory chart

                                                              System Memory chart

                                                              • @@ -75,7 +75,7 @@

                                                              Process Memory chart

                                                            • Heap Allocation chart -

                                                              You can check the allocated heap memory size of the process. It is calculated by "total allocation – total free":

                                                              +

                                                              You can check the allocated heap memory size of the process. It is calculated by "total allocation – total free":

                                                              • Total: Allocated heap memory size of the process
                                                              • Main Executable: Allocated heap memory size of the main executable
                                                              @@ -123,8 +123,8 @@
                                                            • GEM: Sum of the unique GEM (Graphics Execution Manager) memory in the system
                                                          • Heap (Total): Main executable heap size + each library heap size
                                                            • -
                                                          • Main Executable: "Allocated memory – free memory" of the main executable
                                                            • -
                                                          • Each library: "Allocated memory – free memory" of each library
                                                            • +
                                                          • Main Executable: "Allocated memory – free memory" of the main executable
                                                            • +
                                                          • Each library: "Allocated memory – free memory" of each library

                                                          Range Analysis

                                                          @@ -188,7 +188,7 @@

                                                        CallStack

                                                        -

                                                        You can see a call stack for each allocation from the Persistent Allocations table in the CallStack table. The allocation's call stack is shown when you select an allocation in the Persistent Allocations table.

                                                        +

                                                        You can see a call stack for each allocation from the Persistent Allocations table in the CallStack table. The allocation's call stack is shown when you select an allocation in the Persistent Allocations table.

                                                        Figure: CallStack table

                                                        CallStack table

                                                        @@ -212,7 +212,7 @@
                                                      • Name: Library file name including a full path
                                                      • Low- and High-address: Address range of a library inside the process
                                                      - + diff --git a/org.tizen.studio/html/common_tools/da_network.htm b/org.tizen.studio/html/common_tools/da_network.htm index 27f84c5..a7f13c6 100644 --- a/org.tizen.studio/html/common_tools/da_network.htm +++ b/org.tizen.studio/html/common_tools/da_network.htm @@ -15,12 +15,12 @@ - +

                                                      Mobile Wearable

                                                      - +

                                                      Dependencies

                                                        @@ -49,12 +49,12 @@

                                                        Figure: Network analysis

                                                        Network analysis

                                                        - +

                                                        Network Chart

                                                        The network chart displays the socket object in a tree format using a graph.

                                                        Figure: Network chart

                                                        -

                                                        Network chart

                                                        +

                                                        Network chart

                                                        The color of the horizontal bar in the chart indicates the state of the socket:

                                                          @@ -69,7 +69,7 @@
                                                        • Red line indicates that the API has failed.
                                                        -
                                                      • The lower line: +
                                                      • The lower line:
                                                        • Purple area or line indicates the read area of the socket.
                                                        • Lime green area or line indicates the write area of the socket.
                                                          • diff --git a/org.tizen.studio/html/common_tools/da_opengl.htm b/org.tizen.studio/html/common_tools/da_opengl.htm index 0cfdc5f..35241e5 100644 --- a/org.tizen.studio/html/common_tools/da_opengl.htm +++ b/org.tizen.studio/html/common_tools/da_opengl.htm @@ -15,12 +15,12 @@ - +

                                                          Mobile Wearable

                                                          - +

                                                          Dependencies

                                                          @@ -55,7 +55,7 @@

                                                        Figure: OpenGL analysis

                                                        -

                                                        OpenGL analysis

                                                        +

                                                        OpenGL analysis

                                                        OpenGL® Chart

                                                        The OpenGL® chart displays the elapsed frame time with 2 charts:

                                                        @@ -63,7 +63,7 @@
                                                      • The Frame time chart shows the elapsed frame time. The X axis value of the frame time chart means the frame index number. A small chart value means a good status frame. Only the frames smaller than the value specified by the user and changed to yellow are visible.

                                                        Figure: Frame time chart

                                                        -

                                                        Frame time chart

                                                        +

                                                        Frame time chart

                                                      • The Frame rate chart shows the FPS. The X axis value of the frame rate chart means the analysis time. A larger chart value means a good status frame. @@ -76,7 +76,7 @@

                                                        The Statistics table displays the API statistics related to EvasGL and OpenGL® 2.0.

                                                        Figure: Statistics table

                                                        -

                                                        Statistics table

                                                        +

                                                        Statistics table

                                                        The table contains the following columns:

                                                          @@ -90,7 +90,7 @@

                                                          The API List table displays the APIs associated with the values selected in the chart.

                                                          Figure: API List table

                                                          -

                                                          API List table

                                                          +

                                                          API List table

                                                          The table contains the following columns:

                                                            @@ -110,7 +110,7 @@

                                                            The Redundant table displays the APIs that are called repeatedly with the same parameters.

                                                            Figure: Redundant table

                                                            -

                                                            Redundant table

                                                            +

                                                            Redundant table

                                                            The table contains the following columns:

                                                              @@ -124,7 +124,7 @@

                                                              The Context table displays the context rendering state associated with the item selected in the API List table. The title of the table refers to the context number of the selected API.

                                                              Figure: Context table

                                                              -

                                                              Context table

                                                              +

                                                              Context table

                                                              The table contains the following columns:

                                                                @@ -138,7 +138,7 @@

                                                                The Program table displays the program information associated with the items selected in the API List table.

                                                                Figure: Program table

                                                                -

                                                                Program table

                                                                +

                                                                Program table

                                                                The table contains the following columns:

                                                                  diff --git a/org.tizen.studio/html/common_tools/da_overview.htm b/org.tizen.studio/html/common_tools/da_overview.htm index af8854e..7cae771 100644 --- a/org.tizen.studio/html/common_tools/da_overview.htm +++ b/org.tizen.studio/html/common_tools/da_overview.htm @@ -5,22 +5,22 @@ - + - Monitoring Performance with Dynamic Analyzer + Monitoring Performance with Dynamic Analyzer - +

                                                                  Mobile Wearable

                                                                  - +

                                                                  Dependencies

                                                                    @@ -28,7 +28,7 @@

                                                                  Related Info

                                                                  @@ -46,7 +46,7 @@
                                                                • Study the tracing result and fix performance issues again.
                                                                  • -

                                                                  Figure: Basic workflow using Dynamic Analyzer

                                                                  +

                                                                  Figure: Basic workflow using Dynamic Analyzer

                                                                  Basic workflow using Dynamic Analyzer

                                                                  With several of profiling features on the Dynamic Analyzer, you can get a hint about how to highly optimize the application.

                                                                  @@ -55,7 +55,7 @@

                                                                  When the Dynamic Analyzer is launched, a feature selection dialog opens. You can select the available features for your profiling based on the selected target profile.

                                                                  -

                                                                  Figure: Feature selection dialog

                                                                  +

                                                                  Figure: Feature selection dialog

                                                                  Feature selection dialog

                                                                  The following table lists the supported features on the Dynamic Analyzer. Every feature is placed onto a specific group (CPU, Memory, File System, Graphics, Network, UI, Synchronization, or Energy) to help you understand the profiling category.

                                                                  diff --git a/org.tizen.studio/html/common_tools/da_thread.htm b/org.tizen.studio/html/common_tools/da_thread.htm index 7607261..d0ee26c 100644 --- a/org.tizen.studio/html/common_tools/da_thread.htm +++ b/org.tizen.studio/html/common_tools/da_thread.htm @@ -15,12 +15,12 @@ - +

                                                                  Mobile Wearable

                                                                  - +

                                                                  Dependencies

                                                                    @@ -49,12 +49,12 @@

                                                                    Figure: Thread analysis

                                                                    Thread analysis

                                                                    - +

                                                                    Thread Chart

                                                                    The thread chart displays the thread and the related synchronization object in a tree format using a graph.

                                                                    Figure: Thread chart

                                                                    -

                                                                    Thread chart

                                                                    +

                                                                    Thread chart

                                                                    The chart classifies thread and synchronization object states by color and shape:

                                                                      diff --git a/org.tizen.studio/html/common_tools/da_ui_hierarchy_n.htm b/org.tizen.studio/html/common_tools/da_ui_hierarchy_n.htm index a36faf3..7ac07e4 100644 --- a/org.tizen.studio/html/common_tools/da_ui_hierarchy_n.htm +++ b/org.tizen.studio/html/common_tools/da_ui_hierarchy_n.htm @@ -5,22 +5,22 @@ - + - Performing UI Hierarchy Analysis + Performing UI Hierarchy Analysis - +

                                                                      Mobile native Wearable native

                                                                      - +

                                                                      Dependencies

                                                                        @@ -50,7 +50,7 @@
                                                                      • Layout view shows a block representation of your application.
                                                                        • -

                                                                        Figure: UI hierarchy analysis

                                                                        +

                                                                        Figure: UI hierarchy analysis

                                                                        UI hierarchy analysis

                                                                        Hierarchy Tree

                                                                        @@ -81,8 +81,8 @@
                                                                      • You can export the hierarchy tree to an image file.

                                                                        To save a screenshot of the tree view to an image file (PNG), click the export button (Export button) at the top right corner. In a dialog box, click Save As and define a location for the file.

                                                                        - -

                                                                        Figure: Hierarchy tree

                                                                        + +

                                                                        Figure: Hierarchy tree

                                                                        Hierarchy tree

                                                                      @@ -92,14 +92,14 @@

                                                                      The Overview area represents the entire tree in the map style. The Hierarchy Tree view displays an enlarged tree, which indicates a particular part of the whole tree in the Overview area.

                                                                      Through the Overview area, you can move around the whole hierarchy tree. Select and move the shaded rectangle, and the tree in the rectangle is displayed as an enlarged tree in the Hierarchy Tree view.

                                                                      -

                                                                      Figure: Overview

                                                                      +

                                                                      Figure: Overview

                                                                      Overview

                                                                      UI Object

                                                                      When you select a node in the Hierarchy Tree view, basic information about the selected UI object appears in a small balloon (UI Object view) above the node.

                                                                      -

                                                                      Figure: UI Object view

                                                                      +

                                                                      Figure: UI Object view

                                                                      UI Object view

                                                                      In the view, you can see:

                                                                      @@ -125,16 +125,16 @@

                                                                      The Properties table shows a list of the properties for the selected UI object from the Hierarchy Tree view. To find an individual property, expand a category name by clicking the arrow on its left.

                                                                      The properties are categorized by the type of the EFL UI object (Evas, Elementary, or Edje). The Properties table always shows the Evas category, because all of the EFL UI objects are subtypes of Evas.

                                                                      -

                                                                      If the UI object is of the Elementary or Edje type, the view shows those categories too. Each type's own properties are also categorized (such as elm_label).

                                                                      +

                                                                      If the UI object is of the Elementary or Edje type, the view shows those categories too. Each type's own properties are also categorized (such as elm_label).

                                                                      -

                                                                      Figure: Properties table

                                                                      +

                                                                      Figure: Properties table

                                                                      Properties table

                                                                      Layout

                                                                      The Layout view shows a block representation of the application. When you select a node in the Hierarchy Tree view, the corresponding image is displayed and highlighted.

                                                                      -

                                                                      Figure: Layout view

                                                                      +

                                                                      Figure: Layout view

                                                                      Layout view

                                                                      diff --git a/org.tizen.studio/html/common_tools/emulator.htm b/org.tizen.studio/html/common_tools/emulator.htm index 47c6691..1fec25f 100644 --- a/org.tizen.studio/html/common_tools/emulator.htm +++ b/org.tizen.studio/html/common_tools/emulator.htm @@ -5,22 +5,22 @@ - + - Running Applications on the Emulator + Running Applications on the Emulator - +

                                                                      Mobile Wearable

                                                                      - +

                                                                      Dependencies

                                                                        @@ -29,12 +29,12 @@

                                                                        Content

                                                                        Related Info

                                                                        @@ -90,10 +90,10 @@
                                                                        1. Prerequisites for using HW virtualization:
                                                                            -
                                                                          • In Ubuntu: +
                                                                          • In Ubuntu:

                                                                            To use KVM, you need a processor that supports HW virtualization. Both Intel and AMD have developed those extensions for their processors (Intel VT-x/AMD-V). Check whether the CPU supports HW virtualization with the following command:

                                                                            -$egrep -c '(vmx|svm)' /proc/cpuinfo
+$egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                            If the output of the command is 0, the CPU does not support HW virtualization. Otherwise, it does.

                                                                            The HW virtualization feature can also be disabled on the BIOS setting. Check the setting and enable it if you need the feature.

                                                                            @@ -163,7 +163,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                            Portrait (default), landscape, reverse portrait, and reverse landscape

                                                                            Supported - 2 skin layout types are supported: + 2 skin layout types are supported:
                                                                            • Profile-specific skin
                                                                            • General purpose skin
                                                                              • @@ -196,7 +196,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo OpenGL® ES - Compatible with OpenGL® ES 1.1 and 2.0 + Compatible with OpenGL® ES 1.1 and 2.0

                                                                              OpenGL® ES API pass-through through PCI

                                                                              Supported @@ -225,7 +225,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Emulator Control Panel - The Emulator Control Panel (ECP) supports different features depending on the device profile: + The Emulator Control Panel (ECP) supports different features depending on the device profile:

                                                                              Mobile:

                                                                              • Device Manager: Device Tree, Network, Host Directory Sharing
                                                                                • @@ -243,7 +243,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Camera - Virtual camera device connecting a host machine's Webcam: + Virtual camera device connecting a host machine's Webcam:
                                                                                • Support: preview, capture, and record
                                                                                • Image format: YUYV, I420, and YV12
                                                                                  • @@ -306,7 +306,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Category - Subject + Subject Physical target Emulator @@ -316,80 +316,80 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Buy a target device or reference board (by model) Download the Tizen Studio (multi-profile and multi-model support) - + Network Need Bluetooth Only the network environment - + Target connection USB IPC (TCP/UDP) - + Source and package management Source and package for target Source and package for the emulator - + Host Directory Sharing Not supported Supported - + Portability Screen resolution Fixed Configurable - + RAM, storage size Fixed Configurable - + 2D and 3D acceleration API GPU-dependent GPU-independent (common set) - + CP, telephony Fully supported Partially supported (only SMS and voice call) - + Wi-Fi Fully supported Partially supported (using ethernet) - + Sensor Fully supported Partially supported (using the Emulator Control Panel) - + PnP, external connection Fully supported Partially supported (using the Emulator Control Panel) - + Camera Fully supported Partially supported (preview, capture, recording, contrast, and brightness) - + Vibration, haptic Fully supported @@ -400,21 +400,21 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Bluetooth Fully supported Not supported - - + + - Performance + Performance CPU performance Mobile CPU Desktop CPU (with hardware virtualization) - + GPU performance Real GPU Desktop GPU (relatively slow) - + I/O performance Real HW I/O @@ -431,7 +431,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Category - Physical target + Physical target Emulator @@ -441,58 +441,58 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo Real device and driver Virtual (VirtIO) device and driver - - + + Host keyboard and hardware key Real device and driver Virtual (VirtIO) device and driver - +

                                                                                  Graphics and Display

                                                                                  - +

                                                                                  Table: Graphics and display differences

                                                                                  - + - + - + - - + +
                                                                                  CategoryPhysical targetPhysical target Emulator
                                                                                  Framebuffer device Display controller in the processor Virtual VGA card
                                                                                  Backlight control LDI (LCD Driver IC) command Additional virtual device and driver
                                                                                  - +

                                                                                  Virtual Sensor (Emulator Control Panel)

                                                                                  - - + +

                                                                                  Table: Virtual sensor differences

                                                                                  - + - + @@ -500,22 +500,22 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo - - + + - + - - + + @@ -523,8 +523,8 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                                  You can register an event handler for the proximity sensor and test it with the Emulator Control Panel. However, the screen does not power off during the event because the emulator does not connect to the power manager.

                                                                                  - - + + @@ -532,58 +532,58 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                                  You can register an event handler for the light sensor and test it with the Emulator Control Panel. However, in order to test the screen brightness change, the brightness setting must be automatic in the setting application.

                                                                                  - + - + - + - + - + - - + + - + - + @@ -592,26 +592,26 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                                  You can use a log file of the NMEA format.

                                                                                  - + - - + + - + - +
                                                                                  Category Physical target Emulator
                                                                                  Sensor AccelerationReceives the virtual acceleration value through the Emulator Control Panel.

                                                                                  If the emulator orientation is portrait, the acceleration values are approximately 0, -9.81, and 0 degrees.
                                                                                  Gyro Receives the actual gyroscope value of the device. Receives the virtual gyroscope value through the Emulator Control Panel.
                                                                                  Geomagnetic Receives the actual geomagnetic value of the device. Receives the virtual geomagnetic value through the Emulator Control Panel.

                                                                                  If the emulator orientation is portrait, the Y axis points to true north and the magnetic tesla values are 1, 0, and -10 degrees.
                                                                                  Proximity Receives the actual proximity value of the device.
                                                                                  Light Receives the actual ambient light value of the device.
                                                                                  Pressure Receives the actual pressure value of the device. Receives the virtual actual pressure value through the Emulator Control Panel.
                                                                                  Ultraviolet Receives the actual ultraviolet value of the device. Receives the virtual actual ultraviolet value through the Emulator Control Panel.
                                                                                  Heart Rate Monitor Receives the actual heart rate and peak-to-peak values of the device. Receives the virtual actual heart rate and peak-to-peak values through the Emulator Control Panel.
                                                                                  Device Battery Receives the actual battery value of the device. Receives the virtual battery value through the Emulator Control Panel. -

                                                                                  You can change the battery level and the charger connection status.

                                                                                  +

                                                                                  You can change the battery level and the charger connection status.
                                                                                  Earjack Receives the actual earjack connection event of the device. Receives the earjack connection event through the Emulator Control Panel. -

                                                                                  You can select a 3-wire or 4-wire connection, or set the earjack as disconnected.

                                                                                  +

                                                                                  You can select a 3-wire or 4-wire connection, or set the earjack as disconnected.
                                                                                  USB Receives the actual USB connection event of the device. Receives the USB connection event through the Emulator Control Panel.
                                                                                  RSSI Receives the actual RSSI value of the device. Receives the virtual RSSI value through the Emulator Control Panel.
                                                                                  Location Log
                                                                                  Manual Not supported. Receives the virtual longitude and latitude values through the Emulator Control Panel.
                                                                                  Map Not supported. Receives the virtual longitude, latitude, altitude, and horizontal accuracy values through the Emulator Control Panel map.
                                                                                  Auto Receives the actual GPS coordinates of the device. Not supported.
                                                                                  @@ -620,8 +620,8 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                                  Table: Telephony differences

                                                                                  - - + + @@ -634,7 +634,7 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo - + @@ -642,34 +642,34 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                                  Sending emulator-to-emulator SMS messages is not supported.

                                                                                  -
                                                                                  Category Physical targetCall waiting, outgoing call barring, and voice calls with the Emulator Control Panel are supported.

                                                                                  Video calls, call forwarding, incoming call barring, and emulator-to-emulator calls are not supported.
                                                                                  SMS SMS messaging is supported.
                                                                                  - - + + +

                                                                                  Power Management

                                                                                  - +

                                                                                  Table: Power management differences

                                                                                  - - + + - - + + - + - +
                                                                                  Mode Physical target Emulator
                                                                                  Display on/off Display controller in the processor Internal emulation
                                                                                  Power off Power management in the processor ACPI (Advanced Configuration and Power Interface)
                                                                                  @@ -677,8 +677,8 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo

                                                                                  Table: Media format and codec differences

                                                                                  - - + + @@ -686,14 +686,14 @@ $egrep -c '(vmx|svm)' /proc/cpuinfo - + - + -
                                                                                  Category Physical target
                                                                                  DecoderFLAC Supported Not supported
                                                                                  - + +
                                                                      diff --git a/org.tizen.studio/html/common_tools/emulator_control_panel.htm b/org.tizen.studio/html/common_tools/emulator_control_panel.htm index faca2a3..3c25545 100644 --- a/org.tizen.studio/html/common_tools/emulator_control_panel.htm +++ b/org.tizen.studio/html/common_tools/emulator_control_panel.htm @@ -5,13 +5,13 @@ - + - Using Emulator Control Keys, Menu, and Panel + Using Emulator Control Keys, Menu, and Panel @@ -50,10 +50,10 @@

                                                                      Using the Control Keys and Menu

                                                                      -

                                                                      The control keys are visible on the emulator when you start it. To access the context menu, right-click the emulator.

                                                                      +

                                                                      The control keys are visible on the emulator when you start it. To access the context menu, right-click the emulator.

                                                                      Figure: Emulator control keys

                                                                      -

                                                                      Emulator control keys

                                                                      +

                                                                      Emulator control keys

                                                                      The emulator can use a general purpose or profile-specific skin. While the profile-specific skin provides a realistic skin and hardware keys, the general purpose skin shows a consistent frame on every state of resolution, scale, or rotation, and enables you to change the emulator display resolution to custom values. You can also see the key window.

                                                                      @@ -91,14 +91,14 @@
                                                                    • Home (mobile only)

                                                                      When long-pressed, the Task switcher application opens as in a real device.

                                                                      -
                                                                      • +
                                                                    • Back

                                                                      When tapped, the emulator returns to the previous screen.

                                                                      -
                                                                      • +
                                                                    • Power -

                                                                      You can power off the display by tapping the Power key in most general situations. - Sometimes, the display does not power off though you tap the Power key. - This is to guarantee the operation of a current application, such as the Stopwatch in the Clock application. +

                                                                      You can power off the display by tapping the Power key in most general situations. + Sometimes, the display does not power off though you tap the Power key. + This is to guarantee the operation of a current application, such as the Stopwatch in the Clock application. If you tap the Power or Home key again, the display is powered on.

                                                                    • Volume Up and Volume Down (mobile only) @@ -121,7 +121,7 @@ Feature - Description + Description @@ -133,7 +133,7 @@ Skin Name Skin name - + CPU Arch CPU architecture @@ -153,7 +153,7 @@ Network connection NAT (Network Address Translation) or Bridged - + CPU Virtualization Whether hardware virtualization is supported @@ -178,7 +178,7 @@ Directory Sharing Whether host directory sharing is used - + File Shared Path Path to the shared host directory @@ -261,7 +261,7 @@

                                                                    Figure: Emulator Control Panel

                                                                    Emulator Control Panel

                                                                    - +

                                                                    To open the control panel:

                                                                      @@ -271,7 +271,7 @@

                                                                      Figure: Opening the control panel

                                                                      Opening the control panel

                                                                      - +

                                                                      The main features of the Emulator Control Panel are described in the following sections.

                                                                      Controlling the Network Setting

                                                                      @@ -399,10 +399,10 @@ timestamp, x, y, z
                                                                    1. Enter the phone number you want to imitate the call from.
                                                                    2. Click Connect.
                                                                    3. To hide the phone number on the emulator, select the Hidden option. -

                                                                      The caller ID on the emulator is set to "Unknown".

                                                                      4. +

                                                                      The caller ID on the emulator is set to "Unknown".

                                                                    - -

                                                                    To make an MO call, use the emulator's phone application:

                                                                    + +

                                                                    To make an MO call, use the emulator's phone application:

                                                                    1. To ready the emulator for the connection, click Alert.
                                                                    2. To ready the emulator for the call, click Connect.
                                                                      3. @@ -576,7 +576,7 @@ timestamp, x, y, z

                                                                      You can access this mode by running the binary without any parameters. The mode keeps a session until it is exited. You can exit by entering the exit command.

                                                                    3. Shell mode

                                                                      This mode is used for one-time message handling.

                                                                  -

                                                                  Figure: Session and shell modes

                                                                  +

                                                                  Figure: Session and shell modes

                                                                  Session and shell modes

                                                                  In Ubuntu, the bash-based auto-completion is used with the TAB key.

                                                                  @@ -614,13 +614,13 @@ timestamp, x, y, z qmp qmp <qmp command> - Access the QEMU monitoring protocol. The commands are handled in the JSON format, and do not require {"execute": "qmp_capabilities"} to be in the control mode. -

                                                                  In the shell mode, the shell does not support the double quotation mark (") as an argument. For the JSON arguments, use \" (back space + double quotation mark) instead.

                                                                  + Access the QEMU monitoring protocol. The commands are handled in the JSON format, and do not require {"execute": "qmp_capabilities"} to be in the control mode. +

                                                                  In the shell mode, the shell does not support the double quotation mark (") as an argument. For the JSON arguments, use \" (back space + double quotation mark) instead.

                                                                  hds hds mount <host path> <guest path> - Enable the host directory sharing feature between the specified <host path> and the emulator's <guest path>. The specified path must be a folder, not a file. + Enable the host directory sharing feature between the specified <host path> and the emulator's <guest path>. The specified path must be a folder, not a file. hds unmount <id> @@ -630,7 +630,7 @@ timestamp, x, y, z hds status Show the current host directory sharing status. - +

                                                                  Table: CLI profile commands

                                                                  @@ -640,14 +640,14 @@ timestamp, x, y, z - + - + - + @@ -661,7 +661,7 @@ timestamp, x, y, z - + @@ -677,12 +677,12 @@ timestamp, x, y, z - + - + - + @@ -698,10 +698,10 @@ timestamp, x, y, z - + - + @@ -713,10 +713,10 @@ timestamp, x, y, z - + - + @@ -724,10 +724,10 @@ timestamp, x, y, z - + - + @@ -735,10 +735,10 @@ timestamp, x, y, z - + - + @@ -746,7 +746,7 @@ timestamp, x, y, z - + @@ -761,7 +761,7 @@ timestamp, x, y, z - + @@ -788,12 +788,12 @@ timestamp, x, y, z - + - + - + @@ -846,7 +846,7 @@ timestamp, x, y, z
                                                                  Sub-command Mobile WearableSyntaxSyntax
                                                                  telephonytelephony call dial YesNoNo telephony call dial <number>
                                                                  call disconnect telephony call disconnect <call id>
                                                                  sms send telephony sms send <number> <text>
                                                                  sms mms_status telephony sms mms_status
                                                                  locationlocation set YesYesYes location set <longitude> <latitude>
                                                                  location file <file-path>
                                                                  batterybattery level YesYesYes battery level <percent>
                                                                  battery status
                                                                  earjackearjack set YesNoNo earjack set <3wire | 4wire | off>
                                                                  earjack status
                                                                  usbusb set YesYesYes usb set <on | off>
                                                                  usb status
                                                                  rssirssi set YesNoNo rssi set <0~4>
                                                                  rssi status
                                                                  sdcardsdcard attach Yes Nosdcard status
                                                                  nfcnfc tag attach Yes Nonfc status
                                                                  sensorsensor accelerometer YesYesYes sensor accelerometer <x> <y> <z>
                                                                  gyroscope sensor gyroscope <x> <y> <z>
                                                                  - + diff --git a/org.tizen.studio/html/common_tools/emulator_features.htm b/org.tizen.studio/html/common_tools/emulator_features.htm index db54c74..86917c8 100644 --- a/org.tizen.studio/html/common_tools/emulator_features.htm +++ b/org.tizen.studio/html/common_tools/emulator_features.htm @@ -5,7 +5,7 @@ - + @@ -102,7 +102,7 @@
                                                                • Run the Emulator Manager and click Create or Edit.
                                                                • In the File Sharing section of the VM property, enable the Sharing button and select a directory to share.
                                                                • Start the emulator. -

                                                                  The host computer's directory is shown as /mnt/host in the emulator.

                                                                  • +

                                                                  The host computer's directory is shown as /mnt/host in the emulator.

                                                                  You can also add a shared directory in the Emulator Control Panel (ECP):

                                                                  @@ -139,7 +139,7 @@

                                                                  The following table lists the host Webcam features.

                                                                  Table: Webcam features

                                                                  - +
                                                                  @@ -147,14 +147,14 @@ - - + + - + @@ -164,7 +164,7 @@ @@ -174,7 +174,7 @@ YV12
                                                                  @@ -261,19 +261,19 @@ The following preallocated addresses are not supported as a manual proxy:

                                                                  You can add port forwarding by using the ECP. In the ECP > Network card, under Add port-forwarding, enter the ports to forward.

                                                                • SDB (Smart Development Bridge)

                                                                  The SDB provides port forwarding as a command. For more user,id=net0 information in the SDB commands, see sdb forward.

                                                                  • -
                                                                • Launch configuration on boot +
                                                                • Launch configuration on boot

                                                                  You can forward the port on booting the emulator by modifying the QEMU redirection option. The QEMU redirection option can be appended in the existing -netdev user,id=net0 option in the <TIZEN_STUDIO_DATA>/emulator/vms/<image name>/vm_launch.conf file with the following appending command:

                                                                  -netdev user,id=net0,hostfwd=[tcp|udp]:[<hostaddr>]:<hostport>-[<guestaddr>]:<guestport>

                                                                  Redirect incoming TCP or UDP connections to the <hostport> host port to the <guestaddr> guest IP address on the <guestport> guest port. If the <guestaddr> is not specified, its value is 10.0.2.15 (default first address given by the built-in DHCP server).

                                                                  -

                                                                  You can also connect one emulator instance with another by using redirection. To set up redirection (where A and B are emulator instances):

                                                                  +

                                                                  You can also connect one emulator instance with another by using redirection. To set up redirection (where A and B are emulator instances):

                                                                  1. Set up the server on A, listening to 10.0.2.15:<ServerPort>.
                                                                    2. -
                                                                  2. On A, append the ,hostfwd tcp:127.0.0.1:<B's localPort>-:<A's serverPort> redirection option in the vm_launch.conf file.
                                                                    3. +
                                                                  3. On A, append the ,hostfwd tcp:127.0.0.1:<B's localPort>-:<A's serverPort> redirection option in the vm_launch.conf file.
                                                                    4. -
                                                                  4. On B, let the client connect to 10.0.2.2:<B's localPort>. +
                                                                  5. On B, let the client connect to 10.0.2.2:<B's localPort>.
                                                                  @@ -295,7 +295,7 @@ The appending value of the configuration file is removed when the user changes t

                                                                  Figure: Emulator bridged network architecture

                                                                  - +

                                                                  Emulator bridged network architecture

                                                                  @@ -323,7 +323,7 @@ The appending value of the configuration file is removed when the user changes t
                                                                • Bridge configuration on Windows 8 and above:
                                                                    -
                                                                  1. Click the Windows Start (Start) > Control Panel. In the search box, enter "adapter", and click Network and Sharing Center > View network connections.
                                                                    2. +
                                                                  2. Click the Windows Start (Start) > Control Panel. In the search box, enter "adapter", and click Network and Sharing Center > View network connections.
                                                                  3. Right-click the physical network connection used for bridging, and click Properties.
                                                                  4. On the General tab (for a local area connection), click Internet Protocol (TCP/IP) > Properties.
                                                                  5. Click Obtain an IP address automatically to delete IP configuration, and click OK. The IP configuration (IP address, Subnet mask, and Default gateway) are used for the configuration of the bridged network.
                                                                    6. @@ -339,39 +339,39 @@ The appending value of the configuration file is removed when the user changes t

                                                                    The following example shows the content of the layout.xml layout file:

                                                                    -<?xml version="1.0" encoding="UTF-8"?>
-<EmulatorUI xmlns="http://www.tizen.org/emulator/ui/layout">
-   <layoutVersion>2.4</layoutVersion>
-   <formList>
-      <!--Skin mode definition-->
-      <form name="Portrait">
-         <display>
-            <!--Display screen size and position-->
-            <region left="30" top="81" width="480" height="800"/>
-            <!--Rotate display screen by degree-->
-            <angle>0</angle>
-         </display>
-         <!--Resource file name of the usual skin image-->
-         <normalImage>default_0.png</normalImage>
-         <!--Resource file name of the skin image when hardware key events occur-->
-         <pressedImage>default_0_p.png</pressedImage>
-         <keyList>
-            <key name="Home"> <!--Optional-->
-               <!--Hardware key region size and position-->
-               <region left="233" top="882" width="74" height="74"/>
-               <keycode>139</keycode> <!--Keycode value-->
-               <!--This line to be displayed when mouse hovers over the hardware key region-->
-               <tooltip>Home</tooltip>
-               <!--Defined keyboard shortcut-->
-               <shortcut>F1</shortcut>
-            </key>
-         </keyList>
-         <hover>
-            <!--RGB line color of the hardware key hover-->
-            <color R="255" G="255" B="255"/>
-         </hover>
-      </form>
-   </formList>
+<?xml version="1.0" encoding="UTF-8"?>
+<EmulatorUI xmlns="http://www.tizen.org/emulator/ui/layout">
+   <layoutVersion>2.4</layoutVersion>
+   <formList>
+      <!--Skin mode definition-->
+      <form name="Portrait">
+         <display>
+            <!--Display screen size and position-->
+            <region left="30" top="81" width="480" height="800"/>
+            <!--Rotate display screen by degree-->
+            <angle>0</angle>
+         </display>
+         <!--Resource file name of the usual skin image-->
+         <normalImage>default_0.png</normalImage>
+         <!--Resource file name of the skin image when hardware key events occur-->
+         <pressedImage>default_0_p.png</pressedImage>
+         <keyList>
+            <key name="Home"> <!--Optional-->
+               <!--Hardware key region size and position-->
+               <region left="233" top="882" width="74" height="74"/>
+               <keycode>139</keycode> <!--Keycode value-->
+               <!--This line to be displayed when mouse hovers over the hardware key region-->
+               <tooltip>Home</tooltip>
+               <!--Defined keyboard shortcut-->
+               <shortcut>F1</shortcut>
+            </key>
+         </keyList>
+         <hover>
+            <!--RGB line color of the hardware key hover-->
+            <color R="255" G="255" B="255"/>
+         </hover>
+      </form>
+   </formList>
 </EmulatorUI>

                                                                    The emulator skin also contains a <TIZEN_STUDIO>/platforms/<PLATFORM_VERSION>/<PROFILE>/emulator-resources/skins/<SKIN_NAME>/info.ini property file. The file defines skin-related information, such as skin name and supported resolutions.

                                                                    @@ -402,7 +402,7 @@ resolution.height=800

                                                                    The emulator supports event injection using ECP (Emulator Control Panel). However, injecting sensor events using ECP is less intuitive and convenient. When you are injecting events, touching the emulator screen simultaneously is impossible. EventCast enables you to inject sensor and touch events more intuitively using a real target device.

                                                                    The following figure illustrates how the EventCast application in the target device gathers events and passes them to the emulator controller, which converts and hands them over to the Tizen platform. This is convenient in case you do not have a Tizen mobile device.

                                                                    -

                                                                    Figure: EventCast architecture

                                                                    +

                                                                    Figure: EventCast architecture

                                                                    eventcast_architecture

                                                                    EventCast provides the following features:

                                                                    @@ -420,13 +420,13 @@ resolution.height=800

                                                                    For more information, see ADB Fastboot Install.

                                                                  6. Windows®: Download ADB and install it in the C:\ADB folder.

                                                                    For more information, see ADB Fastboot for Windows.

                                                                  - +

                                                                  When connecting through Wi-Fi, make sure that your Android device and computer are within the same AP.

                                                                  - +

                                                                  Installing EventCaster

                                                                  -

                                                                  EventCaster is the application on the target device. It communicates with the Tizen emulator through the TCP/IP protocol. It can connect to the emulator using USB or Wi-Fi.

                                                                  +

                                                                  EventCaster is the application on the target device. It communicates with the Tizen emulator through the TCP/IP protocol. It can connect to the emulator using USB or Wi-Fi.

                                                                  You can download the EventCaster from Google Play (https://github.com/eventcaster/eventcaster.git) and install it manually.

                                                                  @@ -498,7 +498,7 @@ resolution.height=800 
                                                                   [[VARIABLE]]
 ram=512     # define variable ram
-    
+
 [[QEMU_OPTIONS]]
 -m ${ram}   # use variable ram
                                                                  @@ -509,19 +509,19 @@ ram=512 # define variable ram
                                                                  • - +

                                                                  For more information about the start-up options, see QEMU Emulator User Documentation and the vm_launch.conf file.

                                                                  The following example shows the configuration file:

                                                                  - + 
                                                                   [[VARIABLES]]
 vm_name=mobile-vm
-vms_path="/home/user/tizen-studio-data/emulator/vms"
+vms_path="/home/user/tizen-studio-data/emulator/vms"
 image_arch=i386
-drive="file=${vms_path}/${vm_name}/emulimg-${vm_name}.${image_arch},if=none,index=0,cache.no-flush=on"
-swap="file=${vms_path}/${vm_name}/swap-${vm_name}.img,if=none,index=1"
-skin_path="/home/user/tizen-studio/platforms/tizen-2.4/mobile/emulator-resources/skins/mobile-general-3btn"
+drive="file=${vms_path}/${vm_name}/emulimg-${vm_name}.${image_arch},if=none,index=0,cache.no-flush=on"
+swap="file=${vms_path}/${vm_name}/swap-${vm_name}.img,if=none,index=1"
+skin_path="/home/user/tizen-studio/platforms/tizen-2.4/mobile/emulator-resources/skins/mobile-general-3btn"
 display_resolution=480x800
 display_pixel_density=233
 process_num=4
@@ -529,17 +529,17 @@ ram=512
 max_point=10
 sensors=accel&geo&gyro&light&proxi&haptic&uv&press&hrm
 jacks=earjack&charger&usb
-network_proxy="http_proxy=1.2.3.4:123 https_proxy=1.2.3.4:123 ftp_proxy=1.2.3.4:123 socks_proxy=1.2.3.4:123"
-bios_path="/home/user/tizen-studio/platforms/tizen-2.4/common/emulator/data/bios"
-kernel="/home/user/tizen-studio/platforms/tizen-2.4/common/emulator/data/kernel/bzImage.${image_arch}"
-kernel_log="${vms_path}/${vm_name}/logs/emulator.klog"
-virt_cam_img_path0="/home/user/tizen-studio/tools/emulator/images/default-image2.gif"
+network_proxy="http_proxy=1.2.3.4:123 https_proxy=1.2.3.4:123 ftp_proxy=1.2.3.4:123 socks_proxy=1.2.3.4:123"
+bios_path="/home/user/tizen-studio/platforms/tizen-2.4/common/emulator/data/bios"
+kernel="/home/user/tizen-studio/platforms/tizen-2.4/common/emulator/data/kernel/bzImage.${image_arch}"
+kernel_log="${vms_path}/${vm_name}/logs/emulator.klog"
+virt_cam_img_path0="/home/user/tizen-studio/tools/emulator/images/default-image2.gif"
 wsi=vigs_wsi
 host_ip=10.0.2.2
 image_ver=1.0.4
 profile=mobile
 platform_version=tizen-2.4
-append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${display_pixel_density} ${network_proxy} host_ip=${host_ip} console=ttyS0"
+append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${display_pixel_density} ${network_proxy} host_ip=${host_ip} console=ttyS0"
 
 [[QEMU_OPTIONS]]
 -drive ${drive},id=drive
@@ -588,7 +588,7 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d

                                                                  Emulator Directory Structure

                                                                  - +

                                                                  The following table describes the content of the emulator directory, located in the <TIZEN_STUDIO>/tools/emulator folder.

                                                                  @@ -627,7 +627,7 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d - + @@ -648,8 +648,8 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d
                                                                  Feature Detail Notes
                                                                  FPS 30 fpsPreview image format YUYV
                                                                  I420
                                                                  -YV12
                                                                  +YV12
                                                                  		 -
                                                                  YUYV
                                                                  I420
                                                                  YV12
                                                                  -JPEG
                                                                  +JPEG
                                                                  		 -
                                                                  bin/emulator-control-panel-cli.jar ECP CLI (Command Line Interface)
                                                                  bin/libecp.jar Profile-independent library for ECP

                                                                  The following table describes the platform image directories that are located in the <TIZEN_STUDIO>/platforms/<PLATFORM_VERSION>/<PROFILE>/emulator-images folder.

                                                                  - - + +

                                                                  Table: Platform image directory content

                                                                  @@ -657,21 +657,21 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d - + - + - + - + - + - + - + -
                                                                  Name Description
                                                                  <IMAGE_DIR><IMAGE_DIR> Platform image directory
                                                                  <IMAGE_DIR>/emulimg-<VERSION>.<ARCHITECTURE><IMAGE_DIR>/emulimg-<VERSION>.<ARCHITECTURE> Platform image, which represents an emulator root file system for x86 in the guest OS view
                                                                  <IMAGE_DIR>/info.ini<IMAGE_DIR>/info.ini File for specifying information of the platform image
                                                                  +

                                                                  The following table describes the platform common directories that are located in the <TIZEN_STUDIO>/platforms/<PLATFORM_VERSION>/common/emulator folder.

                                                                  @@ -715,23 +715,23 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d Description - plugins/ + plugins/ Plugins for profile - plugins/ecp-plugin-<PROFILE>-<VERSION>.jar + plugins/ecp-plugin-<PROFILE>-<VERSION>.jar Plugin for the ECP - plugins/ecp-plugin-<PROFILE>-<VERSION>.xml + plugins/ecp-plugin-<PROFILE>-<VERSION>.xml XML file for the ecp-plugin-<PROFILE>-<VERSION>.jar file configuration - plugins/em-plugin-<PROFILE>.jar + plugins/em-plugin-<PROFILE>.jar Plugin for the Emulator Manager - skins/ + skins/ Emulator skin images specific to the emulator resolution, and icons for the emulator option button and shortcut @@ -753,10 +753,10 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d - +

                                                                  The following table describes the directory structure of the user-specific files that are located in the <TIZEN_STUDIO_DATA>/emulator/vms folder.

                                                                  - - + +

                                                                  Table: User directory content

                                                                  @@ -765,58 +765,58 @@ append="vm_name=${vm_name} video=LVDS-1:${display_resolution}-32@60 dpi=${d - + - + - + - + - + - + - + - + - + - + - + - + - - + - + - + -
                                                                  Description
                                                                  .em.lock.em.lock Lock file used for synchronization between VM operations, such as modify, delete, and launch
                                                                  .tizen-em-info.tizen-em-info Configuration file for the Emulator Manager
                                                                  emulator-manager.logemulator-manager.log Emulator Manager log file
                                                                  last-created_<PROFILE>.xmllast-created_<PROFILE>.xml File for saving the VM properties that the user created last. When user creates a new VM next time, properties in this file are displayed as default.
                                                                  <VM_NAME>/<VM_NAME>/ Target-specific images
                                                                  <VM_NAME>/emulimg-<VM_NAME>.<ARCHITECTURE><VM_NAME>/emulimg-<VM_NAME>.<ARCHITECTURE> Writable <VM_NAME> image file
                                                                  <VM_NAME>/gui.property<VM_NAME>/gui.property Hidden data for the emulator GUI
                                                                  <VM_NAME>/logs/<VM_NAME>/logs/ Log files (emulator and kernel logs)
                                                                  <VM_NAME>/swap-<VM_NAME>.img<VM_NAME>/swap-<VM_NAME>.img Swap image file
                                                                  <VM_NAME>/vm_config.xml<VM_NAME>/vm_config.xml Hardware configuration file
                                                                  <VM_NAME>/vm_launch.confEmulator start-up options file (for more information, see Starting an Emulator with a Configuration File) + <VM_NAME>/vm_launch.confEmulator start-up options file (for more information, see Starting an Emulator with a Configuration File)
                                                                  <VM_NAME>/${USER}.lock<VM_NAME>/${USER}.lock Lock file used for synchronization between VM and ECP for set/get operations
                                                                  + + - diff --git a/org.tizen.studio/html/common_tools/emulator_manager.htm b/org.tizen.studio/html/common_tools/emulator_manager.htm index 23b60c9..5a711e3 100644 --- a/org.tizen.studio/html/common_tools/emulator_manager.htm +++ b/org.tizen.studio/html/common_tools/emulator_manager.htm @@ -5,22 +5,22 @@ - + - Managing Emulator Instances + Managing Emulator Instances - +

                                                                  Managing Emulator Instances

                                                                  - - + +

                                                                  The Tizen Studio provides emulators to run your application in a virtual environment.

                                                                  In order to test the application in a variety of environments, you need a variety of emulators. The Tizen Studio provides the Emulator Manager to help you easily create and manage the emulator instances.

                                                                  @@ -60,15 +60,15 @@
                                                                • Deleting an emulator instance or hardware profile
                                                                • Starting and stopping the emulator
                                                                - +

                                                                Accessing the Emulator Manager

                                                                - +

                                                                If you do not have the Emulator Manager installed, you can install it using the Tizen Studio Package Manager.

                                                                There are 2 different ways to access the Emulator Manager:

                                                                  -
                                                                • Click the Emulator Manager icon on the desktop or in the Start menu. +
                                                                • Click the Emulator Manager icon on the desktop or in the Start menu.

                                                                  Table: Starting the Emulator Manager

                                                                  @@ -132,7 +132,7 @@
                                                                • Click the create icon (Create icon).
                                                                • In the dialog box, select a base platform and platform image file.

                                                                  You can create a custom platform using a qcow2 or raw format image.

                                                                  -

                                                                  Qcow2 is a platform image format that is released with the Tizen Studio. Using the Emulator Manager's "Export as" feature, you can also create a qcow2 image.

                                                                  +

                                                                  Qcow2 is a platform image format that is released with the Tizen Studio. Using the Emulator Manager's "Export as" feature, you can also create a qcow2 image.

                                                                  A platform image of the development stage is in the raw format. If you try launching an emulator with a raw image, you can see the current state of this image. This can be useful for platform developers.

                                                                • Click OK to save your configuration and click Next.

                                                                  The newly created platform is added to the list with a settings icon.

                                                                  @@ -159,9 +159,9 @@

                                                                  After configuring the template, click Next. The new device template is added to the list with a settings icon.

                                                                  Figure: Template configuration

                                                                  -

                                                                  Template configuration

                                                                  - - +

                                                                  Template configuration

                                                                  + +

                                                                  Managing the Emulator

                                                                  In the Emulator Manager, you can edit, delete, reset, and export emulator instances:

                                                                  @@ -175,7 +175,7 @@

                                                                  Managing Platforms and Templates

                                                                  - +

                                                                  To manage the template:

                                                                  • To modify a template, click the modify icon (Modify icon), make the appropriate changes, and click Confirm. You can only modify the custom device templates you have created.
                                                                    • @@ -211,9 +211,9 @@

                                                                    The following figure shows an example how to create and launch an emulator using the CLI.

                                                                    Figure: Launching the emulator using the command line

                                                                    Launching the emulator using the command line

                                                                    - +

                                                                    In the create command, the –p option is the platform name. You can see the available platforms using the list -vm command.

                                                                    - + diff --git a/org.tizen.studio/html/common_tools/keyboard_shortcuts.htm b/org.tizen.studio/html/common_tools/keyboard_shortcuts.htm index 9057596..23714a0 100644 --- a/org.tizen.studio/html/common_tools/keyboard_shortcuts.htm +++ b/org.tizen.studio/html/common_tools/keyboard_shortcuts.htm @@ -609,7 +609,7 @@
                                                                  • - + @@ -860,25 +860,25 @@ - + - + - + - + @@ -975,13 +975,13 @@ - + - + @@ -1066,13 +1066,13 @@ - + - +
                                                                  Ctrl + 5 Ctrl + 5 Command + 5
                                                                  Select the Range tab Ctrl + 6Enter Enter Enter
                                                                  Close pop-up dialog ESC ESC ESC
                                                                  Move to previous page Page Up Page Up Page Up
                                                                  Move to next page Page Down Page Down Page Down
                                                                  Mobile BatteryAlt + H Alt + H Option + H
                                                                  Memory Alt + O Alt + O Option + O
                                                                  Wearable BatteryAlt + H Alt + H Option + H
                                                                  App Manager Alt + U Alt + U Option + U
                                                                  @@ -1087,188 +1087,188 @@ Windows® Mac OS® X - -Close the menu + +Close the menu Esc Esc Esc - -Show shortcut keys + +Show shortcut keys F1 F1 F1 - + Show or hide the line numbers F5 F5 F5 - -Show or hide the toolbar + +Show or hide the toolbar F9 F9 F9 - -Show or hide the EDC navigator + +Show or hide the EDC navigator F10 F10 F10 - -Show or hide the status bar + +Show or hide the status bar F11 F11 F11 - + Show the configuration setting window F12 F12 F12 - -Quick save and compile EDC + +Quick save and compile EDC Ctrl + S Ctrl + S Command + S - -Enable or disable auto indentation + +Enable or disable auto indentation Ctrl + I Ctrl + I Command + I - -Enable or disable auto completion + +Enable or disable auto completion Ctrl + O Ctrl + O Command + O - -Show or hide virtual images to visualize SWALLOW part objects + +Show or hide virtual images to visualize SWALLOW part objects Ctrl + W Ctrl + W Command + W - -Enable or disable part object highlighting + +Enable or disable part object highlighting Ctrl + H Ctrl + H Command + H - -Enable or disable full text view + +Enable or disable full text view Alt + Left Alt + Left Option + Left - -Enable or disable full live view + +Enable or disable full live view Alt + Right Alt + Right Option + Right - -Enable or disable full console view + +Enable or disable full console view Alt + Up Alt + Up Option + Up - -Enable or disable full live/text view + +Enable or disable full live/text view Alt + Down Alt + Down Option + Down - -Insert default template code + +Insert default template code Ctrl + T Ctrl + T Command + T - -View scale up/bigger font size + +View scale up/bigger font size Ctrl + Mouse wheel up Ctrl + Mouse wheel up Command + Mouse wheel up - -View scale down/smaller font size + +View scale down/smaller font size Ctrl + Mouse wheel down Ctrl + Mouse wheel down Command + Mouse wheel down - -Select all the text + +Select all the text Ctrl + A Ctrl + A Command + A - -Select the word + +Select the word Ctrl + Double-click Ctrl + Double-click Command + Double-click - -Undo text changes + +Undo text changes Ctrl + Z Ctrl + Z Command + Z - -Redo text changes + +Redo text changes Ctrl + R Ctrl + R Command + R - -Copy selected text + +Copy selected text Ctrl + C Ctrl + C Command + C - -Paste copied text + +Paste copied text Ctrl + V Ctrl + V Command + V - -Cut selected text + +Cut selected text Ctrl + X Ctrl + X Command + X - -Delete the current line + +Delete the current line Ctrl + D Ctrl + D Command + D - + Find and replace the given word Ctrl + F Ctrl + F Command + F - -Go to the given line + +Go to the given line Ctrl + L Ctrl + L Command + L - + Go to the top line Ctrl + Home Ctrl + Home Command + Home - -Go to the bottom line + +Go to the bottom line Ctrl + End Ctrl + End Command + End diff --git a/org.tizen.studio/html/common_tools/log_view.htm b/org.tizen.studio/html/common_tools/log_view.htm index c0a4d66..e29fb49 100644 --- a/org.tizen.studio/html/common_tools/log_view.htm +++ b/org.tizen.studio/html/common_tools/log_view.htm @@ -5,22 +5,22 @@ - + - Checking Logs with Log View + Checking Logs with Log View - +

                                                                  Mobile Wearable

                                                                  - +

                                                                  Dependencies

                                                                    @@ -36,7 +36,7 @@

                                                                    Checking Logs with Log View

                                                                    - +

                                                                    This topic explains how to insert logging methods to your code and check the logs of your application in the Log view.

                                                                    Viewing Logs in Log Tabs

                                                                    @@ -44,9 +44,9 @@

                                                                    By default, the Log view is located at the bottom of the Native perspective. If you want to open the Log view manually, go to Window > Show View > Other > Log in the Tizen Studio menu.

                                                                    The Log view helps you debug your application by capturing all the events logged by the platform and your application. The Log view shows the logs through the dlog logging service. The service consists of the dlogutil and dlog library. You can also see logs with the dlogutil command in the CLI environment, and create log entries with the dlog library.

                                                                    -

                                                                    Figure: Log view

                                                                    -

                                                                    Log view

                                                                    - +

                                                                    Figure: Log view

                                                                    +

                                                                    Log view

                                                                    +

                                                                    Creating a Log Message

                                                                    You can create a log message in your application with the dlog library. Before using the dlog library, make sure you know which priorities and tags to use and how to send the message to the log device. With appropriate properties and tags, it is easy to filter and check the messages.

                                                                    For more information, see the System Logs guide.

                                                                    @@ -77,11 +77,11 @@
                                                                  • Message: log message
                                                                  -

                                                                  Figure: Log table fields

                                                                  -

                                                                  Log view

                                                                  - +

                                                                  Figure: Log table fields

                                                                  +

                                                                  Log view

                                                                  +

                                                                  In the log table, you have the following options and functions:

                                                                  - +
                                                                  • Log level filtering option

                                                                    In the Log view, you can filter the log messages using the V (verbose), D (debug), I (info), W (warning), E (error), and F (fatal) buttons to show specific log messages suitable to the selected type.

                                                                    • @@ -95,7 +95,7 @@

                                                                    You can export the current log messages in the log tab and save them as a log file by clicking the export the log icon (Export icon).

                                                                  - +
                                                                  diff --git a/org.tizen.studio/html/common_tools/smart_development_bridge.htm b/org.tizen.studio/html/common_tools/smart_development_bridge.htm index 65235a2..9027060 100644 --- a/org.tizen.studio/html/common_tools/smart_development_bridge.htm +++ b/org.tizen.studio/html/common_tools/smart_development_bridge.htm @@ -48,7 +48,7 @@
                                                                • The SDB supplies basic commands for application development, such as file transfer, remote shell command, port forwarding for a debugger, viewing, filtering, and controlling target log output.
                                                                  • - +

                                                                The SDB is a client-server program that consists of a client, daemon, and server:

                                                                  @@ -122,7 +122,7 @@ forward <local> <remote> - Sets up requests' arbitrary port forwarding from the host's local port to the target's remote port. + Sets up requests' arbitrary port forwarding from the host's local port to the target's remote port. dlog [option] [<filter>] @@ -173,7 +173,7 @@

                                                                  The following snippet shows an example of the command output:

                                                                   > sdb devices
-List of devices attached 
+List of devices attached
 emulator-26100    device    myemulator1
 emulator-26200    device    myemulator2
                                                                  @@ -242,7 +242,7 @@ ls, rm, mv, cd, cp, mkdir, touch, echo, tar, grep, cat, chmod, rpm, find, uname,

                                                                  GDB in a host connects to localhost:26102:

                                                                   > gdb hellotizen
-... 
+...
 (gdb) target remote localhost:26102

                                                                  Controlling Device Log Output

                                                                  diff --git a/org.tizen.studio/html/cover_page.htm b/org.tizen.studio/html/cover_page.htm index db4dd07..0dae565 100644 --- a/org.tizen.studio/html/cover_page.htm +++ b/org.tizen.studio/html/cover_page.htm @@ -16,12 +16,12 @@ - +

                                                                  Mobile Wearable

                                                                  - +

                                                                  Dependencies

                                                                    diff --git a/org.tizen.studio/html/download/1_0_1_release_notes.htm b/org.tizen.studio/html/download/1_0_1_release_notes.htm index aef4458..1f5e9e5 100644 --- a/org.tizen.studio/html/download/1_0_1_release_notes.htm +++ b/org.tizen.studio/html/download/1_0_1_release_notes.htm @@ -30,7 +30,7 @@
                                                                    • Release Date: Oct 28, 2016
                                                                    -

                                                                    IDE and Tools

                                                                    +

                                                                    IDE and Tools

                                                                    New Features

                                                                    @@ -82,7 +82,7 @@
                                                                  • Emulator
                                                                      -
                                                                    • Support has been added for Google Maps' search box in the location card.
                                                                      • +
                                                                    • Support has been added for Google Maps' search box in the location card.
                                                                  • Dynamic Analyzer @@ -101,7 +101,7 @@
                                                                  • Installer, Package Manager, and Uninstaller
                                                                    • Some texts in the Package Manager info dialog were displayed in a different font setting on Windows®. This issue has been fixed.
                                                                      • -
                                                                    • Texts were cut when the font size was set to "Large" on Windows®. This issue has been fixed.
                                                                      • +
                                                                    • Texts were cut when the font size was set to "Large" on Windows®. This issue has been fixed.
                                                                  • Native UI Builder @@ -117,7 +117,7 @@
                                                                  • CLI and SDB
                                                                      -
                                                                    • When the Remote Device Manager displayed the Gear device connected over Wi-Fi, the device name was shown as "unknown" due to the SDB internal error. This issue has been fixed.
                                                                      • +
                                                                    • When the Remote Device Manager displayed the Gear device connected over Wi-Fi, the device name was shown as "unknown" due to the SDB internal error. This issue has been fixed.
                                                                    • The bug, which caused the Unity 5.4.x and 5.5.x project to fail to be packaged, has been fixed.
                                                                    • @@ -155,7 +155,7 @@
                                                                  • Native UI Builder
                                                                      -
                                                                    • If the WYSIWYG editor of the Native UI Builder for Windows® runs over 12 hours, your computer slows down because of the editor's high memory usage. To solve the problem, restart the Tizen Studio.
                                                                      • +
                                                                    • If the WYSIWYG editor of the Native UI Builder for Windows® runs over 12 hours, your computer slows down because of the editor's high memory usage. To solve the problem, restart the Tizen Studio.
                                                                  • Emulator @@ -163,13 +163,13 @@
                                                                  • Ubuntu sometimes stops responding for a few seconds after closing the Emulator Manager. This issue is related to an IBus (Intelligent Input Bus) bug. When the issue occurs, restart the ibus-daemon by entering the ibus-daemon –drx command at the command prompt, and use another framework, such as uim and fcitx, for multilingual input.
                                                                  • To use the Tizen emulator, install an Intel VTx supported by the CPU, and the latest version of the graphic card driver provided by the vendor. Check the prerequisites for the Tizen emulator from Prerequisites for the Tizen Studio.
                                                                      -
                                                                    • If the host machine is using Nvidia Optimus™ technology on either Ubuntu or Windows®, you must set the Tizen emulator to run with your Nvidia® graphics card. In case of Ubuntu, check the bumblebee project (https://wiki.ubuntu.com/Bumblebee). In case of Windows®, select "High Speed NVIDIA Processor" as "Preferred Graphics processor" in the Nvidia® control panel.
                                                                      • +
                                                                    • If the host machine is using Nvidia Optimus™ technology on either Ubuntu or Windows®, you must set the Tizen emulator to run with your Nvidia® graphics card. In case of Ubuntu, check the bumblebee project (https://wiki.ubuntu.com/Bumblebee). In case of Windows®, select "High Speed NVIDIA Processor" as "Preferred Graphics processor" in the Nvidia® control panel.
                                                                    • On Ubuntu, if the graphics driver is out-of-date, your Ubuntu desktop session can be occasionally logged out when launching the Emulator Manager, or the emulator skin can be drawn improperly. Check the prerequisites and upgrade to the latest graphics driver.
                                                                  • On Ubuntu 14.04, a shortcut menu can sometimes appear transparent.
                                                                  • On Windows®, depending on your OS theme (such as Non-Aero themes and Windows XP themes), a display surface can be erased for a while if the emulator window is covered with another window. If you click the emulator window, the display surface runs correctly again.
                                                                    • -
                                                                  • On Windows®, if a 'failed to allocate memory' error occurs while executing the emulator, try the following: +
                                                                  • On Windows®, if a 'failed to allocate memory' error occurs while executing the emulator, try the following:
                                                                    • Close some other programs and try to launch the emulator again.
                                                                    • If the RAM size is set to 768 or 1024 MB for the VM in the Emulator Manager, change it to 512 MB.
                                                                      • diff --git a/org.tizen.studio/html/download/1_0_release_notes.htm b/org.tizen.studio/html/download/1_0_release_notes.htm index e82f65e..5d976df 100644 --- a/org.tizen.studio/html/download/1_0_release_notes.htm +++ b/org.tizen.studio/html/download/1_0_release_notes.htm @@ -30,7 +30,7 @@
                                                                      • Release Date: Sep 1, 2016
                                                                      -

                                                                      IDE and Tools

                                                                      +

                                                                      IDE and Tools

                                                                      New Features

                                                                      @@ -53,7 +53,7 @@
                                                                    • The project wizard has been changed and improved.
                                                                    • The Configuration (for Web) and Manifest (for native) Editors have been changed and improved.
                                                                    • The Certificate Manager has been introduced to easily create and manage a certificate profile. The IDE provides a default certificate profile to develop faster without creating an additional certificate.
                                                                      • -
                                                                    • The default font in the editing views is changed to "Eco Sans Mono", which shows characters more lucidly in the same screen size.
                                                                      • +
                                                                    • The default font in the editing views is changed to "Eco Sans Mono", which shows characters more lucidly in the same screen size.
                                                                    • Support to develop a Web widget application has been added for the wearable profile.
                                                                    • The Dropdown Target Combo has been inserted into the top trim bar of the workbench windows. With this, you can easily launch your projects on a device.
                                                                    • Support to develop Tizen 2.3.2-based applications has been added.
                                                                      • @@ -118,7 +118,7 @@
                                                                      • Unnecessary Eclipse plugins, such as JDT, PDE, mylin, birt, and egit, have been removed. Consequently, the required disk space for installing the IDE has been decreased about 100 MiB.
                                                                      • The new UX has been applied to the Preference and Properties dialogs. Various abundant items have been removed for simplicity.
                                                                        • -
                                                                      • The /home/developer/sdk_tools/lib directory has been excluded in the linking reference of the native project's -rpath option.
                                                                        • +
                                                                      • The /home/developer/sdk_tools/lib directory has been excluded in the linking reference of the native project's -rpath option.
                                                                    • Native UI Builder @@ -172,7 +172,7 @@
                                                                    • The event injection scenario has been changed. The UX of the Emulator Control Panel (ECP) has been renewed and improved:
                                                                        -
                                                                      • To improve the user's concentration on the values of an event injection device, the UX has been designed with a card selection style.
                                                                        • +
                                                                      • To improve the user's concentration on the values of an event injection device, the UX has been designed with a card selection style.
                                                                    @@ -194,7 +194,7 @@
                                                                    • Web IDE and Native IDE
                                                                        -
                                                                      • If JRE 1.8 was installed on your computer and you selected IDE > Help > Help Contents, the "HTTP ERROR:500" message sometimes appeared in the Help page due to the Eclipse Kepler bug. This issue has been fixed.
                                                                        • +
                                                                      • If JRE 1.8 was installed on your computer and you selected IDE > Help > Help Contents, the "HTTP ERROR:500" message sometimes appeared in the Help page due to the Eclipse Kepler bug. This issue has been fixed.
                                                                      • Only on Windows®, if the project had a file with its name containing a non-ASCII character, the project packaging sometimes failed. This issue has been fixed.
                                                                      • @@ -235,7 +235,7 @@
                                                                    • Installer, Package Manager, and Uninstaller
                                                                      • If the SDK Update Notification appears when you start the Tizen IDE or emulator on Mac OS® X, a terminal (shell.exec) icon can appear on the dock for a few seconds.
                                                                        • -
                                                                      • If there is a multibyte character in the Tizen SDK installation path, some development packages have a difficulty in finding the installed SDK's location when they are working.
                                                                        • +
                                                                      • If there is a multibyte character in the Tizen SDK installation path, some development packages have a difficulty in finding the installed SDK's location when they are working.
                                                                    • Web IDE @@ -252,7 +252,7 @@
                                                                    • Native UI Builder
                                                                      • When the WYSIWYG editor of the Native UI Builder for Windows® is running, a project deletion does not work properly. To solve the problem, close the editor.
                                                                        • -
                                                                      • If the WYSIWYG editor of the Native UI Builder for Windows® runs over 12 hours, your computer slows down because of the editor's high memory usage. To solve the problem, restart the Tizen IDE.
                                                                        • +
                                                                      • If the WYSIWYG editor of the Native UI Builder for Windows® runs over 12 hours, your computer slows down because of the editor's high memory usage. To solve the problem, restart the Tizen IDE.
                                                                    • EDC Editor @@ -266,13 +266,13 @@
                                                                    • Ubuntu sometimes stops responding for a few seconds after closing the Emulator Manager. This issue is related to an IBus (Intelligent Input Bus) bug. When the issue occurs, restart the ibus-daemon by entering the ibus-daemon –drx command at the command prompt, and use another framework, such as uim and fcitx, for multilingual input.
                                                                    • To use the Tizen emulator, install an Intel VTx supported by the CPU, and the latest version of the graphic card driver provided by the vendor. Check the prerequisites for the Tizen emulator from Prerequisites for the Tizen SDK.
                                                                        -
                                                                      • If the host machine is using Nvidia Optimus™ technology on either Ubuntu or Windows®, you must set the Tizen emulator to run with your Nvidia® graphics card. In case of Ubuntu, check the bumblebee project (https://wiki.ubuntu.com/Bumblebee). In case of Windows®, select "High Speed NVIDIA Processor" as "Preferred Graphics processor" in the Nvidia® control panel.
                                                                        • +
                                                                      • If the host machine is using Nvidia Optimus™ technology on either Ubuntu or Windows®, you must set the Tizen emulator to run with your Nvidia® graphics card. In case of Ubuntu, check the bumblebee project (https://wiki.ubuntu.com/Bumblebee). In case of Windows®, select "High Speed NVIDIA Processor" as "Preferred Graphics processor" in the Nvidia® control panel.
                                                                      • On Ubuntu, if the graphics driver is out-of-date, your Ubuntu desktop session can be occasionally logged out when launching the Emulator Manager, or the emulator skin can be drawn improperly. Check the prerequisites and upgrade to the latest graphics driver.
                                                                    • On Ubuntu 14.04, a shortcut menu can sometimes appear transparent.
                                                                    • On Windows®, depending on your OS theme (such as Non-Aero themes and Windows XP themes), a display surface can be erased for a while if the emulator window is covered with another window. If you click the emulator window, the display surface runs correctly again.
                                                                      • -
                                                                    • On Windows®, if a 'failed to allocate memory' error occurs while executing the emulator, try the following: +
                                                                    • On Windows®, if a 'failed to allocate memory' error occurs while executing the emulator, try the following:
                                                                      • Close some other programs and try to launch the emulator again.
                                                                      • If the RAM size is set to 768 or 1024 MB for the VM in the Emulator Manager, change it to 512 MB.
                                                                        • diff --git a/org.tizen.studio/html/download/1_1_0_release_notes.htm b/org.tizen.studio/html/download/1_1_0_release_notes.htm index 7138294..fc156ab 100644 --- a/org.tizen.studio/html/download/1_1_0_release_notes.htm +++ b/org.tizen.studio/html/download/1_1_0_release_notes.htm @@ -30,7 +30,7 @@
                                                                        • Release Date: Jan 18, 2017
                                                                        -

                                                                        IDE and Tools

                                                                        +

                                                                        IDE and Tools

                                                                        New Features

                                                                        @@ -136,7 +136,7 @@
                                                                      • Persistent Allocations table is hidden by default.
                                                                      • Filter and search functionality is available for all plain tables.
                                                                      • Table column resize behavior has been improved.
                                                                        • -
                                                                      • New "Preparing for trace" life-cycle state has been added.
                                                                        • +
                                                                      • New "Preparing for trace" life-cycle state has been added.
                                                                      • New version command has been added for the CLI.
                                                                      • UI for empty tables has been unified.
                                                                      @@ -156,7 +156,7 @@
                                                                    • Native UI Builder
                                                                        -
                                                                      • When the WYSIWYG editor of the Native UI Builder for Windows® ran over 12 hours, your computer slowed down because of the editor's high memory usage. This issue has been fixed.
                                                                        • +
                                                                      • When the WYSIWYG editor of the Native UI Builder for Windows® ran over 12 hours, your computer slowed down because of the editor's high memory usage. This issue has been fixed.
                                                                      • @@ -200,7 +200,7 @@
                                                                    • Native Component Designer
                                                                        -
                                                                      • The vector-type "part" is not supported. You cannot see the vector image and change the SVG file.
                                                                        • +
                                                                      • The vector-type "part" is not supported. You cannot see the vector image and change the SVG file.
                                                                      • Playing sound is not supported on Windows® or Mac OS® X.
                                                                      • @@ -209,13 +209,13 @@
                                                                    • Ubuntu sometimes stops responding for a few seconds after closing the Emulator Manager. This issue is related to an IBus (Intelligent Input Bus) bug. When the issue occurs, restart the ibus-daemon by entering the ibus-daemon -drx command at the command prompt, and use another framework, such as uim and fcitx, for multilingual input.
                                                                    • To use the Tizen emulator, install an Intel VTx supported by the CPU, and the latest version of the graphic card driver provided by the vendor. Check the prerequisites for the Tizen emulator from Prerequisites for the Tizen Studio.
                                                                        -
                                                                      • If the host machine is using Nvidia Optimus™ technology on either Ubuntu or Windows®, you must set the Tizen emulator to run with your Nvidia® graphics card. In case of Ubuntu, check the bumblebee project (https://wiki.ubuntu.com/Bumblebee). In case of Windows®, select "High Speed NVIDIA Processor" as "Preferred Graphics processor" in the Nvidia® control panel.
                                                                        • +
                                                                      • If the host machine is using Nvidia Optimus™ technology on either Ubuntu or Windows®, you must set the Tizen emulator to run with your Nvidia® graphics card. In case of Ubuntu, check the bumblebee project (https://wiki.ubuntu.com/Bumblebee). In case of Windows®, select "High Speed NVIDIA Processor" as "Preferred Graphics processor" in the Nvidia® control panel.
                                                                      • On Ubuntu, if the graphics driver is out-of-date, your Ubuntu desktop session can be occasionally logged out when launching the Emulator Manager, or the emulator skin can be drawn improperly. Check the prerequisites and upgrade to the latest graphics driver.
                                                                    • On Ubuntu 14.04, a shortcut menu can sometimes appear transparent.
                                                                    • On Windows®, depending on your OS theme (such as Non-Aero themes and Windows XP themes), a display surface can be erased for a while if the emulator window is covered with another window. If you click the emulator window, the display surface runs correctly again.
                                                                      • -
                                                                    • On Windows®, if a 'failed to allocate memory' error occurs while executing the emulator, try the following: +
                                                                    • On Windows®, if a 'failed to allocate memory' error occurs while executing the emulator, try the following:
                                                                      • Close some other programs and try to launch the emulator again.
                                                                      • If the RAM size is set to 768 or 1024 MB for the VM in the Emulator Manager, change it to 512 MB.
                                                                        • diff --git a/org.tizen.studio/html/download/advanced_configuration.htm b/org.tizen.studio/html/download/advanced_configuration.htm index 6ced1e1..baa1a29 100644 --- a/org.tizen.studio/html/download/advanced_configuration.htm +++ b/org.tizen.studio/html/download/advanced_configuration.htm @@ -75,13 +75,13 @@
                                                                        1. Type the full path of the SDK image file in the Package Repository box, or click Browse next to the combo box to open the file browser. -

                                                                          In the file browser, select the SDK image file, and click OK. When you select the image file, the repository's origin information of the image is displayed below the combo box.

                                                                          2. +

                                                                          In the file browser, select the SDK image file, and click OK. When you select the image file, the repository's origin information of the image is displayed below the combo box.

                                                                        2. Click OK to confirm your setting.
                                                                        Note - If the SDK image's origin repository URL or distribution ID is different compared to the current packages' URL or distribution ID, entire packages are removed to guarantee system integrity. Pay attention to that before installing or updating packages with an image file. + If the SDK image's origin repository URL or distribution ID is different compared to the current packages' URL or distribution ID, entire packages are removed to guarantee system integrity. Pay attention to that before installing or updating packages with an image file.

                                                                        Configuring the Extension SDK Repository

                                                                        diff --git a/org.tizen.studio/html/download/download.htm b/org.tizen.studio/html/download/download.htm index 7c5e3f6..b4a1f76 100644 --- a/org.tizen.studio/html/download/download.htm +++ b/org.tizen.studio/html/download/download.htm @@ -16,12 +16,12 @@ - +

                                                                        Mobile Wearable

                                                                        - +

                                                                        Dependencies

                                                                          diff --git a/org.tizen.studio/html/download/hardware_accelerated_execution_manager.htm b/org.tizen.studio/html/download/hardware_accelerated_execution_manager.htm index 85aaa7d..6c84313 100644 --- a/org.tizen.studio/html/download/hardware_accelerated_execution_manager.htm +++ b/org.tizen.studio/html/download/hardware_accelerated_execution_manager.htm @@ -15,12 +15,12 @@ - +

                                                                          Mobile Wearable

                                                                          - +

                                                                          Dependencies

                                                                            @@ -41,9 +41,9 @@

                                                                            This topic describes how to install the HAXM on your Windows® or Mac OS® development system.

                                                                            Hardware requirements:

                                                                            -
                                                                              -
                                                                            • Intel processor with support for VT-x, EM64T, and Execute Disable Bit
                                                                              • -
                                                                            • At least 1 GB of available memory (2 GB or more is preferred)
                                                                              • +
                                                                                +
                                                                              • Intel processor with support for VT-x, EM64T, and Execute Disable Bit
                                                                                • +
                                                                              • At least 1 GB of available memory (2 GB or more is preferred)
                                                                              @@ -75,22 +75,22 @@

                                                                              To install Intel® HAXM:

                                                                              -
                                                                                +
                                                                                1. Run the downloaded installer and accept the UAC prompt. - +

                                                                                  UAC prompt

                                                                                  - -
                                                                                  2. + +
                                                                                2. Click Next to start the installation. - +

                                                                                  Start installation

                                                                                  You can access the documentation at any time by clicking Intel® HAXM Documentation.

                                                                                3. Adjust the amount of RAM to be allocated to Intel® HAXM.

                                                                                  Adjust RAM

                                                                                  - +

                                                                                  The installer also functions as a configuration tool for Intel® HAXM. To change the memory settings later on, run the installer again.

                                                                                  - +
                                                                                  Note If you change the Intel® HAXM memory settings for the emulator, you must restart the Intel® HAXM and the emulator. Currently running emulator continues to use the previous memory setting. @@ -109,13 +109,13 @@ 
                                                                                   sc query intelhaxm
                                                                                  -

                                                                                  If Intel® HAXM is working, the command displays a status message indicating that the state is "4 RUNNING".

                                                                                  +

                                                                                  If Intel® HAXM is working, the command displays a status message indicating that the state is "4 RUNNING".

                                                                                  4 RUNNING status

                                                                                  Starting and Stopping Intel® HAXM

                                                                                  To start or stop Intel® HAXM, open the Command Prompt window with administrator privileges and execute one of the following commands:

                                                                                  -
                                                                                    +
                                                                                    • Start HAXM: sc start intelhaxm
                                                                                    • Stop HAXM: sc stop intelhaxm
                                                                                    @@ -137,7 +137,7 @@ sc query intelhaxm

                                                                                    Troubleshooting

                                                                                    If you meet an installation failure because of hardware requirements, check the BIOS/OS settings:

                                                                                    -
                                                                                      +
                                                                                      • Make sure VT is enabled in BIOS.
                                                                                      • Make sure Execute Disable Bit is enabled in BIOS.
                                                                                      • Make sure Data Execution Prevention is enabled in Windows®. On the Windows® platform, click Control Panel > System > Advanced system settings > Advanced tab > Performance section, Options (or Settings), and Data Execution Prevention. Make sure that DEP is enabled.
                                                                                        • @@ -174,7 +174,7 @@ sc query intelhaxm

                                                                                        To install Intel® HAXM:

                                                                                        -
                                                                                          +
                                                                                          1. Open the downloaded DMG file and run the installer inside it.
                                                                                          2. Click Continue to start the installation.

                                                                                            Start installation

                                                                                            diff --git a/org.tizen.studio/html/download/installing_sdk.htm b/org.tizen.studio/html/download/installing_sdk.htm index 1f6d592..50f1c6e 100644 --- a/org.tizen.studio/html/download/installing_sdk.htm +++ b/org.tizen.studio/html/download/installing_sdk.htm @@ -5,22 +5,22 @@ - + - Installing Tizen Studio + Installing Tizen Studio - +

                                                                                            Mobile Wearable

                                                                                            - +

                                                                                            Dependencies

                                                                                              @@ -54,7 +54,7 @@

                                                                                              Accepting the Tizen Studio software license is the first step in installing the Tizen Studio. Since the license contains important legal notifications for using the Tizen Studio, it is recommended to read it line by line, and click Accept only when you agree with the license statement.

                                                                                              -

                                                                                              Figure: Tizen Studio License Agreement

                                                                                              +

                                                                                              Figure: Tizen Studio License Agreement

                                                                                              Tizen Studio License Agreement

                                                                                              Configuring the Installation Directory

                                                                                              @@ -62,7 +62,7 @@

                                                                                              Basically, the installer is installed in the location specified in the installation settings step. You can install the Tizen Studio and its data directory where you want. To change the directory, click Browse and specify a new directory. If the new directory is valid, click Install at the bottom of the installer.

                                                                                              -

                                                                                              Figure: Configuring the installation directory

                                                                                              +

                                                                                              Figure: Configuring the installation directory

                                                                                              Configuring the installation directory

                                                                                              Installing the Tizen Studio

                                                                                              @@ -139,7 +139,7 @@ web-cli_Tizen_Studio_<version> [options] [<directory path>] If you want to develop a native application on the CLI, you must install the Native App Development platform and tools using the CLI Package Manager.
                                                                                            -

                                                                                            Installing Additional Packages with the CLI Package Manager

                                                                                            +

                                                                                            Installing Additional Packages with the CLI Package Manager

                                                                                            Run the CLI Package Manager with the install command using the following syntax:

                                                                                            @@ -183,7 +183,7 @@ package-manager-cli show-pkgs - +
                                                                                  diff --git a/org.tizen.studio/html/download/prerequisites.htm b/org.tizen.studio/html/download/prerequisites.htm index d8fe088..1b87a05 100644 --- a/org.tizen.studio/html/download/prerequisites.htm +++ b/org.tizen.studio/html/download/prerequisites.htm @@ -15,12 +15,12 @@ - +

                                                                                  Mobile Wearable

                                                                                  - +

                                                                                  Dependencies

                                                                                    @@ -39,9 +39,9 @@

                                                                                    Prerequisites for the Tizen Studio

                                                                                    - +

                                                                                    Check the following prerequisites before attempting to install the Tizen Studio.

                                                                                    - +

                                                                                    OS and System Requirements

                                                                                    The following table lists the supported operating systems and hardware requirements for the Tizen Studio.

                                                                                    @@ -157,7 +157,7 @@ Note
                                                                                    • If the host machine is using the Nvidia Optimus™ technology, the emulator works with the on-board graphics card. To prevent this, either disable the Nvidia Optimus™ technology, or set the emulator to run with the external Nvidia graphics card.
                                                                                      • -
                                                                                    • Integrated graphic cards inside Intel's Q33/Q35/Q43/Q45 motherboards are not supported.
                                                                                      • +
                                                                                    • Integrated graphic cards inside Intel's Q33/Q35/Q43/Q45 motherboards are not supported.
                                                                                    • First generation Intel HD Graphics is not supported.
                                                                                    @@ -167,7 +167,7 @@ Driver You must update to the latest vendor-provided version of the graphic card driver for OpenGL ES acceleration. - + Check and install the necessary drivers in the Control Panel > System and Security > Windows Update. - @@ -177,9 +177,9 @@ Webcam - To use the emulator with your computer's webcam, the webcam must support the USB Video Class (UVC) driver. The following image format requirements apply to each OS: + To use the emulator with your computer's webcam, the webcam must support the USB Video Class (UVC) driver. The following image format requirements apply to each OS: - + YUYV or MJPEG RGB24 or YUY2 UYYY, YYU420, YUY420, or YUYY diff --git a/org.tizen.studio/html/download/tizen_studio_migration_guide.htm b/org.tizen.studio/html/download/tizen_studio_migration_guide.htm index e29a977..1ca31b3 100644 --- a/org.tizen.studio/html/download/tizen_studio_migration_guide.htm +++ b/org.tizen.studio/html/download/tizen_studio_migration_guide.htm @@ -16,12 +16,12 @@ - +

                                                                                    Mobile Wearable

                                                                                    - +

                                                                                    Dependencies

                                                                                      @@ -45,7 +45,7 @@
                                                                                      Note -
                                                                                        +
                                                                                        • If the Tizen certificates (author and distributor) are removed during the uninstallation, you cannot issue the same ones again to update your existing applications. Back up your certificates!
                                                                                        • Your projects used in the Tizen SDK can be imported to the Tizen Studio. Do not uninstall the Tizen SDK before you have imported them to the Tizen Studio after a successful installation.
                                                                                        • Emulator images made in the Tizen SDK cannot be migrated to the Tizen Studio. After installing the Tizen Studio, you can make a new emulator for each platform.
                                                                                          • @@ -54,7 +54,7 @@

                                                                                          To migrate from the Tizen SDK to the Tizen Studio:

                                                                                          -
                                                                                            +
                                                                                            1. Back up your author and distributor certificates in the old Tizen SDK.
                                                                                            2. Install the Tizen Studio, which includes development environments for the 2.3.0, 2.3.1, 2.3.2, and 2.4 platforms.
                                                                                            3. Restore your certificates in the Tizen Studio.
                                                                                              4. @@ -75,7 +75,7 @@
                                                                                            4. /home/<user>/<TIZEN-SDK-DATA>/keystore/distributor.p12
                                                                                        -
                                                                                      • Windows®: +
                                                                                      • Windows®:
                                                                                        • C:\<TIZEN-SDK-DATA>\keystore\author.p12
                                                                                        • C:\<TIZEN-SDK-DATA>\keystore\distributor.p12
                                                                                          • @@ -91,7 +91,7 @@

                                                                                      To install Tizen Studio:

                                                                                      -
                                                                                        +
                                                                                        1. Launch the Tizen Studio installer.

                                                                                          Launch Tizen Studio installer

                                                                                          2. @@ -102,7 +102,7 @@

                                                                                          If your default location is already in use, click the … button in the SDK location field, and select an empty location.

                                                                                          Set SDK and data location

                                                                                          -
                                                                                        2. Launch the Package Manager to install additional development environment packages. +
                                                                                        3. Launch the Package Manager to install additional development environment packages.

                                                                                          Select the checkbox and click Finish to launch the Tizen Studio Package Manager.

                                                                                          Installation complete

                                                                                          4. @@ -115,7 +115,7 @@

                                                                                          Restoring Certificates

                                                                                          If you already have both certificate files, you can import and use them to sign your application:

                                                                                          -
                                                                                            +
                                                                                            1. In the Tizen Studio menu, go to Tools > Certificate Manager.
                                                                                            2. Click the + button. @@ -153,7 +153,7 @@ These instructions assume that you want to import wearable 2.3.1 projects (created by the Tizen SDK) to the Tizen Studio.
                                                                                    -
                                                                                      +
                                                                                      1. Launch the Tizen Studio from Start > Tizen Studio > Tizen Studio.

                                                                                        Launch Tizen Studio

                                                                                        2. @@ -195,7 +195,7 @@
                                                                                      2. /home/<user>/<TIZEN_SDK_DATA>
                                                                                  4. -
                                                                                4. Windows®: +
                                                                                5. Windows®:
                                                                                  • C:\<TIZEN_SDK>
                                                                                  • C:\<TIZEN_SDK_DATA>
                                                                                    • diff --git a/org.tizen.studio/html/download/uninstalling_sdk.htm b/org.tizen.studio/html/download/uninstalling_sdk.htm index a6dbf39..bb90ba4 100644 --- a/org.tizen.studio/html/download/uninstalling_sdk.htm +++ b/org.tizen.studio/html/download/uninstalling_sdk.htm @@ -15,12 +15,12 @@ - +

                                                                                    Mobile Wearable

                                                                                    - +

                                                                                    Dependencies

                                                                                      @@ -47,7 +47,7 @@

                                                                                      Selecting the Directories to Keep

                                                                                      The first step is to select the components to uninstall. By unchecking the SDK data or Keystore components, you can keep the SDK data or keystore files in each directory for future re-use.

                                                                                      -

                                                                                      Figure: Uninstaller selections

                                                                                      +

                                                                                      Figure: Uninstaller selections

                                                                                      Uninstaller selections

                                                                                      SDK Data Directory

                                                                                      @@ -59,7 +59,7 @@

                                                                                      Uninstalling the Tizen Studio

                                                                                      Once you click Uninstall, the uninstaller removes all the platforms and tools that you have installed, as well as data and files you have created. Note that you cannot cancel the uninstallation or restore the files after the uninstallation. Thus, make sure to back up data and files before clicking Uninstall.

                                                                                      -

                                                                                      Figure: Uninstallation

                                                                                      +

                                                                                      Figure: Uninstallation

                                                                                      Uninstallation

                                                                                      diff --git a/org.tizen.studio/html/download/updating_sdk.htm b/org.tizen.studio/html/download/updating_sdk.htm index b107d70..9707de5 100644 --- a/org.tizen.studio/html/download/updating_sdk.htm +++ b/org.tizen.studio/html/download/updating_sdk.htm @@ -15,12 +15,12 @@ - +

                                                                                      Mobile Wearable

                                                                                      - +

                                                                                      Dependencies

                                                                                        @@ -55,7 +55,7 @@

                                                                                        Package Manager Structure

                                                                                        The Package Manager is composed of 3 main tabs: Main SDK, Extension SDK, and Progress.

                                                                                        -
                                                                                          +
                                                                                          • In the Main SDK tab, you can manage platforms, emulators, and other advanced tools.
                                                                                          • In the Extension SDK tab, you can install and remove extension SDKs, such as the Certification Extension and other extra packages for platforms.
                                                                                          • In the Progress tab, you can monitor the progress of installing, removing, and updating packages. You can also cancel the process while the packages are installing or updating.
                                                                                            • @@ -74,7 +74,7 @@
                                                                                          • On Ubuntu, select Dashboard Home > Package Manager.
                                                                                          -

                                                                                          Figure: Package Manager main window

                                                                                          +

                                                                                          Figure: Package Manager main window

                                                                                          Package Manager main window

                                                                                          Looking Around the Package Manager

                                                                                          @@ -193,7 +193,7 @@ package-manager-cli update [--accept-license] [--no-java-check] [--proxy <val This option is only useful to update the Tizen Studio to the latest version after you downgraded it manually to an earlier version. Otherwise, the Package Manager updates it to the latest version with or without this option. - +
                                                                                      diff --git a/org.tizen.studio/html/index.htm b/org.tizen.studio/html/index.htm index ebae3fd..b8f7edb 100644 --- a/org.tizen.studio/html/index.htm +++ b/org.tizen.studio/html/index.htm @@ -31,7 +31,7 @@
                                                                                    • Prerequisites
                                                                                    • Updating Tizen Studio
                                                                                    • Hardware Accelerated Execution Manager
                                                                                      • -
                                                                                    +
                                                                                6. Tizen Studio Migration Guide
                                                                                7. Configuring the Package Manager
                                                                                  8. @@ -67,13 +67,13 @@ - +
                                                                          • EDC Editor
                                                                          • Component Designer
                                                                          - +
                                                                        • Configuring Your App -
                                                                          • +
                                                                        • Debugging Your App
                                                                        • CLI @@ -140,7 +140,7 @@
                                                                        • Writing and Editing Codes -
                                                                          • +
                                                                        • Configuring Your App -
                                                                          • +
                                                                        • Debugging Your App
                                                                        • Using the Web Simulator diff --git a/org.tizen.studio/html/native_tools/call_stack_view_n.htm b/org.tizen.studio/html/native_tools/call_stack_view_n.htm index f97af64..9413bfd 100644 --- a/org.tizen.studio/html/native_tools/call_stack_view_n.htm +++ b/org.tizen.studio/html/native_tools/call_stack_view_n.htm @@ -5,13 +5,13 @@ - + - Getting Crash Data from Call Stack View - + Getting Crash Data from Call Stack View +
                                                                          @@ -28,23 +28,23 @@
                                                                          -

                                                                          Getting Crash Data from Call Stack View

                                                                          -

                                                                          The Call Stack view provides information about a crashed API, call stack, or debug message, when the application crashes while running. Though debugging tools give more detailed information in the debugging state, the Call Stack view is a useful tool in the running state.

                                                                          -

                                                                          When the application crashes during running, the Tizen Studio creates a *.cs file in the crash-info folder under the current project and shows the Call Stack view automatically. The view can also be opened from the Tizen Studio menu by selecting Window > Show View > Other > Tizen > Call Stack.

                                                                          -

                                                                          The Call Stack view has 3 tabs:

                                                                          -
                                                                            +

                                                                            Getting Crash Data from Call Stack View

                                                                            +

                                                                            The Call Stack view provides information about a crashed API, call stack, or debug message, when the application crashes while running. Though debugging tools give more detailed information in the debugging state, the Call Stack view is a useful tool in the running state.

                                                                            +

                                                                            When the application crashes during running, the Tizen Studio creates a *.cs file in the crash-info folder under the current project and shows the Call Stack view automatically. The view can also be opened from the Tizen Studio menu by selecting Window > Show View > Other > Tizen > Call Stack.

                                                                            +

                                                                            The Call Stack view has 3 tabs:

                                                                            +
                                                                            • Header: Provides basic information about the crashed application. Select a specific information type from the left pane.

                                                                              Figure: Header tab

                                                                              -

                                                                              Header tab

                                                                              • +

                                                                              Header tab

                                                                            • Call Stack Information: Traces call stack steps to find where the memory block has crashed. If you select a call stack item in the left pane, search result is shown in the right pane.

                                                                              Figure: Call Stack Information tab

                                                                              -

                                                                              Call Stack Information tab

                                                                              • +

                                                                              Call Stack Information tab

                                                                            • Debug Message: Provides the latest debug messages and the filtering function similar to the Log view. You can search with keywords filtered by tag, pid, and message.

                                                                              Figure: Debug Message tab

                                                                              -

                                                                              Debug Message tab

                                                                              • -
                                                                            -

                                                                            The Call Stack view shows information only when the application crashes.

                                                                            - +

                                                                            Debug Message tab

                                                                            +
                                                                          +

                                                                          The Call Stack view shows information only when the application crashes.

                                                                          +
                                                                          diff --git a/org.tizen.studio/html/native_tools/component_attributes_n.htm b/org.tizen.studio/html/native_tools/component_attributes_n.htm index 597f9ed..55e6f83 100644 --- a/org.tizen.studio/html/native_tools/component_attributes_n.htm +++ b/org.tizen.studio/html/native_tools/component_attributes_n.htm @@ -5,22 +5,22 @@ - + - Managing UI Component Attributes in layout.xml + Managing UI Component Attributes in layout.xml - + @@ -52,33 +52,33 @@

                                                                          The layout.xml file has a hierarchical organization, which consists of XML elements. The tree structure in the following figure shows the relationship between the elements of the layout.xml file.

                                                                          -

                                                                          Figure: Elements in the layout.xml file

                                                                          +

                                                                          Figure: Elements in the layout.xml file

                                                                          Elements in the layout.xml file

                                                                          The following example illustrates the content and structure of the layout.xml file. The usage format is <attribute_name=value>.

                                                                          -<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <document>
-    <mscreen>
-        <configuration device="HD" id="config1" name="common" orientation="portrait" type="common" />
-        <configuration orientation="landscape" name="sd" id="configuration1" type="specific" device="HD" />
-    </mscreen>
-    <views startup="view1">
-        <view id="view1" indicator="true" screen_orientation="full_sensor" type="view">
-            <grid align_h="fill" vsize_w="1000" align_v="fill" visible="true" weight_v="1"
-                  id="grid1" weight_h="1" vsize_h="1000">
-                <button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" align_h="fill"
-                        pack_w="210" disable="false" pack_x="406" pack_y="219" style="default" id="button1" text="Button">
-                    <event connection_wrapper="connection_view1_button1_onclicked"
-                           function_name="view1_button1_onclicked" signal="clicked" target="view2" />
-                    <variation config_ref="configuration1" visible="true" pack_w="210" pack_x="515"
-                               pack_h="49" pack_y="753" />
-                </button>
-            </grid>
-        </view>
-        <view indicator="true" screen_orientation="full_sensor" id="view2" type="view"></view>
-    </views>
+    <mscreen>
+        <configuration device="HD" id="config1" name="common" orientation="portrait" type="common" />
+        <configuration orientation="landscape" name="sd" id="configuration1" type="specific" device="HD" />
+    </mscreen>
+    <views startup="view1">
+        <view id="view1" indicator="true" screen_orientation="full_sensor" type="view">
+            <grid align_h="fill" vsize_w="1000" align_v="fill" visible="true" weight_v="1"
+                  id="grid1" weight_h="1" vsize_h="1000">
+                <button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" align_h="fill"
+                        pack_w="210" disable="false" pack_x="406" pack_y="219" style="default" id="button1" text="Button">
+                    <event connection_wrapper="connection_view1_button1_onclicked"
+                           function_name="view1_button1_onclicked" signal="clicked" target="view2" />
+                    <variation config_ref="configuration1" visible="true" pack_w="210" pack_x="515"
+                               pack_h="49" pack_y="753" />
+                </button>
+            </grid>
+        </view>
+        <view indicator="true" screen_orientation="full_sensor" id="view2" type="view"></view>
+    </views>
 </document>
                                                                          @@ -92,7 +92,7 @@ 
                                                                           <mscreen>
-   <configuration device="HD" id="config1" name="common" orientation="portrait" type="common" />
+   <configuration device="HD" id="config1" name="common" orientation="portrait" type="common" />
 </mscreen>
                                                                          @@ -139,10 +139,10 @@

                                                                          The <variation> element represents a set of the variation properties. The following is an example:

                                                                          -<button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" 
-        align_h="fill" pack_w="210" disable="false" pack_x="406"
-        pack_y="219" style="default" id="button1" text="Button">
-    <variation config_ref="configuration1" visible="true" pack_w="210" pack_x="515" pack_h="49" pack_y="753" />
+<button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1"
+        align_h="fill" pack_w="210" disable="false" pack_x="406"
+        pack_y="219" style="default" id="button1" text="Button">
+    <variation config_ref="configuration1" visible="true" pack_w="210" pack_x="515" pack_h="49" pack_y="753" />
 </button>
                                                                          @@ -171,7 +171,7 @@ pack_col, pack_row, row_span, col_span Position when the parent container is a table. -

                                                                          pack_col/pack_row: 0 ~

                                                                          +

                                                                          pack_col/pack_row: 0 ~

                                                                          row_span/col_span: 1 ~

                                                                          @@ -186,8 +186,8 @@

                                                                          By using various UI containers and components in the Palette of the native UI Builder, you can create your application UI layout. Each component can be set in various styles. For a detailed list of component styles, see the related guides (mobile and wearable).

                                                                          -

                                                                          Figure: Native UI Builder Palette

                                                                          -

                                                                          Native UI Builder Palette

                                                                          +

                                                                          Figure: Native UI Builder Palette

                                                                          +

                                                                          Native UI Builder Palette

                                                                          Component Attributes – Common

                                                                          @@ -252,11 +252,11 @@

                                                                          An <event> element represents a set of the event attributes. The following is an example:

                                                                          -<button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1"
-        align_h="fill" pack_w="210" disable="false" pack_x="406"
-        pack_y="219" style="default" id="button1" text="Button">
-    <event connection_wrapper="connection_view1_button1_onclicked" function_name="view1_button1_onclicked" 
-           signal="clicked" target="view2" />
+<button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1"
+        align_h="fill" pack_w="210" disable="false" pack_x="406"
+        pack_y="219" style="default" id="button1" text="Button">
+    <event connection_wrapper="connection_view1_button1_onclicked" function_name="view1_button1_onclicked"
+           signal="clicked" target="view2" />
 </button>
                                                                          @@ -280,7 +280,7 @@ connection_wrapper - Connection wrapper function's name + Connection wrapper function's name target @@ -328,8 +328,8 @@

                                                                          A box is a basic and simple EFL container.

                                                                          -<box homogeneous="false" align_h="fill" align_v="fill" visible="true" weight_v="1" padding_v="0"
-     id="box2" padding_h="0" weight_h="1" direction="vertical">
+<box homogeneous="false" align_h="fill" align_v="fill" visible="true" weight_v="1" padding_v="0"
+     id="box2" padding_h="0" weight_h="1" direction="vertical">
 </box>
                                                                          @@ -375,11 +375,11 @@

                                                                          In a grid container, objects are placed at specific positions along a fixed grid.

                                                                          -<grid align_h="fill" vsize_w="1000" align_v="fill" visible="true" weight_v="1"
-      id="grid1" weight_h="1" vsize_h="1000">
-    <button align_v="fill" visible="true" weight_v="1" pack_h="48" weight_h="1" align_h="fill"
-            pack_w="210" disable="false" pack_x="365" pack_y="197" style="default" id="button1" text="Button">
-    </button>
+<grid align_h="fill" vsize_w="1000" align_v="fill" visible="true" weight_v="1"
+      id="grid1" weight_h="1" vsize_h="1000">
+    <button align_v="fill" visible="true" weight_v="1" pack_h="48" weight_h="1" align_h="fill"
+            pack_w="210" disable="false" pack_x="365" pack_y="197" style="default" id="button1" text="Button">
+    </button>
 </grid>
                                                                          @@ -420,8 +420,8 @@

                                                                          A panel container is an animated object that contains child objects. It can be expanded or contracted by clicking the button on its edge.

                                                                          -<panel align_h="fill" align_v="fill" visible="true" orient="top" hidden="false" weight_v="1"
-       id="panel1" weight_h="1">
+<panel align_h="fill" align_v="fill" visible="true" orient="top" hidden="false" weight_v="1"
+       id="panel1" weight_h="1">
 </panel>
                                                                          @@ -463,14 +463,14 @@

                                                                          A panes container adds a draggable bar between 2 sections of content. The sections are resized when the bar is dragged.

                                                                          -<panes align_h="fill" align_v="fill" visible="true" weight_v="1" fixed="false" id="panes1"
-       weight_h="1" right_size="0.5" direction="vertical">
-    <button align_h="fill" align_v="fill" visible="true" weight_v="1" disable="false" style="default"
-            id="button1" text="Button" weight_h="1" pack="left">
-    </button>
-    <button align_h="fill" align_v="fill" visible="true" weight_v="1" disable="false" style="default"
-            id="button2" text="Button" weight_h="1" pack="right">
-    </button>
+<panes align_h="fill" align_v="fill" visible="true" weight_v="1" fixed="false" id="panes1"
+       weight_h="1" right_size="0.5" direction="vertical">
+    <button align_h="fill" align_v="fill" visible="true" weight_v="1" disable="false" style="default"
+            id="button1" text="Button" weight_h="1" pack="left">
+    </button>
+    <button align_h="fill" align_v="fill" visible="true" weight_v="1" disable="false" style="default"
+            id="button2" text="Button" weight_h="1" pack="right">
+    </button>
 </panes>
                                                                          @@ -517,9 +517,9 @@

                                                                          A scroller container holds (and clips) a single object and allows you to scroll across it.

                                                                          -<scroller scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="123"
-          content_min_h="false" weight_h="1" scrollbar_h="auto" align_h="fill" propagate_events="true"
-          pack_w="276" pack_x=v433" pack_y="173" style="default" id="scroller1" content_min_w="false">
+<scroller scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="123"
+          content_min_h="false" weight_h="1" scrollbar_h="auto" align_h="fill" propagate_events="true"
+          pack_w="276" pack_x=v433" pack_y="173" style="default" id="scroller1" content_min_w="false">
 </scroller>
                                                                          @@ -577,11 +577,11 @@

                                                                          A table container is like the box but with 2 dimensions.

                                                                          -<table align_v="fill" visible="true" weight_v="1" pack_h="244" padding_h="0" weight_h="1" rows="2"
-       homogeneous="false" align_h="fill" pack_w="417" pack_x="164" pack_y="166" padding_v="0" id="table1" cols="2">
-    <button align_v="fill" visible="true" weight_v="1" weight_h="1" col_span="1" align_h="fill"
-            pack_row="0" row_span="1" disable="false" style="default" pack_col="1" id="button2" text="Button">
-    </button>
+<table align_v="fill" visible="true" weight_v="1" pack_h="244" padding_h="0" weight_h="1" rows="2"
+       homogeneous="false" align_h="fill" pack_w="417" pack_x="164" pack_y="166" padding_v="0" id="table1" cols="2">
+    <button align_v="fill" visible="true" weight_v="1" weight_h="1" col_span="1" align_h="fill"
+            pack_row="0" row_span="1" disable="false" style="default" pack_col="1" id="button2" text="Button">
+    </button>
 </table>
                                                                          @@ -630,8 +630,8 @@

                                                                          A background component (in mobile and wearable applications) is used to set a solid background decoration to a window or a container object. It works like an image, but has some background-specific properties, such as setting it to a tiled, centered, scaled, or stretched mode.

                                                                          -<bg align_v="fill" visible="true" color="" src="" weight_v="1" pack_h="162" weight_h="1" align_h="fill"
-    pack_w="278" pack_x="338" pack_y="244" id="bg1" option="scale">
+<bg align_v="fill" visible="true" color="" src="" weight_v="1" pack_h="162" weight_h="1" align_h="fill"
+    pack_w="278" pack_x="338" pack_y="244" id="bg1" option="scale">
 </bg>
                                                                          @@ -678,8 +678,8 @@

                                                                          A button component (in mobile and wearable applications) is a simple push button. It is composed of a label icon and an icon object, and has an auto-repeat feature.

                                                                          -<button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" align_h="fill" pack_w="210"
-        disable="false" pack_x="290" pack_y="364" style="default" id="button1" text="Button">
+<button align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" align_h="fill" pack_w="210"
+        disable="false" pack_x="290" pack_y="364" style="default" id="button1" text="Button">
 </button>
                                                                          @@ -732,9 +732,9 @@

                                                                          A calendar component displays and manipulates month views. (Since 2.4, this component is supported in mobile applications only.)

                                                                          -<calendar align_v="fill" visible="true" weight_v="1" pack_h="365" weight_h="1" max_year="-1"
-          align_h="fill" select_mode="default" pack_w="668" disable="false" pack_x="207" pack_y="247"
-          interval="0.85" id="calendar1" min_year="1902">
+<calendar align_v="fill" visible="true" weight_v="1" pack_h="365" weight_h="1" max_year="-1"
+          align_h="fill" select_mode="default" pack_w="668" disable="false" pack_x="207" pack_y="247"
+          interval="0.85" id="calendar1" min_year="1902">
 </calendar>
                                                                          @@ -786,8 +786,8 @@

                                                                          A check component (in mobile and wearable applications) toggles the Boolean value between true and false.

                                                                          -<check align_v="fill" visible="true" weight_v="1" pack_h="48" weight_h="1" align_h="fill" pack_w="208"
-       disable="false" pack_x="429" pack_y="356" style="default" id="check1" text="Check" state="false">
+<check align_v="fill" visible="true" weight_v="1" pack_h="48" weight_h="1" align_h="fill" pack_w="208"
+       disable="false" pack_x="429" pack_y="356" style="default" id="check1" text="Check" state="false">
 </check>
                                                                          @@ -840,8 +840,8 @@

                                                                          A colorselector component provides a color selection solution to the user. It has different modes, each of them showing a different configuration of selectable colors.

                                                                          -<colorselector align_h="fill" align_v="fill" visible="true" weight_v="1" pack_w="667" pack_x="386"
-               pack_h="131" pack_y="565" id="colorselector1" weight_h="1">
+<colorselector align_h="fill" align_v="fill" visible="true" weight_v="1" pack_w="667" pack_x="386"
+               pack_h="131" pack_y="565" id="colorselector1" weight_h="1">
 </colorselector>
                                                                          @@ -873,12 +873,12 @@

                                                                          A ctxpopup component (in mobile and wearable applications) is a contextual popup that shows a small list of items.

                                                                          -<view indicator="true" screen_orientation="full_sensor" id="view2" type="popup">
-    <ctxpopup align_h="fill" align_v="fill" visible="true" weight_v="1" disable="false"
-              id="ctxpopup1" weight_h="1" direction="vertical">
-        <ctxpopupitem id="ctxpopupitem1" text="CtxPopupItem"></ctxpopupitem>
-    <ctxpopupitem id="ctxpopupitem2" text="CtxPopupItem"></ctxpopupitem>
-    </ctxpopup>
+<view indicator="true" screen_orientation="full_sensor" id="view2" type="popup">
+    <ctxpopup align_h="fill" align_v="fill" visible="true" weight_v="1" disable="false"
+              id="ctxpopup1" weight_h="1" direction="vertical">
+        <ctxpopupitem id="ctxpopupitem1" text="CtxPopupItem"></ctxpopupitem>
+    <ctxpopupitem id="ctxpopupitem2" text="CtxPopupItem"></ctxpopupitem>
+    </ctxpopup>
 </view>
                                                                          @@ -950,8 +950,8 @@

                                                                          A datetime component (in mobile and wearable applications) can display and accept input for date and time values.

                                                                          -<datetime align_h="fill" align_v="fill" visible="true" weight_v="1" pack_w="528" disable="false" pack_x="232"
-          pack_h="171" pack_y="433" style="default" id="datetime1" weight_h="1">
+<datetime align_h="fill" align_v="fill" visible="true" weight_v="1" pack_w="528" disable="false" pack_x="232"
+          pack_h="171" pack_y="433" style="default" id="datetime1" weight_h="1">
 </datetime>
                                                                          @@ -999,10 +999,10 @@

                                                                          An entry component (in mobile and wearable applications) is a box to which the user can enter text.

                                                                          -<entry context_menu="true" align_v="fill" visible="true" src="" weight_v="1" editable="true" pack_h="82"
-       scroll="false" weight_h="1" single_line="false" align_h="fill" password="false"
-       file_text_format="plain_utf8" pack_w="208" disable="false" pack_x="289" pack_y="268"
-       id="entry1" text="Entry">
+<entry context_menu="true" align_v="fill" visible="true" src="" weight_v="1" editable="true" pack_h="82"
+       scroll="false" weight_h="1" single_line="false" align_h="fill" password="false"
+       file_text_format="plain_utf8" pack_w="208" disable="false" pack_x="289" pack_y="268"
+       id="entry1" text="Entry">
 </entry>
                                                                          @@ -1079,9 +1079,9 @@

                                                                          A flipselector component shows a set of text items one at a time. The user can flip up or down the selector to change the text on it. It can contain a small number of items. (Since 2.4, this component is supported in mobile applications only.)

                                                                          -<flipselector align_h="fill" align_v="fill" visible="true" weight_v="1" pack_w="196" disable="false" pack_x="210"
-              pack_h="146" pack_y="312" id="flipselector1" weight_h="1">
-    <flipselectoritem id="flipselectoritem1" text="item"></flipselectoritem>
+<flipselector align_h="fill" align_v="fill" visible="true" weight_v="1" pack_w="196" disable="false" pack_x="210"
+              pack_h="146" pack_y="312" id="flipselector1" weight_h="1">
+    <flipselectoritem id="flipselectoritem1" text="item"></flipselectoritem>
 </flipselector>
                                                                          @@ -1134,7 +1134,7 @@ text #string elm_flipselector_item_append() - + @@ -1143,14 +1143,14 @@

                                                                          A gengrid component displays objects on a grid layout and renders only the visible objects. The gengrid can contain a small number of items.

                                                                          -<gengrid scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="324" item_size_w="200"
-         weight_h="1" scrollbar_h="auto" align_h="fill" select_mode="default" multi_select="false"
-         item_size_h="200" pack_w="554" disable="false" pack_x="206" pack_y="316" style="default"
-         id="gengrid1" direction="vertical">
-    <gengriditem src="" style="default" disabled="false" id="gengriditem1"
-                 text="item" selected="false"></gengriditem>
-    <gengriditem src="" style="default" disabled="false" id="gengriditem2"
-                 text="item" selected="false"></gengriditem>
+<gengrid scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="324" item_size_w="200"
+         weight_h="1" scrollbar_h="auto" align_h="fill" select_mode="default" multi_select="false"
+         item_size_h="200" pack_w="554" disable="false" pack_x="206" pack_y="316" style="default"
+         id="gengrid1" direction="vertical">
+    <gengriditem src="" style="default" disabled="false" id="gengriditem1"
+                 text="item" selected="false"></gengriditem>
+    <gengriditem src="" style="default" disabled="false" id="gengriditem2"
+                 text="item" selected="false"></gengriditem>
 </gengrid>
                                                                          @@ -1244,7 +1244,7 @@ text #string elm_gengrid_item_append() - + src #string @@ -1268,15 +1268,15 @@

                                                                          A genlist component (in mobile and wearable applications) displays a scrollable list of items.

                                                                          -<genlist scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="244" weight_h="1"
-         homogeneous="false" scrollbar_h="auto" align_h="fill" select_mode="default" pack_w="668"
-         disable="false" pack_x="134" pack_y="204" style="solid/default" id="genlist1">
-    <genlistitem sub_text="Sub Text" end_image_path="" item_type="none" image_path="" style="default"
-                 id="genlistitem1" text="List item" end_standard_icon="" selected="false"
-                 standard_icon=""></genlistitem>
-    <genlistitem sub_text="Sub Text" end_image_path="" item_type="none" image_path="" style="default"
-                 id="genlistitem2" text="List item" end_standard_icon="" selected="false"
-                 standard_icon=""></genlistitem>
+<genlist scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="244" weight_h="1"
+         homogeneous="false" scrollbar_h="auto" align_h="fill" select_mode="default" pack_w="668"
+         disable="false" pack_x="134" pack_y="204" style="solid/default" id="genlist1">
+    <genlistitem sub_text="Sub Text" end_image_path="" item_type="none" image_path="" style="default"
+                 id="genlistitem1" text="List item" end_standard_icon="" selected="false"
+                 standard_icon=""></genlistitem>
+    <genlistitem sub_text="Sub Text" end_image_path="" item_type="none" image_path="" style="default"
+                 id="genlistitem2" text="List item" end_standard_icon="" selected="false"
+                 standard_icon=""></genlistitem>
 </genlist>
                                                                          @@ -1403,11 +1403,11 @@

                                                                          A hoversel component is a button that pops up a list of items.

                                                                          -<hoversel align_h="fill" align_v="fill" visible="true" disable="false" weight_v="1"
-          pack_h="41" weight_h="1" pack_w="69" pack_x="308" pack_y="341"
-          id="hoversel1" text="Hoversel">
-    <hoverselitem id="hoverselitem1" text="Hoverselitem"></hoverselitem>
-    <hoverselitem id="hoverselitem2" text="Hoverselitem"></hoverselitem>
+<hoversel align_h="fill" align_v="fill" visible="true" disable="false" weight_v="1"
+          pack_h="41" weight_h="1" pack_w="69" pack_x="308" pack_y="341"
+          id="hoversel1" text="Hoversel">
+    <hoverselitem id="hoverselitem1" text="Hoverselitem"></hoverselitem>
+    <hoverselitem id="hoverselitem2" text="Hoverselitem"></hoverselitem>
 </hoversel>
                                                                          @@ -1475,9 +1475,9 @@

                                                                          An image component (in mobile and wearable applications) loads and displays an image from a file or memory.

                                                                          -<image resizable_up="true" resizable_down="true" align_v="fill" visible="true" src="" weight_v="1"
-       pack_h="41" weight_h="1" align_h="fill" aspect_fixed="false" pack_w="69" pack_x="308" pack_y="341"
-       no_scale="false" id="image1" fill_outside="false">
+<image resizable_up="true" resizable_down="true" align_v="fill" visible="true" src="" weight_v="1"
+       pack_h="41" weight_h="1" align_h="fill" aspect_fixed="false" pack_w="69" pack_x="308" pack_y="341"
+       no_scale="false" id="image1" fill_outside="false">
 </image>
                                                                          @@ -1534,10 +1534,10 @@

                                                                          An index component (in mobile and wearable applications) provides an index for fast access to another group of UI items. The index can contain a small number of items.

                                                                          -<index indicator="true" align_v="fill" visible="true" weight_v="1" pack_h="122" weight_h="1" align_h="fill"
-       pack_w="276" disable="false" pack_x="368" pack_y="385" id="index1" autohide="false">
-    <indexitem id="indexitem1" text="item"></indexitem>
-    <indexitem id="indexitem2" text="item"></indexitem>
+<index indicator="true" align_v="fill" visible="true" weight_v="1" pack_h="122" weight_h="1" align_h="fill"
+       pack_w="276" disable="false" pack_x="368" pack_y="385" id="index1" autohide="false">
+    <indexitem id="indexitem1" text="item"></indexitem>
+    <indexitem id="indexitem2" text="item"></indexitem>
 </index>
                                                                          @@ -1604,9 +1604,9 @@

                                                                          A label component (in mobile and wearable applications) displays text with a simple HTML-like markup.

                                                                          -<label align_v="fill" visible="true" weight_v="1" line_wrap="none" pack_h="24" weight_h="1"
-       ellipsis="false" align_h="fill" wrap_width="0" pack_w="139" disable="false"
-       pack_x="282" pack_y="415" id="label1" text="Label">
+<label align_v="fill" visible="true" weight_v="1" line_wrap="none" pack_h="24" weight_h="1"
+       ellipsis="false" align_h="fill" wrap_width="0" pack_w="139" disable="false"
+       pack_x="282" pack_y="415" id="label1" text="Label">
 </label>
                                                                          @@ -1658,8 +1658,8 @@

                                                                          A layout is a container component that takes a standard Edje design file and wraps it very thinly in a UI component.

                                                                          -<layout align_v="fill" visible="true" src="edc.edj" weight_v="1" pack_h="122" weight_h="1" align_h="fill"
-        pack_w="210" disable="false" pack_x="329" pack_y="398" id="layout1" group="main">
+<layout align_v="fill" visible="true" src="edc.edj" weight_v="1" pack_h="122" weight_h="1" align_h="fill"
+        pack_w="210" disable="false" pack_x="329" pack_y="398" id="layout1" group="main">
 </layout>
                                                                          @@ -1701,11 +1701,11 @@

                                                                          A list component (in mobile and wearable applications) is a very simple list for managing a small number of items. If you need to manage a lot of items, use the genlist component instead.

                                                                          -<list scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="244" weight_h="1" mode="scroll"
-      scrollbar_h="auto" align_h="fill" select_mode="default" multi_select="false" pack_w="667"
-      disable="false" pack_x="307" pack_y="272" id="list1">
-    <listitem id="listitem1" text="List item" selected="false"></listitem>
-    <listitem id="listitem2" text="List item" selected="false"></listitem>
+<list scrollbar_v="auto" align_v="fill" visible="true" weight_v="1" pack_h="244" weight_h="1" mode="scroll"
+      scrollbar_h="auto" align_h="fill" select_mode="default" multi_select="false" pack_w="667"
+      disable="false" pack_x="307" pack_y="272" id="list1">
+    <listitem id="listitem1" text="List item" selected="false"></listitem>
+    <listitem id="listitem2" text="List item" selected="false"></listitem>
 </list>
                                                                          @@ -1797,8 +1797,8 @@

                                                                          A map component can display a geographic map. The default map data is provided by the OpenStreetMap project.

                                                                          -<map align_v="fill" visible="true" weight_v="1" pack_h="244" latitude="0" zoom_level="15" weight_h="1"
-     align_h="fill" pack_w="417" pack_x="221" pack_y="318" id="map1" longitude="0">
+<map align_v="fill" visible="true" weight_v="1" pack_h="244" latitude="0" zoom_level="15" weight_h="1"
+     align_h="fill" pack_w="417" pack_x="221" pack_y="318" id="map1" longitude="0">
 </map>
                                                                          @@ -1845,10 +1845,10 @@

                                                                          A multibutton entry component allows the user to enter text so that the text is divided into chunks and managed as a set of buttons.

                                                                          -<multibuttonentry align_v="fill" visible="true" weight_v="0" editable="true" pack_h="40" weight_h="0"
-                  align_h="fill" expanded="false" pack_w="210" disable="false" pack_x="329"
-                  pack_y="360" id="multibuttonentry1">
-    <multibuttonentryitem id="multibuttonentryitem1" text="item" />
+<multibuttonentry align_v="fill" visible="true" weight_v="0" editable="true" pack_h="40" weight_h="0"
+                  align_h="fill" expanded="false" pack_w="210" disable="false" pack_x="329"
+                  pack_y="360" id="multibuttonentry1">
+    <multibuttonentryitem id="multibuttonentryitem1" text="item" />
 </multibuttonentry>
                                                                          @@ -1920,9 +1920,9 @@

                                                                          A progressbar component (in mobile and wearable applications) is used to display the progress status of a given job.

                                                                          -<progressbar align_v="fill" visible="true" weight_v="1" pack_h="24" weight_h="1" align_h="fill" span_size="0"
-             pack_w="210" disable="false" pack_x="579" pack_y="432" style="default" id="progressbar1"
-             inverted="false" value="0" direction="horizontal">
+<progressbar align_v="fill" visible="true" weight_v="1" pack_h="24" weight_h="1" align_h="fill" span_size="0"
+             pack_w="210" disable="false" pack_x="579" pack_y="432" style="default" id="progressbar1"
+             inverted="false" value="0" direction="horizontal">
 </progressbar>
                                                                          @@ -2047,8 +2047,8 @@

                                                                          A radio component (in mobile and wearable applications) can display 1 or more options, while the user can only select one of them. The UI component is composed of an indicator (selected or unselected), an optional icon, and an optional label. Even though it is usually grouped with 2 or more other radio components, it can also be used alone.

                                                                          -<radio align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" align_h="fill" pack_w="208"
-       disable="false" pack_x="318" pack_y="478" id="radio1" text="Radio" state_value="0" value="0">
+<radio align_v="fill" visible="true" weight_v="1" pack_h="49" weight_h="1" align_h="fill" pack_w="208"
+       disable="false" pack_x="318" pack_y="478" id="radio1" text="Radio" state_value="0" value="0">
 </radio>
                                                                          @@ -2101,9 +2101,9 @@

                                                                          A slider component (in mobile and wearable applications) is a draggable bar that is used to select a value from a range of values.

                                                                          -<slider indicator="false" align_v="fill" visible="true" max="1.0" weight_v="1" pack_h="25" indicator_format=""
-        weight_h="1" align_h="fill" min="0.0" pack_w="276" disable="false" pack_x="318" pack_y="424"
-        style="default" step="0.05" id="slider1" inverted="false" value="0.0" direction="horizontal">
+<slider indicator="false" align_v="fill" visible="true" max="1.0" weight_v="1" pack_h="25" indicator_format=""
+        weight_h="1" align_h="fill" min="0.0" pack_w="276" disable="false" pack_x="318" pack_y="424"
+        style="default" step="0.05" id="slider1" inverted="false" value="0.0" direction="horizontal">
 </slider>
                                                                          @@ -2195,9 +2195,9 @@

                                                                          A spinner component enables the user to increase or decrease a numeric value by using arrow buttons. (This component is not supported in wearable circle applications.)

                                                                          -<spinner align_v="fill" visible="true" max="100" weight_v="1" editable="true" pack_h="123" weight_h="1"
-         align_h="fill" min="0" pack_w="210" disable="false" pack_x="279" pack_y="377"
-         style="horizontal" step="1" id="spinner1">
+<spinner align_v="fill" visible="true" max="100" weight_v="1" editable="true" pack_h="123" weight_h="1"
+         align_h="fill" min="0" pack_w="210" disable="false" pack_x="279" pack_y="377"
+         style="horizontal" step="1" id="spinner1">
 </spinner>
                                                                          @@ -2266,15 +2266,15 @@

                                                                          A toolbar component is a small scrollable list of items. It can also show a menu when an item is selected. Only one item can be selected at a time.

                                                                          -<toolbar shrink_mode="none" align_v="fill" visible="true" weight_v="0" 
-         pack_h="41" weight_h="0" homogeneous="true" align_h="fill" 
-         select_mode="default" pack_w="668" pack_x="113" pack_y="190" 
-         icon_size="32" style="default" id="toolbar1" 
-         transverse_expand="false" direction="horizontal">
-    <toolbaritem src="" disable="false" id="toolbaritem1" text="item" 
-                 selected="false" />
-    <toolbaritem src="" disable="false" id="toolbaritem2" text="item" 
-                 selected="false" />
+<toolbar shrink_mode="none" align_v="fill" visible="true" weight_v="0"
+         pack_h="41" weight_h="0" homogeneous="true" align_h="fill"
+         select_mode="default" pack_w="668" pack_x="113" pack_y="190"
+         icon_size="32" style="default" id="toolbar1"
+         transverse_expand="false" direction="horizontal">
+    <toolbaritem src="" disable="false" id="toolbaritem1" text="item"
+                 selected="false" />
+    <toolbaritem src="" disable="false" id="toolbaritem2" text="item"
+                 selected="false" />
 </toolbar>
                                                                          diff --git a/org.tizen.studio/html/native_tools/component_designer_n.htm b/org.tizen.studio/html/native_tools/component_designer_n.htm index e0b2ab4..f22070e 100644 --- a/org.tizen.studio/html/native_tools/component_designer_n.htm +++ b/org.tizen.studio/html/native_tools/component_designer_n.htm @@ -5,22 +5,22 @@ - + - Designing UIs with the Component Designer + Designing UIs with the Component Designer - +

                                                                          Mobile native Wearable native

                                                                          - +

                                                                          Dependencies

                                                                            @@ -29,8 +29,8 @@

                                                                            Content

                                                                            • UI Layout
                                                                              • -
                                                                            • Group Navigation
                                                                              • -
                                                                            • Part/program Navigation
                                                                              • +
                                                                            • Group Navigation
                                                                              • +
                                                                            • Part/program Navigation
                                                                            • Workspace
                                                                            • Properties
                                                                            • Managers
                                                                              • @@ -45,15 +45,15 @@

                                                                              The Component Designer is a rich graphical tool that provides a UI for the EDC markup. It is aimed to simplify the creation and editing of UI component styles, avoiding the need to learn the EDC syntax.

                                                                              The Component Designer was designed with the idea that target users are not just programmers, but also designers. Besides styles, the Component Designer is also able to create and edit custom layouts.

                                                                              -

                                                                              Figure: Component Designer

                                                                              -

                                                                              Component Designer

                                                                              +

                                                                              Figure: Component Designer

                                                                              +

                                                                              Component Designer

                                                                              UI Layout

                                                                              The Component Designer contains a few different blocks, which interact with each other to show, for example, groups, parts, and EDJ collections.

                                                                              In the following figure:

                                                                              -
                                                                                +
                                                                                • Block in the middle (yellow rectangle) is a workspace. It is used to show group parts.
                                                                                • Blocks on the left (green and blue) are navigation blocks.

                                                                                  The top one contains a list of groups, while the bottom one usually shows parts, programs, data, and other things related to the group (group usually consist of parts, programs working with and sometimes manipulating a part, and some simple data).

                                                                                  @@ -62,45 +62,45 @@
                                                                                • Block on the right is Property. It shows the properties of the item currently selected in the navigation bottom block, and it can be a part, program, or data.
                                                                                • Violet bar at the top contains tabs. Each tab has its own workspace.
                                                                                • Red bar at the bottom of the window is a status bar. -

                                                                                  Figure: Component Designer window blocks

                                                                                  +

                                                                                  Figure: Component Designer window blocks

                                                                                  Component Designer window blocks

                                                                                Group Navigation

                                                                                - +

                                                                                The list of groups is located on the left side of the Component Designer, and holds all groups from the loaded project, with items sorted alphabetically.

                                                                                Figure: Group navigation

                                                                                -

                                                                                Group navigation

                                                                                +

                                                                                Group navigation

                                                                                On the top of the navigation bar, 2 icons allow you to add a new group into the project or delete an existing group. If you add a new group, a simple dialog wizard opens, and sets a name for new group and selects a source group, if one is required to create a copy or alias.

                                                                                Note Copy and alias are different entities. A copied group is an independent group with all parameters copied from the source group. An alias, on the other side, is just a link. The alias group has a specific icon (Link) and the opened alias group does not allow you to work with the part/program navigation or with parts on the workspace.
                                                                                -

                                                                                The group list structure is based on splitting the group name by tokens that are separated from each other by the \ character. This creates a clear tree view. For example, the default Elementary theme contains a lot of groups with styles for elementary components. By splitting the root tokens from component styles (for example, elm/check/base/default), all groups related to Elementary can be organized below the elm entity. On the next level, the splitting happens based on the component names (for example, elm/check/base/default). And finally, the lowest level leafs of this tree are the styles names (for example, elm/check/base/default).

                                                                                -

                                                                                For comfortable visual navigation, the tree leafs have a "document" icon, and the nodes are represented by a "folder" icon.

                                                                                +

                                                                                The group list structure is based on splitting the group name by tokens that are separated from each other by the \ character. This creates a clear tree view. For example, the default Elementary theme contains a lot of groups with styles for elementary components. By splitting the root tokens from component styles (for example, elm/check/base/default), all groups related to Elementary can be organized below the elm entity. On the next level, the splitting happens based on the component names (for example, elm/check/base/default). And finally, the lowest level leafs of this tree are the styles names (for example, elm/check/base/default).

                                                                                +

                                                                                For comfortable visual navigation, the tree leafs have a "document" icon, and the nodes are represented by a "folder" icon.

                                                                                Part/program Navigation

                                                                                The Component Designer provides a navigation bar for primitives that are stored inside groups. The primitives are parts, programs, and data. They are placed on the right side of main work area as 2 root nodes.

                                                                                Figure: Part/program navigation

                                                                                -

                                                                                Part/program navigation

                                                                                +

                                                                                Part/program navigation

                                                                                The controls placed at the top of the navigation bar make it possible to add new primitives or change the order of the parts inside the group. Click the + icon to see the names of the available primitive types. Depending on the selected context, some of the entities can be disabled.

                                                                                Figure: Available primitive types

                                                                                Available primitive types

                                                                                For example, to add a new state for an existing part:

                                                                                -
                                                                                  +
                                                                                  1. Select the part name in the list and add a new state by clicking the + icon.
                                                                                  2. A special wizard guides you through the adding of new primitives with necessary attributes, according to the type of the selected primitive.
                                                                                  3. Select the primitive item in the list to update its attributes properties. By double-clicking the state name you can switch the part state. The state is updated in the workspace view.

                                                                                  To manage primitives:

                                                                                  -
                                                                                    +
                                                                                    • Parts

                                                                                      There is an eye icon (Eye) on the left side of the part name. If the group has too many parts, and it is too complicated to work with them on the workspace, you can hide some parts by clicking the eye icon. To show the part again, click the empty check that replaces the eye icon.

                                                                                      To identify the part type in the tree, an icon representing the part type is shown on the right side of the part name. The following table shows the currently available part types.

                                                                                      - +

                                                                                      Table: Part types

                                                                                      @@ -153,22 +153,22 @@ Some parts can contain items in addition to states, for example, a box or table. The parts/programs list only allows you to add or remove programs. By clicking a program name, the properties are updated to the program parameters available to be modified.

                                                                                    • Data items

                                                                                      Data items contain raw data information (data name and raw value) that is encased inside the current group. Sometimes, the data item information is really important (for example, genlist items contain data items important for setting the text and content). You can add and delete data items by using the controls on top of the navigation bar.

                                                                                      • - +

                                                                                      Workspace

                                                                                      The workspace is placed in the middle of the Component Designer window. It shows a visual representation of the group being edited.

                                                                                      Figure: Workspace

                                                                                      -

                                                                                      Workspace

                                                                                      +

                                                                                      Workspace

                                                                                      You can open multiple groups at the same time, and switch between them using the tab bar placed above the workspace.

                                                                                      Each workspace has a history (for undo and redo actions).

                                                                                      The workspace component can demonstrate 2 possible behaviors: normal and demo.

                                                                                      Group View

                                                                                      The workspace group view is a scrollable view where the background is preset by using certain tools. It contains a visual representation of the group, showing its parts and applied properties:

                                                                                      -
                                                                                        +
                                                                                        • Parts stay within a specific container that can be resized.
                                                                                        • Parts can be manipulated by a mouse pointer.
                                                                                        • Parts can be selected and highlighted, and by using the highlight, resized.
                                                                                          • -
                                                                                        +
                                                                                      Note Clicking a part selects it and loads the part properties. Clicking an already selected part switches between the part state and the part (and switches their properties as well). @@ -176,26 +176,26 @@ Data items contain raw data information (data name and raw value) that is encase

                                                                                      If you right-click the group view background, a context menu opens. You can select actions, such as undo, redo, and show/hide rulers and certain scales (or both). The group view also contains rulers to show the relative and absolute sizes.

                                                                                      Tools

                                                                                      Workspace has various tools to allow you to manipulate it:

                                                                                      -
                                                                                        +
                                                                                        • The size of the previewed group can be changed through the container border. The container has a small rectangle in the right bottom corner: use it to change the size with the mouse.

                                                                                          Another way is to use the spinners placed at the beginning of the toolbar to set the container size. The chain between the spinners determines whether the width and height changes are made simultaneously. The toggle on the left blocks all size changes.

                                                                                          In the following figure, the setting at the bottom blocks all size changes, and the width and height changes are not linked. At the top, the size changes are not blocked, and the width and height changes are linked.

                                                                                          -

                                                                                          Figure: Container size

                                                                                          -

                                                                                          Container size

                                                                                          +

                                                                                          Figure: Container size

                                                                                          +

                                                                                          Container size

                                                                                          Container size

                                                                                        • If the group is too small or too big, you can zoom in and out with a slider. To set an accurate zoom value, use the zoom spinner. -

                                                                                          Figure: Zooming

                                                                                          -

                                                                                          Zooming

                                                                                          +

                                                                                          Figure: Zooming

                                                                                          +

                                                                                          Zooming

                                                                                        • To fit the group view with the currently opened group, use the Size icon. It makes the group smaller or larger, as needed, to fit the size of the group view.

                                                                                          When the fit is selected, it blocks all size changes until the fit is unselected.

                                                                                        • You can undo and redo all changes that happen during group editing. The change history is cleared when you close the tab of the edited group in the workspace. -

                                                                                          Figure: Undo and redo

                                                                                          +

                                                                                          Figure: Undo and redo

                                                                                          Undo and redo

                                                                                        • A combo box allows fast access to the resource libraries. All available libraries are shown in the drop-down list. -

                                                                                          Figure: Resource library access

                                                                                          +

                                                                                          Figure: Resource library access

                                                                                          Resource library access

                                                                                        @@ -214,7 +214,7 @@ Data items contain raw data information (data name and raw value) that is encase

                                                                                        When the object area is selected to be shown, the part highlight has another handler in its middle. By dragging that handler, you can change the align of the selected part.

                                                                                        Modes

                                                                                        The workspace can demonstrate 2 possible behaviors:

                                                                                        -
                                                                                          +
                                                                                          • Normal

                                                                                            This mode is used to manipulate the group primitives in the development stage. All parts are represented on the workspace, including containers and spacers. Each of the non-visible primitive types has their own pattern and color. This makes it possible to understand the markup of the group and the dependencies between primitives. Text parts are bordered to show the area from the left top to right bottom corners. In addition, text parts set the part name as content if there is no preset text in that part (it can be set in the text block in the properties).

                                                                                            You can select primitives directly on the workspace in this mode. You can also select parts inside the part/program navigation panel, as usual. The selected part is covered by the resizing control element, which shows highlights that change the maximum size of the primitive.

                                                                                            @@ -226,7 +226,7 @@ Data items contain raw data information (data name and raw value) that is encase

                                                                                            The demo mode can also emit signals to objects. When the programs inside a group are created, you want to check how the objects react to those signals. The list of signals that can be emitted in the demo mode exclude the programs that depend on mouse events, because it is easier to click (or mouse in/out, double-click) on a real object.

                                                                                            Figure: Demo mode

                                                                                            Demo mode

                                                                                            • -
                                                                                          +
                                                                                        Important @@ -242,7 +242,7 @@ Data items contain raw data information (data name and raw value) that is encase

                                                                                        You can show 2 scales on rulers:

                                                                                        Figure: Ruler scales

                                                                                        Ruler scales

                                                                                        -
                                                                                          +
                                                                                          • Absolute scale (gray text and dashes): rulers show the decent sizes in pixels of the entire group shown and loaded into the container.
                                                                                          • Relative scale (blue bubble with value inside): rulers show the relatives of the selected part (or the entire group if a part is not selected). The relative scale works well with the object area, showing all relatives of the current object on a group view.
                                                                                          @@ -255,7 +255,7 @@ Data items contain raw data information (data name and raw value) that is encase

                                                                                          All general properties that can be modified are described in the following sections. There are different properties for an opened group, demo mode, selected items, data, program, state, and part. Some user-friendly general behaviors, such as list filtering (hide other controls on certain values), popups, and highlights are covered as well.

                                                                                          Property Controls

                                                                                          Properties consist of different controls:

                                                                                          -
                                                                                            +
                                                                                            • The properties are generally grouped into a tree structure containing the attributes (controls) and related values together. For example, the Color block contains the color classes and general color, while the Position block contains all controls to work with relatives (such as relative to and offsets).
                                                                                            • Most properties have a description (title) text, which is highlighted with bold when it has a non-default value. Every property has 1 or 2 controls (like min and max in the Picture property), and the property can show a subparam (subtitle) and measure (for example, px).

                                                                                              Figure: Property title and value

                                                                                              @@ -305,16 +305,16 @@ Data items contain raw data information (data name and raw value) that is encase

                                                                                              Part block properties

                                                                                              State Block Properties

                                                                                              The State block is huge. It differs depending on the selected state of a certain part type. Generally all part types contain 4 blocks:

                                                                                              -
                                                                                                +
                                                                                                • Colors (selected color class for this state or general color)
                                                                                                • Size (such as min, max, and aspects)
                                                                                                • Position (relatives, offsets, and align)
                                                                                                • Map (everything related to map, perspective, colors, and rotations)
                                                                                                  • -
                                                                                                +

                                                                                              Some types have specific blocks in their states. The image part has the Image block (properties, such as tweens, image, and borders) and the Fill block. The text and textblock parts have some text attributes inside every state. The container parts (box and table) have some container attributes (such as align and weight).

                                                                                              Program Block Properties

                                                                                              -

                                                                                              The program usually has 1 important block that contains some attributes, such as the program name, action type, signal, source, and filters. Usually, it also contain a list of after's - programs that are run together with the selected program in a certain queue.

                                                                                              +

                                                                                              The program usually has 1 important block that contains some attributes, such as the program name, action type, signal, source, and filters. Usually, it also contain a list of after's - programs that are run together with the selected program in a certain queue.

                                                                                              Figure: Program block properties

                                                                                              Program block properties

                                                                                              Based on the program action type, the block can contain more attributes. For example, the Action params can have a state name and value for the STATE_SET program type, or it can be a sample, channel, and duration for SOUND_SAMPLE. @@ -331,12 +331,12 @@ For programs like STATE_SET, there is also a block used to set

                                                                                              Data item block properties

                                                                                              Demo Block Properties

                                                                                              The Demo block appears only when the workspace is in the demo mode, and the navigation list of parts contains only signals, text, textblock, and swallow parts. The demo properties differ depending on what kind of part or signal is selected:

                                                                                              -
                                                                                                +
                                                                                                • For selected signals, information is shown about the signal, such as the emitter, signal, and type of program to be called.
                                                                                                • For selected text and textblock parts, simple property attributes are shown, such as uneditable part name and content. By typing text into content, the text is sent to the demo object, showing how the loaded demo object acts when certain text gets into the text parts.
                                                                                                • For selected swallows, more attributes are shown. If you use the swallow properties, you can set up different objects into the selected swallow, and see the resulting layout.

                                                                                                  The demo mode shows how the end result looks like when a specific component or layout is used inside different programs or as a theme.

                                                                                                  • -
                                                                                                +

                                                                                              The Demo properties allows you to set a rectangle (and its color), image (with a path to the image file to load the picture from the system), or UI component (predefined list of components to put into the swallow, for example, check, button, and gengrid). In addition, you can set up a certain style for the selected component, from inside the group.

                                                                                              For any kind of content (UI component, image, or rectangle), you can set up the min and max size, which also helps to determine the resulting behavior of the loaded group.

                                                                                              @@ -382,7 +382,7 @@ For programs like STATE_SET, there is also a block used to set

                                                                                              The style manager shows all textblock styles in the project. You can expand the style to see all its elements.

                                                                                              Figure: Textblock styles

                                                                                              Textblock styles

                                                                                              -

                                                                                              DEFAULT is a virtual element that defines the properties of the text not enclosed in any element. The element's attributes can be edited after selecting it. In the left side, you can see how the selected element affects the text in the textblock.

                                                                                              +

                                                                                              DEFAULT is a virtual element that defines the properties of the text not enclosed in any element. The element's attributes can be edited after selecting it. In the left side, you can see how the selected element affects the text in the textblock.

                                                                                              Colorclasses

                                                                                              Color classes are designed to simplify color adjustment in your theme. Changing colors in the color class manager affects all parts in all styles that are using it.

                                                                                              diff --git a/org.tizen.studio/html/native_tools/content_assist_n.htm b/org.tizen.studio/html/native_tools/content_assist_n.htm index 36eb563..145ef9e 100644 --- a/org.tizen.studio/html/native_tools/content_assist_n.htm +++ b/org.tizen.studio/html/native_tools/content_assist_n.htm @@ -44,7 +44,7 @@

                                                                                              These features improve code productivity when you develop your applications.

                                                                                              API Assist

                                                                                              - +

                                                                                              When you write code, the API assist feature provides API suggestions to complete the code faster.

                                                                                              To receive the API suggestions manually, type at least one letter of content, and press Ctrl + Space. The suggestion list appears. Use the arrow keys to select a suggestion from the list, and press Enter to complete the code.

                                                                                              @@ -57,7 +57,7 @@

                                                                                        API Hover

                                                                                        - +

                                                                                        When you hover over a Tizen native API function in the source editor, a popup window appears below the function. In that window, you can get detailed information of the API function, such as a brief description, defined parameters, return value type, and exception information.

                                                                                        Figure: Using API hover

                                                                                        API hover

                                                                                        diff --git a/org.tizen.studio/html/native_tools/cover_code_n.htm b/org.tizen.studio/html/native_tools/cover_code_n.htm index df9f7c4..22f3190 100644 --- a/org.tizen.studio/html/native_tools/cover_code_n.htm +++ b/org.tizen.studio/html/native_tools/cover_code_n.htm @@ -40,13 +40,13 @@
                                                                                      • API and Privilege Checker (Verifying APIs and Privileges)

                                                                                        The API Checker tool checks for API and privilege usage violations in the application code. It helps you to identify and fix potential problems in the application code related to the API and privilege versions.

                                                                                        • - +
                                                                                      • UI Builder (Building UIs with Components)

                                                                                        The UI Builder tool is a WYSIWYG (What You See Is What You Get) design environment editor used to create user interfaces. It simplifies the creation of Tizen native application UIs by allowing you to arrange UI components using drag-and-drop operations. The UI Builder is a UI layout code generating tool, which also supports an easy-to-use programming model.

                                                                                      • EDC Editor (Designing UIs with the EDC Editor)

                                                                                        The EDC Editor tool is an EDC (Edje Data Collections) script editor that supports text editing and previewing functions for the EDC source code. You can write simple and complex layout designs using the EDC script with the EDC Editor. The EDC Editor makes it easier to write the EDC script code and faster to finish your work.

                                                                                        • - +
                                                                                      • Component Designer (Designing UIs with the Component Designer)

                                                                                        The Component Designer tool provides a UI for the EDC markup. It simplifies the creation and editing of UI component styles, avoiding the need to learn the EDC syntax. Besides the UI component styles, the Component Designer can also create and edit custom layouts.

                                                                                      diff --git a/org.tizen.studio/html/native_tools/cover_debug_n.htm b/org.tizen.studio/html/native_tools/cover_debug_n.htm index 51d8dc1..5de3add 100644 --- a/org.tizen.studio/html/native_tools/cover_debug_n.htm +++ b/org.tizen.studio/html/native_tools/cover_debug_n.htm @@ -38,21 +38,21 @@
                                                                                    • Log View (Checking Logs with Log View)

                                                                                      The Log view allows you to check the logs of your application based on the logging methods you have inserted to your code. It helps to debug your application by capturing all the events logged by the platform and your application.

                                                                                      • - +
                                                                                    • Dynamic Analyzer (Monitoring Performance with Dynamic Analyzer) -

                                                                                      The Dynamic Analyzer tool monitors the performance of your application on a target device or emulator. It analyzes your application for potential performance issues, such as high usage of CPU, memory, file or network operations.

                                                                                      • +

                                                                                      The Dynamic Analyzer tool monitors the performance of your application on a target device or emulator. It analyzes your application for potential performance issues, such as high usage of CPU, memory, file or network operations.

                                                                                    • Call Stack View (Getting Crash Data from Call Stack View)

                                                                                      The Call Stack view provides useful information for debugging the application when the application crashes while running. It provides generic information about the crashed application, traces where the memory block has crashed, and shows the latest debug messages.

                                                                                      • - +
                                                                                    • Static Analyzer (Analyzing the Source Code)

                                                                                      The Static Analyzer tool is used for source code analysis to finds issues in Tizen applications. It can be helpful in detecting a variety of issues in the code during compilation, well before the application deployment. The tool uses clang static analyzer to analyze C/C++ code.

                                                                                      • - +
                                                                                    • Valgrind (Profiling Memory with Valgrind)

                                                                                      The Valgrind tools is used for performance profiling. It detects memory errors and memory leaks in an application.

                                                                                      • - +
                                                                                    • T-trace (Optimizing Performance with T-trace) -

                                                                                      The T-trace tool allows you to detect and analyze performance issues by measuring and visualizing instrumented function calls in the Tizen platform. It helps you to understand what the system is doing while your application is running.

                                                                                      • +

                                                                                      The T-trace tool allows you to detect and analyze performance issues by measuring and visualizing instrumented function calls in the Tizen platform. It helps you to understand what the system is doing while your application is running.

                                                                                      diff --git a/org.tizen.studio/html/native_tools/cover_native_n.htm b/org.tizen.studio/html/native_tools/cover_native_n.htm index 1a13fb3..7a74b4a 100644 --- a/org.tizen.studio/html/native_tools/cover_native_n.htm +++ b/org.tizen.studio/html/native_tools/cover_native_n.htm @@ -42,13 +42,13 @@
                                                                                    • Writing and Editing Codes

                                                                                      You can use the content assist and API and privilege checker tools to speed up the code writing and verification task. In addition, you can design the application UI by arranging UI components with the visual UI Builder tool, or by defining the components and layout with the EDC script, using the EDC script editor or a graphical Component Designer.

                                                                                      • - +
                                                                                    • Configuring Your Application

                                                                                      You can manage various application functionalities and features through the application manifest file, which you can easily configure with the manifest text editor. In addition, you can localize your application to use various languages and locale-specific resources by using the PO file editor and Resource Manager view in the Tizen Studio.

                                                                                      • - +
                                                                                    • Debugging Your Application -

                                                                                      You can debug, profile, and optimize your application with various tools, such as the Dynamic Analyzer, Static Analyzer, Valgrind, and T-trace. The Tizen Studio provides various views designed to help you identify and fix runtime errors, such as the Log and Call Stack views.

                                                                                      • - +

                                                                                      You can debug, profile, and optimize your application with various tools, such as the Dynamic Analyzer, Static Analyzer, Valgrind, and T-trace. The Tizen Studio provides various views designed to help you identify and fix runtime errors, such as the Log and Call Stack views.

                                                                                      +
                                                                                    • Running and Testing Your Application

                                                                                      You can run and test your application using the Tizen emulator. In addition, you can use the Connection Explorer view to manage connections to the emulator and various other target devices. The Smart Development Bridge (SDB) tool allows you to communicate with a connected target device, and the unit test tool allows you to create test projects to verify the reliability of your code.

                                                                                      • diff --git a/org.tizen.studio/html/native_tools/cover_project_mgmt_n.htm b/org.tizen.studio/html/native_tools/cover_project_mgmt_n.htm index a90c169..61d8fa3 100644 --- a/org.tizen.studio/html/native_tools/cover_project_mgmt_n.htm +++ b/org.tizen.studio/html/native_tools/cover_project_mgmt_n.htm @@ -37,10 +37,10 @@
                                                                                      • Project Creation Wizard (Creating Tizen Projects with Tizen Project Wizard)

                                                                                        The Project Wizard tool is used to create an application project. You can select from various project templates and samples that make it easier for you to start coding your application. When you create a new project with a specific template, the Project Wizard uses it to automatically create basic functionalities and default project files and folders for the application.

                                                                                        • - +
                                                                                      • Project Explorer View (Managing Tizen Projects with Project Explorer View)

                                                                                        The Project Explorer view shows a hierarchical view of all project resources in the workspace. It allows you to manage Tizen projects, change the project resources, and build, export, and convert projects.

                                                                                        • - +
                                                                                      • Certificate Registration (Working with the Certificate Profile)

                                                                                        The Certificate Manager tool is used to create a certificate profile and register author and distributor certificates. Before installing your application on a device or submitting it to the Tizen Store, you must sign it with a certificate profile while packaging your application.

                                                                                      diff --git a/org.tizen.studio/html/native_tools/cover_run_test_n.htm b/org.tizen.studio/html/native_tools/cover_run_test_n.htm index 968e114..9818391 100644 --- a/org.tizen.studio/html/native_tools/cover_run_test_n.htm +++ b/org.tizen.studio/html/native_tools/cover_run_test_n.htm @@ -37,13 +37,13 @@
                                                                                      • Connection Explorer View (Managing and Connecting Devices for Testing)

                                                                                        The Connection Explorer view shows the devices connected to the system, and allows you to manage multiple emulator instances. You can explore the file systems of the connected devices and perform file operations.

                                                                                        • - +
                                                                                      • SDB (Connecting Devices over Smart Development Bridge)

                                                                                        The SDB tool uses a command line to communicate with an emulator instance or a connected target device. You can send commands to a specific device to advance application development, such as file transfer, remote shell command, port forwarding for a debugger, viewing, filtering, and controlling target log output.

                                                                                        • - +
                                                                                      • Emulator (Running Applications on the Emulator)

                                                                                        The Tizen emulator tool reduces the inconvenience of testing the application in a real device, by providing an environment similar to a real device. With the Emulator Manager, you can create multiple emulator instances, each representing a different environment (device type).

                                                                                        • - +
                                                                                      • Unit Test (Building Unit Test Projects)

                                                                                        The unit test tool is used to ensure that the application runs properly as intended in the source code. You can create, build, and edit unit tests, and check and analyze the test results.

                                                                                      diff --git a/org.tizen.studio/html/native_tools/edc_editor_n.htm b/org.tizen.studio/html/native_tools/edc_editor_n.htm index 448af87..b49170f 100644 --- a/org.tizen.studio/html/native_tools/edc_editor_n.htm +++ b/org.tizen.studio/html/native_tools/edc_editor_n.htm @@ -20,7 +20,7 @@

                                                                                      Mobile Wearable

                                                                                      - +

                                                                                      Dependencies

                                                                                        @@ -46,13 +46,13 @@

                                                                                        When your application requires real-time changeable layouts, for example, animations, you can write the layout designs using an EDC script, compile it into an EDJ format file, and import it into your application using a UI layout component. You can also write simple and complex design layouts using the EDC script with the EDC Editor. The EDC Editor makes it easier to write the EDC script code and faster to finish your work. If you are not familiar with EDC programming, see Layouting with EDC for more information.

                                                                                        -

                                                                                        Figure: EDC Editor

                                                                                        +

                                                                                        Figure: EDC Editor

                                                                                        EDC Editor

                                                                                        The EDC Editor also provides useful functions for you to develop your application UI. Before using the EDC Editor, familiarize yourself with the functionalities described in the following sections.

                                                                                        Editor Views

                                                                                        The EDC Editor consists of the following views:

                                                                                        -
                                                                                          +
                                                                                          • Directory view

                                                                                            The directory view shows the file list in the current workspace

                                                                                            • @@ -79,7 +79,7 @@

                                                                                            If your EDC collection consists of multiple EDC files, set up a workspace. The default workspace directory is where you opened the EDC file in the Tizen Studio.

                                                                                            The workspace is designed to be used with the file browser (toggle hotkey, F9) and the file tab (toggle hotkey, F11) so that you can navigate between multiple EDC files. The file browser (directory view) displays the current workspace directory.

                                                                                            You can open EDC files in the directory view by double-clicking them. The EDC text file is opened in a new file tab.

                                                                                            -

                                                                                            The EDC Editor allows only one main EDC file that can be activated in the live view. In the directory view, the main EDC file is displayed with the [main] tag. If the main EDC file contains multiple sub EDC files, you can open and navigate through them. You can open those files in the directory view, or by pressing the F3 key if the text editor cursor is placed on the "include" line in the text view (such as #include "subfile.edc"). To go back to the previously edited file tab, use the F4 shortcut key.

                                                                                            +

                                                                                            The EDC Editor allows only one main EDC file that can be activated in the live view. In the directory view, the main EDC file is displayed with the [main] tag. If the main EDC file contains multiple sub EDC files, you can open and navigate through them. You can open those files in the directory view, or by pressing the F3 key if the text editor cursor is placed on the "include" line in the text view (such as #include "subfile.edc"). To go back to the previously edited file tab, use the F4 shortcut key.

                                                                                            The EDC Editor tracks the currently focused EDC group to display it while you go through the groups in 1 EDC collection. But if you open a new EDC file which contains another collection, you need to manually set up that file to be a main. To let the EDC Editor know that EDC has a collection to be adoptable with its subordinate files, press the F2 key after selecting the new main EDC file in the directory view. You can also change the main EDC file in Settings > EDC Build > Main EDC File.

                                                                                            Code View

                                                                                            @@ -87,7 +87,7 @@

                                                                                            The text editor applies syntax color and auto indentation for EDC with its own coding standard rules. If you open an EDC file which does not use the EDC Editor coding standard rules, the EDC Editor applies them to your source code automatically. To disable this functionality, go to Settings > Preference > Auto Indentation.

                                                                                            The code view supports the following features:

                                                                                            -
                                                                                              +
                                                                                              • Auto-complete

                                                                                                To help you write EDC source code, the code view supports an auto-complete function, which lists the reserved keywords in a contextual pop-up.

                                                                                                Figure: Auto-complete feature

                                                                                                @@ -103,7 +103,7 @@

                                                                                                The candidate list function also helps you to know the available range of numeric values based on the context. The numeric candidate function shows a range of available numbers. When you drag the sliders, the EDC Editor updates the preview instantly.

                                                                                              • Color selector -

                                                                                                To change color values, use the color selector tool. Each time a "color" keyword is double-clicked, it displays the color selector.

                                                                                                +

                                                                                                To change color values, use the color selector tool. Each time a "color" keyword is double-clicked, it displays the color selector.

                                                                                                Figure: Color selector feature

                                                                                                Color selector feature

                                                                                                • @@ -122,7 +122,7 @@

                                                                                                View Layer

                                                                                                For easy navigation inside the EDC blocks, the EDC Editor provides a tree-style visual tool called the view layer. You can expand and contract tree items and understand the structure of your EDC layout at a glance.

                                                                                                The following blocks are supported in the view layer:

                                                                                                -
                                                                                                  +
                                                                                                  • Group
                                                                                                  • Part
                                                                                                  • State
                                                                                                    • @@ -268,7 +268,7 @@

                                                                                                    Using Interactive Feedback

                                                                                                    The EDC Editor has the following ways of providing interactive feedback information when you edit the EDC source code:

                                                                                                    -
                                                                                                      +
                                                                                                      • Highlighting a part object

                                                                                                        To easily identify the part object that you are modifying, the EDC Editor highlights the preview image corresponding to the part object. When you click a part section in the EDC source code, the image corresponding to that part object is highlighted in the preview. Alternatively, clicking a part object image in the preview moves the editor cursor to the corresponding EDC line in the code view.

                                                                                                        Figure: Part object highlighting

                                                                                                        @@ -278,20 +278,20 @@

                                                                                                        To notify you about EDC grammar errors, the EDC Editor compiles the EDC source code in the background and detects errors whenever the EDC source code is saved.

                                                                                                        When errors are detected, the console view at the bottom of the EDC Editor is activated automatically, and the detected errors are listed there. The erroneous code is also underlined in the code view. The console view is deactivated when the errors are fixed.

                                                                                                        The console view behavior is only enabled if the auto hiding console mode is enabled in Settings > Preference > Auto Hiding Console. You can change the size of the console view by dragging the pane divider between the code view and the console view. You can also toggle the console view visibility with the Alt + Up and Alt + Down hotkeys.

                                                                                                        - +

                                                                                                        Figure: Error detection

                                                                                                        Error detection

                                                                                                        - +
                                                                                                      • Image preview

                                                                                                        To easily check the image files you use, the code view allows you to preview image files. Write an image keyword and an image file name in the EDC source code and click the image keyword. The preview pop-up of the clicked image file opens. If other image files are written in a previous or next line of the previewed image line, you can view them using the up and down arrow keys or the mouse wheel.

                                                                                                        - +

                                                                                                        Figure: Image preview

                                                                                                        Image preview

                                                                                                      • Reference popup

                                                                                                        A reference popup is like a manual for the EDC keywords applicable to the current cursor position. It shows a description of an EDC keyword for the beginners, who are not familiar with the EDC programming script language, and helps them to understand the keyword syntax. To pop up the reference, press the F5 key after positioning the editor cursor on an EDC keyword.

                                                                                                        - +

                                                                                                        Figure: Reference popup

                                                                                                        Reference popup

                                                                                                        • @@ -315,10 +315,10 @@

                                                                                                        The position and size of a part object in pixels are displayed in the center of the part object preview image. The relative position of the part object is displayed on the top left and bottom right boxes.

                                                                                                        Change the position and size of a part object by dragging the control points placed on each edge of the part object. To move the part object without changing the size, drag the object itself. To move the object position pixel by pixel, use the arrow keys.

                                                                                                        Each part in a layout can be constructed with a relative or fixed size:

                                                                                                        - +
                                                                                                        • If a part is constructed with a fixed size, its size does not scale with the other parts or the layout size. When the live edit mode is activated, you can find a fixed size tool at the bottom of the preview. Check the fixed size options for width and height to fix them. For more information about the scalability concept in EDC, see Scalability Using the EDC File.
                                                                                                          • -
                                                                                                        • A part with a relative size expands or contracts its size to keep up with other parts' position and size or a layout size. In contrast to the fixed size, you can set a new part's position and size relative to other parts. Drag a control point to the edge of other existing parts. Once you release the mouse button, a contextual pop-up opens and displays a list of candidate parts that you can select as a relative to the X and Y coordinates of the new part.
                                                                                                          • +
                                                                                                        • A part with a relative size expands or contracts its size to keep up with other parts' position and size or a layout size. In contrast to the fixed size, you can set a new part's position and size relative to other parts. Drag a control point to the edge of other existing parts. Once you release the mouse button, a contextual pop-up opens and displays a list of candidate parts that you can select as a relative to the X and Y coordinates of the new part.
                                                                                                      • Auto-align the part object @@ -342,7 +342,7 @@

                                                                                                        Preferences

                                                                                                        The preferences contain occasionally used options in the EDC Editor. In addition, it contains some unique function options, such as Auto Hiding Console, Smart Redo/Undo, and Error Message Red Alert:

                                                                                                        -
                                                                                                          +
                                                                                                          • When the Auto Hiding Console option is switched on, the EDC Editor hides the console box automatically when no messages exist after you have fixed all grammatical errors.
                                                                                                          • When the Smart Undo/Redo option is switched on, the EDC Editor redoes and undoes text word by word. If disabled, redoing and undoing works character by character.
                                                                                                          • When the Error Message Red Alert option is switched on, the EDC Editor enables the error message red alert effect. When the EDC compilation fails because of a grammatical error, the EDC Editor alerts you with a fading screen effect. @@ -362,9 +362,9 @@

                                                                                                            Running the EDC Editor

                                                                                                            There are 3 ways to start the EDC editor:

                                                                                                            -
                                                                                                              +
                                                                                                              • Open an existing EDC file: -
                                                                                                                  +
                                                                                                                  1. In Tizen Studio, open a Tizen application project.
                                                                                                                  2. In the Project Explorer view, select an EDC file in the resource folder.

                                                                                                                    Select EDC

                                                                                                                    @@ -375,7 +375,7 @@
                                                                                                                1. Create a new EDC file: -
                                                                                                                    +
                                                                                                                    1. In Tizen Studio, open a Tizen application project.
                                                                                                                    2. In the Project Explorer view, select the project name.
                                                                                                                    3. Right-click the project, and select New > EDC file. @@ -385,7 +385,7 @@
                                                                                                                  1. Create a new EDC file with a predefined template: -
                                                                                                                      +
                                                                                                                      1. In Tizen Studio, open a Tizen application project.
                                                                                                                      2. In the Project Explorer view, select the project name.
                                                                                                                      3. Right-click the project, and select New > EDC file.
                                                                                                                        4. @@ -411,8 +411,8 @@ Evas_Object *layout; layout = elm_layout_add(parent); char buf[PATH_MAX]; -app_get_resource("edje/my_layout.edj", edj_path, (int)PATH_MAX); -elm_layout_file_set(layout, buf, "main"); +app_get_resource("edje/my_layout.edj", edj_path, (int)PATH_MAX); +elm_layout_file_set(layout, buf, "main");

                                                                                                                        The elm_layout_file_set() function imports 1 group from an EDJ file. You can pass the EDJ file path to the second parameter and the group name to the third parameter. On success, this function returns EINA_TRUE.

                                                                                                                        diff --git a/org.tizen.studio/html/native_tools/manifest_elements_n.htm b/org.tizen.studio/html/native_tools/manifest_elements_n.htm index 360951d..15f33b6 100644 --- a/org.tizen.studio/html/native_tools/manifest_elements_n.htm +++ b/org.tizen.studio/html/native_tools/manifest_elements_n.htm @@ -5,13 +5,13 @@ - + - Using Additional Manifest Elements + Using Additional Manifest Elements @@ -20,7 +20,7 @@

                                                                                                                        Mobile native Wearable native

                                                                                                                        - +

                                                                                                                        Dependencies

                                                                                                                          @@ -42,53 +42,53 @@
                                                                                                                        -
                                                                                      +
                                                                                      -

                                                                                      Using Additional Manifest Elements

                                                                                      - +

                                                                                      Using Additional Manifest Elements

                                                                                      +

                                                                                      The following sections summarize some of the common child elements used in the tizen-manifest.xml file of the native application.

                                                                                      - -

                                                                                      <app-control> Element

                                                                                      + +

                                                                                      <app-control> Element

                                                                                      This element represents Tizen application control configuration information.

                                                                                      For more information on the relationship between the elements, see the element hierarchy.

                                                                                      -

                                                                                      Occurrences:

                                                                                      +

                                                                                      Occurrences:

                                                                                        -
                                                                                      • 1 or more (optional)
                                                                                        • +
                                                                                      • 1 or more (optional)
                                                                                      -

                                                                                      Expected children:

                                                                                      +

                                                                                      Expected children:

                                                                                      - - + + - - + + - - + + - - + +
                                                                                      Child elementOccurrencesChild elementOccurrences
                                                                                      <operation>1 or more (optional)<operation>1 or more (optional)
                                                                                      <uri>1 or more (optional)<uri>1 or more (optional)
                                                                                      <mime>1 or more (optional)<mime>1 or more (optional)

                                                                                      For example:

                                                                                       <app-control>
-   <operation name="http://tizen.org/appcontrol/operation/compose"/>
-   <uri name="testuristring"/>
-   <mime name="application/pdf"/>
+   <operation name="http://tizen.org/appcontrol/operation/compose"/>
+   <uri name="testuristring"/>
+   <mime name="application/pdf"/>
 </app-control>
                                                                                      -

                                                                                      <operation> Element

                                                                                      +

                                                                                      <operation> Element

                                                                                      This element represents the operation type of the application control.

                                                                                      -

                                                                                      Attributes:

                                                                                      +

                                                                                      Attributes:

                                                                                      • name

                                                                                        Name of the application control, for example, http://tizen.org/appcontrol/operation/compose

                                                                                        @@ -96,12 +96,12 @@

                                                                                      For example:

                                                                                      -<operation name="http://tizen.org/appcontrol/operation/compose"/>
+<operation name="http://tizen.org/appcontrol/operation/compose"/>

                                                                                      <uri> Element

                                                                                      This element represents the URI scheme of the application control.

                                                                                      -

                                                                                      Attributes:

                                                                                      +

                                                                                      Attributes:

                                                                                      • name

                                                                                        Name of the URI scheme (string)

                                                                                        @@ -109,12 +109,12 @@

                                                                                      For example:

                                                                                      -<uri name="testuristring"/>
+<uri name="testuristring"/>

                                                                                      <mime> Element

                                                                                      This element represents the MIME type of the application control.

                                                                                      -

                                                                                      Attributes:

                                                                                      +

                                                                                      Attributes:

                                                                                      • name

                                                                                        Name of the MIME type (string)

                                                                                        @@ -122,22 +122,22 @@

                                                                                      For example:

                                                                                      -<mime name="application/pdf"/>
+<mime name="application/pdf"/>

                                                                                      <background-category> Element

                                                                                      This element represents the category of the application running on the background.

                                                                                      Note - The <background-category> element is not supported for API versions lower than 2.4. An application with a <background-category> element can fail to be installed on devices with a Tizen version lower than 2.4. In this case, the element can be replaced with <metadata key="http://tizen.org/metadata/bacgkround-category/<value>"/>. + The <background-category> element is not supported for API versions lower than 2.4. An application with a <background-category> element can fail to be installed on devices with a Tizen version lower than 2.4. In this case, the element can be replaced with <metadata key="http://tizen.org/metadata/bacgkround-category/<value>"/>.
                                                                                      -

                                                                                      For more information on the relationship between the elements, see the element hierarchy.

                                                                                      -

                                                                                      Occurrences:

                                                                                      +

                                                                                      For more information on the relationship between the elements, see the element hierarchy.

                                                                                      +

                                                                                      Occurrences:

                                                                                      • 1 or more (optional)
                                                                                      -

                                                                                      Attributes:

                                                                                      +

                                                                                      Attributes:

                                                                                      • value

                                                                                        Value of the background category (string)

                                                                                        @@ -145,17 +145,17 @@

                                                                                        For example:

                                                                                        -<background-category value="download"/> <!--For the API version 2.4 or later-->
-<metadata key="http://tizen.org/metadata/background-category/download"/> <!--For the API version lower than 2.4-->
+<background-category value="download"/> <!--For the API version 2.4 or later-->
+<metadata key="http://tizen.org/metadata/background-category/download"/> <!--For the API version lower than 2.4-->
                                                                                        -

                                                                                        <datacontrol> Element

                                                                                        +

                                                                                        <datacontrol> Element

                                                                                        This element represents configuration information for the Tizen data controls.

                                                                                        -

                                                                                        For more information on the relationship between the elements, see the element hierarchy.

                                                                                        Occurrences:

                                                                                        +

                                                                                        For more information on the relationship between the elements, see the element hierarchy.

                                                                                        Occurrences:

                                                                                          -
                                                                                        • 1 or more (optional)
                                                                                          • +
                                                                                        • 1 or more (optional)
                                                                                        -

                                                                                        Attributes:

                                                                                        +

                                                                                        Attributes:

                                                                                        • access

                                                                                          Access mode of the data control (string)

                                                                                          • @@ -167,20 +167,20 @@

                                                                                        For example:

                                                                                        -
                                                                                        <datacontrol access="WriteOnly" providerid="http://uiapp.com/datacontrol/provider/uiapp" type="Sql"/>
+
                                                                                        <datacontrol access="WriteOnly" providerid="http://uiapp.com/datacontrol/provider/uiapp" type="Sql"/>
 
                                                                                        
 
-  
                                                                                        <icon> Element
                                                                                         
+  
                                                                                        <icon> Element
                                                                                        
 
                                                                                        This element represents the icon relative or absolute file path for the Tizen application.
                                                                                        
 
-
                                                                                        For more information on the relationship between the elements, see the element hierarchy.
                                                                                         
                                                                                        Occurrences: 
                                                                                         
+
                                                                                        For more information on the relationship between the elements, see the element hierarchy.
                                                                                         
                                                                                        Occurrences: 
                                                                                        
       
                                                                                          
-
                                                                                        • 1 (optional)
                                                                                          •  
+
                                                                                        • 1 (optional)
                                                                                          • 
       
                                                                                        
 
-
                                                                                        Expected value: 
                                                                                              
+
                                                                                        Expected value: 
                                                                                        
 	  
                                                                                          
-
                                                                                        • Icon path
                                                                                          •  
+
                                                                                        • Icon path
                                                                                          • 
       
                                                                                        
 
                                                                                        For example:
                                                                                        
 
                                                                                        @@ -188,37 +188,37 @@
 
                                                                                        
 
 
-  
                                                                                        <label> Element
                                                                                         
+  
                                                                                        <label> Element
                                                                                        
 
                                                                                        This element represents the label value for the Tizen application. It is a set of human readable names for the Tizen application according to the language.
                                                                                        
-
                                                                                        For more information on the relationship between the elements, see the element hierarchy.
                                                                                         
                                                                                        Occurrences: 
                                                                                         
+
                                                                                        For more information on the relationship between the elements, see the element hierarchy.
                                                                                         
                                                                                        Occurrences: 
                                                                                        
       
                                                                                          
-
                                                                                        • 1 or more (optional)
                                                                                          •  
+
                                                                                        • 1 or more (optional)
                                                                                          • 
       
                                                                                        
-	  
                                                                                        Attributes: 
                                                                                              
+	  
                                                                                        Attributes: 
                                                                                        
 	  
                                                                                          
 
                                                                                        • xml:lang
-
                                                                                          Language of the label (available value: "<2-letter lowercase language code (ISO 639-1)>-<2-letter lowercase country code (ISO 3166-1 alpha-2)>")
                                                                                          • 
+
                                                                                          Language of the label (available value: "<2-letter lowercase language code (ISO 639-1)>-<2-letter lowercase country code (ISO 3166-1 alpha-2)>")
                                                                                          
 
                                                                                        
 
-
                                                                                        Expected value: 
                                                                                              
+
                                                                                        Expected value: 
                                                                                        
 	  
                                                                                          
-
                                                                                        • Label value in string
                                                                                          •  
+
                                                                                        • Label value in string
                                                                                          • 
       
                                                                                        
 
 
                                                                                        For example:
                                                                                        
 
                                                                                         <label>testlabel</label>
-<label xml:lang="en-gb">testlabel</label>
+<label xml:lang="en-gb">testlabel</label>
 
                                                                                        
 
-
                                                                                        <metadata> Element
                                                                                         
+
                                                                                        <metadata> Element
                                                                                        
 
                                                                                        This element represents user-defined key-value pairs for the application.
                                                                                        
 
-
                                                                                        For more information on the relationship between the elements, see the element hierarchy.
                                                                                         
                                                                                        Occurrences: 
                                                                                         
+
                                                                                        For more information on the relationship between the elements, see the element hierarchy.
                                                                                         
                                                                                        Occurrences: 
                                                                                        
       
                                                                                          
-
                                                                                        • 1 or more (optional)
                                                                                          •  
+
                                                                                        • 1 or more (optional)
                                                                                          • 
       
                                                                                        
-	  
                                                                                        Attributes: 
                                                                                              
+	  
                                                                                        Attributes: 
                                                                                        
 	  
                                                                                          
        
                                                                                        • key
 	   
                                                                                          Key of metadata (string)
                                                                                          • 
@@ -226,9 +226,9 @@
 	   
                                                                                          Value of metadata (string)
                                                                                        
 
 
                                                                                        For example:
                                                                                        
-
                                                                                        <metadata key="testkey" value="testvalue"/>
+
                                                                                        <metadata key="testkey" value="testvalue"/>
 
                                                                                        
-    
+
                                                                          diff --git a/org.tizen.studio/html/native_tools/manifest_text_editor_n.htm b/org.tizen.studio/html/native_tools/manifest_text_editor_n.htm index 7bf34b2..fa9839b 100644 --- a/org.tizen.studio/html/native_tools/manifest_text_editor_n.htm +++ b/org.tizen.studio/html/native_tools/manifest_text_editor_n.htm @@ -5,13 +5,13 @@ - + - Configuring the Application Manifest - + Configuring the Application Manifest + @@ -19,7 +19,7 @@

                                                                          Mobile native Wearable native

                                                                          - + -
                                                                          • +
                                                                          - -

                                                                          Configuring the Application Manifest

                                                                          + +

                                                                          Configuring the Application Manifest

                                                                          A Tizen native application package consists of exactly 1 manifest file, called tizen-manifest.xml, which is used to describe the application information. The manifest file is composed of XML elements, which include the root <manifest> element and its child elements representing application information, such as <version>, and <privileges>. The child elements are organized into a specific hierarchy. The elements can have attributes associated with them, providing more information about the element.

                                                                          -

                                                                          Editing the Manifest File

                                                                          +

                                                                          Editing the Manifest File

                                                                          There are 2 different ways to edit the tizen-manifest.xml file:

                                                                            @@ -50,7 +50,7 @@

                                                                            Text Editor

                                                                          • Use the manifest editor to modify the manifest in a form editor: -

                                                                            Double-click the tizen-manifest.xml file in the Project Explorer view.

                                                                            +

                                                                            Double-click the tizen-manifest.xml file in the Project Explorer view.

                                                                            Figure: Manifest editor

                                                                            Manifest editor

                                                                            @@ -62,9 +62,9 @@ The tizen-manifest.xml file must conform to both the standard XML file format and the Tizen native application specification requirements. Editing the manifest file XML structure with the text editor is intended for advanced users only. If the file does not conform to the standard and requirements, errors can occur during installation.
                                                                          -

                                                                          Manifest Element Hierarchy

                                                                          -

                                                                          The Tizen native application manifest file consists of XML elements organized in a hierarchy. The following tree structure shows the relationship between the elements of the tizen-manifest.xml file.

                                                                          - +

                                                                          Manifest Element Hierarchy

                                                                          +

                                                                          The Tizen native application manifest file consists of XML elements organized in a hierarchy. The following tree structure shows the relationship between the elements of the tizen-manifest.xml file.

                                                                          + @@ -192,7 +192,7 @@ - + @@ -212,7 +212,7 @@ - + @@ -300,8 +300,8 @@ <capability> - - + +
                                                                          <watch-application>
                                                                              <widget-application>
                                                                             
                                                                            @@ -324,49 +324,49 @@
                                                                          -

                                                                          Manifest Elements

                                                                          +

                                                                          Manifest Elements

                                                                          The following sections summarize the elements used in the tizen-manifest.xml file of the native application.

                                                                          - +

                                                                          <manifest> Element

                                                                          This element contains the manifest information of the Tizen native application. The <manifest> element is an easily readable description of the Tizen package and serves as a container for the other elements of the configuration document.

                                                                          -

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          +

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                            -

                                                                          • 1

                                                                            • +

                                                                          • 1

                                                                          -

                                                                          Expected children (in the following order):

                                                                          +

                                                                          Expected children (in the following order):

                                                                          - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + @@ -377,12 +377,12 @@ - - + + - - + +
                                                                          Child elementOccurrencesChild elementOccurrences
                                                                          <author>1 (optional)<author>1 (optional)
                                                                          <description>1 or more (optional)<description>1 or more (optional)
                                                                          <profile>1 or more (optional)<profile>1 or more (optional)
                                                                          <ui-application>1 (optional)<ui-application>1 (optional)
                                                                          <service-application>1 (optional)<service-application>1 (optional)
                                                                          <watch-application>1 (optional)<watch-application>1 (optional)
                                                                          <widget-application>1 (optional)<widget-application>1 (optional)
                                                                          <shortcut-list>1 (optional)
                                                                          <privileges>1 (optional)<privileges>1 (optional)
                                                                          <feature>1 or more (optional)<feature>1 or more (optional)
                                                                          @@ -392,52 +392,52 @@

                                                                          Attributes:

                                                                          • api-version

                                                                            -

                                                                            API version number for the application (available value: number in the "x.y.z" format, where z is optional, for example, 2.3.1 or 2.4)

                                                                            • +

                                                                            API version number for the application (available value: number in the "x.y.z" format, where z is optional, for example, 2.3.1 or 2.4)

                                                                          • install-location

                                                                            -

                                                                            Installation location for the application (available value: "auto")

                                                                            +

                                                                            Installation location for the application (available value: "auto")

                                                                            Note This attribute is read-only. Do not attempt to modify it.

                                                                          • package

                                                                            -

                                                                            Package of the application (available value: "org.tizen.applicationName")

                                                                            -
                                                                            • +

                                                                            Package of the application (available value: "org.tizen.applicationName")

                                                                            +

                                                                          • type

                                                                            -

                                                                            Package type of the application (available value: "tpk")

                                                                            +

                                                                            Package type of the application (available value: "tpk")

                                                                            Note This attribute is read-only. Do not attempt to modify it.
                                                                            -
                                                                            • +

                                                                          • version

                                                                            -

                                                                            Version number of the application (available value: number in the "x.y.z" format, where 0 <= x <= 255, 0 <= y <= 255, and 0 <= z <= 65535)

                                                                            -
                                                                            • +

                                                                            Version number of the application (available value: number in the "x.y.z" format, where 0 <= x <= 255, 0 <= y <= 255, and 0 <= z <= 65535)

                                                                            +
                                                                          -

                                                                          For example:

                                                                          +

                                                                          For example: 

                                                                          -<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1" package="org.tizen.uiapp" version="1.0.0">
-   <author>.....</author>
-   <description>.....</description>
-   <profile name="mobile"/>
-   <ui-application>.....</ui-application>
-   <shortcut-list>.....</shortcut-list>
-   <account>.....</account>
-   <privileges>.....</privileges>
-   <feature>.....</feature>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1" package="org.tizen.uiapp" version="1.0.0">
+   <author>.....</author>
+   <description>.....</description>
+   <profile name="mobile"/>
+   <ui-application>.....</ui-application>
+   <shortcut-list>.....</shortcut-list>
+   <account>.....</account>
+   <privileges>.....</privileges>
+   <feature>.....</feature>
 </manifest>

                                                                          <author> Element

                                                                          -

                                                                          This element represents the creator of the Tizen package.

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          +

                                                                          This element represents the creator of the Tizen package.

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                            -

                                                                          • 1 (optional)

                                                                            • +

                                                                          • 1 (optional)

                                                                          - +

                                                                          Attributes:

                                                                          • email

                                                                            @@ -446,34 +446,34 @@

                                                                            Web site of the package creator, such as a homepage or a profile on a social network (available value: any valid Web site string value)

                                                                          -

                                                                          Expected value:

                                                                          +

                                                                          Expected value:

                                                                            -
                                                                          • Package creator name in string
                                                                            • +
                                                                          • Package creator name in string

                                                                          For example:

                                                                          - 
                                                                          <author email="email@email.com" href="http://test.com">author</author>
                                                                          + 
                                                                          <author email="email@email.com" href="http://test.com">author</author>

                                                                          <description> Element

                                                                          This element contains an easily readable description of the Tizen package.

                                                                          -

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                          +

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                            -
                                                                          • 1 or more (optional)
                                                                            • +
                                                                          • 1 or more (optional)
                                                                          -

                                                                          Attributes:

                                                                          +

                                                                          Attributes:

                                                                          • xml:lang -

                                                                            Language and country code (available value: "<2-letter lowercase language code (ISO 639-1)>-<2-letter lowercase country code (ISO 3166-1 alpha-2)>")

                                                                            • +

                                                                            Language and country code (available value: "<2-letter lowercase language code (ISO 639-1)>-<2-letter lowercase country code (ISO 3166-1 alpha-2)>")

                                                                          -

                                                                          Expected value:

                                                                          +

                                                                          Expected value:

                                                                            -
                                                                          • Description value in string
                                                                            • +
                                                                          • Description value in string

                                                                          For example:

                                                                          -<description xml:lang="en-us">This is a sample</description>
+<description xml:lang="en-us">This is a sample</description>
                                                                          @@ -494,52 +494,52 @@

                                                                          For example:

                                                                          -<profile name="mobile"/>
+<profile name="mobile"/>

                                                                          <ui-application> Element

                                                                          This element contains the manifest information of a Tizen native UI application with a graphical user interface (GUI).

                                                                          -

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                          +

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                            -
                                                                          • 1 or more (optional)
                                                                            • +
                                                                          • 1 or more (optional)
                                                                          -

                                                                          Expected children (in the following order):

                                                                          +

                                                                          Expected children (in the following order):

                                                                          - - + + - - + + - - + + - - + + - - + + - - + + - - + +
                                                                          Child elementOccurrencesChild elementOccurrences
                                                                          <label>1 or more (optional)<label>1 or more (optional)
                                                                          <icon>1 or more (optional)<icon>1 or more (optional)
                                                                          <app-control>1 or more (optional)<app-control>1 or more (optional)
                                                                          <metadata>1 or more (optional)<metadata>1 or more (optional)
                                                                          <datacontrol>1 or more (optional)<datacontrol>1 or more (optional)
                                                                          <background-category>1 or more (optional)<background-category>1 or more (optional)
                                                                          -

                                                                          Attributes:

                                                                          +

                                                                          Attributes:

                                                                          • appid

                                                                            Application unique ID (string)

                                                                            -

                                                                            This can be used for launching or terminating the application explicitly.

                                                                            • +

                                                                            This can be used for launching or terminating the application explicitly.

                                                                          • exec

                                                                            Application executable file path (string)

                                                                          • hw-acceleration @@ -556,7 +556,7 @@
                                                                        • nodisplay -

                                                                          Indicates whether the application is shown in the app-tray (available values: true, false)

                                                                          • +

                                                                          Indicates whether the application is shown in the app-tray (available values: true, false)

                                                                        • taskmanage

                                                                          Indicates whether the application is shown in the task manager (available values: true, false)

                                                                        • type @@ -570,69 +570,69 @@

                                                                          For example:

                                                                          -
                                                                          <ui-application appid="org.tizen.uiapp" exec="uiapp" hw-acceleration="on" launch_mode="single" 
-                multiple="false" nodisplay="false" taskmanage="true" type="capp">
-   <label>uiapplication</label>
-   <label xml:lang="en-gb">testlang</label>
-   <icon>uiapp.png</icon>
-   <app-control>
-      <operation name="http://tizen.org/appcontrol/operation/dial"/>
-      <mime name="application/vnd.ms-excel"/>
-   </app-control>
-   <metadata key="testkey" value="testvalue"/>
-   <datacontrol access="ReadOnly" 
-                providerid="http://uiapp.com/datacontrol/provider/uiapp" type="Sql"/>
+
                                                                          <ui-application appid="org.tizen.uiapp" exec="uiapp" hw-acceleration="on" launch_mode="single"
+                multiple="false" nodisplay="false" taskmanage="true" type="capp">
+   <label>uiapplication</label>
+   <label xml:lang="en-gb">testlang</label>
+   <icon>uiapp.png</icon>
+   <app-control>
+      <operation name="http://tizen.org/appcontrol/operation/dial"/>
+      <mime name="application/vnd.ms-excel"/>
+   </app-control>
+   <metadata key="testkey" value="testvalue"/>
+   <datacontrol access="ReadOnly"
+                providerid="http://uiapp.com/datacontrol/provider/uiapp" type="Sql"/>
 </ui-application>
-
                                                                            
+
                                                                          -

                                                                          <service-application> Element

                                                                          +

                                                                          <service-application> Element

                                                                          This element contains the manifest information of a Tizen native service application without a graphical user interface (GUI).

                                                                          Create a service application if you want to develop a program that is to be run continuously, for example, to get the sensor data. The service application can be packaged together with a native UI application or a Web application.

                                                                          -

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                          +

                                                                          For more information on the relationship between the elements, see the element hierarchy.

                                                                          Occurrences:

                                                                            -
                                                                          • 1 or more (optional)
                                                                            • +
                                                                          • 1 or more (optional)
                                                                          -

                                                                          Expected children (in the following order):

                                                                          +

                                                                          Expected children (in the following order):

                                                                          - - + + - - + + - - + + - - + + - - + + - - + + - - + +
                                                                          Child elementOccurrencesChild elementOccurrences
                                                                          <label>1 or more (optional)<label>1 or more (optional)
                                                                          <icon>1 or more (optional)<icon>1 or more (optional)
                                                                          <app-control>1 or more (optional)<app-control>1 or more (optional)
                                                                          <metadata>1 or more (optional)<metadata>1 or more (optional)
                                                                          <datacontrol>1 or more (optional)<datacontrol>1 or more (optional)
                                                                          <background-category>1 or more (optional)<background-category>1 or more (optional)
                                                                          -

                                                                          Attributes:

                                                                          +

                                                                          Attributes:

                                                                          • appid

                                                                            Application unique ID (string)

                                                                            -

                                                                            This can be used for launching or terminating the application explicitly.

                                                                            • +

                                                                            This can be used for launching or terminating the application explicitly.

                                                                          • auto-restart

                                                                            Indicates whether the application is relaunched automatically if it is terminated abnormally (available values: true, false)

                                                                            If the value is not defined, false is used.

                                                                            @@ -640,10 +640,10 @@
                                                                            Note This attribute is not supported in Tizen wearable devices. Since Tizen 2.4, this attribute is not supported in all Tizen devices. -
                                                                            -
                                                                            • +
                                                                          • +
                                                                        • exec -

                                                                          Application executable file path (string)

                                                                          • +

                                                                          Application executable file path (string)

                                                                        • multiple

                                                                          Indicates whether the application can be launched as a multiple (available values: true, false)

                                                                          @@ -670,22 +670,22 @@
                                                                        - +

                                                                        For example:

                                                                        -
                                                                        <service-application appid="org.tizen.servicenew" auto-restart="false" exec="servicenew"
-                     multiple="false" on-boot="true" taskmanage="false" type="capp">
-   <label>servicenew</label>
-   <label xml:lang="en-gb">testlabel</label>
-   <icon>servicenew.png</icon>
-   <app-control>
-      <operation name="http://tizen.org/appcontrol/operation/compose"/>
-      <uri name="testuristring"/>
-      <mime name="application/pdf"/>
-   </app-control>
-   <metadata key="testkey1" value="testvalue2"/>
-   <metadata key="testkey" value="testvalue"/>
+
                                                                        <service-application appid="org.tizen.servicenew" auto-restart="false" exec="servicenew"
+                     multiple="false" on-boot="true" taskmanage="false" type="capp">
+   <label>servicenew</label>
+   <label xml:lang="en-gb">testlabel</label>
+   <icon>servicenew.png</icon>
+   <app-control>
+      <operation name="http://tizen.org/appcontrol/operation/compose"/>
+      <uri name="testuristring"/>
+      <mime name="application/pdf"/>
+   </app-control>
+   <metadata key="testkey1" value="testvalue2"/>
+   <metadata key="testkey" value="testvalue"/>
 </service-application>
-
                                                                          
+

                                                                        <watch-application> Element

                                                                        This element contains the settings for the watch application.

                                                                        @@ -721,9 +721,9 @@ 
                                                                      -<watch-application ambient-support="true" appid="org.tizen.watchsample" exec="watchsample">
-   <label>.....</label>
-   <icon>.....</icon>
+<watch-application ambient-support="true" appid="org.tizen.watchsample" exec="watchsample">
+   <label>.....</label>
+   <icon>.....</icon>
 </watch-application>
                                                                      @@ -763,60 +763,60 @@

                                                                      <widget-application> Element

                                                                      This element contains the settings for the widget application.

                                                                      For more information on the relationship between the elements, see the element hierarchy.

                                                                      -

                                                                      Occurrences:

                                                                      +

                                                                      Occurrences:

                                                                        -
                                                                      • 1 (optional)
                                                                        • +
                                                                      • 1 (optional)
                                                                      -

                                                                      Expected children:

                                                                      +

                                                                      Expected children:

                                                                      - - + + - - + + - - + + - - + +
                                                                      Child elementOccurrencesChild elementOccurrences
                                                                      <label>1 or more<label>1 or more
                                                                      <icon>1 or more<icon>1 or more
                                                                      <support-size>1<support-size>1
                                                                      -

                                                                      Attributes:

                                                                      +

                                                                      Attributes:

                                                                      • appid - -

                                                                        Widget application unique ID (string)

                                                                        • + +

                                                                        Widget application unique ID (string)

                                                                      • exec -

                                                                        Widget application executable file name (string)

                                                                        • +

                                                                        Widget application executable file name (string)

                                                                      • main -

                                                                        Indicates which widget application is the main application (available values: true, false)

                                                                        • +

                                                                        Indicates which widget application is the main application (available values: true, false)

                                                                      • update-period

                                                                        Indicates the update period in seconds (available values: time in seconds)

                                                                        -

                                                                        Multiples of 1800 only allowed

                                                                        • +

                                                                        Multiples of 1800 only allowed

                                                                      For example:

                                                                      -<widget-application appid="org.tizen.test" exec="test" main="true" update-period="0">
-   <label>.....</label>
-   <icon>.....</icon>
-   <support-size>.....</support-size>
+<widget-application appid="org.tizen.test" exec="test" main="true" update-period="0">
+   <label>.....</label>
+   <icon>.....</icon>
+   <support-size>.....</support-size>
 </widget-application>

                                                                      <label> Element

                                                                      -

                                                                      This element contains the widget application text.

                                                                      -

                                                                      Occurrences:

                                                                      +

                                                                      This element contains the widget application text.

                                                                      +

                                                                      Occurrences:

                                                                        -
                                                                      • 1 or more
                                                                        • +
                                                                      • 1 or more
                                                                      -

                                                                      Expected value:

                                                                      +

                                                                      Expected value:

                                                                      • Label value in string
                                                                      @@ -826,13 +826,13 @@

                                                                      <icon> Element

                                                                      -

                                                                      This element contains the widget application icon image.

                                                                      -

                                                                      Occurrences:

                                                                      +

                                                                      This element contains the widget application icon image.

                                                                      +

                                                                      Occurrences:

                                                                        -
                                                                      • 1 or more
                                                                        • +
                                                                      • 1 or more
                                                                      -

                                                                      Expected value:

                                                                      +

                                                                      Expected value:

                                                                      • Icon file name
                                                                      @@ -842,19 +842,19 @@

                                                                      <support-size> Element

                                                                      -

                                                                      This element contains the size supported by the widget application.

                                                                      -

                                                                      Occurrences:

                                                                      +

                                                                      This element contains the size supported by the widget application.

                                                                      +

                                                                      Occurrences:

                                                                        -
                                                                      • 1
                                                                        • +
                                                                      • 1
                                                                      -

                                                                      Attributes:

                                                                      +

                                                                      Attributes:

                                                                      • preview

                                                                        Relative path to the preview image (available values: file name)

                                                                        The image is shown on the home screen when the user tries to select the widget.

                                                                      -

                                                                      Expected value:

                                                                      +

                                                                      Expected value:

                                                                      • 2x2 (in mobile and wearable)
                                                                      • 4x1 (in mobile only)
                                                                        • @@ -865,7 +865,7 @@

                                                                        For example:

                                                                        -<support-size preview="preview.png">2x2</support-size>
+<support-size preview="preview.png">2x2</support-size>

                                                                        <shortcut-list> Element

                                                                        @@ -890,7 +890,7 @@

                                                                        For example: 

                                                                         <shortcut-list>
-   <shortcut>.....</shortcut>
+   <shortcut>.....</shortcut>
 </shortcut-list>
                                                                        @@ -930,104 +930,104 @@

                                                                        For example:

                                                                        -<shortcut appid="org.example.shortcut" extra_data="data" extra_key="key">
-   <icon>shortcut.png</icon>
-   <label>shortcut</label>
-   <label xml:lang="en-us">short</label>
+<shortcut appid="org.example.shortcut" extra_data="data" extra_key="key">
+   <icon>shortcut.png</icon>
+   <label>shortcut</label>
+   <label xml:lang="en-us">short</label>
 </shortcut>

                                                                        <account> Element

                                                                        This element contains a set of user accounts and account provider-related information in the Tizen application.

                                                                        For more information on the relationship between the elements, see the element hierarchy.

                                                                        -

                                                                        Occurrences:

                                                                        +

                                                                        Occurrences:

                                                                          -
                                                                        • 1 (optional)
                                                                          • +
                                                                        • 1 (optional)
                                                                        -

                                                                        Expected children:

                                                                        +

                                                                        Expected children:

                                                                        - - + + - - + +
                                                                        Child elementOccurrencesChild elementOccurrences
                                                                        <account-provider>1 or more<account-provider>1 or more
                                                                        -

                                                                        For example:

                                                                        +

                                                                        For example: 

                                                                         <account>
-   <account-provider>.....</account-provider>
+   <account-provider>.....</account-provider>
 </account>

                                                                        <account-provider> Element

                                                                        This element contains a specific service provider or user account protocol-related information.

                                                                        - -

                                                                        Expected children:

                                                                        + +

                                                                        Expected children:

                                                                        - - + + - - + + - - + + - - + +
                                                                        Child elementOccurrencesChild elementOccurrences
                                                                        <icon>1 or more<icon>1 or more
                                                                        <label>1 or more<label>1 or more
                                                                        <capability>1 or more (optional)<capability>1 or more (optional)
                                                                        -

                                                                        Attributes:

                                                                        +

                                                                        Attributes:

                                                                        • appid

                                                                          Application unique ID (string)

                                                                          -

                                                                          This can be used for launching or terminating the application explicitly.

                                                                          • +

                                                                          This can be used for launching or terminating the application explicitly.

                                                                        • multiple-accounts-support -

                                                                          Indicates whether multiple accounts are supported (available values: true, false)

                                                                          • +

                                                                          Indicates whether multiple accounts are supported (available values: true, false)

                                                                        • providerid -

                                                                          ID of the account provider (string)

                                                                          • +

                                                                          ID of the account provider (string)

                                                                        For example:

                                                                        -<account-provider appid="org.tizen.uiapp" multiple-accounts-support="false" providerid="org.tizen.uiapp">
-   <icon>.....</icon>
-   <label>.....</label>
-   <capability>.....</capability>
+<account-provider appid="org.tizen.uiapp" multiple-accounts-support="false" providerid="org.tizen.uiapp">
+   <icon>.....</icon>
+   <label>.....</label>
+   <capability>.....</capability>
 </account-provider>

                                                                        <icon> Element

                                                                        This element contains the account provider icon image. Since the icons are used in the device under settings, the account icons are placed in a shared directory.

                                                                        -

                                                                        Attributes:

                                                                        +

                                                                        Attributes:

                                                                        • section -

                                                                          Usage information of the icon image (available values: account (image size: 72 x 72 for density xhigh and 48 x 48 for density high), account-small (image size: 45 x 45 for density xhigh and 30 x 30 for density high))

                                                                          • +

                                                                          Usage information of the icon image (available values: account (image size: 72 x 72 for density xhigh and 48 x 48 for density high), account-small (image size: 45 x 45 for density xhigh and 30 x 30 for density high))

                                                                        -

                                                                        Expected value:

                                                                        +

                                                                        Expected value:

                                                                          -
                                                                        • Icon file name
                                                                          • +
                                                                        • Icon file name

                                                                        For example:

                                                                        -<icon section="account">uiapp.png</icon>
-<icon section="account-small">uiapp.png</icon>
+<icon section="account">uiapp.png</icon>
+<icon section="account-small">uiapp.png</icon>

                                                                        <capability> Element

                                                                        This element contains the account provider capability. The capabilities are defined as http://<VENDOR_INFORMATION>/account/capability/<NAME>.

                                                                        -

                                                                        Expected value:

                                                                        +

                                                                        Expected value:

                                                                          -
                                                                        • IRI string
                                                                          • +
                                                                        • IRI string

                                                                        For example:

                                                                        @@ -1044,45 +1044,45 @@

                                                                        Figure: Editing the <privileges> element in the manifest editor

                                                                        Editing the privileges element in the manifest editor

                                                                        -

                                                                        For more information on the relationship between the elements, see the element hierarchy.

                                                                        Occurrences:

                                                                        +

                                                                        For more information on the relationship between the elements, see the element hierarchy.

                                                                        Occurrences:

                                                                          -
                                                                        • 1 (optional)
                                                                          • +
                                                                        • 1 (optional)
                                                                        -

                                                                        Expected children:

                                                                        +

                                                                        Expected children:

                                                                        - - + + - - + +
                                                                        Child elementOccurrencesChild elementOccurrences
                                                                        <privilege>1 or more (optional)<privilege>1 or more (optional)

                                                                        For example:

                                                                         <privileges>
-   <privilege>.....</privilege>
+   <privilege>.....</privilege>
 </privileges>

                                                                        <privilege> Element

                                                                        -

                                                                        This element contains the required privileges for the Tizen application.

                                                                        -

                                                                        Occurrences:

                                                                        +

                                                                        This element contains the required privileges for the Tizen application.

                                                                        +

                                                                        Occurrences:

                                                                          -
                                                                        • 1 or more (optional)
                                                                          • +
                                                                        • 1 or more (optional)
                                                                        -

                                                                        Expected value:

                                                                        +

                                                                        Expected value:

                                                                        Name (mandatory, the URI of the Device API privilege)

                                                                        -

                                                                        For example:

                                                                        +

                                                                        For example:

                                                                        • http://tizen.org/privilege/application.admin
                                                                        • http://tizen.org/privilege/appmanager.launch
                                                                        • http://tizen.org/privilege/account.read
                                                                        -

                                                                        For more information on the expected values, see Security and API Privileges.

                                                                        +

                                                                        For more information on the expected values, see Security and API Privileges.

                                                                        For example:

                                                                        @@ -1092,7 +1092,7 @@

                                                                        <feature> Element

                                                                        -

                                                                        This element contains a list of required features for feature-based filtering in the Tizen Store.

                                                                        +

                                                                        This element contains a list of required features for feature-based filtering in the Tizen Store.

                                                                        The element is used to define the hardware and software components for the Tizen application. In order to use or access an API that is specialized for each vendor or platform, the feature must be declared. This element has no child elements.

                                                                        Figure: Editing the <feature> element in the manifest editor

                                                                        @@ -1100,26 +1100,26 @@

                                                                        For more information on the relationship between the elements, see the element hierarchy.

                                                                        Occurrences:

                                                                          -
                                                                        • 1 or more (optional)
                                                                          • +
                                                                        • 1 or more (optional)
                                                                        -

                                                                        Attributes:

                                                                        +

                                                                        Attributes:

                                                                        • name (mandatory, a feature key URI) -

                                                                          Item name used in feature-based filtering in the Tizen Store, for example, "http://tizen.org/feature/camera", "http://tizen.org/feature/fmradio"

                                                                          -

                                                                          For more information on the expected values and the application filtering mechanism, see Application Filtering.

                                                                          • +

                                                                          Item name used in feature-based filtering in the Tizen Store, for example, "http://tizen.org/feature/camera", "http://tizen.org/feature/fmradio"

                                                                          +

                                                                          For more information on the expected values and the application filtering mechanism, see Application Filtering.

                                                                        -

                                                                        Expected value:

                                                                        +

                                                                        Expected value:

                                                                          -
                                                                        • true
                                                                          • +
                                                                        • true

                                                                        For example:

                                                                        -<feature name="http://tizen.org/feature/camera">true</privilege>
-<feature name="http://tizen.org/feature/fmradio">true</privilege>
+<feature name="http://tizen.org/feature/camera">true</privilege>
+<feature name="http://tizen.org/feature/fmradio">true</privilege>
                                                                        - +
                                                                  @@ -1142,4 +1142,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + diff --git a/org.tizen.studio/html/native_tools/multiple_screen_n.htm b/org.tizen.studio/html/native_tools/multiple_screen_n.htm index 2f24700..81f3b5b 100644 --- a/org.tizen.studio/html/native_tools/multiple_screen_n.htm +++ b/org.tizen.studio/html/native_tools/multiple_screen_n.htm @@ -160,7 +160,7 @@

                                                                  The following table shows the components for multiple screens.

                                                                  Table: Components for multiple screens

                                                                  - +
                                                                  @@ -203,7 +203,7 @@
                                                                  Category

                                                                  Designing Applications with Multiple Screens

                                                                  - +

                                                                  With the default resources only, you can make an application without alternative resources. The default resource is displayed on the screen through automatic scaling of the EFL libraries at runtime.

                                                                  If you want to increase the quality of the resources or provide device-specific screens in the application, use the Resource Manager view, which supports alternative resources.

                                                                  @@ -229,7 +229,7 @@
                                                                • Add a Background UI component by dragging and dropping a background from the Palette to the grid.
                                                                • Add a Button UI component by dragging and dropping a button from the Palette to the grid.
                                                                • Input a string key. -

                                                                  If you type '@' at the Text property of the Properties view, the auto-completion shows a list of available resource keys.

                                                                  +

                                                                  If you type '@' at the Text property of the Properties view, the auto-completion shows a list of available resource keys.

                                                                • Change a locale.

                                                                  If you change a locale on the toolbar, the view shows a preview of the localized string.

                                                                  @@ -313,13 +313,13 @@ If there is no alternative resource corresponding to a specific locale, the defa

                                                                  Specifying alternative resources

                                                                  The naming rule for alternative resources in the Properties view is @resource/key, where @resource is the annotation symbol specifying the resource file for the alternative resource, and key is the resource key.

                                                                  -

                                                                  When you enter '@' at the Image path in the Properties view, the auto-completion shows a list of resource keys.

                                                                  +

                                                                  When you enter '@' at the Image path in the Properties view, the auto-completion shows a list of resource keys.

                                                                  Using Alternative UI Layouts

                                                                  To use multiple UI layouts for each screen configuration:

                                                                    -
                                                                  1. In the Screen Configurator, configure the specific screen. +
                                                                  2. In the Screen Configurator, configure the specific screen.

                                                                    Open the Screen Configurator window by clicking the applicable icon on the Layout Editor toolbar.

                                                                    Configuring an alternative layout

                                                                    @@ -360,8 +360,8 @@ If there is no alternative resource corresponding to a specific locale, the defa

                                                                    In the Tizen Studio, UI components are in the same memory space. If you delete a UI component in one configuration, the Variation properties of the component are removed from all other screen configurations too. Therefore, to design a UI for each screen configuration, the Variation properties of the UI components must be set differently for visibility.

                                                                    - - + +
                                                      diff --git a/org.tizen.studio/html/native_tools/po_file_editor_n.htm b/org.tizen.studio/html/native_tools/po_file_editor_n.htm index 903be71..b362b99 100644 --- a/org.tizen.studio/html/native_tools/po_file_editor_n.htm +++ b/org.tizen.studio/html/native_tools/po_file_editor_n.htm @@ -60,9 +60,9 @@ Internationalization is the process of making your application able to adapt to

                                                      Figure: PO file editor

                                                      PO file editor

                                                      - +

                                                      Adding and Removing Languages

                                                      - +

                                                      To add a new language, click the Add Language icon (Add language) and select a language code item in the Add Languages dialog.

                                                      Figure: Adding a language

                                                      @@ -71,7 +71,7 @@ Internationalization is the process of making your application able to adapt to

                                                      If you select a base language when adding a new language, you can add and edit strings based on the base language. For example, you can select English (US) as base language when adding a new English (Canada) language, if the English (US) language already exists.

                                                      To remove a language, click the Remove Language icon (Remove language), and select a language code item in the Remove Languages dialog.

                                                      - +

                                                      Adding, Editing, and Removing Strings

                                                      The string table in the PO file editor shows the string keys and translated strings of the supported languages. The string keys are in the first column, and the translated strings are listed from the second column forward.

                                                      diff --git a/org.tizen.studio/html/native_tools/project_conversion_n.htm b/org.tizen.studio/html/native_tools/project_conversion_n.htm index 3abe3b5..5568e55 100644 --- a/org.tizen.studio/html/native_tools/project_conversion_n.htm +++ b/org.tizen.studio/html/native_tools/project_conversion_n.htm @@ -5,22 +5,22 @@ - + - Converting Projects for CLI + Converting Projects for CLI - +

                                                      Mobile native Wearable native

                                                      - +

                                                      Dependencies

                                                        @@ -45,23 +45,23 @@

                                                        To build a Tizen Studio project on the CLI, you must convert the project to a CLI project:

                                                        1. In the Tizen Studio, open the project you want to convert.
                                                          2. -
                                                        2. Right-click the project and select Export to CLI Project. +
                                                        3. Right-click the project and select Export to CLI Project.

                                                          An info dialog appears, and the project_def.prop and build_def.prop files and the Build directory are created.

                                                        The Tizen Studio and CLI differ on how they describe the project properties and build configuration. The CLI uses the project_def.prop file for the project properties and the build_def.prop file for the build configurations. During the export, the project_def.prop, build_def.prop, and the makefiles are added to the converted CLI project automatically.

                                                        -

                                                        Figure: Project conversion

                                                        +

                                                        Figure: Project conversion

                                                        Project conversion

                                                        About the project_def.prop file

                                                        - +

                                                        The project_def.prop file describes the project properties, such as project type and list of source files. When you edit the properties in the project_def.prop file to manipulate the build or packaging process, use the following characters:

                                                          -
                                                        • "/" is a path separator character (in Windows®, Ubuntu, and Mac OS® X).
                                                          • -
                                                        • "\" is a multi-line character, which is used at the end of each line.
                                                          • -
                                                        • "\ " is a space character, used in a path name that contains a space character.
                                                          • -
                                                        • "#" is a comment character.
                                                          • +
                                                        • "/" is a path separator character (in Windows®, Ubuntu, and Mac OS® X).
                                                          • +
                                                        • "\" is a multi-line character, which is used at the end of each line.
                                                          • +
                                                        • "\ " is a space character, used in a path name that contains a space character.
                                                          • +
                                                        • "#" is a comment character.

                                                        Table: Project properties

                                                        diff --git a/org.tizen.studio/html/native_tools/project_explorer_view_n.htm b/org.tizen.studio/html/native_tools/project_explorer_view_n.htm index 357d88a..9898d54 100644 --- a/org.tizen.studio/html/native_tools/project_explorer_view_n.htm +++ b/org.tizen.studio/html/native_tools/project_explorer_view_n.htm @@ -5,7 +5,7 @@ - + @@ -15,12 +15,12 @@ - + @@ -38,11 +38,11 @@

                                                        Managing Tizen Projects with Project Explorer View

                                                        The Project Explorer view allows you to view and manage Tizen projects. You can view and change the resources of a project in the view, and build, export, and convert projects through the view.

                                                        -

                                                        Figure: Project Explorer

                                                        +

                                                        Figure: Project Explorer

                                                        Project Explorer

                                                        In this view, you can:

                                                        -
                                                          +
                                                          • Browse the file elements
                                                          • Open files in the editor view
                                                          • Open projects in a new window
                                                            • @@ -55,7 +55,7 @@

                                                            Opening the Project Explorer View

                                                            Usually, the Project Explorer view is located in the left-top side in the Tizen Studio. You can change the position by dragging and dropping it. If you close the view, you can show it again by selecting Project Explorer in Window > Show View > Other > General.

                                                            -

                                                            Figure: Opening the view

                                                            +

                                                            Figure: Opening the view

                                                            Opening the view

                                                            Using the Project Explorer View

                                                            @@ -127,7 +127,7 @@ New Allows you to create a new resource in the workbench. Select the type of resource to create from the submenu. - + Delete Deletes the selected resource from the workspace. @@ -146,7 +146,7 @@ Build Signed Package - Makes a 'signed' package. This option requires a certificate profile. You can create a certificate profile in Tools > Certificate Manager. + Makes a 'signed' package. This option requires a certificate profile. You can create a certificate profile in Tools > Certificate Manager. Localization @@ -171,7 +171,7 @@ Properties Displays the properties of the selected resource. The displayed properties depend on what type of resource is selected. Resource properties can include (but are not limited to): -
                                                              +
                                                              • Path relative to the project in which it is held
                                                              • Type of the resource
                                                              • Absolute file system path, or name of the path variable when using linked resources
                                                                • diff --git a/org.tizen.studio/html/native_tools/project_wizard_n.htm b/org.tizen.studio/html/native_tools/project_wizard_n.htm index a71e587..c951b7c 100644 --- a/org.tizen.studio/html/native_tools/project_wizard_n.htm +++ b/org.tizen.studio/html/native_tools/project_wizard_n.htm @@ -5,22 +5,22 @@ - + - Creating Tizen Projects with Tizen Project Wizard + Creating Tizen Projects with Tizen Project Wizard - +

                                                                Mobile native Wearable native

                                                                - +

                                                                Dependencies

                                                                  @@ -54,9 +54,9 @@

                                                                  Project Type

                                                                  When the Tizen Project Wizard opens, you must first select the project type.

                                                                  -

                                                                  Figure: Selecting the project type

                                                                  -

                                                                  Selecting the project type

                                                                  - +

                                                                  Figure: Selecting the project type

                                                                  +

                                                                  Selecting the project type

                                                                  +

                                                                  The Tizen Studio provides various project templates and samples for the mobile and wearable devices according to the installed platform. The Tizen Project Wizard helps you select the template and sample for your project.

                                                                  The Template option provides a list of templates with a basic structure where you can start the native application project:

                                                                    @@ -80,7 +80,7 @@
                                                                - +

                                                                The Sample option provides a list of sample applications demonstrating various API usage and UI design.

                                                                To move to the next step, select the project type and click Next.

                                                                @@ -88,34 +88,34 @@

                                                                You can select the profile and version supported by your project, such as a mobile or wearable device. In addition, the Tizen Studio shows you which platforms among the supported platforms have been installed.

                                                                Based on the selected profile and version, a list of templates is shown in the template selection step.

                                                                -

                                                                Figure: Selecting the profile and version

                                                                -

                                                                File analysis

                                                                - +

                                                                Figure: Selecting the profile and version

                                                                +

                                                                File analysis

                                                                +

                                                                To move to the next step, select the profile and version, and click Next.

                                                                Application Type

                                                                You can select the native or Web application type for your project. For more information, see Native Application and Web Application.

                                                                Based on the selected application type, a list of templates is shown in the template selection step.

                                                                -

                                                                Figure: Selecting the application type

                                                                -

                                                                Selecting the application type

                                                                - +

                                                                Figure: Selecting the application type

                                                                +

                                                                Selecting the application type

                                                                +

                                                                To move to the next step, select the application type and click Next.

                                                                Template

                                                                You can select the template for your project while viewing information about a variety of templates. The Tizen Project Wizard creates the project based on the selected template.

                                                                -

                                                                Figure: Selecting the template

                                                                -

                                                                Selecting the template

                                                                +

                                                                Figure: Selecting the template

                                                                +

                                                                Selecting the template

                                                                To move to the next step, select the template and click Next.

                                                                Project Properties

                                                                You can set basic project properties, such as the project name, location, and working sets.

                                                                -

                                                                Figure: Setting project properties

                                                                -

                                                                Setting project properties

                                                                - +

                                                                Figure: Setting project properties

                                                                +

                                                                Setting project properties

                                                                +

                                                                The options you can set are listed in the following table.

                                                                Table: Project properties

                                                                @@ -149,7 +149,7 @@

                                                                After specifying the options, click Finish to create the new project.

                                                                - +
                                                                diff --git a/org.tizen.studio/html/native_tools/resource_manager_n.htm b/org.tizen.studio/html/native_tools/resource_manager_n.htm index 6003e21..f400a80 100644 --- a/org.tizen.studio/html/native_tools/resource_manager_n.htm +++ b/org.tizen.studio/html/native_tools/resource_manager_n.htm @@ -5,22 +5,22 @@ - + - Providing Resources for Multiple Device Types + Providing Resources for Multiple Device Types - +

                                                                Mobile native Wearable native

                                                                - +

                                                                Dependencies

                                                                  @@ -46,11 +46,11 @@

                                                                Resource Directory Hierarchy

                                                                - +

                                                                An application must provide a different UI depending on a specific device configuration, such as the screen size and screen orientation. When developing the application, provide alternative resources for each device display state by grouping them in resource directories.

                                                                -

                                                                The res/contents directory contains predefined directories for specific alternative resources, and the res.xml file that is referenced at application runtime. The following example of a Basic UI project shows how to group the resources in your project. Place resources, such as images and sounds, in a specific subdirectory of the project's res/contents directory or the root directory of the contents directory.

                                                                +

                                                                The res/contents directory contains predefined directories for specific alternative resources, and the res.xml file that is referenced at application runtime. The following example of a Basic UI project shows how to group the resources in your project. Place resources, such as images and sounds, in a specific subdirectory of the project's res/contents directory or the root directory of the contents directory.

                                                                -

                                                                Figure: Resource directory hierarchy

                                                                +

                                                                Figure: Resource directory hierarchy

                                                                Resource directory hierarchy

                                                                @@ -128,10 +128,10 @@ - +

                                                                The res.xml file is composed of XML elements, and describes where each alternative resource is grouped into a device configuration. The following example shows a res.xml file based on the BasicUI project.

                                                                -

                                                                Figure: res.xml file

                                                                +

                                                                Figure: res.xml file

                                                                res.xml file

                                                                The res.xml file is automatically generated as part of the build packaging process by the Tizen Studio. Since editing the res.xml file manually is not easy, the Tizen Studio helps to minimize this difficulty by supporting the Resource Manager view.

                                                                @@ -156,12 +156,12 @@
                                                                1. Open the Resource Configuration dialog by clicking Setting icon in the Resource Manager view toolbar.
                                                                2. Add a configuration by selecting LDPI and MDPI in the DPI combo box.
                                                                  3. -
                                                                3. Drag the edje folder and drop it into the proper tab list view area in the Resource Manager view. +
                                                                4. Drag the edje folder and drop it into the proper tab list view area in the Resource Manager view. The following figure shows the Tab list view (on the left) and the Folding list view (on the right) of the Resource Manager view. You can switch between the views using the buttons in the Resource Manager view toolbar (Folding list to switch to folding lists and Tab to switch to tab lists).
                                                                -

                                                                Figure: Tab view and Folding list view

                                                                +

                                                                Figure: Tab view and Folding list view

                                                                Tab view and Folding list view

                                                                diff --git a/org.tizen.studio/html/native_tools/static_analyzer_n.htm b/org.tizen.studio/html/native_tools/static_analyzer_n.htm index 133dfda..8534be5 100644 --- a/org.tizen.studio/html/native_tools/static_analyzer_n.htm +++ b/org.tizen.studio/html/native_tools/static_analyzer_n.htm @@ -5,22 +5,22 @@ - + - Analyzing the Source Code + Analyzing the Source Code - +

                                                                Mobile native Wearable native

                                                                - +

                                                                Dependencies

                                                                  @@ -42,11 +42,11 @@

                                                                  Tizen Static Analyzer uses clang static analyzer to analyze C/C++ code, and reports static issues, such as Dereference of Null Pointers, Memory Leaks, Division by Zero, and Double Free.

                                                                  Running the Static Analyzer

                                                                  - +

                                                                  In the Project Explorer view, right-click the project on which you want to run the static analyzer, and select Check Potential Bugs with Build.

                                                                  The project is automatically built and the static analyzer is run during the build process.

                                                                  -

                                                                  Figure: Running the Static Analyzer

                                                                  +

                                                                  Figure: Running the Static Analyzer

                                                                  Running the Static Analyzer

                                                                  Customizing the Static Analyzer

                                                                  @@ -69,7 +69,7 @@

                                                                  When the static analysis is completed, the issues found by the static analyzer are listed in the Potential Bugs view on the right pane of the Tizen Studio.

                                                                  The issues are categorized based on type. You can expand the categories and double-click the issues to navigate to the exact location of the problem along with the path which caused the issue.

                                                                  -

                                                                  Figure: Analysis results in the Potential Bugs view

                                                                  +

                                                                  Figure: Analysis results in the Potential Bugs view

                                                                  Analysis results in the Potential Bugs view

                                                                  diff --git a/org.tizen.studio/html/native_tools/storyboard_n.htm b/org.tizen.studio/html/native_tools/storyboard_n.htm index 8466274..6e6a300 100644 --- a/org.tizen.studio/html/native_tools/storyboard_n.htm +++ b/org.tizen.studio/html/native_tools/storyboard_n.htm @@ -42,14 +42,14 @@

                                                                  The Tizen Storyboard is an additional tab in the UI Builder WYSIWYG editor. It provides an interactive view to help in the design of the page transitions.

                                                                  -

                                                                  The Storyboard provides a bird's eye picture of all the views present in the application, along with a flowchart of event-based transitions between views. You can visualize page transition in the native application, and form a better understanding of the application functionality. You can also use the Storyboard as a control panel to manage the application views.

                                                                  +

                                                                  The Storyboard provides a bird's eye picture of all the views present in the application, along with a flowchart of event-based transitions between views. You can visualize page transition in the native application, and form a better understanding of the application functionality. You can also use the Storyboard as a control panel to manage the application views.

                                                                  The Storyboard consists of a collection of the application views, inter-connected by arrows depicting the change of the view when an event is fired by a user action on a UI component. The Storyboard automatically generates the necessary logic to handle the view transformation, and also provides you auto-generated stubs for defining event handlers for various events of the existing UI components.

                                                                  The Storyboard is available for applications created with a UI Builder template.

                                                                  Creating a Storyboard Application

                                                                  - +

                                                                  To use the Storyboard, you must create a Tizen native project using a UI Builder template:

                                                                  1. In the project wizard, select the application profile and version. @@ -62,14 +62,14 @@

                                                                    Select template

                                                                  - +

                                                                  Adding Views

                                                                  - +

                                                                  When you select the Storyboard tab in the WYSIWYG editor, the Storyboard graphical viewer opens. If the UI Builder - Navigation View application template is used, the viewer contains 3 default views with some default connections between them. Otherwise, the viewer contains a single view.

                                                                  Figure: Views shown in the Storyboard tab

                                                                  Views shown in the Storyboard tab

                                                                  - +

                                                                  To add a new view, right-click the editor, select Add View, and select the view type you want. Alternatively, you can add a new view in the Navigation view and drag and drop the view from the Navigation view to the Storyboard tab.

                                                                  @@ -78,9 +78,9 @@ Alternatively, you can add a new view in the Navigation view an

                                                                  You can move the views in the viewer by selecting the black label containing the view name and dragging the view to a new position.

                                                                  - +

                                                                  Creating Connections

                                                                  - +

                                                                  To create a connection between 2 views:

                                                                  1. Press the Ctrl key and click the UI component from which the page transition is to happen.
                                                                    2. @@ -109,7 +109,7 @@ Alternatively, you can add a new view in the Navigation view an

                                                                  Changing Component and Connection Properties

                                                                  - +

                                                                  When you select a component or connection in the Storyboard, the editable properties related to it are displayed in the Properties view. You can view the transition properties and change the connection target view and title.

                                                                  Figure: Component properties

                                                                  @@ -119,14 +119,14 @@ Alternatively, you can add a new view in the Navigation view an

                                                                  Connection properties

                                                                  Maximizing and Minimizing Views

                                                                  - +

                                                                  You can maximize and minimize a set of views in the Storyboard tab by toggling the icon in the right top corner of the respective views.

                                                                  Use this feature to reduce the clutter of multiple views present in the application without compromising on losing the overall sight of the application project.

                                                                  The startup view can be identified by an arrow symbol in the left top corner of the view.

                                                                  Figure: Maximizing and minimizing views

                                                                  Maximizing and minimizing views

                                                                  - + diff --git a/org.tizen.studio/html/native_tools/t_trace_n.htm b/org.tizen.studio/html/native_tools/t_trace_n.htm index 24272be..750cc5d 100644 --- a/org.tizen.studio/html/native_tools/t_trace_n.htm +++ b/org.tizen.studio/html/native_tools/t_trace_n.htm @@ -5,7 +5,7 @@ - + @@ -35,18 +35,18 @@
                                                                - +

                                                                Optimizing Performance with T-trace

                                                                The T-trace is a profiling tool that allows you to optimize application performance by measuring and visualizing instrumented function calls in the Tizen platform. It helps you to understand what the system is doing while your application is running.

                                                                - -

                                                                T-trace Dialog

                                                                + +

                                                                T-trace Dialog

                                                                The following figure illustrates the T-trace dialog elements.

                                                                -

                                                                Figure: T-trace dialog

                                                                -

                                                                T-trace dialog

                                                                +

                                                                Figure: T-trace dialog

                                                                +

                                                                T-trace dialog

                                                                1. Tags

                                                                  You can define which categories to trace. Currently, the T-trace provides several Tizen platform-specific categories, and a few low level system information categories. The Linux kernel and Tizen platform modules (such as EFL, xorg, and mmfw) support the categories.

                                                                  @@ -74,8 +74,8 @@

                                                                  Running the T-trace

                                                                  -

                                                                  When you run the T-trace, the tracing process gathers traces during a specified time period. After tracing is finished, the T-trace processes the traces and creates a trace report in the HTML format.

                                                                  - +

                                                                  When you run the T-trace, the tracing process gathers traces during a specified time period. After tracing is finished, the T-trace processes the traces and creates a trace report in the HTML format.

                                                                  +
                                                                  Note To operate the T-trace, you must first install Python (2.7.x) and Google Chrome™ on your computer. @@ -117,9 +117,9 @@ $ python ttrace.py --help

                                                                  The results are stored in the <TIZEN_STUDIO>/tools/ttrace/trace directory. Both a .text binary-format trace file and a .html result report file are generated. The files are named with a timestamp (YYYYMMDDHHMMSS).

                                                                  You can view the results using the Google Chrome™ browser as a viewer. The viewer is launched with the result report when you click Show result in the T-trace dialog. If you run the T-trace from the command line, open the result report manually in the viewer.

                                                                  - -

                                                                  Figure: T-trace viewer

                                                                  -

                                                                  T-trace viewer

                                                                  + +

                                                                  Figure: T-trace viewer

                                                                  +

                                                                  T-trace viewer

                                                                  The following table lists the keyboard shortcuts available in the viewer.

                                                                  @@ -161,7 +161,7 @@ $ python ttrace.py --help Right arrow Select the next event on the currently selected timeline. - + Left arrow Select the previous event on the currently selected timeline. @@ -175,9 +175,9 @@ $ python ttrace.py --help Zoom out of the trace timeline. - +

                                                                  Result Report

                                                                  - +

                                                                  The result report allows you to analyze various performance aspects of your application. The report shows how your application interacts with the Tizen framework, according to category tags you selected for tracing. The following table shows the kind of information each tag provides.

                                                                  Table: Tag-specific information

                                                                  @@ -214,24 +214,24 @@ $ python ttrace.py --help Image Shows information on image processing, such as rotation, resize, and encoding. - - + +

                                                                  Application life-cycle analysis example:

                                                                  You can analyze your application life-cycle using the T-trace in native applications. The following figure illustrates the various states of a Tizen application. The T-trace shows you the state changes as well as how much time is consumed at each state while the application is launching, running, and terminating.

                                                                  -

                                                                  Figure: Application life-cycle

                                                                  -

                                                                  Application life-cycle

                                                                  +

                                                                  Figure: Application life-cycle

                                                                  +

                                                                  Application life-cycle

                                                                  To analyze the application life-cycle, run the T-trace with the Application manager tag. When the tracing process is finished, the T-trace generates a report, as shown in the following figure.

                                                                  - -

                                                                  Figure: Application life-cycle report

                                                                  -

                                                                  Application life-cycle report

                                                                  + +

                                                                  Figure: Application life-cycle report

                                                                  +

                                                                  Application life-cycle report

                                                                  In the section for Kernel and application processes, you can see your application state changes and system information, such as the CPU frequency and kernel task scheduling on a common timeline. With this information, you can investigate in which state your application spends unnecessary time and then make changes to optimize the time usage.

                                                                  - + diff --git a/org.tizen.studio/html/native_tools/ui_builder_conversion_n.htm b/org.tizen.studio/html/native_tools/ui_builder_conversion_n.htm index dd3e508..a29e012 100644 --- a/org.tizen.studio/html/native_tools/ui_builder_conversion_n.htm +++ b/org.tizen.studio/html/native_tools/ui_builder_conversion_n.htm @@ -123,7 +123,7 @@

                                                                  Figure: Relationship between UI Builder view system and views

                                                                  Relationship between UI Builder view system and views

                                                                  - +

                                                                  The main roles of the view context are:

                                                                  • Root container: A top-level UI component of each screen (in the case of the SettingsUI application, the genlist is the top-level UI component). The root container is referenced in the view system when the settingsui view is displayed.
                                                                    • @@ -176,11 +176,11 @@
                                                                  • Select Sample and click Next.
                                                                  • Select the Mobile v2.4 application, Native Application type, and UI > SettingsUI application sample.

                                                                    Select the sample

                                                                    • -
                                                                  • Click Finish. +
                                                                  • Click Finish.

                                                                    The sample project is created.

                                                                    Created sample project

                                                                - +

                                                                Converting the SettingsUI Project to a UI Builder Project

                                                                To convert the project:

                                                                @@ -212,7 +212,7 @@
                                                              • Add a user view: -

                                                                Add a user view

                                                                +

                                                                Add a user view

                                                                1. Enter the name (settingsui) for the user view:
                                                                    @@ -242,13 +242,13 @@
                                                                    Note The converted project follows specific naming conventions: -
                                                                    • A suffix ("withUIB") is added at the end of the original project name.
                                                                      • +
                                                                      • A suffix ("withUIB") is added at the end of the original project name.
                                                                      • If the same name with the same suffix already exists on the workspace, an empty serial number is appended at the end of the filename.

                                                                    Using UI Builder Features

                                                                    -

                                                                    In the converted UI Builder project, you can naturally use the functions of the UI Builder's visual editing. The following examples show how to edit the views and define transitions among them visually.

                                                                    +

                                                                    In the converted UI Builder project, you can naturally use the functions of the UI Builder's visual editing. The following examples show how to edit the views and define transitions among them visually.

                                                                    Designing Views with Visual Editing

                                                                    @@ -337,10 +337,10 @@

                                                                    If you press the item_type_none (ELM_GENLIST_ITEM_NONE) of the genlist in the first view of the settingsui, the view in the screen is switched to the second view of the settingsui. You can also switch from the user view to the visually-edited view.

                                                                    The following example shows the transition from the genlist to the view1 when the tree_item_type (ELM_GENLIST_ITEM_TREE) is long-pressed in the genlist. In the settingsui.c file, modify the gl_longpressed_cb() function as shown in the following figure.

                                                                    - +

                                                                    Figure: View transition

                                                                    View transition

                                                                    - +

                                                                    The following figure shows the resulting event flow between the SettingsUI views.

                                                                    Figure: Event flow of settingsui view

                                                                    diff --git a/org.tizen.studio/html/native_tools/ui_builder_n.htm b/org.tizen.studio/html/native_tools/ui_builder_n.htm index 27baec1..fd194c8 100644 --- a/org.tizen.studio/html/native_tools/ui_builder_n.htm +++ b/org.tizen.studio/html/native_tools/ui_builder_n.htm @@ -135,7 +135,7 @@

                                                                    If you move a focus to another UI component in the Source tab, the selection in the preview pane is automatically synchronized. Similarly, if you change the selection in the preview pane, the focus in the Source tab moves accordingly.

                                                                    Binding an Event Handler

                                                                    - +

                                                                    An event handler is part of the application logic. It is called by the Tizen framework when any user interaction, such as a mouse click or touch, occurs. The event types differ between UI components, and the event information data depends on the UI component and event type.

                                                                    You can add event handlers for UI component events in the Properties view. To add view transition events between views, use the Storyboard tab in the Layout Editor view.

                                                                    @@ -166,19 +166,19 @@ void view1_button1_onclicked(uib_view1_view_context *vc, Evas_Object *obj, void
                                                                  • vc: View context related to the event. You can access the UI component in the view through this structure. The following code example shows a sample of the view context. 
                                                                     struct _uib_view1_view_context {
-    /* Parent evas_object which was a parameter of the create function */
-    Evas_Object *parent;
-    /* Root container UI component of this view */
-    Evas_Object* root_container;
-    /* View class name */
-    const char *view_name;
-    /* Control context to control this view */
-    struct _uib_view1_control_context *cc;
-
-    /* UI components in this view */
-    Evas_Object *grid1;
-    Evas_Object *button1;
-    Evas_Object *check1;
+    /* Parent evas_object which was a parameter of the create function */
+    Evas_Object *parent;
+    /* Root container UI component of this view */
+    Evas_Object* root_container;
+    /* View class name */
+    const char *view_name;
+    /* Control context to control this view */
+    struct _uib_view1_control_context *cc;
+
+    /* UI components in this view */
+    Evas_Object *grid1;
+    Evas_Object *button1;
+    Evas_Object *check1;
 };
 typedef struct _uib_view1_view_context;
                                                                    diff --git a/org.tizen.studio/html/native_tools/ui_project_migration_combi_n.htm b/org.tizen.studio/html/native_tools/ui_project_migration_combi_n.htm index c8d5dca..d1ff604 100644 --- a/org.tizen.studio/html/native_tools/ui_project_migration_combi_n.htm +++ b/org.tizen.studio/html/native_tools/ui_project_migration_combi_n.htm @@ -24,7 +24,7 @@

                                                                    Dependencies

                                                                      -
                                                                    • Tizen Studio 1.1 and Higher
                                                                      • +
                                                                    • Tizen Studio 1.1 and Higher

                                                                    Content

                                                                      @@ -59,7 +59,7 @@
                                                                      1. In the Tizen Studio, go to File > New > Tizen Project.
                                                                      2. Select the Sample project type, Mobile v2.4 profile and version, and the Native Application application type.
                                                                        3. -
                                                                      3. In the list of samples, select Graphics > GLView11Cube. +
                                                                      4. In the list of samples, select Graphics > GLView11Cube.

                                                                        Wizard Pages of the GLView11Cube

                                                                      5. Click Next, give the project a name and ID, and click Finish.
                                                                        6. @@ -71,9 +71,9 @@
                                                                      6. Copy the related files in the inc, src, and res subfolders.

                                                                        Copying files from the GLView11Cube project

                                                                        7. -
                                                                      7. Set hardware acceleration on in the SettingsUIwithUIB project's manifest file as it is in the GLView11Cube project. +
                                                                      8. Set hardware acceleration on in the SettingsUIwithUIB project's manifest file as it is in the GLView11Cube project.

                                                                        Apply the hardware acceleration attribute

                                                                        -
                                                                        9. +
                                                                @@ -116,7 +116,7 @@
                                                              • To use the UI Builder window object, remove the creation part of the core UI component in the glview11cube_create() function.

                                                                Removing Core UI Components

                                                                -
                                                                • +
                                                              • Add a conditional statement that prevents the root_container from being duplicated, which happens when you transition between the views in the UI Builder view system.
                                                              • Change the return value from the bool type true to the Evas_Object* type table.
                                                              • Remove the main() function from the glview11cube.c file, as it is not needed anymore. @@ -132,9 +132,9 @@
                                                              • Include the glview11cube.h file for referencing the UI component structure (appdata_s).
                                                              • Define the appdata_s structure as ad to be used in the glview11cube_create() function.
                                                              • Add a declaration for calling an external function.
                                                                • -
                                                              • Assign the UI Builder's window object to the ad structure.
                                                                • -
                                                              • Pass the UI Builder's window object as a parameter to the glview11cube_create() function and assign the created glview object to the view context's root_container. At runtime, the GLView11Cube screen is displayed through the root_container.
                                                                • - +
                                                              • Assign the UI Builder's window object to the ad structure.
                                                                • +
                                                              • Pass the UI Builder's window object as a parameter to the glview11cube_create() function and assign the created glview object to the view context's root_container. At runtime, the GLView11Cube screen is displayed through the root_container.
                                                                • +

                                                                Figure: Designing the GLView11Cube view

                                                                Designing the GLView11Cube view

                                                                @@ -157,8 +157,8 @@
                                                              • Modify the _close_cb() function by replacing the ui_app_exit() function with the uib_util_push_view() function.

                                                                The uib_util_push_view() function is a view transition function provided by the UI Builder view system.

                                                                Modifing close_cb function

                                                                - -
                                                                • + +
                                                              • @@ -170,14 +170,14 @@
                                                              • In the UI Builder Outline view, select the button2 item.

                                                                Outline view

                                                                • - +
                                                              • In the Properties view, click Plus button and Arrow button to add a new clicked event.

                                                                Add clicked event

                                                                The uib_view2_event_handler.c file is opened.

                                                                -
                                                                • +
                                                              • In the view2_button2_onclicked() function, call the uib_util_push_view() function to switch to the GLView11Cube view.

                                                                Add event handler code

                                                                -
                                                                • +
                                                              @@ -185,8 +185,8 @@

                                                              Figure: SettingsUIwithUIB event flow

                                                              Behavior flow of SettingsUIwithUIB application

                                                              - - + +
                                                      diff --git a/org.tizen.studio/html/native_tools/unit_test_n.htm b/org.tizen.studio/html/native_tools/unit_test_n.htm index 6ce2b4f..2918888 100644 --- a/org.tizen.studio/html/native_tools/unit_test_n.htm +++ b/org.tizen.studio/html/native_tools/unit_test_n.htm @@ -43,7 +43,7 @@

                                                      Creating a Unit Test Project

                                                      You can create a test project for the Tizen native project through the Tizen Native Unit Test Project wizard. The wizard provides the test project for each Tizen native project type, such as UI application, service application, shared library, and static library.

                                                      - +

                                                      To create a test project:

                                                      1. In the Tizen Studio menu, select File > New > Other > Tizen > Tizen Native Unit Test Project.
                                                        2. @@ -54,10 +54,10 @@
                                                      2. Specify a destination folder where to save the project.
                                                      3. Click Finish.
                                                      -

                                                      New Tizen Unit Test Project wizard

                                                      +

                                                      New Tizen Unit Test Project wizard

                                                      - +

                                                      To use the test project:

                                                      1. In the Project Explorer view, open the <TEST_PROJECT_HOME>/src/<TEST_PROJECT_NAME>TestCase.cpp file.
                                                        2. @@ -67,29 +67,29 @@

                                                        The unit test tool supports basic assertions, binary comparison, and string comparison in the gtest. For more information, see Google Test Advanced Guide.

                                                      -

                                                      To test the project written in the C code, a unit test project for the C++ language is provided. In this case, the tested function must be qualified as an extern "C" to avoid the 'undefined reference' error as demangled symbols in the error message.

                                                      -

                                                      There are 2 forms of the extern "C" declaration:

                                                      +

                                                      To test the project written in the C code, a unit test project for the C++ language is provided. In this case, the tested function must be qualified as an extern "C" to avoid the 'undefined reference' error as demangled symbols in the error message.

                                                      +

                                                      There are 2 forms of the extern "C" declaration:

                                                        -
                                                      • Declare the extern "C" linkage specification in the C header file: +
                                                      • Declare the extern "C" linkage specification in the C header file: 
                                                         #ifdef __cplusplus
-extern "C"
+extern "C"
 {
-    #endif
-    int foo;
-    void bar();
+    #endif
+    int foo;
+    void bar();
 
-    #ifdef __cplusplus
+    #ifdef __cplusplus
 }
 #endif
                                                      • Include the C headers in the C++ code: 
                                                        -extern "C"
+extern "C"
 {
-    #include "header.h"
+    #include "header.h"
 }
                                                      @@ -110,13 +110,13 @@ TEST_F(TestSuite, utils_round)
                                                    • Change the line that includes the utils/utils.h file: 
                                                      -#include "view/window.h"
-#include "view/main-view.h"
-extern "C"
+#include "view/window.h"
+#include "view/main-view.h"
+extern "C"
 {
-    #include "utils/utils.h"
+    #include "utils/utils.h"
 }
-#include "utils/ui-utils.h"
+#include "utils/ui-utils.h"
                                                      • @@ -124,14 +124,14 @@ extern "C"

                                                      Running the Unit Test Project on Devices

                                                      To launch the unit test project, click the Run icon in the toolbar.

                                                      -

                                                      Figure: Launching the test project

                                                      -

                                                      Launching the test project

                                                      - +

                                                      Figure: Launching the test project

                                                      +

                                                      Launching the test project

                                                      +

                                                      After the test cases are executed, the results are displayed on both the Test Result and Test Explorer views.

                                                      -

                                                      Figure: Test results

                                                      -

                                                      Test results

                                                      - +

                                                      Figure: Test results

                                                      +

                                                      Test results

                                                      +

                                                      Customizing the Launch Configuration

                                                      The test case running can be customized with launch options. To set the launch options:

                                                        @@ -179,7 +179,7 @@ extern "C"

                                                        The Test Explorer view provides the following options for testing and test cases:

                                                          -
                                                        • Refresh Tree: refreshes the test case tree to reflect the linked unit test project's changes.
                                                          • +
                                                        • Refresh Tree: refreshes the test case tree to reflect the linked unit test project's changes.
                                                        • Expand All and Collapse All: expands or collapses the test case tree.
                                                        • Check All and Clear All: checks or unchecks all the check boxes in the tree.
                                                        • Check Failed: checks failed test cases only.
                                                          • diff --git a/org.tizen.studio/html/platform_tools/cover_platform.htm b/org.tizen.studio/html/platform_tools/cover_platform.htm index 3fc7b16..e2ed092 100644 --- a/org.tizen.studio/html/platform_tools/cover_platform.htm +++ b/org.tizen.studio/html/platform_tools/cover_platform.htm @@ -95,7 +95,7 @@

                                                          File analysis

                                                      - +

                                                      Building the Platform Project

                                                      After building your Tizen platform project, you can run and debug the platform. To build and package your Tizen platform project:

                                                      @@ -106,7 +106,7 @@

                                                      A dialog box appears and monitors the progress of building and packaging the project.

                                                      After packaging is completed, the package file is located in the $<PROJECT_NAME>\Debug or $<PROJECT_NAME>\Release folder within the project folder.

                                                      - +

                                                      If an error message appears in the Console view due to dependency problems, open the Package Manager and install the needed packages for building the project. After the installation is completed, rebuild the platform project to confirm that the dependency problems have been solved.

                                                      GBS Options

                                                      @@ -114,9 +114,9 @@

                                                      The Git Build System (GBS) builds a platform project internally. You can set the GBS options in the IDE.

                                                      For more information about GBS, see Git Build System.

                                                      -

                                                      Figure: GBS options

                                                      -

                                                      GBS options

                                                      - +

                                                      Figure: GBS options

                                                      +

                                                      GBS options

                                                      +

                                                      To set the GBS options:

                                                        @@ -141,7 +141,7 @@

                                                        The Platform IDE provides 3 different solutions to debug a platform project: basic, attach, and coredump debug.

                                                        -

                                                        Basic Debug Process

                                                        +

                                                        Basic Debug Process

                                                        To debug the project:

                                                          @@ -176,7 +176,7 @@
                                                        1. In the Connection Explorer view, select the device for which a coredump archive to debug exists (for example, /opt/usr/share/crash/).
                                                        2. In the Project Explorer view, right-click the project and select Debug As > Tizen Platform Project – Coredump.
                                                        3. In the Launch Configuration dialog, select a core dumped file (*.coredump) and CS file (*.cs) by clicking Remote Browse or Local Browse. -

                                                          Selecting files

                                                          +

                                                          Selecting files

                                                          If the coredump information is displayed, click Next, select a rootstrap, and click Next again. (It takes about 1~5 minutes when installing the required libraries.)

                                                          Selecting rootstrap

                                                          4. @@ -186,7 +186,7 @@
                                                        4. If there is package problem, click Package Manager and install packages.

                                                          Checking packages

                                                          5. - +
                                                        5. Click Finish, if it is enabled.
                                                      diff --git a/org.tizen.studio/html/platform_tools/platform_tools.htm b/org.tizen.studio/html/platform_tools/platform_tools.htm index 971bb8e..bc9d81c 100644 --- a/org.tizen.studio/html/platform_tools/platform_tools.htm +++ b/org.tizen.studio/html/platform_tools/platform_tools.htm @@ -42,12 +42,12 @@

                                                      The Tizen Platform IDE provides several tools to help your platform development tasks: Rootstrap View, Package Manager, Specfile Editor, content assist features, and PO file editor.

                                                      -

                                                      Rootstrap View

                                                      - +

                                                      Rootstrap View

                                                      +

                                                      The Rootstrap View displays available rootstraps and the currently selected rootstrap. In the view, you can select, create, and remove a rootstrap, and also manage packages.

                                                      - -

                                                      Figure: Rootstrap View

                                                      -

                                                      Rootstrap View

                                                      + +

                                                      Figure: Rootstrap View

                                                      +

                                                      Rootstrap View

                                                      • To set a rootstrap to the project, right-click the desired rootstrap and select Select.
                                                        • @@ -69,7 +69,7 @@

                                                        To run the Package Manager, right-click the desired rootstrap and select Manage Packages. By selecting the applicable tab in the Package Manager, you can install packages to the rootstrap or the device.

                                                        -

                                                        Figure: Package Manager

                                                        +

                                                        Figure: Package Manager

                                                        Package Manager

                                                        On both tabs:

                                                        @@ -107,9 +107,9 @@

                                                        To set the Specfile Editor configuration, go to Window > Preferences > Others > Specfile Editor in the IDE toolbar. For more information, see Help Contents > Specfile Editor User Guide > Configuring Specfile Editor Settings.

                                                        -

                                                        Figure: Specfile Editor

                                                        +

                                                        Figure: Specfile Editor

                                                        Specfile Editor

                                                        - +

                                                        Content Assist

                                                        The Tizen Platform IDE provides the API assist and API hover features to make writing content in the Platform editor quick and efficient:

                                                        @@ -130,18 +130,18 @@ There is no specific wizard to create the .po files. To create a .po file, go to New > Other > General > File and save the file with the .po extension.
                                                      -

                                                      Figure: PO file editor

                                                      +

                                                      Figure: PO file editor

                                                      PO file editor

                                                      - +
                                                      • To open the PO file editor, double-click the .po file in the Project Explorer view.
                                                      • To add a new string key, click the Add String Key icon.

                                                        An empty row is added to the string table. Fill in the details for the row.

                                                      • To remove a string key, right-click the key and select Remove.
                                                        • - +
                                                      • To add a language, click the Add Language icon.

                                                        In the Add Languages dialog, select the language code item you want.

                                                        -

                                                        Figure: Adding a language

                                                        +

                                                        Figure: Adding a language

                                                        Adding a language

                                                      • To remove a language, in the Supporting Languages pane, click the Remove Language icon and select the applicable language code item in the Remove Languages dialog.
                                                        • diff --git a/org.tizen.studio/html/web_tools/IDE_preferences_w.htm b/org.tizen.studio/html/web_tools/IDE_preferences_w.htm index 8ccb4fa..b2ed10d 100644 --- a/org.tizen.studio/html/web_tools/IDE_preferences_w.htm +++ b/org.tizen.studio/html/web_tools/IDE_preferences_w.htm @@ -5,22 +5,22 @@ - + - Setting Tizen Studio Web Preferences + Setting Tizen Studio Web Preferences - +

                                                        Mobile Web Wearable Web

                                                        - +

                                                        Dependencies

                                                        @@ -56,16 +56,16 @@

                                                        You can customize your Tizen Studio with the Web preferences introduced in the following sections.

                                                        Setting Web Preferences

                                                        - +

                                                        To set Web preferences, go to Window > Preferences > Tizen Studio > Web in the Tizen Studio menu.

                                                        - +
                                                        Note In Windows® and Linux, Preferences is located in the Window menu. However, in Mac OS® X, it is located in the Tizen Studio menu.
                                                        -

                                                        Figure: Tizen Studio preferences

                                                        -

                                                        Tizen Studio preferences

                                                        +

                                                        Figure: Tizen Studio preferences

                                                        +

                                                        Tizen Studio preferences

                                                        The preferences are listed in the left pane, and you can search for items by using the search box on the top left.

                                                        @@ -74,8 +74,8 @@

                                                        To set a customized prefix for the widget ID, go to Window > Preferences > Tizen Studio > Web, and enter the value in the Widget ID prefix field. The default value of this field is http://yourdomain/.

                                                        The value is automatically used in all widget IDs when you create a new Web application in the Tizen Studio. You can view the widget ID in the config.xml file of the project.

                                                        -

                                                        Figure: Widget ID

                                                        -

                                                        Widget ID

                                                        +

                                                        Figure: Widget ID

                                                        +

                                                        Widget ID

                                                        Chrome™ Browser Path

                                                        @@ -99,9 +99,9 @@

                                                        Go to Tizen Studio > Web > Editor > CSS Editor.

                                                        In the CSS editor, you can modify several CSSLint options. CSSLint is a CSS code quality tool.

                                                        You can set the following validation times:

                                                        -
                                                          -
                                                        • Build
                                                          • -
                                                        • Reconcile
                                                          • +
                                                            +
                                                          • Build
                                                            • +
                                                          • Reconcile

                                                          You can set the following validation levels:

                                                            @@ -212,7 +212,7 @@ ko
                                                          -

                                                          Figure: Live highlight

                                                          +

                                                          Figure: Live highlight

                                                          Live highlight

                                                          diff --git a/org.tizen.studio/html/web_tools/code_productivity_w.htm b/org.tizen.studio/html/web_tools/code_productivity_w.htm index e8f3183..1365ef6 100644 --- a/org.tizen.studio/html/web_tools/code_productivity_w.htm +++ b/org.tizen.studio/html/web_tools/code_productivity_w.htm @@ -5,22 +5,22 @@ - + - Improving Your Code Productivity + Improving Your Code Productivity - +

                                                          Mobile Web Wearable Web

                                                          - +

                                                          Dependencies

                                                            @@ -40,7 +40,7 @@

                                                            The Tizen Studio provides various features for the productive development. This topic describes the Code Beautifier and Code Minifier features that you can use with the Tizen Web Editor.

                                                            Using the Code Beautifier

                                                            - +

                                                            The Code Beautifier is a tool that can help you understand code and make it easier to read. For example, to match the indentation and alignment in the same style automatically, you can improve your coding performance.

                                                            The Code Beautifier has the following features for beautifying HTML, CSS, and JavaScript:

                                                              @@ -56,14 +56,14 @@
                                                            • In the Source Editor view, right-click the code and select Code Beautifier.
                                                            • In the Source Editor or Project Explorer view, use the Ctrl + 6 hotkey.
                                                            - -

                                                            In case you use the Code Beautifier in the Source Editor view, no new file is generated. The original file is changed instead.

                                                            -

                                                            Figure: Code Beautifier with CSS file - before beautifying

                                                            +

                                                            In case you use the Code Beautifier in the Source Editor view, no new file is generated. The original file is changed instead.

                                                            + +

                                                            Figure: Code Beautifier with CSS file - before beautifying

                                                            Code Beautifier with CSS file - before beautifying

                                                            -

                                                            Figure: Code Beautifier with CSS file - after beautifying

                                                            +

                                                            Figure: Code Beautifier with CSS file - after beautifying

                                                            Code Beautifier with CSS file - after beautifying

                                                            @@ -108,14 +108,14 @@
                                                          • In the Source Editor view, right-click the code and select Code Minifier.
                                                          • In the Source Editor or Project Explorer view, use the Ctrl + 5 hotkey.
                                                          - -

                                                          In case you use the Code Minifier in the Source Editor view, no new file is generated. The original file is changed instead.

                                                          -

                                                          Figure: Code Minifier with CSS file - before minifying

                                                          +

                                                          In case you use the Code Minifier in the Source Editor view, no new file is generated. The original file is changed instead.

                                                          + +

                                                          Figure: Code Minifier with CSS file - before minifying

                                                          Code Minifier with CSS file - before minifying

                                                          -

                                                          Figure: Code Minifier with CSS file - after minifying

                                                          +

                                                          Figure: Code Minifier with CSS file - after minifying

                                                          Code Minifier with CSS file - after minifying

                                                          diff --git a/org.tizen.studio/html/web_tools/config_editor_w.htm b/org.tizen.studio/html/web_tools/config_editor_w.htm index 373ce8b..a952f64 100644 --- a/org.tizen.studio/html/web_tools/config_editor_w.htm +++ b/org.tizen.studio/html/web_tools/config_editor_w.htm @@ -43,12 +43,12 @@

                                                          This configuration information is used when you install or run the Tizen Web application on the Tizen platform. The Tizen Web application project must have the config.xml file in the project root directory.

                                                          The configuration file can be easily edited with the Web application configuration editor (form editor), or you can modify the XML structure directly using the configuration source editor. With the form editor, you can set the project configuration (manifest), even if you have no experience of developing a Tizen Web application project. If you are fluent with the configuration file XML structure, you can create the configuration file directly through the configuration source editor.

                                                          - +
                                                          Note The config.xml must conform to both the XML file format and the W3C specification requirements. Editing the file XML structure with the configuration source editor is intended for advanced users only.
                                                          - +

                                                          Editing the config.xml File

                                                          There are 2 different ways to edit the config.xml file:

                                                          @@ -58,21 +58,21 @@
                                                          1. Double-click the config.xml file in the Project Explorer view.
                                                          2. Select the Source tab.
                                                          - -

                                                          Figure: Source tab

                                                          + +

                                                          Figure: Source tab

                                                          Source tab

                                                        • Use the form tabs:
                                                          1. Double-click the config.xml file in the Project Explorer view.
                                                          2. Select one of the form tabs (Overview, Features, Privileges, Localization, Policy, Preferences, Tizen).
                                                          - -

                                                          Figure: Form tabs

                                                          + +

                                                          Figure: Form tabs

                                                          Form tabs

                                                        - - + +

                                                        Configuration Element Hierarchy

                                                        The Tizen Web application configuration file consists of XML elements organized in a hierarchy. The following tree structure shows the relationship between the elements of the config.xml file.

                                                        @@ -102,7 +102,7 @@ - + @@ -135,7 +135,7 @@ - + @@ -143,7 +143,7 @@ - + @@ -207,7 +207,7 @@ - + @@ -308,7 +308,7 @@ - + @@ -318,7 +318,7 @@

                                                        Configuration Elements

                                                        The following tables summarize of the W3C configuration elements used in the config.xml file of the Web application. For more information on the W3C element details, see Packaging and XML Configuration (the details of the Tizen extending configuration elements are described in Extending Configuration Elements in Mobile Applications and Extending Configuration Elements in Wearable Applications). For a quick view of the element hierarchy, see Configuration Element Hierarchy.

                                                        - +
                                                            <tizen:capability>
                                                          <tizen:account> (in mobile only)  <tizen:mime>
                                                          <tizen:application> (in mobile or wearable)
                                                          <tizen:app-widget> (in wearable only)
                                                             <span>
                                                          <feature> (in mobile or wearable)    <tizen:category>
                                                          <tizen:setting> (in mobile or wearable)
                                                        @@ -327,7 +327,7 @@
                                                        Represents the root element of a configuration document.

                                                        Expected children:

                                                        <access>, <tizen:account>, <tizen:app-control>, <tizen:application>, <author>, <content>, <tizen:content>, <description>, <feature>, <icon>, <license>, <name>, <preference>, <tizen:privilege>, <tizen:profile>, and <tizen:setting>

                                                        -

                                                        Attributes:

                                                        +

                                                        Attributes:

                                                        • xml:lang
                                                        • dir
                                                        • id
                                                          • @@ -340,7 +340,7 @@
                                                        - + @@ -353,7 +353,7 @@
                                                        - + @@ -369,7 +369,7 @@
                                                        - + @@ -385,7 +385,7 @@
                                                        - + @@ -399,7 +399,7 @@
                                                        - + @@ -411,11 +411,11 @@
                                                      • dir
                                                      • src
                                                      • width
                                                        • -
                                                      • height
                                                        • +
                                                      • height
                                                        • - + @@ -430,7 +430,7 @@
                                                        - + @@ -445,8 +445,8 @@
                                                        - - + + @@ -462,7 +462,7 @@
                                                        - + @@ -478,7 +478,7 @@
                                                        - + @@ -493,13 +493,13 @@
                                                        - +

                                                        Extending Configuration Elements in Mobile Applications

                                                        The following sections show additional configuration elements used in the config.xml file of the Web application, but not included in the Widget Packaging and XML Configuration guidelines. For a quick view of the entire element hierarchy, see Configuration Element Hierarchy.

                                                        Note - The extension elements are denoted as though the xmlns:tizen="http://tizen.org/ns/widgets" namespace declaration was in effect. + The extension elements are denoted as though the xmlns:tizen="http://tizen.org/ns/widgets" namespace declaration was in effect.

                                                        The maximum length of the attribute and the element (except <tizen:metadata>, W3C preference element) can be limited to 2048 bytes. In this case, leftover bytes are ignored.

                                                        @@ -529,16 +529,16 @@
                                                        • multiple-account-support

                                                          Mandatory; indicates whether multiple accounts are supported (available values: true, false)

                                                          • -

                                                        Example: 

                                                        <tizen:account multiple-account-support="false">
-   <tizen:icon section="Account">account_provider_icon.png</tizen:icon>
-   <tizen:icon section="AccountSmall">account_provider_small_icon.png</tizen:icon>
-   <tizen:display-name xml:lang="en">AccountProviderExample</tizen:display-name>
-   <tizen:capability>http://tizen.org/account/capability/contact</tizen:capability>
+

                                                      Example: 

                                                      <tizen:account multiple-account-support="false">
+   <tizen:icon section="Account">account_provider_icon.png</tizen:icon>
+   <tizen:icon section="AccountSmall">account_provider_small_icon.png</tizen:icon>
+   <tizen:display-name xml:lang="en">AccountProviderExample</tizen:display-name>
+   <tizen:capability>http://tizen.org/account/capability/contact</tizen:capability>
 </tizen:account>
                                                      - +

                                                      Tizen Navigation Policy

                                                      @@ -556,7 +556,7 @@
                                                      - +

                                                      Tizen Application Control

                                                      @@ -575,10 +575,10 @@

                                                      Attributes:

                                                      • name

                                                        Mandatory; page handling the requests

                                                        • -
                                                      • reload

                                                        Optional; sets whether the page is reloaded when it is already loaded (available values: enable (default), disable)

                                                        Since: 2.4

                                                        +
                                                      • reload

                                                        Optional; sets whether the page is reloaded when it is already loaded (available values: enable (default), disable)

                                                        Since: 2.4

                                                        Note - The reload attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the reload attribute is used, the application installation fails. + The reload attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the reload attribute is used, the application installation fails.
                                                      @@ -587,15 +587,15 @@
                                                    • operation

                                                      Mandatory; string that defines the action to be performed

                                                    • uri and mime

                                                      Optional; additional parameters used for resolving application control requests

                                                      • Example: 

                                                      <tizen:app-control>
-   <tizen:src name="view.html" reload="disable"/>
-   <tizen:operation name="http://tizen.org/appcontrol/operation/view"/>
-   <tizen:uri name="http"/>
-   <tizen:mime name="image/jpeg"/>
+   <tizen:src name="view.html" reload="disable"/>
+   <tizen:operation name="http://tizen.org/appcontrol/operation/view"/>
+   <tizen:uri name="http"/>
+   <tizen:mime name="image/jpeg"/>
 </tizen:app-control>
                                                      - +

                                                      Tizen Application ID

                                                      @@ -620,17 +620,17 @@

                                                      Since: 2.4

                                                      Note - The launch_mode attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the launch_mode attribute is used, the application installation fails. + The launch_mode attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the launch_mode attribute is used, the application installation fails.
                                                      -

                                                      Example:

                                                      <tizen:application id="1234abcDEF.projectname"
-                   package="1234abcDEF"
-                   required_version="2.4"
-                   launch_mode="caller" />
                                                      +

                                                      Example:

                                                      <tizen:application id="1234abcDEF.projectname"
+                   package="1234abcDEF"
+                   required_version="2.4"
+                   launch_mode="caller" />
                                                      - +

                                                      Tizen Background Category

                                                      @@ -652,11 +652,11 @@

                                                      Example:

                                                      - 
                                                      <tizen:background-category value="media" />
                                                      + 
                                                      <tizen:background-category value="media" />
                                                      - +

                                                      Tizen-hosted Web Application

                                                      @@ -676,11 +676,11 @@
                                                    • src

                                                      Mandatory; URI of the external start page

                                                      • -

                                                      Example: 

                                                      <tizen:content src="https://www.tizen.org/" />
                                                      +

                                                      Example: 

                                                      <tizen:content src="https://www.tizen.org/" />
                                                      - +

                                                      Tizen Content Security Policy

                                                      @@ -694,11 +694,11 @@
                                                    • 0 or more

                                                      If more than 1, the first occurrence is applied.

                                                      • -

                                                      Example: 

                                                      <tizen:content-security-policy>script-src 'self'</tizen:content-security-policy>
                                                      +

                                                      Example: 

                                                      <tizen:content-security-policy>script-src 'self'</tizen:content-security-policy>
                                                      - +

                                                      Tizen Content Security Policy Report Only

                                                      @@ -713,12 +713,12 @@

                                                      If more than 1, the first occurrence is applied.

                                                      Example: 

                                                      <tizen:content-security-policy-report-only>
-   script-src 'self'; report-uri="http://example.com/report.cgi"
+   script-src 'self'; report-uri="http://example.com/report.cgi"
 </tizen:content-security-policy-report-only>
                                                      - +

                                                      Tizen Feature

                                                      @@ -740,11 +740,11 @@

                                                      Attributes:

                                                      Example: 

                                                      <feature name="http://tizen.org/feature/network.bluetooth" />
                                                      +

                                                      Example: 

                                                      <feature name="http://tizen.org/feature/network.bluetooth" />
                                                      - +

                                                      Tizen Metadata

                                                      @@ -768,12 +768,12 @@

                                                      The maximum length can be limited to 8192 bytes. In this case, leftover bytes are ignored.

                                                      -

                                                      Example: 

                                                      <tizen:metadata key="key1"/>
-<tizen:metadata key="key2" value="value/>
                                                      +

                                                      Example: 

                                                      <tizen:metadata key="key1"/>
+<tizen:metadata key="key2" value="value/>
                                                      - +

                                                      Tizen Privilege

                                                      @@ -789,12 +789,12 @@

                                                      Attributes:

                                                      • name

                                                        Mandatory; URI of the Device API privilege

                                                        • -

                                                      Example: 

                                                      <tizen:privilege name="http://tizen.org/privilege/application.launch" />
                                                      +

                                                      Example: 

                                                      <tizen:privilege name="http://tizen.org/privilege/application.launch" />
                                                      - -

                                                      Tizen Profile

                                                      + +

                                                      Tizen Profile

                                                      @@ -802,18 +802,18 @@
                                                      Used to define the application profile. -

                                                      Occurrences:

                                                      -
                                                        +

                                                        Occurrences:

                                                        +
                                                        • 1
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • name

                                                          Mandatory; string

                                                          • -

                                                        Example: 

                                                        <tizen:profile name="mobile" />
                                                        +

                                                        Attributes:

                                                        +
                                                          +
                                                        • name

                                                          Mandatory; string

                                                          • +

                                                        Example: 

                                                        <tizen:profile name="mobile" />
                                                      - +

                                                      Tizen Settings

                                                      @@ -830,8 +830,8 @@
                                                      • screen-orientation

                                                        Optional; viewport orientation lock (available values: portrait (default), landscape), auto-rotation

                                                        If the system auto rotation setting is on, the Web application viewport orientation is changed accordingly by default.
                                                      • context-menu

                                                        Optional; context menu is displayed when the user clicks, for example, an image, text, or link (available values: enable (default), disable)

                                                        • -
                                                      • background-support -

                                                        Optional; application execution continues when it is moved to the background (available values: enable (execution continues on the background), disable (default; application is suspended))

                                                        +
                                                      • background-support +

                                                        Optional; application execution continues when it is moved to the background (available values: enable (execution continues on the background), disable (default; application is suspended))

                                                        Note Since Tizen 2.4, the system manages background processes more tightly. Even if the background-support attribute is set to enable, the Web application process can be suspended on the background. To guarantee that the application runs on the background, add at least one background category for the application with the <tizen:background-category> element. Only the background categories declared in the system can be used. @@ -841,32 +841,32 @@
                                                      • install-location

                                                        Optional; application installation location (available values: auto (default), internal-only, prefer-external)

                                                        • auto: the system defines the installation location
                                                          • -
                                                        • internal-only: the application is installed in the device's internal storage
                                                          • +
                                                        • internal-only: the application is installed in the device's internal storage
                                                        • prefer-external: the application is installed in the external storage (if available)
                                                          • -
                                                        +
                                                    • hwkey-event

                                                      Optional; a hardware key event is sent to the Web application when the user presses the hardware key (available values: enable (default), disable)

                                                      If this option is enabled, the tizenhwkey custom event is sent to the Web application. The tizenhwkey event object has a keyName attribute (available values: menu and back).

                                                      • Example: 

                                                      -<!--Viewport orientation is locked to "landscape"-->
-<tizen:setting screen-orientation="landscape" />
+<!--Viewport orientation is locked to "landscape"-->
+<tizen:setting screen-orientation="landscape" />
 
 <!--Context menu is not displayed-->
-<tizen:setting context-menu="disable" />
+<tizen:setting context-menu="disable" />
 
 <!--Web application execution is not suspended-->
 <!--when the application is sent to the background-->
-<tizen:setting background-support="enable" />
+<tizen:setting background-support="enable" />
 
 <!--Web applications resources are stored encrypted by the WRT-->
-<tizen:setting encryption="enable" />
+<tizen:setting encryption="enable" />
 
-<!--Installation location is set to "internal-only"-->
-<tizen:setting install-location="internal-only" />
+<!--Installation location is set to "internal-only"-->
+<tizen:setting install-location="internal-only" />
 
 <!--Hardware key event is sent to the Web application when the hardware key is pressed-->
-<tizen:setting hwkey-event="enable" />
                                                      +<tizen:setting hwkey-event="enable" />
                                                      @@ -876,11 +876,11 @@
                                                      Note - The extension elements are denoted as though the xmlns:tizen="http://tizen.org/ns/widgets" namespace declaration was in effect. + The extension elements are denoted as though the xmlns:tizen="http://tizen.org/ns/widgets" namespace declaration was in effect.

                                                      The maximum length of the attribute and the element (except tizen:metadata, W3C preference element) can be limited to 2048 bytes. In that case, leftover bytes are ignored.

                                                      -

                                                      Tizen Navigation Policy

                                                      +

                                                      Tizen Navigation Policy

                                                      @@ -888,16 +888,16 @@
                                                      Used to define a list of URL domains that are allowed to be navigated in using the Web application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more -

                                                        If more than 1, the first occurrence is applied.

                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more +

                                                          If more than 1, the first occurrence is applied.

                                                        Example: 

                                                        <tizen:allow-navigation>tizen.org *.tizen.org<tizen:allow-navigation/>
                                                      - +

                                                      Tizen Application Control

                                                      @@ -916,11 +916,11 @@

                                                      Attributes:

                                                      • name

                                                        Mandatory; page handling the requests

                                                        • -
                                                      • reload

                                                        Optional; sets whether the page is reloaded when it is already loaded (available values: enable (default), disable)

                                                        Since: 2.4

                                                        +
                                                      • reload

                                                        Optional; sets whether the page is reloaded when it is already loaded (available values: enable (default), disable)

                                                        Since: 2.4

                                                        Note - The reload attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the reload attribute is used, the application installation fails. + The reload attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the reload attribute is used, the application installation fails.
                                                      @@ -929,15 +929,15 @@
                                                    • operation

                                                      Mandatory; string that defines the action to be performed

                                                    • uri and mime

                                                      Optional; additional parameters used for resolving application control requests

                                                      • Example: 

                                                      <tizen:app-control>
-   <tizen:src name="view.html" reload="disable"/>
-   <tizen:operation name="http://tizen.org/appcontrol/operation/view"/>
-   <tizen:uri name="http"/>
-   <tizen:mime name="image/jpeg"/>
+   <tizen:src name="view.html" reload="disable"/>
+   <tizen:operation name="http://tizen.org/appcontrol/operation/view"/>
+   <tizen:uri name="http"/>
+   <tizen:mime name="image/jpeg"/>
 </tizen:app-control>
                                                      - +

                                                      Tizen Web Widget

                                                      @@ -951,7 +951,7 @@
                                                    • 0 or more

                                                      • Expected children:

                                                      -
                                                        +

                                                        Example: 

                                                        -<tizen:app-widget id="EHtuCWfzcr.Widget.Widget" primary="true" max-instance="0">
-   <tizen:widget-label>Hello Web Widget!</tizen:widget-label>
-   <tizen:widget-content src="index.html">
-      <tizen:widget-size preview="preview.png">2x2</tizen:widget-size>
-   </tizen:widget-content>
-   <tizen:widget-metadata key="index" value="2"/>
+<tizen:app-widget id="EHtuCWfzcr.Widget.Widget" primary="true" max-instance="0">
+   <tizen:widget-label>Hello Web Widget!</tizen:widget-label>
+   <tizen:widget-content src="index.html">
+      <tizen:widget-size preview="preview.png">2x2</tizen:widget-size>
+   </tizen:widget-content>
+   <tizen:widget-metadata key="index" value="2"/>
 </tizen:app-widget>
                                                        @@ -983,13 +983,13 @@
                                                      @@ -1002,22 +1002,22 @@
                                                      Used to define the name of Web widget. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • xml:lang

                                                          Optional; specifies the language of the box label (for available values, see the IANA Language Subtag)

                                                          • +

                                                          Attributes:

                                                          +
                                                      Used to define the starting page of the Web widget. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1

                                                        Expected children:

                                                        -
                                                          + -

                                                          Attributes:

                                                          -
                                                            -
                                                          • src

                                                            Mandatory; local file path, relative to the source Web application directory of the widget starting page

                                                            • +

                                                            Attributes:

                                                            +
                                                              +
                                                            • src

                                                              Mandatory; local file path, relative to the source Web application directory of the widget starting page
                                                      - + @@ -1025,13 +1025,13 @@ @@ -1044,12 +1044,12 @@
                                                      Used to define the size of the Web widget. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • preview

                                                          Mandatory; image file path, relative to the source Web application directory of the box content displayed in the widget viewer

                                                          • +

                                                          Attributes:

                                                          +
                                                            +
                                                          • preview

                                                            Mandatory; image file path, relative to the source Web application directory of the box content displayed in the widget viewer
                                                      Used to define a (key, value) pair that can be read by a Web widget through the WidgetService API. Its main use is to allow you to define a constant to be read by a Web widget. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          +

                                                          Attributes:

                                                          +
                                                          • key

                                                            Mandatory; string.

                                                          • value

                                                            Mandatory; string.

                                                          @@ -1065,22 +1065,22 @@
                                                      Used to uniquely identify a Tizen wearable application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • id

                                                          Mandatory; Tizen application ID, which is a combination of the Tizen wearable package ID and project name. The application ID is unique in the device.

                                                          The project name is a set of characters (0~9, a~z, A~Z) randomly generated by the Tizen Studio. The minimum value is 1 byte and maximum value is 52 bytes.

                                                          • +

                                                          Attributes:

                                                          +
                                                            +
                                                          • id

                                                            Mandatory; Tizen application ID, which is a combination of the Tizen wearable package ID and project name. The application ID is unique in the device.

                                                            The project name is a set of characters (0~9, a~z, A~Z) randomly generated by the Tizen Studio. The minimum value is 1 byte and maximum value is 52 bytes.

                                                          • package

                                                            Mandatory; Tizen wearable package ID generated by the Tizen Studio, comprises of 10 characters (0~9, a~z, A~Z). The package ID is unique in the Samsung Apps.

                                                          • required_version

                                                            Mandatory; Tizen API version required for running the Web application

                                                            • - +
                                                          • ambient_support

                                                            Optional; sets whether the Web application supports the ambient mode (available values: enable, disable (default))

                                                            If this option is enabled, the application can be shown in the ambient mode.

                                                            Since: 2.3.1
                                                            Note The ambient_support option is only used for watch applications, and ignored in all non-watch applications. -

                                                            The ambient_support attribute is supported from Tizen 2.3.1 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.3.1, and the ambient_support attribute is used, the application installation fails.

                                                            +

                                                            The ambient_support attribute is supported from Tizen 2.3.1 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.3.1, and the ambient_support attribute is used, the application installation fails.

                                                          • launch_mode

                                                            Optional; sets which launch mode is supported (available values: single (default), group, caller)

                                                            @@ -1090,17 +1090,17 @@

                                                            Since: 2.4

                                                            Note - The launch_mode attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the launch_mode attribute is used, the application installation fails. + The launch_mode attribute is supported from Tizen 2.4 onwards. If the required_version in the application's config.xml file is set to a version older than Tizen 2.4, and the launch_mode attribute is used, the application installation fails.
                                                            • -

                                                          Example: 

                                                          <tizen:application id="1234abcDEF.projectname"  
-                   package="1234abcDEF"
-                   required_version="2.4"
-                   ambient_support="enable" />
                                                          +

                                                        Example: 

                                                        <tizen:application id="1234abcDEF.projectname"
+                   package="1234abcDEF"
+                   required_version="2.4"
+                   ambient_support="enable" />
                                                      - +

                                                      Tizen Background Category

                                                      @@ -1123,11 +1123,11 @@

                                                      Example:

                                                      - 
                                                      <tizen:background-category value="media" />
                                                      + 
                                                      <tizen:background-category value="media" />
                                                      - +

                                                      Tizen Category

                                                      @@ -1143,12 +1143,12 @@

                                                      Attributes:

                                                      • name

                                                        Mandatory; string

                                                        • -

                                                      Example: 

                                                      <tizen:category name="http://tizen.org/category/wearable_clock" />
                                                      +

                                                      Example: 

                                                      <tizen:category name="http://tizen.org/category/wearable_clock" />
                                                      - -

                                                      Tizen Content

                                                      + +

                                                      Tizen Content

                                                      @@ -1156,22 +1156,22 @@
                                                      Used to define the start page to be hosted on an external server. -

                                                      Occurrences:

                                                      -
                                                        +

                                                        Occurrences:

                                                        +
                                                        • 0 or more

                                                          If more than 1, the first occurrence is considered and all others ignored.

                                                        -

                                                        Attributes:

                                                        -
                                                          - -
                                                        • src

                                                          Mandatory; URI of an external start page

                                                          • +

                                                          Attributes:

                                                          +
                                                            + +
                                                          • src

                                                            Mandatory; URI of an external start page

                                                          Example: 

                                                          -<tizen:content src="https://www.tizen.org"/>
                                                          +<tizen:content src="https://www.tizen.org"/>
                                                      - -

                                                      Tizen Content Security Policy

                                                      + +

                                                      Tizen Content Security Policy

                                                      @@ -1179,17 +1179,17 @@
                                                      Used to define an additional content security policy for a packaged or hosted application. -

                                                      Occurrences:

                                                      -
                                                        +

                                                        Occurrences:

                                                        +
                                                        • 0 or more -

                                                          If more than 1, the first occurrence is applied.

                                                          • +

                                                          If more than 1, the first occurrence is applied.

                                                        -

                                                        Example: 

                                                        <tizen:content-security-policy>script-src 'self'</tizen:content-security-policy>
                                                        +

                                                        Example: 

                                                        <tizen:content-security-policy>script-src 'self'</tizen:content-security-policy>
                                                      - -

                                                      Tizen Content Security Policy Report Only

                                                      + +

                                                      Tizen Content Security Policy Report Only

                                                      @@ -1197,18 +1197,18 @@
                                                      Used to define an additional content security policy for a packaged or hosted application for monitoring purposes. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more -

                                                        If more than 1, the first occurrence is applied.

                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more +

                                                          If more than 1, the first occurrence is applied.

                                                        Example: 

                                                        <tizen:content-security-policy-report-only>
-   script-src 'self'; report-uri="http://example.com/report.cgi"
+   script-src 'self'; report-uri="http://example.com/report.cgi"
 </tizen:content-security-policy-report-only>
                                                      - +

                                                      Tizen Feature

                                                      @@ -1230,12 +1230,12 @@

                                                      Attributes:

                                                      Example: 

                                                      <feature name="http://tizen.org/feature/network.bluetooth" />
                                                      +

                                                      Example: 

                                                      <feature name="http://tizen.org/feature/network.bluetooth" />
                                                      - -

                                                      Tizen IME

                                                      + +

                                                      Tizen IME

                                                      @@ -1246,22 +1246,22 @@
                                                      Note - <tizen:category name="http://tizen.org/category/ime"/> must be defined to activate <tizen:ime>. + <tizen:category name="http://tizen.org/category/ime"/> must be defined to activate <tizen:ime>.
                                                      -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or 1
                                                        -

                                                        Expected children:

                                                        -
                                                          -
                                                        • uuid

                                                          Mandatory; universally unique, an unique identifier that distinguishes an IME from each other, displayed in the form of standard UUID (8-4-4-4-12 for a total of 36 characters)

                                                          • +

                                                          Expected children:

                                                          +
                                                            +
                                                          • uuid

                                                            Mandatory; universally unique, an unique identifier that distinguishes an IME from each other, displayed in the form of standard UUID (8-4-4-4-12 for a total of 36 characters)

                                                          • languages

                                                            Mandatory; list of input languages that the current IME supports

                                                            Note <tizen:language/> elements are provided as the child elements of this element.
                                                            -
                                                            • +

                                                          Example: 

                                                          <tizen:ime>
     <tizen:uuid>6135122a-a428-40d2-8feb-a75f462c202c</tizen:uuid>
@@ -1271,11 +1271,11 @@
     </tizen:languages>
 </tizen:ime>
 
-<tizen:category name="http://tizen.org/category/ime"/>
                                                          +<tizen:category name="http://tizen.org/category/ime"/>
                                                      - + @@ -1283,9 +1283,9 @@
                                                      Used to define the supported input language of the current IME type application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1 or more

                                                        Example: 

                                                        <tizen:languages>
   <tizen:language>en-us</tizen:language>
@@ -1294,8 +1294,8 @@
                                                      - -

                                                      Tizen Metadata

                                                      + +

                                                      Tizen Metadata

                                                      @@ -1303,12 +1303,12 @@
                                                      Used to define metadata information shared with other Web applications. The defined metadata can be accessed (read-only) through the Tizen Application API. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          +

                                                          Attributes:

                                                          +
                                                          • key

                                                            Mandatory; unique key string.

                                                            The maximum length can be limited to 80 bytes. In that case, leftover bytes are ignored.

                                                            @@ -1317,13 +1317,13 @@

                                                            Optional; string.

                                                            The maximum length can be limited to 8192 bytes. In that case, leftover bytes are ignored.

                                                            • -

                                                          Example: 

                                                          <tizen:metadata key="key1"/>
-<tizen:metadata key="key2" value="value/>
                                                          +

                                                        Example: 

                                                        <tizen:metadata key="key1"/>
+<tizen:metadata key="key2" value="value/>
                                                      - -

                                                      Tizen Privilege

                                                      + +

                                                      Tizen Privilege

                                                      @@ -1331,19 +1331,19 @@
                                                      Used to get the required API access privileges for the Web application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • name

                                                          Mandatory; URI of the Device API privilege

                                                          • -

                                                        Example: 

                                                        <tizen:privilege name="http://tizen.org/privilege/application.launch" />
                                                        +

                                                        Attributes:

                                                        +
                                                          +
                                                        • name

                                                          Mandatory; URI of the Device API privilege

                                                          • +

                                                        Example: 

                                                        <tizen:privilege name="http://tizen.org/privilege/application.launch" />
                                                      - -

                                                      Tizen Profile

                                                      + +

                                                      Tizen Profile

                                                      @@ -1351,19 +1351,19 @@
                                                      Used to define the application profile. -

                                                      Occurrences:

                                                      -
                                                        +

                                                        Occurrences:

                                                        +
                                                        • 1
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • name

                                                          Mandatory; string

                                                          • -

                                                        Example: 

                                                        <tizen:profile name="wearable" />
                                                        +

                                                        Attributes:

                                                        +
                                                          +
                                                        • name

                                                          Mandatory; string

                                                          • +

                                                        Example: 

                                                        <tizen:profile name="wearable" />
                                                      - -

                                                      Tizen Settings

                                                      + +

                                                      Tizen Settings

                                                      @@ -1371,20 +1371,20 @@
                                                      Used to define additional application settings. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          - -
                                                        • background-support +

                                                          Attributes:

                                                          +
                                                            + +
                                                          • background-support

                                                            Optional; application execution continues when it is moved to the background (available values: enable (execution continues on the background), disable (default; application is suspended))

                                                            Note Since Tizen 2.4, the system manages background processes more tightly. Even if the background-support attribute is set to enable, the Web application process can be suspended on the background. To guarantee that the application runs on the background, add at least one background category for the application with the <tizen:background-category> element. Only the background categories declared in the system can be used.
                                                            -
                                                            • +
                                                          • context-menu

                                                            Optional; sets whether the context menu is shown (available values: enable (default), disable)

                                                            If this option is enabled, the context menu is visible to the user.

                                                          • encryption

                                                            Optional; sets whether Web Application resources are encrypted (available values: enable, disable (default))

                                                            If this option is enabled, the application resources(HTML, JS and CSS files) are encrypted.

                                                          • screen-orientation

                                                            Optional; sets whether it locks the orientation of the Web Application (available values: portrait (default), landscape, auto-rotation)

                                                            @@ -1394,26 +1394,26 @@
                                                          • install-location

                                                            Optional; application installation location (available values: auto (default), internal-only, prefer-external)

                                                            • auto: the system defines the installation location
                                                              • -
                                                            • internal-only: the application is installed in the device's internal storage
                                                              • +
                                                            • internal-only: the application is installed in the device's internal storage
                                                            • prefer-external: the application is installed in the external storage (if available)
                                                              • -
                                                            +
                                                          • - +
                                                        • hwkey-event

                                                          Optional; a hardware key event is sent to the Web application when the user presses the hardware key (available values: enable (default), disable)

                                                          If this option is enabled, the tizenhwkey custom event is sent to the Web application. The tizenhwkey event object has a keyName attribute (available value: back).

                                                          • - +

                                                        Example: 

                                                        -<tizen:setting background-support="enable" />
-<tizen:setting context-menu="disable" />
-<tizen:setting encryption="enable" />
-<tizen:setting screen-orientation="landscape" />
-<tizen:setting install-location="internal-only" />
-<tizen:setting hwkey-event="enable" />
-
                                                        +<tizen:setting background-support="enable" /> +<tizen:setting context-menu="disable" /> +<tizen:setting encryption="enable" /> +<tizen:setting screen-orientation="landscape" /> +<tizen:setting install-location="internal-only" /> +<tizen:setting hwkey-event="enable" /> +
                                                      -

                                                      Tizen Service

                                                      +

                                                      Tizen Service

                                                      @@ -1422,12 +1422,12 @@
                                                      Used to define Web Service Application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more

                                                        Expected children:

                                                        -
                                                          + -

                                                          Attributes:

                                                          -
                                                            -
                                                          • id

                                                            Mandatory; Tizen service ID, which is a combination of the Tizen wearable package ID and service name.

                                                            The service ID is a set of characters (0~9, a~z, A~Z) and unique in the device. The minimum value is 1 byte and maximum value is 52 bytes.

                                                            • -
                                                          • on-boot

                                                            Optional; sets whether the service application is launched automatically on device booting time (available values: true, false (default))

                                                            • -
                                                          • auto-restart

                                                            Optional; sets whether the service application is relaunched automatically when it is terminated (available values: true, false (default))

                                                            • +

                                                            Attributes:

                                                            +
                                                              +
                                                            • id

                                                              Mandatory; Tizen service ID, which is a combination of the Tizen wearable package ID and service name.

                                                              The service ID is a set of characters (0~9, a~z, A~Z) and unique in the device. The minimum value is 1 byte and maximum value is 52 bytes.

                                                              • +
                                                            • on-boot

                                                              Optional; sets whether the service application is launched automatically on device booting time (available values: true, false (default))

                                                              • +
                                                            • auto-restart

                                                              Optional; sets whether the service application is relaunched automatically when it is terminated (available values: true, false (default))

                                                            -

                                                            Example: 

                                                            <tizen:service id="webService.application" auto-restart="true" on-boot="false">
-   <tizen:content src="service/service.js"/>
-   <tizen:name>WebService</tizen:name>
-   <tizen:icon src="service-icon.png"/>
-   <tizen:description>Web Service Application</tizen:description>
-   <tizen:metadata key="key1" value="value1"/>
-   <tizen:category name="http://tizen.org/category/service"/>
+      
                                                            Example: 
                                                            <tizen:service id="webService.application" auto-restart="true" on-boot="false">
+   <tizen:content src="service/service.js"/>
+   <tizen:name>WebService</tizen:name>
+   <tizen:icon src="service-icon.png"/>
+   <tizen:description>Web Service Application</tizen:description>
+   <tizen:metadata key="key1" value="value1"/>
+   <tizen:category name="http://tizen.org/category/service"/>
 <tizen:service>
                                                      - + @@ -1461,18 +1461,18 @@
                                                      Used to define the start page of the Web Service Application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • src

                                                          Mandatory; start JavaScript file path of the Web Service Application. The path is relative to the source Web application directory.

                                                          • +

                                                          Attributes:

                                                          +
                                                            +
                                                          • src

                                                            Mandatory; start JavaScript file path of the Web Service Application. The path is relative to the source Web application directory.
                                                      - + @@ -1480,18 +1480,18 @@
                                                      Used to define the name of Web Service Application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 1 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 1 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • xml:lang

                                                          Optional; specifies the language of the service name (for available values, see the IANA Language Subtag)

                                                          • +

                                                          Attributes:

                                                          +
                                                      - + @@ -1499,18 +1499,18 @@
                                                      Used to define the icon of Web Service Application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or 1
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • src

                                                          Mandatory; file path of the Web Service Application icon. The path is relative to the source Web application directory.

                                                          • +

                                                          Attributes:

                                                          +
                                                            +
                                                          • src

                                                            Mandatory; file path of the Web Service Application icon. The path is relative to the source Web application directory.
                                                      - + @@ -1518,14 +1518,14 @@
                                                      Used to define the description of the Web Service Application. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or 1
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or 1
                                                      - + @@ -1533,19 +1533,19 @@
                                                      Used to define metadata information shared with other Web Applications. The defined metadata can be accessed (read-only) through the Tizen Application API. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • key

                                                          Mandatory; unique key string

                                                          • -
                                                        • value

                                                          Optional; string

                                                          • +

                                                          Attributes:

                                                          +
                                                            +
                                                          • key

                                                            Mandatory; unique key string

                                                            • +
                                                          • value

                                                            Optional; string
                                                      - + @@ -1553,20 +1553,20 @@
                                                      Used to define the categories that the service application belongs to. -

                                                      Occurrences:

                                                      -
                                                        -
                                                      • 0 or more
                                                        • +

                                                        Occurrences:

                                                        +
                                                          +
                                                        • 0 or more
                                                        -

                                                        Attributes:

                                                        -
                                                          -
                                                        • name

                                                          Mandatory; string

                                                          • +

                                                          Attributes:

                                                          +
                                                            +
                                                          • name

                                                            Mandatory; string
                                                      - - + + diff --git a/org.tizen.studio/html/web_tools/content_assist_w.htm b/org.tizen.studio/html/web_tools/content_assist_w.htm index 2d5cf80..d7a675c 100644 --- a/org.tizen.studio/html/web_tools/content_assist_w.htm +++ b/org.tizen.studio/html/web_tools/content_assist_w.htm @@ -5,22 +5,22 @@ - + - Speeding Up Typing with Content Assist + Speeding Up Typing with Content Assist - +

                                                      Mobile Web Wearable Web

                                                      - +

                                                      Dependencies

                                                        @@ -40,14 +40,14 @@

                                                        Speeding Up Typing with Content Assist

                                                        - +

                                                        Content assist is a function provided in parts of the Tizen Studio to help you write code faster and more efficiently.

                                                        Content assist allows you to quickly type names in the context of the code. It can be further improved to assist the you. For example, you can just type in the first letter as lowercase (uppercase letters from a type or variable name), and press Ctrl + Space to be offered all the choices that match the entered letters that are valid for the current context (class name, interface name, variable, or field names).

                                                        The Tizen Studio supports Web API, W3C API, jQuery API, and jQuery Mobile API. User-defined and third party APIs can be supported by expanding the content assist functionality.

                                                        -

                                                        Figure: Content assist in the JavaScript editor

                                                        +

                                                        Figure: Content assist in the JavaScript editor

                                                        Content assist in the JavaScript editor

                                                        - +

                                                        Using the Content Assist

                                                        To use the content assist in the source editor (JavaScript editor, CSS editor or HTML editor):

                                                          diff --git a/org.tizen.studio/html/web_tools/cover_code_w.htm b/org.tizen.studio/html/web_tools/cover_code_w.htm index da2f85c..a9e0e88 100644 --- a/org.tizen.studio/html/web_tools/cover_code_w.htm +++ b/org.tizen.studio/html/web_tools/cover_code_w.htm @@ -40,16 +40,16 @@
                                                        1. Live Editing (Live Editing of HTML, CSS, and JavaScript)

                                                          The Live Editing tool allows you to apply source changes to the running application immediately (without building, packaging, and relaunching). You can monitor how the changes you have made in a file are rendered in the target window without refreshing the page manually.

                                                          2. - +
                                                        2. Content Assist (Speeding Up Typing with Content Assist) -

                                                          The Content Assist tool is a function provided in parts of the Tizen Studio to help you write code faster and more efficiently. It allows you to quickly type names in the context of the code.

                                                          3. - +

                                                          The Content Assist tool is a function provided in parts of the Tizen Studio to help you write code faster and more efficiently. It allows you to quickly type names in the context of the code.

                                                          +
                                                        3. Code Productivity (Improving Your Code Productivity)

                                                          The Code Productivity tool provides various features for productive development. It includes the Code Beautifier and Code Minifier features that you can use with the Tizen Web Editor. The Code Beautifier can help you understand code and make it easier to read, while the Code Minifier removes or modifies some unnecessary characters from the code.

                                                          4. - +
                                                        4. REST Viewer (Using the REST Viewer)

                                                          The REST Viewer tool allows you to view and edit WADL documents, and use RESTful Web services. The REST Viewer provides facilities to emulate interaction with a Web service by composing and running requests as if it was the application that actually calls the service.

                                                          5. - +
                                                        5. Previewer (Previewing Pages in a Browser)

                                                          The Previewer tools allows you to preview the source code you have developed. In addition, you can visually define the type and hierarchy of the selector to help development.

                                                          6. diff --git a/org.tizen.studio/html/web_tools/cover_debug_w.htm b/org.tizen.studio/html/web_tools/cover_debug_w.htm index 90c0742..3490f37 100644 --- a/org.tizen.studio/html/web_tools/cover_debug_w.htm +++ b/org.tizen.studio/html/web_tools/cover_debug_w.htm @@ -38,13 +38,13 @@
                                                        6. Log View (Checking Logs with Log View)

                                                          The Log view allows you to check the logs of your application based on the logging methods you have inserted to your code. It helps to debug your application by capturing all the events logged by the platform and your application.

                                                          7. - +
                                                        7. Dynamic Analyzer (Monitoring Performance with Dynamic Analyzer) -

                                                          The Dynamic Analyzer tool monitors the performance of your application on a target device or emulator. It analyzes your application for potential performance issues, such as high usage of CPU, memory, file or network operations.

                                                          8. +

                                                          The Dynamic Analyzer tool monitors the performance of your application on a target device or emulator. It analyzes your application for potential performance issues, such as high usage of CPU, memory, file or network operations.

                                                        8. Web Inspector (Debugging with Web Inspector)

                                                          The Web Inspector tool allows you to debug your Web applications. It supports various features, such as viewing the Web page components, inspecting local and downloaded resources and the JavaScript source page, and performing advanced timing and speed analysis.

                                                          9. - +
                                                        9. JavaScript Analyzer (Analyzing JavaScript Problems)

                                                          The JavaScript Analyzer tool makes it easy to find problems in JavaScript code. It supports 2 analyzer types: a static analyzer to check the coding rules and a dynamic analyzer to check stale objects.

                                                      diff --git a/org.tizen.studio/html/web_tools/cover_project_mgmt_w.htm b/org.tizen.studio/html/web_tools/cover_project_mgmt_w.htm index 6cc3c3a..2f5dc32 100644 --- a/org.tizen.studio/html/web_tools/cover_project_mgmt_w.htm +++ b/org.tizen.studio/html/web_tools/cover_project_mgmt_w.htm @@ -37,10 +37,10 @@
                                                      • Project Creation Wizard (Creating Tizen Projects with Tizen Project Wizard)

                                                        The Project Wizard tool is used to create an application project. You can select from various project templates and samples that make it easier for you to start coding your application. When you create a new project with a specific template, the Project Wizard uses it to automatically create basic functionalities and default project files and folders for the application.

                                                        • - +
                                                      • Project Explorer View (Managing Tizen Projects with Project Explorer View)

                                                        The Project Explorer view shows a hierarchical view of all project resources in the workspace. It allows you to manage Tizen projects, change the project resources, and build, export, and convert projects.

                                                        • - +
                                                      • Certificate Registration (Working with the Certificate Profile)

                                                        The Certificate Manager tool is used to create a certificate profile and register author and distributor certificates. Before installing your application on a device or submitting it to the Tizen Store, you must sign it with a certificate profile while packaging your application.

                                                      diff --git a/org.tizen.studio/html/web_tools/cover_run_test_w.htm b/org.tizen.studio/html/web_tools/cover_run_test_w.htm index ce8a1cb..4e23a2c 100644 --- a/org.tizen.studio/html/web_tools/cover_run_test_w.htm +++ b/org.tizen.studio/html/web_tools/cover_run_test_w.htm @@ -37,13 +37,13 @@
                                                      • Connection Explorer View (Managing and Connecting Devices for Testing)

                                                        The Connection Explorer view shows the devices connected to the system, and allows you to manage multiple emulator instances. You can explore the file systems of the connected devices and perform file operations.

                                                        • - +
                                                      • SDB (Connecting Devices over Smart Development Bridge)

                                                        The SDB tool uses a command line to communicate with an emulator instance or a connected target device. You can send commands to a specific device to advance application development, such as file transfer, remote shell command, port forwarding for a debugger, viewing, filtering, and controlling target log output.

                                                        • - +
                                                      • Emulator (Running Applications on the Emulator)

                                                        The Tizen emulator tool reduces the inconvenience of testing the application in a real device, by providing an environment similar to a real device. With the Emulator Manager, you can create multiple emulator instances, each representing a different environment (device type).

                                                        • - +
                                                      • Web Unit Testing Tool (Unit Testing Web Applications)

                                                        The unit test tool is used to ensure that the application runs properly as intended in the source code. You can create, edit, and run unit tests, and check and analyze the test results.

                                                      diff --git a/org.tizen.studio/html/web_tools/cover_web_w.htm b/org.tizen.studio/html/web_tools/cover_web_w.htm index 1b1e4ca..4a8ed1d 100644 --- a/org.tizen.studio/html/web_tools/cover_web_w.htm +++ b/org.tizen.studio/html/web_tools/cover_web_w.htm @@ -43,16 +43,16 @@
                                                    • Writing and Editing Codes

                                                      You can edit HTML, JS, and CSS files in specific editors, and preview how the changing code affects the application screen. You can also use the live editing feature to modify the application while it is running.

                                                      You can use the content assist, privilege checker, and code productivity tools to speed up the code writing and verification task. With the REST Viewer tool, you can emulate interaction with a Web service. In addition, you can modify various Tizen Studio preferences to ensure that the code editing environment suits your needs.

                                                      • - +
                                                    • Configuring Your Application

                                                      You can manage various application functionalities and features through the application configuration file, which you can easily configure with a test or form editor. In addition, you can localize your application to use various languages and locale-specific resources by using the Web Localization view in the Tizen Studio.

                                                      • - +
                                                    • Debugging Your Application -

                                                      You can debug, profile, and optimize your application with various tools, such as the Dynamic Analyzer, Web Inspector, and JavaScript Analyzer. The Tizen Studio provides various views designed to help you identify and fix runtime errors, such as the Log view.

                                                      • - +

                                                      You can debug, profile, and optimize your application with various tools, such as the Dynamic Analyzer, Web Inspector, and JavaScript Analyzer. The Tizen Studio provides various views designed to help you identify and fix runtime errors, such as the Log view.

                                                      +
                                                    • Running and Testing Your Application

                                                      You can run and test your application using the Tizen emulator. In addition, you can use the Connection Explorer view to manage connections to the emulator and various other target devices. The Smart Development Bridge (SDB) tool allows you to communicate with a connected target device, and the unit test tool allows you to create test projects to verify the reliability of your code.

                                                      • - +
                                                    • Using the Web Simulator

                                                      You can run your Web application in a Google Chrome™-based simulator, which provides many settings and features for debugging your application. You can test how the application behaves, and even send in events and messages.

                                                    diff --git a/org.tizen.studio/html/web_tools/js_analyzer_w.htm b/org.tizen.studio/html/web_tools/js_analyzer_w.htm index d67398a..4171d32 100644 --- a/org.tizen.studio/html/web_tools/js_analyzer_w.htm +++ b/org.tizen.studio/html/web_tools/js_analyzer_w.htm @@ -44,8 +44,8 @@

                                                    JSA supports 2 analyzer types:

                                                    • Static Analyzer (Coding Rule Checker) -

                                                      Contains checkers for a set of predefined coding rules. It supports 27 rules, including coding rules and Web API usage rules.

                                                      -

                                                      The Coding Rule Checker is a static analysis tool that evaluates an application by examining the JavaScript code without its execution. This type of checkers examine all possible execution paths and variable values, and then provide its their analysis result.

                                                      +

                                                      Contains checkers for a set of predefined coding rules. It supports 27 rules, including coding rules and Web API usage rules.

                                                      +

                                                      The Coding Rule Checker is a static analysis tool that evaluates an application by examining the JavaScript code without its execution. This type of checkers examine all possible execution paths and variable values, and then provide its their analysis result.

                                                    • Dynamic Analyzer (Stale Object Checker)

                                                      Contains a checker for stale objects that cause possible memory leaks.

                                                      @@ -95,25 +95,25 @@

                                                      For example, if the functions that have a same name are defined as following example codes, the foo function is changed whenever the func1 or func2 function is called. The foo function can not be guaranteed.

                                                      -

                                                      This rule is supported by the JSLint and the Google Closure Linter. They say that "When you fail to specify var, the variable gets placed in the global context, potentially clobbering existing values. Also, if there is no declaration, it is hard to tell in what scope a variable lives."

                                                      +

                                                      This rule is supported by the JSLint and the Google Closure Linter. They say that "When you fail to specify var, the variable gets placed in the global context, potentially clobbering existing values. Also, if there is no declaration, it is hard to tell in what scope a variable lives."

                                                      function func1() {
-   /* The foo function is defined without the var keyword */
-   foo = function() {
-      alert('func1');
-   };
+   /* The foo function is defined without the var keyword */
+   foo = function() {
+      alert('func1');
+   };
 
-   /* When the foo function is called, the foo function is not clear */
-   foo();
+   /* When the foo function is called, the foo function is not clear */
+   foo();
 }
 function func2() {
-   /* The other foo function is defined without var keyword */
-   foo = function() {
-      alert('func2');
-   };
+   /* The other foo function is defined without var keyword */
+   foo = function() {
+      alert('func2');
+   };
 
-   /* When the foo function is called, the foo function is not clear */
-   foo();
+   /* When the foo function is called, the foo function is not clear */
+   foo();
 }

                                                      The JSA displays the following message:

                                                      @@ -127,8 +127,8 @@ function func2() {

                                                      In the following example, the statement var arguments = []; in the function overwrites the reserved keyword arguments. As a result, the reserved keyword arguments in functions lose the feature to access the arguments of the function.

                                                      function func() {
-   /* 'arguments' has been predefined as a reserved keyword */
-   var arguments = [];
+   /* 'arguments' has been predefined as a reserved keyword */
+   var arguments = [];
 }

                                                      The JSA displays the following message:

                                                      @@ -141,17 +141,17 @@ function func2() {

                                                      In the following example, you always expect 1 to be returned from calling the test function. However, the returned value is not always 1 because the variable x in the function outer is captured.

                                                      -

                                                      This rule is introduced in the Google JavaScript Style Guide. They say that "The ability to create closures is perhaps the most useful and often overlooked feature of JS.One thing to keep in mind, however, is that a closure keeps a pointer to its enclosing scope. As a result, attaching a closure to a DOM element can create a circular reference and thus, a memory leak.".

                                                      +

                                                      This rule is introduced in the Google JavaScript Style Guide. They say that "The ability to create closures is perhaps the most useful and often overlooked feature of JS.One thing to keep in mind, however, is that a closure keeps a pointer to its enclosing scope. As a result, attaching a closure to a DOM element can create a circular reference and thus, a memory leak.".

                                                      var outer = function() {
-   /* Warning case, be careful */
-   var x = 0;
+   /* Warning case, be careful */
+   var x = 0;
 
-   return function() {
-      /* Variable x of the outer function is captured in the inner function */
+   return function() {
+      /* Variable x of the outer function is captured in the inner function */
 
-      return ++x;
-   }
+      return ++x;
+   }
 }
 var x = -1;
 
@@ -177,16 +177,16 @@ test();

                                                      Extra semicolons make readability worse. In addition, it may cause wrong operation of the program.

                                                      -

                                                      This rule is described in the Google JavaScript Coding Style Guide. They say that "Extra comma and semicolon can make error.".

                                                      +

                                                      This rule is described in the Google JavaScript Coding Style Guide. They say that "Extra comma and semicolon can make error.".

                                                      function func() {
-   for (var i = 0; i < 10; i++) {
-      /* Extra semicolon */
-      x++;;
-      /* Extra semicolon after the 'for' statement */
-   };
+   for (var i = 0; i < 10; i++) {
+      /* Extra semicolon */
+      x++;;
+      /* Extra semicolon after the 'for' statement */
+   };
 
-   return x;
+   return x;
 /* Extra semicolon after the function definition statement */
 };
 var result = func();
                                                      @@ -197,14 +197,14 @@ var result = func();

                                                      Rule 5. Do Not Use the Delete Keyword

                                                      -

                                                      Deleting the property of the object needs time to operate removing the property. In addition, it changes the shape of object. The change of the object's shape may cause decrease of performance.

                                                      +

                                                      Deleting the property of the object needs time to operate removing the property. In addition, it changes the shape of object. The change of the object's shape may cause decrease of performance.

                                                      In the following example, the property value of the instance obj is deleted using the keyword delete. This leads the instance obj not to share the shape of the constructor Obj with other instances. For that reason, the performance can be slower.

                                                      -

                                                      This rule is introduced by the Google JavaScript Style Guide. They say that "In modern JavaScript engines, changing the number of properties on an object is much slower than reassigning the values. The delete keyword should be avoided except when it is necessary to remove a property from an object's iterated list of keys, or to change the result of if (key in obj)."

                                                      +

                                                      This rule is introduced by the Google JavaScript Style Guide. They say that "In modern JavaScript engines, changing the number of properties on an object is much slower than reassigning the values. The delete keyword should be avoided except when it is necessary to remove a property from an object's iterated list of keys, or to change the result of if (key in obj)."

                                                      function Obj() {
-   this.value = 10;
+   this.value = 10;
 };
 var obj = new Obj();
 
@@ -219,11 +219,11 @@ delete obj.value;

                                                      Using multi-line string literals can cause unexpected operation of the program because of the whitespace at the beginning of each line and after the backslash (\).

                                                      -

                                                      This rule is introduced by the Google JavaScript Style Guide. They say that "The whitespace at the beginning of each line can't be safely stripped at compile time; whitespace after the slash will result in tricky errors; and while most script engines support this, it is not part of ECMAScript".

                                                      +

                                                      This rule is introduced by the Google JavaScript Style Guide. They say that "The whitespace at the beginning of each line can't be safely stripped at compile time; whitespace after the slash will result in tricky errors; and while most script engines support this, it is not part of ECMAScript".

                                                      /* Multi-line string literals can create a problem */
-var str = 'The Test String \
-   for Positive TC';
                                                      +var str = 'The Test String \ + for Positive TC';

                                                      The JSA displays the following message:

                                                      @@ -235,7 +235,7 @@ var str = 'The Test String \

                                                      In the following example, the array arr2 that has 3 values (1, 2, and 3) can be created using an array constructor. In the same way, if the array arr1 that has a single value (1) is created using an array constructor, it is the array with the length 1, not arr[0] is 1.

                                                      -

                                                      This rule is introduced by the Google Javascript Style Guide. They say that "Array constructors are error-prone due to their arguments".

                                                      +

                                                      This rule is introduced by the Google Javascript Style Guide. They say that "Array constructors are error-prone due to their arguments".

                                                      var x = 1
 
@@ -255,11 +255,11 @@ var arr2 = new Array(1, 2, 3);

                                                      For example, the functions in prototypes of built-in objects are shared by every instance of the built-in objects. If the function is modified, it affects every instances of the built-in objects.

                                                      -

                                                      This rule is introduced by the Google Javascript Style Guide. They say that "Modifying builtins like Object.prototype and Array.prototype are strictly forbidden. It leads to hard to debug issues in production and should be avoided."

                                                      +

                                                      This rule is introduced by the Google Javascript Style Guide. They say that "Modifying builtins like Object.prototype and Array.prototype are strictly forbidden. It leads to hard to debug issues in production and should be avoided."

                                                      /* Modifying the function in prototype of built-in object makes debugging difficult */
 Object.prototype.create = function() {
-   alert('Warning!');
+   alert('Warning!');
 };

                                                      The JSA displays the following message:

                                                      @@ -272,17 +272,17 @@ Object.prototype.create = function() {

                                                      If a boolean variable is created by the constructor Boolean, its value is a wrapper object, not true or false. In the following example, the program always prints true because the variable bool is a object that has a value, false.

                                                      -

                                                      This rule is introduced by the Google Javascript Style Guide. They say that "There's no reason to use wrapper objects for primitive types, plus they are dangerous".

                                                      +

                                                      This rule is introduced by the Google Javascript Style Guide. They say that "There's no reason to use wrapper objects for primitive types, plus they are dangerous". 

                                                      /* The variable bool is not false. It is an object with the value false */
 var bool = new Boolean(false);
 
 /* bool is always true */
 if (bool) {
-   alert('true');
+   alert('true');
 }
 else {
-   alert('false');
+   alert('false');
 }

                                                      The JSA displays the following message:

                                                      @@ -295,13 +295,13 @@ else {

                                                      In the following example, you expect to print a, b, and c, but the program prints 0, 1, and 2.

                                                      -

                                                      This rule is introduced both by the JSLint and the Google Javascript Style Guide. They say that "for-in loops are often incorrectly used to loop over the elements in an Array. This is however very error prone because it does not loop from 0 to length - 1 but over all the present keys in the object and its prototype chain."

                                                      +

                                                      This rule is introduced both by the JSLint and the Google Javascript Style Guide. They say that "for-in loops are often incorrectly used to loop over the elements in an Array. This is however very error prone because it does not loop from 0 to length - 1 but over all the present keys in the object and its prototype chain."

                                                      -
                                                      var arr = ['a', 'b', 'c'];
+
                                                      var arr = ['a', 'b', 'c'];
 
-/* The variable key is not 'a', 'b', and 'c'. It is 0, 1, and 2 */
+/* The variable key is not 'a', 'b', and 'c'. It is 0, 1, and 2 */
 for (var key in arr) {
-   alert(key);
+   alert(key);
 }
                                                      
 
 
                                                      The JSA displays the following message:
                                                      
@@ -316,7 +316,7 @@ for (var key in arr) {
 
                                                       /* The temp function needs the closing brace */
 function temp() {
-   var a = 'ddd';
                                                      
+   var a = 'ddd';

                                                      The JSA displays the following message:

                                                      [Syntax Error]Missing closing brace } character.
                                                      @@ -332,12 +332,12 @@ function temp() { var a = 10; var b = 5; for (var i = 0; i < b; i++) { -   a += i; -   /* init i; + a += i; + /* init i; }

                                                      The JSA displays the following message:

                                                      -
                                                      [Syntax Error]Missing closing comment "*/".
                                                      +
                                                      [Syntax Error]Missing closing comment "*/".

                                                      Rule 13. Do Not Use Unclosed Strings

                                                      @@ -349,11 +349,11 @@ for (var i = 0; i < b; i++) { /* Setting value for MAX is not correct, missing single quote */ var MAX = 20; for (var i = 0; i < 10; i++) { -   MAX = 'tt; + MAX = 'tt; }

                                                      The JSA displays the following message:

                                                      -
                                                      [Syntax Error]Missing closing single-quote ' character.
                                                      +
                                                      [Syntax Error]Missing closing single-quote ' character.

                                                      Rule 14. Do Not Omit Semicolons

                                                      @@ -364,7 +364,7 @@ for (var i = 0; i < 10; i++) { 
                                                       /* The declaration of a needed semicolon in the end */
 function tempx() {
-   var a = 'ddd'
+   var a = 'ddd'
 }

                                                      The JSA displays the following message:

                                                      @@ -380,7 +380,7 @@ function tempx() { var variable_sum = 1; var b = 2; var abc -   = 10 + variable_sum + b; + = 10 + variable_sum + b;

                                                      The JSA displays the following message:

                                                      @@ -390,11 +390,11 @@ var abc

                                                      Invoking a code block with double-quotes instead of single-quotes for a string is noticed, although the analysis proceeds without stopping.

                                                      -

                                                      In the following example, "aa" must be 'aa'. The JSA detects it and creates an alarm.

                                                      +

                                                      In the following example, "aa" must be 'aa'. The JSA detects it and creates an alarm.

                                                       if (true) {
-   var a = "aa";
+   var a = "aa";
 }

                                                      The JSA displays the following message:

                                                      @@ -404,7 +404,7 @@ if (true) {

                                                      Invoking a code block with an extra comma at the end of object/array literals is noticed, although the analysis proceeds without stopping.

                                                      -

                                                      In the following example, the last ',' must be removed. The JSA detects it and creates an alarm.

                                                      +

                                                      In the following example, the last ',' must be removed. The JSA detects it and creates an alarm.

                                                       var abc = [1, 2, 3,];
                                                      @@ -414,20 +414,20 @@ var abc = [1, 2, 3,];

                                                      Rule 18. Do Not Use Wrong Opening Brace

                                                      -

                                                      Invoking a code block with an opening brace '{' which does not appear in the same line with the statement is noticed, although the analysis proceeds without stopping.

                                                      +

                                                      Invoking a code block with an opening brace '{' which does not appear in the same line with the statement is noticed, although the analysis proceeds without stopping.

                                                      -

                                                      In the following example, the opening brace '{' must appear in the same line with the statement. If not, the JSA detects it and creates an alarm.

                                                      +

                                                      In the following example, the opening brace '{' must appear in the same line with the statement. If not, the JSA detects it and creates an alarm. 

                                                       /* Do Not Use Wrong Opening Brace */
-if (true) 
+if (true)
 {
-   var test = 'test';
+   var test = 'test';
 }

                                                      The JSA displays the following message:

                                                      -
                                                      [CodingRule] Opening brace '{' character should appear in the same line with the statement.
                                                      +
                                                      [CodingRule] Opening brace '{' character should appear in the same line with the statement.

                                                      Web API Usage Rules

                                                      @@ -446,7 +446,7 @@ var alarm = tizen.alarm.gett(abs_alarm.id);

                                                      The JSA displays the following message:

                                                      [Web API Rule] Name gett is not found in the API AlarmManager.
-[Web API Rule] Reading absent property 'gett' of object 'tizen.alarm'.
                                                      +[Web API Rule] Reading absent property 'gett' of object 'tizen.alarm'.

                                                      Rule 2. Wrong Argument Number

                                                      @@ -455,8 +455,8 @@ var alarm = tizen.alarm.gett(abs_alarm.id);

                                                      In the following example, the tizen.filesystem.resolve() function needs more than 1 argument. Since the number of arguments is 1, the JSA detects it and creates an alarm.

                                                      /* The number of arguments is wrong (2 or more arguments required) */
-tizen.filesystem.resolve('images'
-                         /* Missing error callback arguments */);
                                                      +tizen.filesystem.resolve('images' + /* Missing error callback arguments */);

                                                      The JSA displays the following message:

                                                      @@ -468,11 +468,11 @@ tizen.filesystem.resolve('images'

                                                      In the following example, the tizen.filesystem.resolve() function needs an error callback as its third argument. Because the error callback does not exist, the JSA detects it and creates an alarm.

                                                      -
                                                      tizen.filesystem.resolve('images',
-                         function(dir) {
-                            console.log("Mount point Name is " +  dir.path);
-                         }
-                         /* Error callback required as the third argument */
+
                                                      tizen.filesystem.resolve('images',
+                         function(dir) {
+                            console.log("Mount point Name is " +  dir.path);
+                         }
+                         /* Error callback required as the third argument */
 );
                                                      
 
 
                                                      The JSA displays the following message:
                                                      
@@ -486,7 +486,7 @@ tizen.filesystem.resolve('images'
 
                                                      In the following example, the tizen.calendar.getCalendars() is a function that can throw exceptions, so it must be wrapped by a try-catch statement. Because the try-catch statement does not exist, the JSA detects it and creates an alarm.
                                                      
 
 
                                                      /* tizen.calendar.getCalendars API can make exceptions, so it should be wrapped in a try-catch statement */
-tizen.calendar.getCalendars('EVENT', calendarListCallback, errorCallback);
                                                      
+tizen.calendar.getCalendars('EVENT', calendarListCallback, errorCallback);

                                                      The JSA displays the following message:

                                                      @@ -498,13 +498,13 @@ tizen.calendar.getCalendars('EVENT', calendarListCallback, errorCallback

                                                      In the following example, the tizen.contact.getAddressBooks() function needs arguments whose type is the function instead of the string and the undefined, so the JSA detects it and makes an alarm.

                                                      -
                                                      var addressBooksCB = 'notFucntion';
+
                                                      var addressBooksCB = 'notFucntion';
 try {
-   /* The arguments of tizen.contact.getAddressBooks API must be function types instead of strings and undefined */
-   tizen.contact.getAddressBooks(addressBooksCB, undefined);
+   /* The arguments of tizen.contact.getAddressBooks API must be function types instead of strings and undefined */
+   tizen.contact.getAddressBooks(addressBooksCB, undefined);
 }
 catch (e) {
-   /* Error handling */
+   /* Error handling */
 }
                                                      
 
 
                                                      The JSA displays the following message:
                                                      
@@ -519,19 +519,19 @@ catch (e) {
 
                                                      In the following example, the constructor tizen.Contact() function needs a dictionary object as the first argument. If the keys of the dictionary object are different from the spec, the JSA detects it and creates an alarm.
                                                      
 
 
                                                      var validContactObj = new tizen.Contact({
-   name: new tizen.ContactName({
-      firstName: 'Jeffrey',
-      lastName: 'Hyman',
-      nicknames: ['joey ramone']
-   }),
-   emails: [new tizen.ContactEmailAddress('user@domain.com')],
-   phoneNumbers: [new tizen.ContactPhoneNumber('666666666')]
+   name: new tizen.ContactName({
+      firstName: 'Jeffrey',
+      lastName: 'Hyman',
+      nicknames: ['joey ramone']
+   }),
+   emails: [new tizen.ContactEmailAddress('user@domain.com')],
+   phoneNumbers: [new tizen.ContactPhoneNumber('666666666')]
 });
 
 var invalidContactObj = new tizen.Contact(
 {
-   /* The first argument, whose type is dictionary, of tizen.Contact API does not have the property 'foo' */
-   foo: 'I'm not an member of Contact'
                                                      
+   /* The first argument, whose type is dictionary, of tizen.Contact API does not have the property 'foo' */
+   foo: 'I'm not an member of Contact'

                                                      The JSA displays the following message:

                                                      @@ -548,16 +548,16 @@ function onsuccess() { /* ... */ } function onerror() { /* ... */ } try { -   /* Source code in Web App for Tizen 2.3 wearable platform, but 'open()' is defined in mobile-2.3 */ -   tizen.archive.open('downloads/some_archive.zip', 'r', onsuccess, onerror); + /* Source code in Web App for Tizen 2.3 wearable platform, but 'open()' is defined in mobile-2.3 */ + tizen.archive.open('downloads/some_archive.zip', 'r', onsuccess, onerror); } catch (e) { -   /* ... */ + /* ... */ }

                                                      The JSA displays the following message:

                                                      -
                                                      [Web API Rule] Tizen Wearable-2.3 API not support "open" API. It is defined in Tizen mobile-2.3.
                                                      +
                                                      [Web API Rule] Tizen Wearable-2.3 API not support "open" API. It is defined in Tizen mobile-2.3.

                                                      Rule 8. API Privilege Missing

                                                      @@ -570,15 +570,15 @@ try { 
                                                       /* JavaScript File */
 function onsuccess() { /* ... */ }
-tizen.application.launch('targetApp0.main', onsuccess);
+tizen.application.launch('targetApp0.main', onsuccess);
 
 /* config.xml file (privilege commented) */
-<!--tizen:privilege name="http://tizen.org/privilege/application.launch"/-->
+<!--tizen:privilege name="http://tizen.org/privilege/application.launch"/-->

                                                      The JSA displays the following message:

                                                      -
                                                      [Web API Rule] Tizen tizen.application.launch API need "http://tizen.org/privilege/application.launch" privilege in 'config.xml'.
                                                      +
                                                      [Web API Rule] Tizen tizen.application.launch API need "http://tizen.org/privilege/application.launch" privilege in 'config.xml'.

                                                      Using the Stale Object Checker

                                                      @@ -626,8 +626,8 @@ tizen.application.launch('targetApp0.main', onsuccess);
                                                      • The anonymous event handler function at the line 10 is identified as a stale object that can cause a memory leak.
                                                      • In the call tree view, a call hierarchy is shown for the function which contains the code that creates stale objects. The name of a node in the call tree view indicates the file name, line number, and column number. -

                                                        The "js/main_orig_.js:10:45" root element indicates that the memory leak occurs at line 10, column 45 in the js/main_orig_.js file.

                                                        -

                                                        Click the root element to move the source view to the location. Click the "js/main_orig_.js:27:5" child node to move the source view to line 27 where the function that contains the memory leak issue is called, and to highlight the function.

                                                        • +

                                                        The "js/main_orig_.js:10:45" root element indicates that the memory leak occurs at line 10, column 45 in the js/main_orig_.js file.

                                                        +

                                                        Click the root element to move the source view to the location. Click the "js/main_orig_.js:27:5" child node to move the source view to line 27 where the function that contains the memory leak issue is called, and to highlight the function.

                                                      • In the timeline view, the x axis represents the time elapse and the y axis represents the number of created objects from this site. Move the mouse to a specific time to show the number of stale and allocated instances on the graph.
                                                      • In the access paths view, you can find out the scope of an object at runtime which leads to the location of the memory leak.
                                                      @@ -642,29 +642,29 @@ tizen.application.launch('targetApp0.main', onsuccess);

                                                      Timer Sample Code

                                                      When you click start, the Timer starts to run. If you click again, the timer stops. The exitApp() function registers an event handler for the Tizen Back key to terminate the application when the Back key is pressed.

                                                      - +

                                                      In the runtime() function, the exitApp() function is added by mistake. As a result, every time you click start, the exitApp() function is called, creates an anonymous function, and registers it to listen to the Back key events. When you test this application with the Stale Object Checker, multiple start button clicks are shown as a memory leak.

                                                       /* JavaScript snippets */
 function exitApp() {
-   document.addEventListener('tizenhwkey', function(e) {
-      if (e.keyName == 'back') {
-         try {
-            tizen.application.getCurrentApplication().exit();
-         } catch (error) {
-            console.error('getCurrentApplication(): ' + error.message);
-         }
-      }
-   });
+   document.addEventListener('tizenhwkey', function(e) {
+      if (e.keyName == 'back') {
+         try {
+            tizen.application.getCurrentApplication().exit();
+         } catch (error) {
+            console.error('getCurrentApplication(): ' + error.message);
+         }
+      }
+   });
 }
 
 function runtime() {
-   exitApp(); /* Add the function call for memory leak */
+   exitApp(); /* Add the function call for memory leak */
 }
                                                      -

                                                      When testing the source code, the following figure shows the result. It indicates that a memory leak occurred at the "js/main_orig_.js:39:42" site. Clicking this site, the detailed information is retrieved.

                                                      +

                                                      When testing the source code, the following figure shows the result. It indicates that a memory leak occurred at the "js/main_orig_.js:39:42" site. Clicking this site, the detailed information is retrieved.

                                                      Figure: Timer example issue table

                                                      @@ -673,11 +673,11 @@ function runtime() {

                                                      Figure: Timer example detailed information

                                                      Timer example detailed information

                                                      -

                                                      The detailed information shows that function object added to listen for "tizenhwkey" events caused a memory leak. If you click the "Call Tree" on the page, you can see that the exitApp() function with a memory leak issue is called in the runtime() function.

                                                      +

                                                      The detailed information shows that function object added to listen for "tizenhwkey" events caused a memory leak. If you click the "Call Tree" on the page, you can see that the exitApp() function with a memory leak issue is called in the runtime() function.

                                                      This code site is detected as a leak because the handler function objects created from the site have not been used before the application exits. The call tree says that when the runtime() function is executed, the exitApp() function is invoked, every time creates an anonymous function and registers it to a document object.

                                                      -

                                                      In the "Timeline" graph, you can see how the number of stale instances increases steadily. This graph shows any objects created from this code site that have not been used before the application exists.

                                                      +

                                                      In the "Timeline" graph, you can see how the number of stale instances increases steadily. This graph shows any objects created from this code site that have not been used before the application exists.

                                                      Calculator Sample Code

                                                      @@ -689,20 +689,20 @@ function runtime() { 
                                                       /* JavaScript snippets */
-var init = function() { 
-   document.addEventListener('tizenhwkey', function(e) {
-      if (e.keyName == 'back') {
-         try {
-            tizen.application.getCurrentApplication().exit();
-         } catch (error) {
-            console.error('getCurrentApplication(): ' + error.message);
-         }
-      }
-   });
+var init = function() {
+   document.addEventListener('tizenhwkey', function(e) {
+      if (e.keyName == 'back') {
+         try {
+            tizen.application.getCurrentApplication().exit();
+         } catch (error) {
+            console.error('getCurrentApplication(): ' + error.message);
+         }
+      }
+   });
 }
 
 function command(num) {
-   init(); /* Add the function call for memory leak */  
+   init(); /* Add the function call for memory leak */
 }
                                                      @@ -729,4 +729,4 @@ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga - \ No newline at end of file + diff --git a/org.tizen.studio/html/web_tools/live_editing_w.htm b/org.tizen.studio/html/web_tools/live_editing_w.htm index c54350f..5ab6a8d 100644 --- a/org.tizen.studio/html/web_tools/live_editing_w.htm +++ b/org.tizen.studio/html/web_tools/live_editing_w.htm @@ -5,22 +5,22 @@ - + - Live Editing of HTML, CSS, and JavaScript + Live Editing of HTML, CSS, and JavaScript - +

                                                      Mobile Web Wearable Web

                                                      - +

                                                      Dependencies

                                                        @@ -33,7 +33,7 @@

                                                      Related Info

                                                      @@ -46,7 +46,7 @@

                                                      You can monitor how the changes you have made in a file are rendered in the target window without refreshing the page manually.

                                                      About Live Editing

                                                      - +

                                                      Live editing is a special feature, which applies source changes to the running application immediately without building, packaging, and relaunching the application. All changes made in the HTML, CSS, and JavaScript files are automatically and immediately reflected in the running application.

                                                      This feature can be used in the Previewer view and when running the application in the emulator or the Web simulator.

                                                      @@ -61,7 +61,7 @@
                                                    • Select the Enable live editing check box in the run configuration.

                                                      • If you are running your application for the first time, you must create a new configuration first.

                                                      - +
                                                      Note The live editing feature has the following limitations: diff --git a/org.tizen.studio/html/web_tools/previewer_w.htm b/org.tizen.studio/html/web_tools/previewer_w.htm index e817fff..bf17cc5 100644 --- a/org.tizen.studio/html/web_tools/previewer_w.htm +++ b/org.tizen.studio/html/web_tools/previewer_w.htm @@ -5,22 +5,22 @@ - + - Previewing Pages in a Browser + Previewing Pages in a Browser - +

                                                      Mobile Web Wearable Web

                                                      - +

                                                      Dependencies

                                                        @@ -33,7 +33,7 @@

                                                      Related Info

                                                      @@ -46,7 +46,7 @@

                                                      Not only can you preview the source code you have developed, you can also visually define the type and hierarchy of the selector to help development.

                                                      About the Previewer

                                                      - +

                                                      The Tizen Studio provides the previewer window for instantly previewing the entire look and feel of the application.

                                                      The previewer for HTML and CSS is a tool that can check the content of a file on the browser. All the changes made in the HTML and CSS file editor are automatically reflected in the previewer.

                                                      @@ -55,8 +55,8 @@
                                                    • The Device API cannot be run in the emulator.
                                                    • Some network environments do not support live editing.
                                                    - - + +

                                                    Using the HTML and CSS Previewer

                                                    To use the HTML and CSS previewer:

                                                    @@ -65,7 +65,7 @@
                                                  • In the context menu, select Preview (or use the hotkey Ctrl + 4).
                                                    • -

                                                    Figure: HTML previewer (calendar application in mobile Web) and CSS previewer

                                                    +

                                                    Figure: HTML previewer (calendar application in mobile Web) and CSS previewer

                                                    HTML previewer (calendar application in mobile Web) and CSS previewer HTML previewer (calendar application in mobile Web) and CSS previewer

                                                    You can configure the previewer to suit your own preferences.

                                                    diff --git a/org.tizen.studio/html/web_tools/privilege_checker_w.htm b/org.tizen.studio/html/web_tools/privilege_checker_w.htm index b0befe7..d403762 100644 --- a/org.tizen.studio/html/web_tools/privilege_checker_w.htm +++ b/org.tizen.studio/html/web_tools/privilege_checker_w.htm @@ -5,22 +5,22 @@ - + - Verifying Privilege Usage + Verifying Privilege Usage - +

                                                    Mobile Web Wearable Web

                                                    - +

                                                    Dependencies

                                                      @@ -36,10 +36,10 @@

                                                      Verifying Privilege Usage

                                                      - +

                                                      The Tizen Studio provides a checker to identify potential privilege violation problems in the application code. This check is performed automatically, and you can easily verify the source code in your project.

                                                      - +

                                                      Using the Privilege Checker

                                                      The Privilege Checker is enabled by default. It is automatically performed during the build process or code editing.

                                                      To perform the check manually:

                                                      @@ -48,7 +48,7 @@
                                                    • Right-click the project folder, and select Check Privilege.
                                                      • -

                                                      Figure: Privilege Checker

                                                      +

                                                      Figure: Privilege Checker

                                                      Privilege Checker

                                                      Setting the Options

                                                      @@ -66,13 +66,13 @@
                                                    • Error (default)

                                                    You can exclude JS files from parsing by specifying pattern strings, separated by a comma, in the Exclude files that match these patterns from validation field. The default value in this field is min, jquery, jqm-docs, phonegap, sencha, tizen-web-ui-fw, dowhide, globalize, coderdeck, modernizr, tau. For instance, since parsing the jquery.min.js file generates many warnings, the default pattern string values exclude the parsing of this JS file.

                                                    - +

                                                    The check results are displayed in the Problems view and vertical ruler. To resolve an alarm, click the annotation on the vertical ruler and select an entry from the proposal list. The required privilege is automatically added into the config.xml file (for a quick fix, use the Ctrl + 1 keyboard shortcut).

                                                    - -

                                                    Figure: Check results displayed in the Problems view

                                                    + +

                                                    Figure: Check results displayed in the Problems view

                                                    Check results displayed in the Problems view

                                                    -

                                                    Figure: Required privilege is automatically added

                                                    -

                                                    Required privilege is automatically added

                                                    +

                                                    Figure: Required privilege is automatically added

                                                    +

                                                    Required privilege is automatically added

                                                    Table: Privilege check alarm example

                                                    diff --git a/org.tizen.studio/html/web_tools/project_explorer_view_w.htm b/org.tizen.studio/html/web_tools/project_explorer_view_w.htm index 336dcc2..cd190bc 100644 --- a/org.tizen.studio/html/web_tools/project_explorer_view_w.htm +++ b/org.tizen.studio/html/web_tools/project_explorer_view_w.htm @@ -5,7 +5,7 @@ - + @@ -15,12 +15,12 @@ - + @@ -38,11 +38,11 @@

                                                    Managing Tizen Projects with Project Explorer View

                                                    The Project Explorer view allows you to view and manage Tizen projects. You can view and change the resources of a project in the view, and build, export, and convert projects through the view.

                                                    -

                                                    Figure: Project Explorer

                                                    +

                                                    Figure: Project Explorer

                                                    Project Explorer

                                                    In this view, you can:

                                                    -
                                                      +
                                                      • Browse the file elements
                                                      • Open files in the editor view
                                                      • Open projects in a new window
                                                        • @@ -55,7 +55,7 @@

                                                        Opening the Project Explorer View

                                                        Usually, the Project Explorer view is located in the left-top side in the Tizen Studio. You can change the position by dragging and dropping it. If you close the view, you can show it again by selecting Project Explorer in Window > Show View > Other > General.

                                                        -

                                                        Figure: Opening the view

                                                        +

                                                        Figure: Opening the view

                                                        Opening the view

                                                        Using the Project Explorer View

                                                        @@ -161,7 +161,7 @@
                                                    - + @@ -190,8 +190,8 @@ - + - + - + - + - +
                                                    Build Signed PackageMakes a 'signed' package. This option requires a certificate profile. You can create a certificate profile in Tools > Certificate Manager.Makes a 'signed' package. This option requires a certificate profile. You can create a certificate profile in Tools > Certificate Manager.
                                                    Localization
                                                    Compare With Allows you to do one of the following types of compares: - -
                                                      + +
                                                      • Compare 2 or 3 selected resources with each other.
                                                      • Compare the selected resource with remote versions (if the project is associated with a version control management system).
                                                      • Compare the selected resource with a local history state.
                                                        • @@ -206,7 +206,7 @@
                                                    Properties Displays the properties of the selected resource. The displayed properties depend on what type of resource is selected. Resource properties can include (but are not limited to): -
                                                      +
                                                      • Path relative to the project in which it is held
                                                      • Type of the resource
                                                      • Absolute file system path, or name of the path variable when using linked resources
                                                        • diff --git a/org.tizen.studio/html/web_tools/project_wizard_w.htm b/org.tizen.studio/html/web_tools/project_wizard_w.htm index 7c0a08d..af43027 100644 --- a/org.tizen.studio/html/web_tools/project_wizard_w.htm +++ b/org.tizen.studio/html/web_tools/project_wizard_w.htm @@ -5,22 +5,22 @@ - + - Creating Tizen Projects with Tizen Project Wizard + Creating Tizen Projects with Tizen Project Wizard - +

                                                        Mobile Web Wearable Web

                                                        - +

                                                        Dependencies

                                                          @@ -54,9 +54,9 @@

                                                          Project Type

                                                          When the Tizen Project Wizard opens, you must first select the project type.

                                                          -

                                                          Figure: Selecting the project type

                                                          -

                                                          Selecting the project type

                                                          - +

                                                          Figure: Selecting the project type

                                                          +

                                                          Selecting the project type

                                                          +

                                                          The Tizen Studio provides various project templates and samples for the mobile and wearable devices according to the installed platform. The Tizen Project Wizard helps you select the template and sample for your project.

                                                          The Template option provides a list of templates with a basic structure where you can start the Web application project:

                                                            @@ -77,7 +77,7 @@
                                                        - +

                                                        The Sample option provides a list of sample applications demonstrating various API usage and UI design.

                                                        To move to the next step, select the project type and click Next.

                                                        @@ -85,34 +85,34 @@

                                                        You can select the profile and version supported by your project, such as a mobile or wearable device. In addition, the Tizen Studio shows you which platforms among the supported platforms have been installed.

                                                        Based on the selected profile and version, a list of templates is shown in the template selection step.

                                                        -

                                                        Figure: Selecting the profile and version

                                                        -

                                                        File analysis

                                                        - +

                                                        Figure: Selecting the profile and version

                                                        +

                                                        File analysis

                                                        +

                                                        To move to the next step, select the profile and version, and click Next.

                                                        Application Type

                                                        You can select the Web or native application type for your project. For more information, see Web Application and Native Application.

                                                        Based on the selected application type, a list of templates is shown in the template selection step.

                                                        -

                                                        Figure: Selecting the application type

                                                        -

                                                        Selecting the application type

                                                        - +

                                                        Figure: Selecting the application type

                                                        +

                                                        Selecting the application type

                                                        +

                                                        To move to the next step, select the application type and click Next.

                                                        Template

                                                        You can select the template for your project while viewing information about a variety of templates. The Tizen Project Wizard creates the project based on the selected template.

                                                        -

                                                        Figure: Selecting the template

                                                        -

                                                        Selecting the template

                                                        +

                                                        Figure: Selecting the template

                                                        +

                                                        Selecting the template

                                                        To move to the next step, select the template and click Next.

                                                        Project Properties

                                                        You can set basic project properties, such as the project name, location, and working sets.

                                                        -

                                                        Figure: Setting project properties

                                                        -

                                                        Setting project properties

                                                        - +

                                                        Figure: Setting project properties

                                                        +

                                                        Setting project properties

                                                        +

                                                        The options you can set are listed in the following table.

                                                        Table: Project properties

                                                        diff --git a/org.tizen.studio/html/web_tools/rest_viewer_w.htm b/org.tizen.studio/html/web_tools/rest_viewer_w.htm index 1de6e07..b0e29bd 100644 --- a/org.tizen.studio/html/web_tools/rest_viewer_w.htm +++ b/org.tizen.studio/html/web_tools/rest_viewer_w.htm @@ -5,22 +5,22 @@ - + - Using the REST Viewer + Using the REST Viewer - +

                                                        Mobile Web Wearable Web

                                                        - +

                                                        Dependencies

                                                          @@ -50,7 +50,7 @@
                                                          • It solves the inconvenience of the existing development process.
                                                          • It is a basic test and test history management tool without the need for additional test tools.
                                                            • -
                                                          • The automatic code generation features improve code productivity. +
                                                          • The automatic code generation features improve code productivity.

                                                            You do not need to implement a REST API call unit code. Besides, it automatically updates whenever the specification of the REST API changes.

                                                          @@ -64,9 +64,9 @@

                                                          The REST Viewer displays the components of the WADL (Web Application Description Language) document in a hierarchical structure.

                                                          The viewer loads the documents from a specific location and classifies them as 4-typed WADL components.

                                                          -

                                                          Figure: REST Viewer

                                                          -

                                                          REST Viewer

                                                          - +

                                                          Figure: REST Viewer

                                                          +

                                                          REST Viewer

                                                          +

                                                          The WADL document can contain 4 types of WADL components:

                                                          • Service icon Service (application): The application element forms the root of a WADL description.
                                                            • @@ -92,10 +92,10 @@
                                                          • Import icon: Import a WADL file and show the WADL models from a local WADL file or URL.
                                                          • Export icon: Export the selected WADL models as a .wadl file.
                                                          -

                                                          When you add a new WADL component, you must define its place in the WADL structure in the addition dialog. The WADL structure is "Service > Base URI > Path [> Path] > API".

                                                          +

                                                          When you add a new WADL component, you must define its place in the WADL structure in the addition dialog. The WADL structure is "Service > Base URI > Path [> Path] > API".

                                                          -

                                                          Figure: Adding a WADL component

                                                          -

                                                          Adding a WADL component

                                                          +

                                                          Figure: Adding a WADL component

                                                          +

                                                          Adding a WADL component

                                                          Fill in the necessary details:

                                                          • Service @@ -138,10 +138,10 @@
                                                          • API Key authentication with a header or parameter
                                                          • OAuth 2.0 authentication information for a RESTful API
                                                          - -

                                                          Figure: Authentication details

                                                          + +

                                                          Figure: Authentication details

                                                          Authentication details

                                                          - +

                                                          Testing the APIs

                                                          You can test the selected API on the REST Viewer and view the results.

                                                          @@ -153,25 +153,25 @@

                                                        The API that works with variables needs specific values for the test. Each profile has its own user variables (key and value). You can manage the profiles and user variables in the Preferences window. After the user variables are set, you can use them with a placeholder to test the API (for example, ${email}).

                                                        -

                                                        Figure: User variables

                                                        +

                                                        Figure: User variables

                                                        User variables

                                                        - +

                                                        You can select an active profile in the REST Viewer user variable toolbar menu. When you test the APIs in the REST Viewer, user variables of the selected profile are used.

                                                        -

                                                        Figure: Selecting a profile

                                                        +

                                                        Figure: Selecting a profile

                                                        Selecting a profile

                                                        The user variables of the active profile are shown when you set the values for an API.

                                                        -

                                                        Figure: Selecting a user variable

                                                        +

                                                        Figure: Selecting a user variable

                                                        Selecting a user variable

                                                        After setting the variables and running the test, the result is displayed in the Console view. You can save the response structure.

                                                        -

                                                        Figure: Test result

                                                        +

                                                        Figure: Test result

                                                        Test result

                                                        - +

                                                        Automatic Code Generation

                                                        You can use the REST Viewer to send asynchronous requests with the REST APIs.

                                                        There are 2 ways to use automatic code generation:

                                                        @@ -186,7 +186,7 @@
                                                      -

                                                      Figure: Selecting functions for the REST API

                                                      +

                                                      Figure: Selecting functions for the REST API

                                                      Selecting functions for the REST API

                                                      diff --git a/org.tizen.studio/html/web_tools/web_editor_w.htm b/org.tizen.studio/html/web_tools/web_editor_w.htm index d03c505..8e2eb2f 100644 --- a/org.tizen.studio/html/web_tools/web_editor_w.htm +++ b/org.tizen.studio/html/web_tools/web_editor_w.htm @@ -5,22 +5,22 @@ - + - Writing Your Code + Writing Your Code - +

                                                      Mobile Web Wearable Web

                                                      - +

                                                      Dependencies

                                                        @@ -42,7 +42,7 @@

                                                        Writing Your Code

                                                        - +

                                                        Tizen Web Editor is a powerful tool for creating and modifying source code. It supports all basic coding features, such as syntax highlighting, content assist, and privilege checking.

                                                        Tizen Web Editor provides support for JavaScript, HTML, and CSS file editing.

                                                        @@ -60,29 +60,29 @@ You can check JavaScript immediately, even without saving the file.
                                                        -

                                                        Figure: Checking JavaScript rules manually

                                                        -

                                                        Checking JavaScript rules manually

                                                        +

                                                        Figure: Checking JavaScript rules manually

                                                        +

                                                        Checking JavaScript rules manually

                                                      • Automatic check

                                                        When writing code, if there are syntax errors, the automatic check displays the CSSLint or JSLint validator results on the left edge of the editor.

                                                        • If you save a file, the project is built and syntax is checked automatically. -

                                                          Figure: Checking JavaScript automatically

                                                          -

                                                          Checking JavaScript automatically

                                                          +

                                                          Figure: Checking JavaScript automatically

                                                          +

                                                          Checking JavaScript automatically

                                                          -

                                                          Figure: JavaScript scan results in the Problems view

                                                          -

                                                          JavaScript scan results in the Problems view

                                                          +

                                                          Figure: JavaScript scan results in the Problems view

                                                          +

                                                          JavaScript scan results in the Problems view

                                                          • -
                                                        • Using content assist. +
                                                        • Using content assist.

                                                          You can get suggestions for HTML, CSS, and JavaScript tag and attribute properties. Also, if you mistype, content assist displays an error. Press Ctrl + Space to open content assist.

                                                          -

                                                          Figure: Content assist in a CSS file

                                                          -

                                                          Content assist in a CSS file

                                                          +

                                                          Figure: Content assist in a CSS file

                                                          +

                                                          Content assist in a CSS file

                                                      - +

                                                      Syntax Check Settings

                                                      If you want to adjust the error level settings for the CSS or JavaScript Validator, go to Window > Preferences > Tizen Studio > Web > Editor > CSS Editor or JavaScript Editor.

                                                      By default, the CSS or JavaScript syntax check is operated when a document is saved or the project built. However, you can set the detailed attributes in the preferences. To change the inspection point, adjust it in Preference > Build or Reconcile:

                                                      @@ -134,7 +134,7 @@
                                                    -

                                                    Figure: Content assist with the <img> element

                                                    +

                                                    Figure: Content assist with the <img> element

                                                    Content assist with the img element

                                                    To use content assist in the HTML editor:

                                                    @@ -161,8 +161,8 @@
                                                  • Supports a preview of the image file at the src attribute value of the <img> element.
                                                  • Support a preview of the CSS rule at the id or class attribute value of all elements, if the selector (that is made by the id or class value) exists.
                                                    • -

                                                    Figure: Content hover with the <link> element

                                                    -

                                                    Content hover with the link element

                                                    +

                                                    Figure: Content hover with the <link> element

                                                    +

                                                    Content hover with the link element

                                                    To use the hover feature in the HTML editor, hover the mouse cursor at the above attributes.

                                                    Advanced File Refactoring in Mobile Applications

                                                    @@ -176,11 +176,11 @@
                                                  • File delete refactoring

                                                    When a file is deleted, other files to which the deleted file is related, are commented out at the linked line of codes.

                                                    • -

                                                    Figure: Before CSS file rename refactoring

                                                    -

                                                    Before CSS file rename refactoring

                                                    +

                                                    Figure: Before CSS file rename refactoring

                                                    +

                                                    Before CSS file rename refactoring

                                                    -

                                                    Figure: After CSS file rename refactoring

                                                    -

                                                    After CSS file rename refactoring

                                                    +

                                                    Figure: After CSS file rename refactoring

                                                    +

                                                    After CSS file rename refactoring

                                                    Previewer

                                                    If you want to test a Web application (or just a Web page) as a part of a client application, you can do it using the Previewer tool.

                                                    @@ -200,29 +200,29 @@
                                                    console.logconsole.log("console.log");console.log("console.log");
                                                    console.infoconsole.info("console.info");console.info("console.info");
                                                    console.warnconsole.warn("console.warn");console.warn("console.warn");
                                                    console.errorconsole.error("console.error");console.error("console.error");
                                                    console.debugconsole.debug("console.debug");console.debug("console.debug");
                                                    -

                                                    Figure: JavaScript log method colors

                                                    -

                                                    JavaScript log method colors

                                                    - +

                                                    Figure: JavaScript log method colors

                                                    +

                                                    JavaScript log method colors

                                                    +

                                                    Live Edit

                                                    When you change the source code in the Tizen Studio, the running application is updated instantly without any reloading process.

                                                    For more details, see Live Editing of HTML, CSS, and JavaScript.

                                                    diff --git a/org.tizen.studio/html/web_tools/web_inspector_w.htm b/org.tizen.studio/html/web_tools/web_inspector_w.htm index e57b21e..9c355d9 100644 --- a/org.tizen.studio/html/web_tools/web_inspector_w.htm +++ b/org.tizen.studio/html/web_tools/web_inspector_w.htm @@ -5,20 +5,20 @@ - + - Debugging with Web Inspector - + Debugging with Web Inspector + +
                                                    -

                                                    Debugging with Web Inspector

                                                    -

                                                    You can debug Web applications using the JavaScript Debugger tool. The JavaScript Debugger is based on Webkit Web Inspector, and has been modified to support remote debugging.

                                                    -

                                                    The JavaScript Debugger supports the following panels:

                                                    - -

                                                    Figure: JavaScript Debugger panels

                                                    -

                                                    JavaScript Debugger panels

                                                    -

                                                    When debugging with the emulator, the emulator communicates with the Google Chrome™ browser through the HTTP protocol.

                                                    -

                                                    When the JavaScript Debugger is started, the Network panel is off. To enable the Network panel and start monitoring the resource loading status, press the F5 key. This reloads the current page and displays the load time on the Network panel.

                                                    - -

                                                    Elements Panel

                                                    -

                                                    The Elements panel of the JavaScript Debugger allows you to see the Web page components (the DOM tree, CSS style, and Document Object Model).

                                                    -

                                                    Figure: Elements panel

                                                    -

                                                    Elements panel

                                                    - -

                                                    Resources Panel

                                                    -

                                                    The Resources panel of the JavaScript Debugger allows you to inspect resources. You can interact with frames containing resources, such as HTML, JavaScript, CSS, images, and fonts. You can also inspect HTML5 databases, local storage, cookies, and application cache.

                                                    -

                                                    Figure: Resources panel

                                                    -

                                                    Resources panel

                                                    - -

                                                    Network Panel

                                                    -

                                                    The Network panel of the JavaScript Debugger allows you to inspect resources downloaded over the network. You can also inspect the HTTP header, response, cookies, and preview.

                                                    -

                                                    Figure: Network panel

                                                    -

                                                    Network panel

                                                    - -

                                                    Sources Panel

                                                    -

                                                    The Sources panel of the JavaScript Debugger allows you to inspect the JavaScript source page. You can debug your JavaScript code. This panel supports watch expressions, callstack, scope variables, and break point operation. In addition, it supports basic debugging operations: continue, step over, step into, and step out.

                                                    -

                                                    Figure: Sources panel

                                                    -

                                                    Sources panel

                                                    - -

                                                    Timeline Panel

                                                    -

                                                    The Timeline panel of the JavaScript Debugger allows you to perform advanced timing and speed analysis. You can see how long the browser takes to handle DOM events, and rendering and painting windows.

                                                    -

                                                    Figure: Timeline panel

                                                    -

                                                    Timeline panel

                                                    - -

                                                    Profiles Panel

                                                    -

                                                    The Profiles panel of the JavaScript Debugger allows you to inspect the JavaScript performance analyses. You can inspect CPU profiles or CSS Select profiles.

                                                    -

                                                    Figure: Profiles panel

                                                    -

                                                    Profiles panel

                                                    - -

                                                    Console Panel

                                                    -

                                                    The Console panel of the JavaScript Debugger allows you to inspect the JavaScript console operation. You can interact with your page programmatically. Any errors or warnings on your page are shown in the console.

                                                    -

                                                    Figure: Console panel

                                                    -

                                                    Console panel

                                                    - - +

                                                    Debugging with Web Inspector

                                                    +

                                                    You can debug Web applications using the JavaScript Debugger tool. The JavaScript Debugger is based on Webkit Web Inspector, and has been modified to support remote debugging.

                                                    +

                                                    The JavaScript Debugger supports the following panels:

                                                    + +

                                                    Figure: JavaScript Debugger panels

                                                    +

                                                    JavaScript Debugger panels

                                                    +

                                                    When debugging with the emulator, the emulator communicates with the Google Chrome™ browser through the HTTP protocol.

                                                    +

                                                    When the JavaScript Debugger is started, the Network panel is off. To enable the Network panel and start monitoring the resource loading status, press the F5 key. This reloads the current page and displays the load time on the Network panel.

                                                    + +

                                                    Elements Panel

                                                    +

                                                    The Elements panel of the JavaScript Debugger allows you to see the Web page components (the DOM tree, CSS style, and Document Object Model).

                                                    +

                                                    Figure: Elements panel

                                                    +

                                                    Elements panel

                                                    + +

                                                    Resources Panel

                                                    +

                                                    The Resources panel of the JavaScript Debugger allows you to inspect resources. You can interact with frames containing resources, such as HTML, JavaScript, CSS, images, and fonts. You can also inspect HTML5 databases, local storage, cookies, and application cache.

                                                    +

                                                    Figure: Resources panel

                                                    +

                                                    Resources panel

                                                    + +

                                                    Network Panel

                                                    +

                                                    The Network panel of the JavaScript Debugger allows you to inspect resources downloaded over the network. You can also inspect the HTTP header, response, cookies, and preview.

                                                    +

                                                    Figure: Network panel

                                                    +

                                                    Network panel

                                                    + +

                                                    Sources Panel

                                                    +

                                                    The Sources panel of the JavaScript Debugger allows you to inspect the JavaScript source page. You can debug your JavaScript code. This panel supports watch expressions, callstack, scope variables, and break point operation. In addition, it supports basic debugging operations: continue, step over, step into, and step out.

                                                    +

                                                    Figure: Sources panel

                                                    +

                                                    Sources panel

                                                    + +

                                                    Timeline Panel

                                                    +

                                                    The Timeline panel of the JavaScript Debugger allows you to perform advanced timing and speed analysis. You can see how long the browser takes to handle DOM events, and rendering and painting windows.

                                                    +

                                                    Figure: Timeline panel

                                                    +

                                                    Timeline panel

                                                    + +

                                                    Profiles Panel

                                                    +

                                                    The Profiles panel of the JavaScript Debugger allows you to inspect the JavaScript performance analyses. You can inspect CPU profiles or CSS Select profiles.

                                                    +

                                                    Figure: Profiles panel

                                                    +

                                                    Profiles panel

                                                    + +

                                                    Console Panel

                                                    +

                                                    The Console panel of the JavaScript Debugger allows you to inspect the JavaScript console operation. You can interact with your page programmatically. Any errors or warnings on your page are shown in the console.

                                                    +

                                                    Figure: Console panel

                                                    +

                                                    Console panel

                                                    + +
                                                    diff --git a/org.tizen.studio/html/web_tools/web_localization_w.htm b/org.tizen.studio/html/web_tools/web_localization_w.htm index 006a065..edc8649 100644 --- a/org.tizen.studio/html/web_tools/web_localization_w.htm +++ b/org.tizen.studio/html/web_tools/web_localization_w.htm @@ -5,22 +5,22 @@ - + - Localizing Web Applications + Localizing Web Applications - +

                                                    Mobile Web Wearable Web

                                                    - + @@ -50,15 +50,15 @@

                                                    This topic describes how to localize your application.

                                                    Opening the Web Localization View

                                                    - +

                                                    To open the Web Localization view:

                                                    1. Right-click the selected project in the Project Explorer view.
                                                    2. Click Localization.
                                                    -

                                                    Figure: Opening the Web Localization view

                                                    -

                                                    Opening the Web Localization view

                                                    +

                                                    Figure: Opening the Web Localization view

                                                    +

                                                    Opening the Web Localization view

                                                    Adding Locales

                                                    @@ -76,7 +76,7 @@
                                                  • To confirm the selected locale information, click OK.
                                                    • -

                                                    Figure: Added locales

                                                    +

                                                    Figure: Added locales

                                                    Added locales

                                                    A container named locales is created for the localized content. Under the container, a subfolder for a locale is added when you set a locale. For example, /locales/en-us and /locales/zn-cn.

                                                    @@ -98,28 +98,28 @@

                                                    You can check the defined strings in the String tab.

                                                    -

                                                    Figure: Defined strings

                                                    +

                                                    Figure: Defined strings

                                                    Defined strings

                                                    You can add more items to the table or remove them, as needed.

                                                    You can change the table tab configuration between ID and Locale by clicking the Change ViewMode button.

                                                    -

                                                    Figure: String-based viewmode

                                                    +

                                                    Figure: String-based viewmode

                                                    String-based viewmode

                                                    When the string localization is complete, the following modifications are made in the project:

                                                    • language.js file is created in the application's top-level folder and in each locale folder under locales, containing the localized string content. -

                                                      Figure: language.js

                                                      +

                                                      Figure: language.js

                                                      language.js

                                                    • The <script> element, whose src attribute is language.js, is added to the index.html file. -

                                                      Figure: src element in index.html

                                                      +

                                                      Figure: src element in index.html

                                                      src element in index.html

                                                    - +
                                                    Note For more information about using localized string content, see Localization. @@ -129,12 +129,12 @@

                                                    In the Resource tab, you can localize resource files, such as images, sound, video, HTML, and JavaScript more efficiently. The Resource tab displays the resources of the project in a tile form.

                                                    -

                                                    Figure: Resource tab

                                                    +

                                                    Figure: Resource tab

                                                    Resource tab

                                                    If a resource is not localized, the + button appears on the resource tile.

                                                    -

                                                    Figure: Missing resource file

                                                    +

                                                    Figure: Missing resource file

                                                    Missing resource file

                                                    To localize the missing resource:

                                                    @@ -154,15 +154,15 @@ 
                                                     root/
-   images/
-      a.png
-      b.png
-      c.png
-   locales/
-      ko-kr/
-         images/
-            a.png
-            c.png
+   images/
+      a.png
+      b.png
+      c.png
+   locales/
+      ko-kr/
+         images/
+            a.png
+            c.png
                                                    diff --git a/org.tizen.studio/html/web_tools/web_simulator_features_w.htm b/org.tizen.studio/html/web_tools/web_simulator_features_w.htm index fb2c596..3ee3396 100644 --- a/org.tizen.studio/html/web_tools/web_simulator_features_w.htm +++ b/org.tizen.studio/html/web_tools/web_simulator_features_w.htm @@ -5,13 +5,13 @@ - + - Taking Advantage of Web Simulator Features - + Taking Advantage of Web Simulator Features + @@ -34,109 +34,109 @@
                                                    -

                                                    Taking Advantage of Web Simulator Features

                                                    - -

                                                    The Web Simulator has several features for developing Web applications.

                                                    -

                                                    Basic Panel Operation

                                                    -

                                                    The Web Simulator provides the following panel operations:

                                                    -
                                                      -
                                                    • Expand/Collapse

                                                      Each panel can be opened or closed by clicking the small arrow on the left side of the panel bar.

                                                      • -
                                                    • Reorder

                                                      Each panel can be moved and reordered by dragging the items on the drag area on the right side of the panel bar.

                                                      • -
                                                    • Show/Hide

                                                      Each panel can be displayed or hidden by clicking the panel-setting button on the right side of the application address bar.

                                                      • -
                                                    -

                                                    Panels

                                                    +

                                                    Taking Advantage of Web Simulator Features

                                                    + +

                                                    The Web Simulator has several features for developing Web applications.

                                                    +

                                                    Basic Panel Operation

                                                    +

                                                    The Web Simulator provides the following panel operations:

                                                    +
                                                      +
                                                    • Expand/Collapse

                                                      Each panel can be opened or closed by clicking the small arrow on the left side of the panel bar.

                                                      • +
                                                    • Reorder

                                                      Each panel can be moved and reordered by dragging the items on the drag area on the right side of the panel bar.

                                                      • +
                                                    • Show/Hide

                                                      Each panel can be displayed or hidden by clicking the panel-setting button on the right side of the application address bar.

                                                      • +
                                                    +

                                                    Panels

                                                    The Web Simulator has the following panels which allow you to control the simulation conditions of various device aspects:

                                                    - +

                                                    Orientation and Zooming

                                                    -

                                                    In the Orientation and Zooming panel, you can switch the orientation between the portrait and landscape modes. If your application has subscribed to the orientation change event, it receives the event and the subscribed event handler is invoked.

                                                    -

                                                    You can also set the zoom level of your application to view specific areas of the application. Zooming is a visual aid and does not trigger application notifications.

                                                    - -

                                                    Figure: Orientation and Zooming panel (mobile app on the left, wearable on the right)

                                                    -

                                                    Orientation and Zooming panel

                                                    - -

                                                    System Summary

                                                    - - -

                                                    The System Summary panel displays generic information and settings about the application, system, device, and platform.

                                                    -

                                                    Figure: System Summary panel (mobile app on the left, wearable on the right)

                                                    -

                                                    System Summary panel

                                                    - - -

                                                    Geolocation

                                                    - - -

                                                    The Geolocation panel contains location-related settings. You can set the local time zone to test whether your application reacts properly when the target device is located in different geographical areas.

                                                    -

                                                    Figure: Geolocation panel

                                                    -

                                                    Geolocation panel

                                                    -

                                                    The panel also provides an input area to configure geographical data being sent from the device. Additionally, a map is displayed and updated in accordance to the changing of data.

                                                    -

                                                    To simulate a custom, multi-point route:

                                                    -
                                                      -
                                                    1. Click the red location marker button at the upper right corner of the map.
                                                      2. -
                                                    2. Click the desired location points.
                                                      3. -
                                                    3. Double-click the map to end route creation.
                                                      4. -
                                                    4. To send the geolocation data to the application along the defined route, click the play button. You can also set the speed of playback.
                                                      5. -
                                                    - -

                                                    Application Configuration

                                                    - - -

                                                    The Application Configuration panel displays a graphical representation of the config.xml file. You can use it to ensure the validity of your application configuration.

                                                    -

                                                    For more information about the configuration details, see W3C/HTML5 Specifications.

                                                    -

                                                    Figure: Application Configuration panel

                                                    -

                                                    Application Configuration panel

                                                    - - -

                                                    Sensors

                                                    - - -

                                                    The Sensors panel provides slide bars to configure the ambient, accelerometer, and magnetic field sensors.

                                                    -

                                                    To change the accelerometer value, either drag the simulator image, or enter a degree value along each axis.

                                                    -

                                                    The following buttons can be used to simulate the accelerometer sensor:

                                                    -
                                                      -
                                                    • FaceDown simulates placing the device with the screen facing down.
                                                      • -
                                                    • Shake simulates shaking the device along the X axis.
                                                      • -
                                                    • ResetAll simulates returning the device to its default position.
                                                      • -
                                                    -

                                                    Figure: Accelerometer sensor (mobile app on the left, wearable on the right)

                                                    -

                                                    Accelerometer sensor

                                                    -

                                                    To set the magnetic field, enter the X, Y, and Z axis values.

                                                    -

                                                    Figure: Accelerometer and gyro sensors

                                                    -

                                                    Accelerometer and gyro sensors

                                                    +

                                                    In the Orientation and Zooming panel, you can switch the orientation between the portrait and landscape modes. If your application has subscribed to the orientation change event, it receives the event and the subscribed event handler is invoked.

                                                    +

                                                    You can also set the zoom level of your application to view specific areas of the application. Zooming is a visual aid and does not trigger application notifications.

                                                    + +

                                                    Figure: Orientation and Zooming panel (mobile app on the left, wearable on the right)

                                                    +

                                                    Orientation and Zooming panel

                                                    + +

                                                    System Summary

                                                    + + +

                                                    The System Summary panel displays generic information and settings about the application, system, device, and platform.

                                                    +

                                                    Figure: System Summary panel (mobile app on the left, wearable on the right)

                                                    +

                                                    System Summary panel

                                                    + + +

                                                    Geolocation

                                                    + + +

                                                    The Geolocation panel contains location-related settings. You can set the local time zone to test whether your application reacts properly when the target device is located in different geographical areas.

                                                    +

                                                    Figure: Geolocation panel

                                                    +

                                                    Geolocation panel

                                                    +

                                                    The panel also provides an input area to configure geographical data being sent from the device. Additionally, a map is displayed and updated in accordance to the changing of data.

                                                    +

                                                    To simulate a custom, multi-point route:

                                                    +
                                                      +
                                                    1. Click the red location marker button at the upper right corner of the map.
                                                      2. +
                                                    2. Click the desired location points.
                                                      3. +
                                                    3. Double-click the map to end route creation.
                                                      4. +
                                                    4. To send the geolocation data to the application along the defined route, click the play button. You can also set the speed of playback.
                                                      5. +
                                                    + +

                                                    Application Configuration

                                                    + + +

                                                    The Application Configuration panel displays a graphical representation of the config.xml file. You can use it to ensure the validity of your application configuration.

                                                    +

                                                    For more information about the configuration details, see W3C/HTML5 Specifications.

                                                    +

                                                    Figure: Application Configuration panel

                                                    +

                                                    Application Configuration panel

                                                    + + +

                                                    Sensors

                                                    + + +

                                                    The Sensors panel provides slide bars to configure the ambient, accelerometer, and magnetic field sensors.

                                                    +

                                                    To change the accelerometer value, either drag the simulator image, or enter a degree value along each axis.

                                                    +

                                                    The following buttons can be used to simulate the accelerometer sensor:

                                                    +
                                                      +
                                                    • FaceDown simulates placing the device with the screen facing down.
                                                      • +
                                                    • Shake simulates shaking the device along the X axis.
                                                      • +
                                                    • ResetAll simulates returning the device to its default position.
                                                      • +
                                                    +

                                                    Figure: Accelerometer sensor (mobile app on the left, wearable on the right)

                                                    +

                                                    Accelerometer sensor

                                                    +

                                                    To set the magnetic field, enter the X, Y, and Z axis values.

                                                    +

                                                    Figure: Accelerometer and gyro sensors

                                                    +

                                                    Accelerometer and gyro sensors

                                                    Note If the computer does not fully support WebGL, the simulated device in the Sensors panel looks like in the following figure. -

                                                    Figure: Sensor without WebGL

                                                    +

                                                    Figure: Sensor without WebGL

                                                    Sensor without WebGL

                                                    -

                                                    Packages and Applications

                                                    +

                                                    Packages and Applications

                                                    The Packages and Applications panel provides a simulated packages and applications management center on a device. It lists available and installed packages and applications on a device:

                                                      -
                                                    • On the Packages tab, the available packages list provides INSTALL and UPDATE operations. The operations generate events, such as INSTALLED and UPDATED, and call the required callbacks.
                                                      • -
                                                    • On the Applications tab, the installed packages list shows the installed packages and applications on the device. You can simulate the UNINSTALL operation, which generates an UNINSTALLED event and calls the required callback.
                                                      • +
                                                    • On the Packages tab, the available packages list provides INSTALL and UPDATE operations. The operations generate events, such as INSTALLED and UPDATED, and call the required callbacks.
                                                      • +
                                                    • On the Applications tab, the installed packages list shows the installed packages and applications on the device. You can simulate the UNINSTALL operation, which generates an UNINSTALLED event and calls the required callback.

                                                    You can use the Packages and Applications panel to verify created operations and operation details.

                                                    -

                                                    Figure: Packages and Applications panel

                                                    -

                                                    Packages and Applications panel

                                                    -

                                                    The following sample code demonstrates how to receive the INSTALLED, UPDATED, and UNINSTALLED events for changes in the installed packages list. If you select Sample Package from the available packages list and click Install, the "The package "Sample Package" is installed" message is displayed in the console, and for each application in the package, the oninstalled event is generated. You can subscribe to these application events by registering the tizen.application.addAppInfoEventListener interface.

                                                    +

                                                    Figure: Packages and Applications panel

                                                    +

                                                    Packages and Applications panel

                                                    +

                                                    The following sample code demonstrates how to receive the INSTALLED, UPDATED, and UNINSTALLED events for changes in the installed packages list. If you select Sample Package from the available packages list and click Install, the "The package "Sample Package" is installed" message is displayed in the console, and for each application in the package, the oninstalled event is generated. You can subscribe to these application events by registering the tizen.application.addAppInfoEventListener interface.

                                                    var packageEventCallback =
 {
-   oninstalled: function(packageInfo)
-   {
-      console.log('The package "' + packageInfo.name + '" is installed');
-   },
-   onupdated: function(packageInfo)
-   {
-      console.log('The package "' + packageInfo.name + '" is updated');
-   },
-   onuninstalled: function(packageId)
-   {
-      console.log('The package "' + packageId + '" is uninstalled');
-   }
+   oninstalled: function(packageInfo)
+   {
+      console.log('The package "' + packageInfo.name + '" is installed');
+   },
+   onupdated: function(packageInfo)
+   {
+      console.log('The package "' + packageInfo.name + '" is updated');
+   },
+   onuninstalled: function(packageId)
+   {
+      console.log('The package "' + packageId + '" is uninstalled');
+   }
 };
 
 tizen.package.setPackageInfoEventListener(packageEventCallback);
                                                    @@ -144,142 +144,142 @@ tizen.package.setPackageInfoEventListener(packageEventCallback);

                                                    Preinstalled Packages and Applications In Mobile Applications

                                                    A Sample Package is preinstalled in the simulator and contains 2 sample applications: Tizen dialer for making phone calls, and Tizen sender for sending SMS messages. Many sample applications, such as CallLog, use the Tizen Application API to invoke these service applications. Since the simulator allows you to run only 1 application at a time, the Application Module Message window is available, which can provide return data for success callback and simulate application launch failure.

                                                    - +

                                                    The following sample code demonstrates how to define an application control and invoke the http://tizen.org/appcontrol/operation/send_text service provided by the Tizen sender application. You can use the Application Module Message window to simulate the success value for the success callback or an error message for the error callback.

                                                    - 
                                                    var appControl = new tizen.ApplicationControl('http://tizen.org/appcontrol/operation/send_text',
-                                              'sms:' + phoneNumber);
+  
                                                    var appControl = new tizen.ApplicationControl('http://tizen.org/appcontrol/operation/send_text',
+                                              'sms:' + phoneNumber);
 
 tizen.application.launchAppControl(appControl, null, function()
 {
-   console.log('launch app service ...');
+   console.log('launch app service ...');
 }, function(e) {/* Error handling */},
 {
-   onsuccess: function()
-   {
-      console.log('Message service launch success');
-   },
-   onfailure: function(er) {/* Error handling */}
+   onsuccess: function()
+   {
+      console.log('Message service launch success');
+   },
+   onfailure: function(er) {/* Error handling */}
 });
                                                    
 
-  
                                                    Figure: Providing application callback data
                                                     
-  
                                                    Providing application callback data
                                                     
-  
                                                    The Web Simulator does not have a home screen. Therefore, when the application.exit() method is called, you cannot navigate to another application or to the home screen. In this situation, a message is displayed stating that the application tried to exit and can be launched again.
                                                     
-    
-       
                                                    Figure: Launch an application again
                                                     
-  
                                                    Launch an application again
                                                     
-       
-                               
                                                    Communications in Mobile Applications
                                                     
-			 
+  
                                                    Figure: Providing application callback data
                                                    
+  
                                                    Providing application callback data
                                                    
+  
                                                    The Web Simulator does not have a home screen. Therefore, when the application.exit() method is called, you cannot navigate to another application or to the home screen. In this situation, a message is displayed stating that the application tried to exit and can be launched again.
                                                    
+
+       
                                                    Figure: Launch an application again
                                                    
+  
                                                    Launch an application again
                                                    
+
+                               
                                                    Communications in Mobile Applications
                                                    
+
   
                                                    In the Communications panel, you can handle calls, messages, and the push service.
                                                    
   
                                                    Calls
                                                    
-  
                                                    The Calls tab provides controls for simulating incoming calls made to the application. The calls can be tracked by call history-related methods using the Tizen Call History API.
                                                     
-  
                                                    Figure: Calls tab
                                                     
-  
                                                    Calls tab
                                                     
-  
                                                    Click Call to display the calling screen. Click Answer to simulate a received call, and Ignore to simulate a rejected call.
                                                     
-  
                                                    Figure: Calling screen
                                                     
+  
                                                    The Calls tab provides controls for simulating incoming calls made to the application. The calls can be tracked by call history-related methods using the Tizen Call History API.
                                                    
+  
                                                    Figure: Calls tab
                                                    
+  
                                                    Calls tab
                                                    
+  
                                                    Click Call to display the calling screen. Click Answer to simulate a received call, and Ignore to simulate a rejected call.
                                                    
+  
                                                    Figure: Calling screen
                                                    
   
                                                    Calling screen
                                                    
       
                                                    Messages
                                                    
-  
                                                    The Messages tab provides controls for simulating SMS, MMS, and email message exchange between the panel and a target application. To send a message from the panel to the application:
                                                     
-  
                                                       
-   
                                                    1. Enter the sender name and message body.
                                                      2.  
-   
                                                    2. Select the message type.
                                                      3.  
-   
                                                    3. Click Send. 
                                                      4.  
-  
                                                     
-  
                                                    The application receives messages using the Tizen Messaging API.
                                                     
-  
                                                    The Message Thread section shows the message history of the current session.
                                                     
-  
                                                    Figure: Messages tab
                                                     
-  
                                                    Messages tab
                                                     
+  
                                                    The Messages tab provides controls for simulating SMS, MMS, and email message exchange between the panel and a target application. To send a message from the panel to the application:
                                                    
+  
                                                      
+   
                                                    1. Enter the sender name and message body.
                                                      2. 
+   
                                                    2. Select the message type.
                                                      3. 
+   
                                                    3. Click Send. 
                                                      4. 
+  
                                                    
+  
                                                    The application receives messages using the Tizen Messaging API.
                                                    
+  
                                                    The Message Thread section shows the message history of the current session.
                                                    
+  
                                                    Figure: Messages tab
                                                    
+  
                                                    Messages tab
                                                    
   
                                                    Push Service
                                                    
   
                                                    The Push tab provides controls for delivering push notifications to your application. The applications table (on the Packages and Applications panel) lists registered applications for receiving push notifications and connectivity status. If an application is connected, the push service sends the push notification data directly to the application. If an application is not connected, the push service posts a UI notification on the Notification panel.
                                                    
 
   
                                                    For the application to receive push messages, it has to register itself with the tizen.push.registerService() method. If the registration is successful, a red pause button is shown at the Application section under Status. During this status, notification messages pushed by the service server are posted on the Notification panel.
                                                    
-   
                                                    Figure: Registered for the push service
                                                     
-  
                                                    Registered for the push service
                                                      
-  
-
                                                    After the registration, the application must connect to the push service with the tizen.push.connectService() method. When the application is connected, a callback provided by the application is called whenever a notification message arrives.
                                                     
-
-   
                                                    Figure: Connected to the push service
                                                     
-  
                                                    Connected to the push service
                                                      
-  
-
                                                    To push a message from the panel to the application:
                                                     
-  
                                                       
-   
                                                    1. Select the target application on the Packages and Applications panel.
                                                      2.  
-   
                                                    2. Enter the alert message and application data.
                                                      3.  
-   
                                                    3. Click Push. 
                                                      4.  
-  
                                                       
-  
                                                    The application receives push notifications using the Tizen Push API.
                                                     
-  
                                                    Figure: Push tab
                                                     
-  
                                                    Push tab
                                                     
-			
-			
+   
                                                    Figure: Registered for the push service
                                                    
+  
                                                    Registered for the push service
                                                    
+
+
                                                    After the registration, the application must connect to the push service with the tizen.push.connectService() method. When the application is connected, a callback provided by the application is called whenever a notification message arrives.
                                                    
+
+   
                                                    Figure: Connected to the push service
                                                    
+  
                                                    Connected to the push service
                                                    
+
+
                                                    To push a message from the panel to the application:
                                                    
+  
                                                      
+   
                                                    1. Select the target application on the Packages and Applications panel.
                                                      2. 
+   
                                                    2. Enter the alert message and application data.
                                                      3. 
+   
                                                    3. Click Push. 
                                                      4. 
+  
                                                    
+  
                                                    The application receives push notifications using the Tizen Push API.
                                                    
+  
                                                    Figure: Push tab
                                                    
+  
                                                    Push tab
                                                    
+
+
 				
                                                    Network Management in Mobile Applications
                                                    
-				
-			 
-  
                                                    The Network Management panel is used to manage network capabilities, such as Wi-Fi, cellular network (2G, 3G, and 4G), NFC, Bluetooth, and bearer selection. 
                                                     
-  
                                                    Figure: Network Management panel
                                                     
-
-  
                                                    Network Management panel
                                                     
-  
                                                    You can also set additional parameters for the NFC and Bluetooth functionalities, such as NFC tag and target type, Bluetooth adapter information, and the simulated devices.
                                                     
-  
                                                    Figure: NFC parameters
                                                     
-  
                                                    NFC parameters
                                                     
-  
-    
                                                    Figure: Bluetooth parameters
                                                     
-  
                                                    Bluetooth parameters
                                                     
-  
+
+
+  
                                                    The Network Management panel is used to manage network capabilities, such as Wi-Fi, cellular network (2G, 3G, and 4G), NFC, Bluetooth, and bearer selection. 
                                                    
+  
                                                    Figure: Network Management panel
                                                    
+
+  
                                                    Network Management panel
                                                    
+  
                                                    You can also set additional parameters for the NFC and Bluetooth functionalities, such as NFC tag and target type, Bluetooth adapter information, and the simulated devices.
                                                    
+  
                                                    Figure: NFC parameters
                                                    
+  
                                                    NFC parameters
                                                    
+
+    
                                                    Figure: Bluetooth parameters
                                                    
+  
                                                    Bluetooth parameters
                                                    
+
   
                                                    The Bearer Selection section provides network bearer selection management by listing supported network devices and their current availability status. You can request and release specific network connections from this section.
                                                    
-  
                                                    Figure: Network bearer selection
                                                     
+  
                                                    Figure: Network bearer selection
                                                    
   
                                                    Network bearer selection
                                                    
 
-
                                                    Your application can manage network devices and network status using the Tizen NFC, Bluetooth, and Network Bearer Selection APIs.
                                                     
-
-			
-			
-                               
                                                    Power Manager in Mobile Applications
                                                     
-                       
-  
                                                    The Power Manager panel provides controls for managing the state of the battery and power resources.
                                                     
-  
                                                    Figure: Power Manager panel
                                                     
-  
                                                    Power Manager panel
                                                     
-
-  
                                                    The BATTERY section simulates the device battery level. Your application can retrieve the current battery status using the Tizen System Information API.
                                                     
-
-                       
-				
                                                    Download in Mobile Applications
                                                     
-			
-  
                                                    The Download panel allows you to create a simulated download object with custom size, MIME type, and download speed. All simulated download objects support start, cancel, pause, and resume operations, and provide status feedback mechanism. You can use the simulated download object created by the panel to test various conditions for your application.
                                                     
-  
                                                    The panel contains 2 predefined simulated download objects: http://tizen.org/small_file.zip and http://tizen.org/big_file.zip. When an object is selected from the drop-down list, its details are displayed at the bottom half of the panel. The panel also allows you to add, remove, and update download objects. Details, such as URL, MIME type, file size, and speed, are configurable.
                                                     
-  
                                                    The following sample code demonstrates how to start the download process and set a listener callback to monitor the status of the download. By adjusting the parameter of the download object, you can verify that you application behaves correctly in different scenarios.
                                                     
-  
                                                    request = tizen.DownloadRequest("http://tizen.org/small_file.zip")
+
                                                    Your application can manage network devices and network status using the Tizen NFC, Bluetooth, and Network Bearer Selection APIs.
                                                    
+
+
+
+                               
                                                    Power Manager in Mobile Applications
                                                    
+
+  
                                                    The Power Manager panel provides controls for managing the state of the battery and power resources.
                                                    
+  
                                                    Figure: Power Manager panel
                                                    
+  
                                                    Power Manager panel
                                                    
+
+  
                                                    The BATTERY section simulates the device battery level. Your application can retrieve the current battery status using the Tizen System Information API.
                                                    
+
+
+				
                                                    Download in Mobile Applications
                                                    
+
+  
                                                    The Download panel allows you to create a simulated download object with custom size, MIME type, and download speed. All simulated download objects support start, cancel, pause, and resume operations, and provide status feedback mechanism. You can use the simulated download object created by the panel to test various conditions for your application.
                                                    
+  
                                                    The panel contains 2 predefined simulated download objects: http://tizen.org/small_file.zip and http://tizen.org/big_file.zip. When an object is selected from the drop-down list, its details are displayed at the bottom half of the panel. The panel also allows you to add, remove, and update download objects. Details, such as URL, MIME type, file size, and speed, are configurable.
                                                    
+  
                                                    The following sample code demonstrates how to start the download process and set a listener callback to monitor the status of the download. By adjusting the parameter of the download object, you can verify that you application behaves correctly in different scenarios.
                                                    
+  
                                                    request = tizen.DownloadRequest("http://tizen.org/small_file.zip")
 downloadId = tizen.download.start(request)
 tizen.download.setListener(downloadId, listener)
-
                                                     
-  
                                                    Figure: Download panel
                                                     
-  
                                                     
                                                     
-  
                                                    Download panel
                                                     
-			
-			
-				
                                                    Notification in Mobile Applications
                                                     
-		
-  
                                                    The Notification panel provides a notification center administrating system notifications. As the Simulator has no real desktop UI components, such as status bar or notification tray, the panel serves as the final rendering place of all the notifications. You can easily verify that the notification details you created with the Tizen Notification API are correct.
                                                     
-  
                                                    Figure: Notification panel with empty notification
                                                     
-
-  
                                                    Notification panel with empty notification
                                                     
-  
                                                    The following sample code demonstrates how to create a status notification. When it is posted with the post() method, the details of the notification are displayed on the panel, as shown in the figure below.
                                                     
+
                                                    
+  
                                                    Figure: Download panel
                                                    
+  
                                                     
                                                    
+  
                                                    Download panel
                                                    
+
+
+				
                                                    Notification in Mobile Applications
                                                    
+
+  
                                                    The Notification panel provides a notification center administrating system notifications. As the Simulator has no real desktop UI components, such as status bar or notification tray, the panel serves as the final rendering place of all the notifications. You can easily verify that the notification details you created with the Tizen Notification API are correct.
                                                    
+  
                                                    Figure: Notification panel with empty notification
                                                    
+
+  
                                                    Notification panel with empty notification
                                                    
+  
                                                    The following sample code demonstrates how to create a status notification. When it is posted with the post() method, the details of the notification are displayed on the panel, as shown in the figure below.
                                                    
   
                                                    -notification = new tizen.StatusNotification("PROGRESS", "Notification Sample", 
+notification = new tizen.StatusNotification("PROGRESS", "Notification Sample",
 {
-   content: "sample content", 
-   iconPath: file:///images/icons/icon.png,
-   soundPath: file:///sounds/alert.wav,
-   vibration: true, 
-   progressValue: 67
+   content: "sample content",
+   iconPath: file:///images/icons/icon.png,
+   soundPath: file:///sounds/alert.wav,
+   vibration: true,
+   progressValue: 67
 });
 
-
                                                     
-  
                                                    Figure: Notification panel with a notification
                                                     
-  
                                                     
                                                     
-  
                                                    Notification panel with a notification
                                                     
-		
-		
+
                                                    +

                                                    Figure: Notification panel with a notification

                                                    +

                                                    +

                                                    Notification panel with a notification

                                                    + +
                                                    diff --git a/org.tizen.studio/html/web_tools/web_simulator_w.htm b/org.tizen.studio/html/web_tools/web_simulator_w.htm index eb22497..ad9b145 100644 --- a/org.tizen.studio/html/web_tools/web_simulator_w.htm +++ b/org.tizen.studio/html/web_tools/web_simulator_w.htm @@ -5,20 +5,20 @@ - + - Using the Web Simulator - + Using the Web Simulator +

                                                    Mobile Web Wearable Web

                                                    - + -
                                                    +
                                                    -

                                                    Using the Web Simulator

                                                    -

                                                    The Tizen Web Simulator is a light-weight tool that provides many settings and features to develop Web applications. You can use the simulator features to debug your applications.

                                                    +

                                                    Using the Web Simulator

                                                    +

                                                    The Tizen Web Simulator is a light-weight tool that provides many settings and features to develop Web applications. You can use the simulator features to debug your applications.

                                                    + +

                                                    The Tizen Web Simulator:

                                                    +
                                                      +
                                                    • Supports running and debugging modern HTML5 Web applications.
                                                      • +
                                                    • Simulates Tizen Web APIs using a JavaScript backend. For more information about the Tizen Web APIs supported by the simulator, see Tizen API Coverage.
                                                      • +
                                                    • Includes configuration panels for sending in events and messages to debug features, such as Geolocation, Accelerometer, and Messaging.
                                                      • +
                                                    • Runs on Google Chrome™.
                                                      • +
                                                    • Provides preferences to allow you to customize how it works.
                                                      • +
                                                    +

                                                    The Tizen Web Simulator is based on the Ripple-UI Framework and is licensed under Apache Software License v.2.0.

                                                    -

                                                    The Tizen Web Simulator:

                                                    -
                                                      -
                                                    • Supports running and debugging modern HTML5 Web applications.
                                                      • -
                                                    • Simulates Tizen Web APIs using a JavaScript backend. For more information about the Tizen Web APIs supported by the simulator, see Tizen API Coverage.
                                                      • -
                                                    • Includes configuration panels for sending in events and messages to debug features, such as Geolocation, Accelerometer, and Messaging.
                                                      • -
                                                    • Runs on Google Chrome™.
                                                      • -
                                                    • Provides preferences to allow you to customize how it works.
                                                      • -
                                                    -

                                                    The Tizen Web Simulator is based on the Ripple-UI Framework and is licensed under Apache Software License v.2.0.

                                                    -
                                                    Note The Web Simulator does not support a wearable circular UI.
                                                    -

                                                    Figure: Tizen Web Simulator

                                                    -

                                                    Tizen Web Simulator

                                                    - -

                                                    Web Simulator Settings

                                                    -

                                                    The Web Simulator has several settings for developing Web applications.

                                                    -

                                                    Application Navigation Bar

                                                    -

                                                    The application navigation bar is used to load an application, view the browsing history, and modify the Web Simulator configuration and visibility settings.

                                                    -

                                                    The navigation bar has the following options:

                                                    -
                                                      -
                                                    • Address bar

                                                      When the Web Simulator is launched from the Tizen Studio, the file path of your application main file is displayed in the address bar. You can edit this field for changing the file or project to run.

                                                      -

                                                      Address bar

                                                      • -
                                                    • Reload button

                                                      Reloads the current application.

                                                      -

                                                      Reload button

                                                      • -
                                                    • Browsing history

                                                      Click the history button to view the previously launched applications.

                                                      -

                                                      Browsing history

                                                      • -
                                                    • Configuration button

                                                      Opens the Web Simulator configuration window.

                                                      -

                                                      Web Simulator configuration

                                                      • -
                                                    • Panel visibility button

                                                      Opens the panel visibility window.

                                                      -

                                                      Web Simulator panel visibility

                                                      • -
                                                    • Information button

                                                      Opens the Web Simulator information window.

                                                      -

                                                      Web Simulator information

                                                      • -
                                                    -

                                                    Simulator Configuration Settings

                                                    -

                                                    You can modify the following configuration settings in the Web Simulator configuration window:

                                                    -
                                                      -
                                                    • Configuration management

                                                      Save your configuration settings to the local storage and restore the settings at a later time.

                                                      -

                                                      Configuration settings save and load buttons

                                                      • -
                                                    • Device settings

                                                      Set the device API and device resolution to simulate the device resolution of the target device on the DEVICE tab.

                                                      +

                                                      Figure: Tizen Web Simulator

                                                      +

                                                      Tizen Web Simulator

                                                      + +

                                                      Web Simulator Settings

                                                      +

                                                      The Web Simulator has several settings for developing Web applications.

                                                      +

                                                      Application Navigation Bar

                                                      +

                                                      The application navigation bar is used to load an application, view the browsing history, and modify the Web Simulator configuration and visibility settings.

                                                      +

                                                      The navigation bar has the following options:

                                                      +
                                                        +
                                                      • Address bar

                                                        When the Web Simulator is launched from the Tizen Studio, the file path of your application main file is displayed in the address bar. You can edit this field for changing the file or project to run.

                                                        +

                                                        Address bar

                                                        • +
                                                      • Reload button

                                                        Reloads the current application.

                                                        +

                                                        Reload button

                                                        • +
                                                      • Browsing history

                                                        Click the history button to view the previously launched applications.

                                                        +

                                                        Browsing history

                                                        • +
                                                      • Configuration button

                                                        Opens the Web Simulator configuration window.

                                                        +

                                                        Web Simulator configuration

                                                        • +
                                                      • Panel visibility button

                                                        Opens the panel visibility window.

                                                        +

                                                        Web Simulator panel visibility

                                                        • +
                                                      • Information button

                                                        Opens the Web Simulator information window.

                                                        +

                                                        Web Simulator information

                                                        • +
                                                      +

                                                      Simulator Configuration Settings

                                                      +

                                                      You can modify the following configuration settings in the Web Simulator configuration window:

                                                      +
                                                        +
                                                      • Configuration management

                                                        Save your configuration settings to the local storage and restore the settings at a later time.

                                                        +

                                                        Configuration settings save and load buttons

                                                        • +
                                                      • Device settings

                                                        Set the device API and device resolution to simulate the device resolution of the target device on the DEVICE tab.

                                                        Note - To provide similar UI rendering on the emulator and the target device, set the emulator resolution to tizen WVGA (480x800) or tizen HD (720x1280), as the viewport property of these resolutions is configured to be the same as the target device's. + To provide similar UI rendering on the emulator and the target device, set the emulator resolution to tizen WVGA (480x800) or tizen HD (720x1280), as the viewport property of these resolutions is configured to be the same as the target device's.
                                                        - -
                                                        • -
                                                      • System settings

                                                        The Tizen System Information API (for mobile and wearable applications) is used to retrieve device and network-related information. Use the SYSTEM SETTINGS tab to set the device status and to test whether your application can retrieve the current device status. You can also test the application listener functions for status change notifications.

                                                        You can modify the following system configuration settings on the SYSTEM SETTINGS tab:

                                                        -
                                                          -
                                                        • CONFIG

                                                          Manage the device vibration and screen lock status.

                                                          • -
                                                        • CPU

                                                          Manually set the CPU load. If the value is set to 0, the CPU is idle. If the value is set to 1, the CPU usage is 100%.

                                                          • + + +
                                                        • System settings

                                                          The Tizen System Information API (for mobile and wearable applications) is used to retrieve device and network-related information. Use the SYSTEM SETTINGS tab to set the device status and to test whether your application can retrieve the current device status. You can also test the application listener functions for status change notifications.

                                                          You can modify the following system configuration settings on the SYSTEM SETTINGS tab:

                                                          +
                                                            +
                                                          • CONFIG

                                                            Manage the device vibration and screen lock status.

                                                            • +
                                                          • CPU

                                                            Manually set the CPU load. If the value is set to 0, the CPU is idle. If the value is set to 1, the CPU usage is 100%.

                                                          • BUILD, LOCALE, DEVICE ORIENTATION, STORAGE, and DISPLAY

                                                            Display the build type, language, country, display orientation, dots per inch (DPI), and device width and height. You can also set the display brightness and storage attributes.

                                                            • -
                                                          • PERIPHERAL

                                                            Display and set the video output.

                                                            • -
                                                          • -
                                                        • Network settings

                                                          Set the network type, Wi-Fi network, cellular network, and SIM card-related configuration options on the NETWORK tab.

                                                          • +
                                                        • PERIPHERAL

                                                          Display and set the video output.

                                                          • +
                                                        • +
                                                      • Network settings

                                                        Set the network type, Wi-Fi network, cellular network, and SIM card-related configuration options on the NETWORK tab.

                                                      -

                                                      Simulator Preferences

                                                      -

                                                      To view the Tizen Web Simulator preferences, select Window > Preferences > Tizen Studio > Web > Simulator in the Tizen Studio.

                                                      -

                                                      Google Chrome™ Settings

                                                      -

                                                      In this section, you can modify Google Chrome™-related preferences.

                                                      -

                                                      Google Chrome™ Location

                                                      -

                                                      Enter the full path to the Google Chrome™ program. When first started, the Tizen Studio attempts to discover the location. However, it can be necessary to enter or modify this value manually.

                                                      -
                                                        -
                                                      • For Linux: /opt/google/chrome/google-chrome.
                                                        • -
                                                      • For Windows® 64-bit: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
                                                        • -
                                                      • For Windows® 32-bit: C:\Program Files\Google\Chrome\Application\chrome.exe
                                                        • -
                                                      -

                                                      Extra Parameters

                                                      -

                                                      The simulator is started with default parameters, including the ones described in the following table.

                                                      -

                                                      Table: Default parameters

                                                      +

                                                      Simulator Preferences

                                                      +

                                                      To view the Tizen Web Simulator preferences, select Window > Preferences > Tizen Studio > Web > Simulator in the Tizen Studio.

                                                      +

                                                      Google Chrome™ Settings

                                                      +

                                                      In this section, you can modify Google Chrome™-related preferences.

                                                      +

                                                      Google Chrome™ Location

                                                      +

                                                      Enter the full path to the Google Chrome™ program. When first started, the Tizen Studio attempts to discover the location. However, it can be necessary to enter or modify this value manually.

                                                      +
                                                        +
                                                      • For Linux: /opt/google/chrome/google-chrome.
                                                        • +
                                                      • For Windows® 64-bit: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
                                                        • +
                                                      • For Windows® 32-bit: C:\Program Files\Google\Chrome\Application\chrome.exe
                                                        • +
                                                      +

                                                      Extra Parameters

                                                      +

                                                      The simulator is started with default parameters, including the ones described in the following table.

                                                      +

                                                      Table: Default parameters

                                                      - - - - - - - - - - - - - - -
                                                      ParametersDescription
                                                      --allow-access-from-files Allows the simulator JavaScript APIs to access files on the disk (such as config.xml and the application icon).
                                                      --disable-web-security Allows the simulator to do cross-domain requests (such as access the map location on another server).
                                                      -

                                                      To add more start-up parameters, enter them in this field.

                                                      -

                                                      Profile Data Location

                                                      -

                                                      Enter the full directory path for the simulator to store user preferences and Web application data.

                                                      + + + Parameters + Description + + + --allow-access-from-files + Allows the simulator JavaScript APIs to access files on the disk (such as config.xml and the application icon). + + + --disable-web-security + Allows the simulator to do cross-domain requests (such as access the map location on another server). + + + +

                                                      To add more start-up parameters, enter them in this field.

                                                      +

                                                      Profile Data Location

                                                      +

                                                      Enter the full directory path for the simulator to store user preferences and Web application data.

                                                      Note Linux users must manually define this parameter instead of using the default value, since the total length of the directory path in Linux is very limited for this parameter. Using the default value can prevent you from launching more than 1 application concurrently. There is no such restriction in the Windows® version.
                                                      - -

                                                      Simulator Settings

                                                      -

                                                      In this section, you can modify simulator-related preferences:

                                                      -
                                                        -
                                                      • Simulator location

                                                        Set whether to use the default version of the simulator, or a custom version.

                                                        -
                                                          -
                                                        • Internal: Use the simulator that is part of the Tizen Studio.
                                                          • -
                                                        • External: Use a custom build or other simulator version. Enter the full path to the index.html file for the version you want to use.
                                                          • -
                                                        • -

                                                      • Selecting Launch simulator in Google Chrome™ application mode launches the simulator without the Google URL bar or tabs at the top. The result is that the simulator appears as a standalone application. The setting has no effect on the simulator features.

                                                        • + +

                                                        Simulator Settings

                                                        +

                                                        In this section, you can modify simulator-related preferences:

                                                        +
                                                          +
                                                        • Simulator location

                                                          Set whether to use the default version of the simulator, or a custom version.

                                                          +
                                                            +
                                                          • Internal: Use the simulator that is part of the Tizen Studio.
                                                            • +
                                                          • External: Use a custom build or other simulator version. Enter the full path to the index.html file for the version you want to use.
                                                            • +
                                                          • +

                                                        • Selecting Launch simulator in Google Chrome™ application mode launches the simulator without the Google URL bar or tabs at the top. The result is that the simulator appears as a standalone application. The setting has no effect on the simulator features.

                                                          • +
                                                        + +

                                                        Tizen API Coverage

                                                        +

                                                        Below is a summary of the Tizen APIs supported in this release. Some APIs are supported with a JavaScript backend and others are provided by Google Chrome™. Tizen also supports W3C/HTML5 Specifications.

                                                        +

                                                        Supported Tizen Web Device API

                                                        +

                                                        The following APIs are implemented by the simulator in JavaScript:

                                                        + +

                                                        Non-supported Tizen Web Device API

                                                        +

                                                        The following APIs are not supported by the current version of the simulator. Support for these APIs is under development.

                                                        +
                                                          +
                                                        • Message Port
                                                          • +
                                                        • Secure Element
                                                        -

                                                        Tizen API Coverage

                                                        -

                                                        Below is a summary of the Tizen APIs supported in this release. Some APIs are supported with a JavaScript backend and others are provided by Google Chrome™. Tizen also supports W3C/HTML5 Specifications.

                                                        -

                                                        Supported Tizen Web Device API

                                                        -

                                                        The following APIs are implemented by the simulator in JavaScript:

                                                        - -

                                                        Non-supported Tizen Web Device API

                                                        -

                                                        The following APIs are not supported by the current version of the simulator. Support for these APIs is under development.

                                                        -
                                                          -
                                                        • Message Port
                                                          • -
                                                        • Secure Element
                                                          • -
                                                        - -

                                                        Web Simulator Known Issues

                                                        -

                                                        The Tizen APIs have the following known issues on the Web simulator:

                                                        -
                                                          -
                                                        • Not all Tizen-specific properties are supported in the Web simulator config.xml configuration file. However, the syntax and values of all Tizen-specific properties are verified. The verification result is displayed in the Application Configuration panel of the widget configuration editor.
                                                          • -
                                                        • You can run only 1 application at a time. If your application uses the Application API to invoke another service or application, use the Web simulator features to simulate results for the required callbacks.
                                                          • -
                                                        • DST (Daylight Saving Time) -related methods of the Time API are not supported.
                                                          • +

                                                          Web Simulator Known Issues

                                                          +

                                                          The Tizen APIs have the following known issues on the Web simulator:

                                                          +
                                                            +
                                                          • Not all Tizen-specific properties are supported in the Web simulator config.xml configuration file. However, the syntax and values of all Tizen-specific properties are verified. The verification result is displayed in the Application Configuration panel of the widget configuration editor.
                                                            • +
                                                          • You can run only 1 application at a time. If your application uses the Application API to invoke another service or application, use the Web simulator features to simulate results for the required callbacks.
                                                            • +
                                                          • DST (Daylight Saving Time) -related methods of the Time API are not supported.
                                                          • For the Messaging module, the attachment is not supported, and the message body is always loaded.
                                                          • If you are using the jQuery Mobile swipe component, the swipe action is simulated by mouse click and unclick events. jQuery Mobile does not recognize swipe actions if they begin or end outside the component, and if the mouse pointer is dragged slowly or not in a straight line.
                                                            • -
                                                          +
                                                        + +

                                                        W3C/HTML5 Specifications

                                                        +

                                                        The following W3C/HTML5 specifications are supported:

                                                        +
                                                          +

                                                        • Widget:

                                                          +
                                                            +

                                                          • The config.xml of a widget is parsed by the simulator and the information is shown in the Application Configuration panel.

                                                            • +
                                                          • +
                                                        • Content (documents, graphics, multimedia): +
                                                            +
                                                          • HTML5 audio
                                                            • +
                                                          • HTML5 video
                                                            • +
                                                          • HTML5 forms
                                                            • +
                                                          • Session History API
                                                            • +
                                                          • HTML5 2D canvas
                                                            • +
                                                          • Inline SVG
                                                            • +
                                                          • +
                                                        • CSS3: +
                                                            +
                                                          • CSS3 2D transforms
                                                            • +
                                                          • CSS3 3D transforms
                                                            • +
                                                          • CSS3 animations
                                                            • +
                                                          • CSS3 transitions
                                                            • +
                                                          • iframe sandbox attribute
                                                            • +
                                                          • HTML5 2D canvas
                                                            • +
                                                          • CSS3 colors
                                                            • +
                                                          • +
                                                        • Device/OS integration: +
                                                            +
                                                          • Geolocation API Specification
                                                            • +
                                                          • Orientation and acceleration
                                                            • +
                                                          • Browser onLine State
                                                            • +
                                                          • Vibration API
                                                            • +
                                                          • Web audio
                                                            • +
                                                          • Web notifications
                                                            • +
                                                          • +
                                                        • Network and communication: +
                                                            +
                                                          • WebSocket API
                                                            • +
                                                          • Web messaging
                                                            • +
                                                          • XMLHttpRequest Level 2
                                                            • +
                                                          • Cross-origin resource sharing (CORS)
                                                            • +
                                                          • Server-sent events
                                                            • +
                                                          • +
                                                        • Storage: +
                                                            +
                                                          • Web storage
                                                            • +
                                                          • File API
                                                            • +
                                                          • File API: directories and system
                                                            • +
                                                          • File API: writer
                                                            • +
                                                          • HTML5 application cache
                                                            • +
                                                          • Web SQL database
                                                            • +
                                                          • Indexed DB API
                                                            • +
                                                          • +
                                                        • Performance: +
                                                            +
                                                          • Web workers
                                                            • +
                                                          • Page Visibility API (via JavaScript backend)
                                                            • +
                                                          • Animation timing control
                                                            • +
                                                          • +
                                                        -

                                                        W3C/HTML5 Specifications

                                                        -

                                                        The following W3C/HTML5 specifications are supported:

                                                        -
                                                          -

                                                        • Widget:

                                                          -
                                                            -

                                                          • The config.xml of a widget is parsed by the simulator and the information is shown in the Application Configuration panel.

                                                            • -
                                                          • -
                                                        • Content (documents, graphics, multimedia): -
                                                            -
                                                          • HTML5 audio
                                                            • -
                                                          • HTML5 video
                                                            • -
                                                          • HTML5 forms
                                                            • -
                                                          • Session History API
                                                            • -
                                                          • HTML5 2D canvas
                                                            • -
                                                          • Inline SVG
                                                            • -
                                                          • -
                                                        • CSS3: -
                                                            -
                                                          • CSS3 2D transforms
                                                            • -
                                                          • CSS3 3D transforms
                                                            • -
                                                          • CSS3 animations
                                                            • -
                                                          • CSS3 transitions
                                                            • -
                                                          • iframe sandbox attribute
                                                            • -
                                                          • HTML5 2D canvas
                                                            • -
                                                          • CSS3 colors
                                                            • -
                                                          • -
                                                        • Device/OS integration: -
                                                            -
                                                          • Geolocation API Specification
                                                            • -
                                                          • Orientation and acceleration
                                                            • -
                                                          • Browser onLine State
                                                            • -
                                                          • Vibration API
                                                            • -
                                                          • Web audio
                                                            • -
                                                          • Web notifications
                                                            • -
                                                          • -
                                                        • Network and communication: -
                                                            -
                                                          • WebSocket API
                                                            • -
                                                          • Web messaging
                                                            • -
                                                          • XMLHttpRequest Level 2
                                                            • -
                                                          • Cross-origin resource sharing (CORS)
                                                            • -
                                                          • Server-sent events
                                                            • -
                                                          • -
                                                        • Storage: -
                                                            -
                                                          • Web storage
                                                            • -
                                                          • File API
                                                            • -
                                                          • File API: directories and system
                                                            • -
                                                          • File API: writer
                                                            • -
                                                          • HTML5 application cache
                                                            • -
                                                          • Web SQL database
                                                            • -
                                                          • Indexed DB API
                                                            • -
                                                          • -
                                                        • Performance: -
                                                            -
                                                          • Web workers
                                                            • -
                                                          • Page Visibility API (via JavaScript backend)
                                                            • -
                                                          • Animation timing control
                                                            • -
                                                          • -
                                                        -
                                                    diff --git a/org.tizen.studio/html/web_tools/web_unit_test_tool_w.htm b/org.tizen.studio/html/web_tools/web_unit_test_tool_w.htm index ae853f8..488bb0d 100644 --- a/org.tizen.studio/html/web_tools/web_unit_test_tool_w.htm +++ b/org.tizen.studio/html/web_tools/web_unit_test_tool_w.htm @@ -5,22 +5,22 @@ - + - Unit Testing Web Applications + Unit Testing Web Applications - +

                                                    Mobile Web Wearable Web

                                                    - + @@ -41,7 +41,7 @@

                                                    If you are implementing a component in your application, you must test it to ensure that it does not behave in an unexpected way. Well-tested applications that perform as expected improve user satisfaction. Testing can also help you develop your applications faster and further, with less wasted effort.

                                                    Creating the Web Unit Test

                                                    - +

                                                    A unit of code is the smallest testable component of your project, such as a class or a method.

                                                    You can create unit tests easily with the Web Unit Test wizard.

                                                    To test your project:

                                                    @@ -51,10 +51,10 @@
                                                  • Select the methods to test from the method list on the right pane.
                                                  • Enter a name for the test file, and click Finish.
                                                    • -

                                                    Figure: Creating a Web unit test

                                                    -

                                                    Creating a Web unit test

                                                    +

                                                    Figure: Creating a Web unit test

                                                    +

                                                    Creating a Web unit test

                                                    The Web unit tests are generated in the webUnitTest folder.

                                                    -

                                                    Figure: Web unit test location

                                                    +

                                                    Figure: Web unit test location

                                                    Web unit test location

                                                    Editing the Web Unit Test

                                                    @@ -74,7 +74,7 @@ test(name, test2);
                                                  • Edit the test2 parameter using assertions.

                                                    An assertion is a Boolean expression that means pass or failure in the test. You can test a value generated by your code with the expected value using a number of assertions provided by the Web unit testing tool.

                                                    • - +
                                                    Note For more information about assertions, see http://api.qunitjs.com/category/assert/. @@ -89,13 +89,13 @@ test(name, test2);

                                                    The Web Unit Test Result view shows the test results in a tree format. It shows the passed tests with a green icon and failed tests with a red icon. To only display the failed tests, you can use the Show failed only button (marked with a red rectangle in the following figure).

                                                    -

                                                    Figure: Web unit test application result

                                                    -

                                                    Web unit test application result

                                                    +

                                                    Figure: Web unit test application result

                                                    +

                                                    Web unit test application result

                                                    To repeat the test, select its check box and click the Run checked button (marked with a red rectangle in the following figure).

                                                    -

                                                    Figure: Repeating a test

                                                    -

                                                    Repeating a test

                                                    +

                                                    Figure: Repeating a test

                                                    +

                                                    Repeating a test

                                                    diff --git a/org.tizen.training/html/cover_page.htm b/org.tizen.training/html/cover_page.htm index 5b6bcb6..e5d4382 100644 --- a/org.tizen.training/html/cover_page.htm +++ b/org.tizen.training/html/cover_page.htm @@ -5,13 +5,13 @@ - + - Tizen Training + Tizen Training @@ -19,7 +19,7 @@

                                                    Mobile Wearable TV Web

                                                    - +

                                                    Content

                                                    -
                                                    +
                                                    - +

                                                    Tizen
                                                    Training

                                                    @@ -59,7 +59,7 @@

                                                    A program built using the Web API is laid out much like a standard Web site with an index.html file that serves as the root, and separate directories for resources, such as JavaScript, CSS, images, and sound resources. This approach makes Web application development in Tizen extremely intuitive for developers with a background in Web development, and makes it easy to quickly write simple applications using high-level languages.

                                                  The following figure illustrates the Tizen architecture model supporting the 2 application types.

                                                  -

                                                  Figure: Tizen architecture

                                                  +

                                                  Figure: Tizen architecture

                                                  Tizen architecture

                                                  The Tizen platform also allows you to develop a hybrid application package where native and Web applications are packaged together to make more powerful applications. The Tizen platform ensures that all Tizen applications have consistent look and feel, regardless of whether you use the native or Web framework to create them.

                                                  @@ -72,9 +72,9 @@

                                                  Figure: Applications using the mobile profile

                                                  Applications using the mobile profile

                                                  - +

                                                  Figure: Applications using the wearable profile

                                                  -

                                                  Applications using the wearable profile

                                                  +

                                                  Applications using the wearable profile

                                                  Tizen Documentation

                                                  @@ -97,59 +97,59 @@
                                                • Tizen Studio

                                                  The Tizen Studio introduces the Tizen development environment and related tools you can use when developing your Tizen application.

                                                  • -
                                                - - -

                                                When using the Tizen documentation, look for the profile icons on the upper right corner of each page. The icons (listed in the following table) indicate which profiles the topic applies to. "N" in the icon stands for the native application profiles and "W" for the Web application profiles.

                                                - -

                                                Table: Tizen profiles

                                                - - - - - - + + + +

                                                When using the Tizen documentation, look for the profile icons on the upper right corner of each page. The icons (listed in the following table) indicate which profiles the topic applies to. "N" in the icon stands for the native application profiles and "W" for the Web application profiles.

                                                + +

                                                Table: Tizen profiles

                                                +
                                                ProfileIcon
                                                + + + + + + + + + + + + + - - - + + + - - - - - - - + + + - - - + + + - - - + + + - - - + + + - - - - - +
                                                ProfileIcon
                                                Mobile native and WebMobile
                                                Wearable native and WebWearable
                                                Mobile native and WebMobile
                                                Mobile nativeMobile Native or Optional mobile native
                                                Wearable native and WebWearable
                                                Mobile nativeMobile Native or Optional mobile native
                                                Wearable nativeWearable Native or Optional wearable native
                                                Wearable nativeWearable Native or Optional wearable native
                                                Mobile WebMobile Web or Optional mobile Web
                                                Mobile WebMobile Web or Optional mobile Web
                                                Wearable WebWearable Web or Optional wearable Web
                                                Wearable WebWearable Web or Optional wearable Web
                                                TV WebTV Web
                                                TV WebTV Web
                                                - +
                                                Note In Tizen native APIs and Web Device mobile and wearable APIs, there are 2 types of APIs: mandatory and optional. The fully gray profile icon (as shown in the table above) refers to an optional API.

                                                The mandatory APIs are always available on all Tizen devices. The optional APIs provide functionality that depends on the available device hardware or software capabilities, and they may not be available in all Tizen devices.

                                                - +

                                                To become familiar with some terms that you encounter throughout this site, see Glossary.

                                                - +
    diff --git a/org.tizen.training/html/index.htm b/org.tizen.training/html/index.htm index 1620104..903363e 100644 --- a/org.tizen.training/html/index.htm +++ b/org.tizen.training/html/index.htm @@ -5,13 +5,13 @@ - + - Training + Training @@ -22,13 +22,13 @@

    Training

    - +

    Native Application

    - +
    +

    Tizen Native Application Model

    @@ -48,18 +48,18 @@

    The following figure shows the UI and service application life-cycle.

    -

    Figure: UI and service application life-cycle

    -

    UI and service application life-cycle

    +

    Figure: UI and service application life-cycle

    +

    UI and service application life-cycle

    -

    A Tizen native application is similar to a conventional Linux application, with some additional features optimized for mobile and wearable devices. -These devices have constraints, such as relatively small screen sizes and lack of system resources compared to a larger system.

    +

    A Tizen native application is similar to a conventional Linux application, with some additional features optimized for mobile and wearable devices. +These devices have constraints, such as relatively small screen sizes and lack of system resources compared to a larger system.

    For example, for power management reasons, well-designed applications reduce resource usage when they detect that their display window is covered by another application window. State change events make the detection possible.

    -

    Native Application Life-cycle

    +

    Native Application Life-cycle

    -

    A Tizen native application can be in one of several different states. Typically, the application is launched by the user from the Launcher, or by another application. When the application is starting, the app_create_cb() function is executed and the main event loop starts. The application normally at the top window, with focus.

    +

    A Tizen native application can be in one of several different states. Typically, the application is launched by the user from the Launcher, or by another application. When the application is starting, the app_create_cb() function is executed and the main event loop starts. The application normally at the top window, with focus.

    When the application loses the focus status, the app_pause_cb() callback is invoked. The application can go into the pause state, which means that your application is not terminated but continues to run on the background, when:

    - +

    • A new application is launched based on a request from your application.

    • The user requests to go to the home screen.

      • @@ -67,12 +67,12 @@ These devices have constraints, such as relatively small screen sizes and lack o

    • An alarm is triggered for another application, which becomes the top-most window and hides your application.

    -

    Since Tizen 2.4, the application on the background goes into a suspended state. In the suspended state, the application process is executed with limited CPU resources. In other words, the platform does not allow the running of the background applications, except for some exceptional applications (such as Media and Download) that necessarily work on the background. In this case, the application can designate their background category as an allowed category to avoid going into the suspended state.

    - +

    Since Tizen 2.4, the application on the background goes into a suspended state. In the suspended state, the application process is executed with limited CPU resources. In other words, the platform does not allow the running of the background applications, except for some exceptional applications (such as Media and Download) that necessarily work on the background. In this case, the application can designate their background category as an allowed category to avoid going into the suspended state.

    +

    When your application becomes visible again, the app_resume_cb() callback is invoked. The visibility returns, when:

      -

    • Another application requests your application to run (for example, the Task Navigator, which shows all running applications and lets user select any application to run).

      • +

    • Another application requests your application to run (for example, the Task Navigator, which shows all running applications and lets user select any application to run).

    • All applications on top of your application in the window stack finish.

    • An alarm is triggered for your application, bringing it to the front and hiding other applications.

    @@ -84,10 +84,10 @@ These devices have constraints, such as relatively small screen sizes and lack o

    Because the service application has no UI, it neither has a pause state. Since Tizen 2.4, the service application can go into the suspended state. Basically, the service application is running on the background by its nature; so the platform does not allow the running of the service application unless it is designated as a background category application. However, when the UI application that is packaged with the service application is running in the foreground, the service application is also regarded as a foreground application and it can be run without a designated background category.

    - -

    Application state changes are managed by the underlying framework. + +

    Application state changes are managed by the underlying framework. For more information about application state transitions, see Application States and Transitions.

    - +

    Starting the Tizen Native Application

    @@ -113,9 +113,9 @@ These devices have constraints, such as relatively small screen sizes and lack o

    The following figure shows how to use the package and application ID.

    -

    Figure: Package ID and application ID

    -

    Package ID and application ID

    - +

    Figure: Package ID and application ID

    +

    Package ID and application ID

    +

    Application Directory Policy

    @@ -124,10 +124,10 @@ These devices have constraints, such as relatively small screen sizes and lack o
  • bin: Executable binary path
  • lib: Library path
  • res: Resource path
    • -
  • data: The application's own directory (read or write); no initial data
    • +
  • data: The application's own directory (read or write); no initial data
  • shared/: For sharing with other applications

    Sandboxing refers to an application package which can access its own directories only. It is used to share resources in the shared directories.

    -

    In sandboxing, SMACK is used, and discretionary access control (DAC) is applied to application package directories and files. The +

    In sandboxing, SMACK is used, and discretionary access control (DAC) is applied to application package directories and files. The uid(root, app) is applied to directories and files.

    • @@ -136,8 +136,8 @@ uid(root, app) is applied to directories and files.

    Permissions

    The installed packages have a user ID, a group ID, permissions, and a smack label.

    -

    Figure: Permissions

    -

    Permissions

    +

    Figure: Permissions

    +

    Permissions

    The following table shows the details of files and directories.

    @@ -211,29 +211,29 @@ uid(root, app) is applied to directories and files.

    1 The {PackageId} is the package ID, such as org.tizen.browser.

    2 {Random} means that there is a 28-byte random string created by the smack module.

    -

    3 {Cert Hash} refers to a 28-byte string where [Raw Hash] equals to Base64Encode (SHA1 author certificate in author-signature.xml) and {Cert Hash} replaces "/" with "#" in [Raw Hash].

    +

    3 {Cert Hash} refers to a 28-byte string where [Raw Hash] equals to Base64Encode (SHA1 author certificate in author-signature.xml) and {Cert Hash} replaces "/" with "#" in [Raw Hash].

    Application Manifest

    The following example shows the beginning of the Tizen manifest schema:

    -<?xml version="1.0" encoding="UTF-8"?>
-<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" targetNamespace="http://tizen.org/ns/packages" xmlns:packages="http://tizen.org/ns/packages">
-   <xs:import namespace="http://www.w3.org/XML/1998/namespace" schemaLocation="xml.xsd"/>
-      <xs:element name="manifest">
-         <xs:complexType>
-            <xs:sequence>
-               <xs:choice maxOccurs="unbounded">
-                  <xs:element ref="packages:label"/>
+<?xml version="1.0" encoding="UTF-8"?>
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" targetNamespace="http://tizen.org/ns/packages" xmlns:packages="http://tizen.org/ns/packages">
+   <xs:import namespace="http://www.w3.org/XML/1998/namespace" schemaLocation="xml.xsd"/>
+      <xs:element name="manifest">
+         <xs:complexType>
+            <xs:sequence>
+               <xs:choice maxOccurs="unbounded">
+                  <xs:element ref="packages:label"/>

    The following example shows the syntax of the manifest reference. The <manifest> element serves as a container for the other configuration elements.

     <manifest xmlns=http://tizen.org/ns/packages
-          package="org.tizen.application"
-          version="1.0.0"
-          api-version="2.3">
    + package="org.tizen.application" + version="1.0.0" + api-version="2.3">

    Signature

    @@ -250,16 +250,16 @@ uid(root, app) is applied to directories and files.

    The following image describes the relationship between the signatures.

    -

    Figure: Signature

    +

    Figure: Signature

    Signature

    - +

    Installer and SMACK

    The following figure describes how the application installer works.

    -

    Figure: Installer

    -

    Installer

    +

    Figure: Installer

    +

    Installer

    The installer applies smack according to the privileges that are specified in the tizen-manifest.xml file.

    An application can only access the resources that are allowed by the privileges. The privileges are used in Tizen Store to show the permissions and receive user consent.

    @@ -270,9 +270,9 @@ uid(root, app) is applied to directories and files.

    You can use shell commands to install, uninstall, update, and launch applications.

    -

    Figure: Tizen Studio interactions

    -

    Tizen Studio interactions

    - +

    Figure: Tizen Studio interactions

    +

    Tizen Studio interactions

    +
    diff --git a/org.tizen.training/html/native/cover_page_n.htm b/org.tizen.training/html/native/cover_page_n.htm index 54fca9b..62babea 100644 --- a/org.tizen.training/html/native/cover_page_n.htm +++ b/org.tizen.training/html/native/cover_page_n.htm @@ -5,25 +5,25 @@ - + - Introduction to Native Applications + Introduction to Native Applications
    -
    +

    Mobile native Wearable native

    - +

    Introduction to Native Applications

    @@ -44,7 +44,7 @@

    Describes the basic characteristics and components of UI development with EFL.

  • Designing Your Native Application -

    Teaches you how to develop a native application using the native UI Builder tool.

    • +

    Teaches you how to develop a native application using the native UI Builder tool.

  • Understanding Tizen Programming

    Introduces the Tizen platform, its architecture, and some useful programming concepts you need to take into account when designing Tizen applications.

    @@ -56,7 +56,7 @@
  • Creating Applications with Contacts

    Demonstrates how you can create applications that handle various people-related information, such as contacts, groups, accounts, and address books.

    • - +
  • Creating Applications with Content Sharing

    Demonstrates how you can create applications with content sharing through application control features or simple NDEF message transfer.

    • diff --git a/org.tizen.training/html/native/details/app_filtering_n.htm b/org.tizen.training/html/native/details/app_filtering_n.htm index 84ed428..cebbcca 100644 --- a/org.tizen.training/html/native/details/app_filtering_n.htm +++ b/org.tizen.training/html/native/details/app_filtering_n.htm @@ -5,13 +5,13 @@ - + - Application Filtering + Application Filtering @@ -27,35 +27,35 @@
  • Profile-based Filtering
    • -
    +

    Application Filtering

    - +

    The Tizen platform provides a wide range of features across a variety of hardware and software components. Among the features, there are some that can be selectively supported by the Tizen device manufacturer. For application stores to correctly select your application for installation on an appropriate device, the feature and profile information must be correctly declared in your application.

    - +

    Feature-based Filtering

    Some features can be selectively supported by the Tizen device manufacturer. To prevent problems when the user is trying to run your application on a device that does not support all the features your application is using, do one of the following:

    • When the application is running, check whether the device supports the needed features. If not, the application can use other features, which are supported by the device, as a workaround.

      For example, if an application wants to use location information, it can check the device capability by using the system_info_get_XXX() function of the System Information API (in mobile and wearable applications). If the device supports GPS, the application uses GPS information, and if the device supports WPS only, the application uses WPS information instead of GPS.

      • -
    • Use feature-based filtering to prevent your application from being shown in the application list on the Tizen Store, if the user's device does not support all the features of your application. This way you can prevent the application from being installed on an unsupportive device in the first place. +
    • Use feature-based filtering to prevent your application from being shown in the application list on the Tizen Store, if the user's device does not support all the features of your application. This way you can prevent the application from being installed on an unsupportive device in the first place.

      Be careful when defining the feature list for feature-based filtering. The feature list can dramatically reduce your chances of getting the application downloaded by reducing the number of devices which can support the application.

    - +

    If the tizen-manifest.xml file of the application package includes a feature list, the Tizen Store compares the capabilities of the device with the required feature conditions of the application. The store only lists the applications whose conditions match the capabilities of the device, and thus prevents unsupported applications from being installed.

    -

    Figure: Feature-based filtering

    -

    Feature-based filtering

    - -

    When multiple features are defined in the feature list for feature-based filtering, the Tizen Store creates the filtering condition for all using the "AND" operation. For example, if there are http://tizen.org/feature/network.nfc and http://tizen.org/feature/network.bluetooth features in the feature list of the application package, only a device that has both those features can show the application on the Tizen Store application list for downloading.

    +

    Figure: Feature-based filtering

    +

    Feature-based filtering

    + +

    When multiple features are defined in the feature list for feature-based filtering, the Tizen Store creates the filtering condition for all using the "AND" operation. For example, if there are http://tizen.org/feature/network.nfc and http://tizen.org/feature/network.bluetooth features in the feature list of the application package, only a device that has both those features can show the application on the Tizen Store application list for downloading.

    Screen Size Feature

    -

    The screen size feature is the only exception to the normal feature handling process described above. When the screen size is defined in the feature list, the Tizen Store creates the filtering condition with the "OR" operation. For example, if the http://tizen.org/feature/screen.size.normal.480.800 and http://tizen.org/feature/screen.size.normal.720.1280 features are defined in your application feature list, a device that supports one or the other of those features can show the application on the Tizen Store application list.

    +

    The screen size feature is the only exception to the normal feature handling process described above. When the screen size is defined in the feature list, the Tizen Store creates the filtering condition with the "OR" operation. For example, if the http://tizen.org/feature/screen.size.normal.480.800 and http://tizen.org/feature/screen.size.normal.720.1280 features are defined in your application feature list, a device that supports one or the other of those features can show the application on the Tizen Store application list.

    If you do not specify a proper screen size in the tizen-manifest.xml file, your application can be rejected from the Tizen store.

    The following table lists the available screen size features.

    - +

    Table: Available screen size features

    @@ -72,19 +72,19 @@ - + - + - + - +
    2.2.1
    http://tizen.org/feature/screen.size.normal.240.400http://tizen.org/feature/screen.size.normal.240.400 Specify this key, if the application supports the 240 x 400 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    		 2.2.1
    http://tizen.org/feature/screen.size.normal.320.320 Specify this key, if the application supports the 320 x 320 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    		 2.3
    http://tizen.org/feature/screen.size.normal.320.480 Specify this key, if the application supports the 320 x 480 resolution on the normal screen size. @@ -102,7 +102,7 @@ Specify this key, if the application supports the 360 x 480 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    		 2.3
    http://tizen.org/feature/screen.size.normal.480.800 Specify this key, if the application supports the 480 x 800 resolution on the normal screen size. @@ -142,8 +142,8 @@
    - -

    Feature Hierarchy

    + +

    Feature Hierarchy

    The feature keys have a hierarchy. For example, consider the http://tizen.org/feature/location, http://tizen.org/feature/location.gps, and http://tizen.org/feature/location.wps features:

      @@ -151,88 +151,88 @@
    • If the feature list includes the http://tizen.org/feature/location feature, a device which has the http://tizen.org/feature/location.gps, http://tizen.org/feature/location.wps, or http://tizen.org/feature/location feature can show the application on the Tizen Store application list.

      This means that the Tizen Store considers the http://tizen.org/feature/location feature as the http://tizen.org/feature/location.gps OR http://tizen.org/feature/location.wps feature. (If the feature list includes the http://tizen.org/feature/location.gps and http://tizen.org/feature/location.wps features together, only a device which supports both those features can show the application.)

    -

    Adding the Feature List

    - -

    To enable filtering for your native application, add the feature list for the application tizen-manifest.xml file:

    +

    Adding the Feature List

    + +

    To enable filtering for your native application, add the feature list for the application tizen-manifest.xml file:

    1. To open the manifest editor in the Tizen Studio, double-click the tizen-manifest.xml file in the Project Explorer view.
    2. In the Features tab, click Add and set the mandatory features for the application package.

      The manifest file (tizen-manifest.xml) is updated automatically.

      -
      3. -
    3. Upload and publish the application package on the Tizen Store.
      4. -
    4. If a Tizen-powered device requests applications, the store displays a list containing only applications compatible with the user's device.
      5. + +
    5. Upload and publish the application package on the Tizen Store.
      6. +
    6. If a Tizen-powered device requests applications, the store displays a list containing only applications compatible with the user's device.
    -

    The following tables show the available requirements for an application package. If you want to check which features are necessary for using a specific API, see the related feature in the native API Reference.

    +

    The following tables show the available requirements for an application package. If you want to check which features are necessary for using a specific API, see the related feature in the native API Reference.

    Table: Available mobile native requirements

    - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - - + + - - + + - - + + @@ -241,103 +241,103 @@ - - + + - - + + - + - + - - + + - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - - + + - - + + - + - - + + - - + + @@ -351,84 +351,84 @@ - - + + - - + + - + - - + + - - - + + + - - + + - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - + @@ -450,77 +450,77 @@ - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - + - - + + - + + - + + @@ -531,68 +531,68 @@ - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - - + + - - + + - - + + @@ -601,168 +601,168 @@ - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - + - + - - + + - - + + - + - + - - + + - - + + - + - - + + - - + + - - + + - + - - + + - - + + - + - - + + - + - - + + - - + + - + - - + + - + - + - - + + - - + + - - + + - + - - + + - - + + - + - + - + - - + + - - + + - - + + - - + + @@ -776,93 +776,93 @@ - + - - + + - + - + - - + + - - + + - + - + - - + + - - + + - + - + - - + + - - + + - - + + - - + + - - + + - - + + - + - + - + - + - - + + - - + + @@ -872,188 +872,188 @@
    Feature keyDescriptionFeature keyDescription Since
    http://tizen.org/feature/cameraSpecify this key, if the application requires any kind of a camera.http://tizen.org/feature/cameraSpecify this key, if the application requires any kind of a camera. 2.2.1
    http://tizen.org/feature/camera.backSpecify this key, if the application requires a back-facing camera.http://tizen.org/feature/camera.backSpecify this key, if the application requires a back-facing camera. 2.2.1
    http://tizen.org/feature/camera.back.flashSpecify this key, if the application requires a back-facing camera with a flash.http://tizen.org/feature/camera.back.flashSpecify this key, if the application requires a back-facing camera with a flash. 2.2.1
    http://tizen.org/feature/camera.frontSpecify this key, if the application requires a front-facing camera.http://tizen.org/feature/camera.frontSpecify this key, if the application requires a front-facing camera. 2.2.1
    http://tizen.org/feature/camera.front.flashSpecify this key, if the application requires a front-facing camera with a flash.http://tizen.org/feature/camera.front.flashSpecify this key, if the application requires a front-facing camera with a flash. 2.2.1
    http://tizen.org/feature/consumer_irSpecify this key, if the application requires the Consumer Infrared (CIR) feature.http://tizen.org/feature/consumer_irSpecify this key, if the application requires the Consumer Infrared (CIR) feature. 3.0
    http://tizen.org/feature/convergence.d2dSpecify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices.http://tizen.org/feature/convergence.d2dSpecify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices. 3.0
    http://tizen.org/feature/database.encryptionSpecify this key, if the application requires the database encryption feature.http://tizen.org/feature/database.encryptionSpecify this key, if the application requires the database encryption feature. 2.2.1
    http://tizen.org/feature/fido.uafSpecify this key, if the application requires the FIDO (Fast Identity Online) UAF (Universal Authentication Framework) client API.http://tizen.org/feature/fido.uafSpecify this key, if the application requires the FIDO (Fast Identity Online) UAF (Universal Authentication Framework) client API. 3.0
    http://tizen.org/feature/fmradioSpecify this key, if the application requires an FM radio.http://tizen.org/feature/fmradioSpecify this key, if the application requires an FM radio. 2.2.1
    http://tizen.org/feature/graphics.accelerationSpecify this key, if the application requires hardware acceleration for both 2D and 3D graphics.http://tizen.org/feature/graphics.accelerationSpecify this key, if the application requires hardware acceleration for both 2D and 3D graphics. 2.2.1
    http://tizen.org/feature/input.keyboardSpecify this key, if the application requires a built-in physical keyboard.http://tizen.org/feature/input.keyboardSpecify this key, if the application requires a built-in physical keyboard. 2.2.1
    http://tizen.org/feature/input.keyboard.layoutSpecify this key with a specific keyboard layout (string type), if the application requires a built-in physical keyboard supporting the specified keyboard layout.http://tizen.org/feature/input.keyboard.layoutSpecify this key with a specific keyboard layout (string type), if the application requires a built-in physical keyboard supporting the specified keyboard layout. 2.2.1
    3.0
    http://tizen.org/feature/ledSpecify this key, if the application requires a LED.http://tizen.org/feature/ledSpecify this key, if the application requires a LED. 2.3
    http://tizen.org/feature/locationSpecify this key, if the application requires any location positioning features.http://tizen.org/feature/locationSpecify this key, if the application requires any location positioning features. 2.2.1
    http://tizen.org/feature/location.batchhttp://tizen.org/feature/location.batch Specify this key, if the application requires the location tracking with a position batch information feature.2.32.3
    http://tizen.org/feature/location.geofenceSpecify this key, if the application requires the geofence feature.http://tizen.org/feature/location.geofenceSpecify this key, if the application requires the geofence feature. 2.4
    http://tizen.org/feature/location.gpsSpecify this key, if the application requires the Global Positioning System (GPS) feature.http://tizen.org/feature/location.gpsSpecify this key, if the application requires the Global Positioning System (GPS) feature. 2.2.1
    http://tizen.org/feature/location.wpsSpecify this key, if the application requires the Wi-Fi-based Positioning System (WPS) feature.http://tizen.org/feature/location.wpsSpecify this key, if the application requires the Wi-Fi-based Positioning System (WPS) feature. 2.2.1
    http://tizen.org/feature/mapsSpecify this key, if the application requires the map service feature.http://tizen.org/feature/mapsSpecify this key, if the application requires the map service feature. 2.3.2
    http://tizen.org/feature/microphoneSpecify this key, if the application requires a microphone.http://tizen.org/feature/microphoneSpecify this key, if the application requires a microphone. 2.2.1
    http://tizen.org/feature/multimedia.transcoderSpecify this key, if the application requires the multimedia transcoder feature.http://tizen.org/feature/multimedia.transcoderSpecify this key, if the application requires the multimedia transcoder feature. 2.3
    http://tizen.org/feature/multi_point_touch.pinch_zoomSpecify this key, if the application requires a pinch-zoom gesture feature.http://tizen.org/feature/multi_point_touch.pinch_zoomSpecify this key, if the application requires a pinch-zoom gesture feature. 2.2.1
    http://tizen.org/feature/multi_point_touch.point_countSpecify this key with a specific number (int type), if the application requires the minimum of specified number of simultaneous touches in a multi-point touch.http://tizen.org/feature/multi_point_touch.point_countSpecify this key with a specific number (int type), if the application requires the minimum of specified number of simultaneous touches in a multi-point touch. 2.2.1
    http://tizen.org/feature/network.bluetoothSpecify this key, if the application requires the Bluetooth feature.http://tizen.org/feature/network.bluetoothSpecify this key, if the application requires the Bluetooth feature. 2.2.1
    http://tizen.org/feature/network.bluetooth.audio.callSpecify this key, if the application requires the Bluetooth Handsfree feature (HFP).http://tizen.org/feature/network.bluetooth.audio.callSpecify this key, if the application requires the Bluetooth Handsfree feature (HFP). 2.3
    http://tizen.org/feature/network.bluetooth.audio.controllerSpecify this key, if the application requires the Bluetooth Advanced Audio Distribution (A2DP) sink feature and the Bluetooth Audio Video Remote Control (AVRCP) controller feature.http://tizen.org/feature/network.bluetooth.audio.controllerSpecify this key, if the application requires the Bluetooth Advanced Audio Distribution (A2DP) sink feature and the Bluetooth Audio Video Remote Control (AVRCP) controller feature. 3.0
    http://tizen.org/feature/network.bluetooth.audio.mediaSpecify this key, if the application requires the Bluetooth Advanced Audio feature (A2DP).http://tizen.org/feature/network.bluetooth.audio.mediaSpecify this key, if the application requires the Bluetooth Advanced Audio feature (A2DP). 2.3
    http://tizen.org/feature/network.bluetooth.healthSpecify this key, if the application requires the Bluetooth Health feature (HDP).http://tizen.org/feature/network.bluetooth.healthSpecify this key, if the application requires the Bluetooth Health feature (HDP). 2.3
    http://tizen.org/feature/network.bluetooth.hidSpecify this key, if the application requires the Bluetooth Human Input Device feature (HID).http://tizen.org/feature/network.bluetooth.hidSpecify this key, if the application requires the Bluetooth Human Input Device feature (HID). 2.3
    http://tizen.org/feature/network.bluetooth.leSpecify this key, if the application requires the Bluetooth LE feature.http://tizen.org/feature/network.bluetooth.leSpecify this key, if the application requires the Bluetooth LE feature. 2.3
    http://tizen.org/feature/network.bluetooth.oppSpecify this key, if the application requires the Bluetooth Object Push feature (OPP).http://tizen.org/feature/network.bluetooth.oppSpecify this key, if the application requires the Bluetooth Object Push feature (OPP). 2.3
    http://tizen.org/feature/network.ethernetSpecify this key, if the application requires the ethernet connection.http://tizen.org/feature/network.ethernetSpecify this key, if the application requires the ethernet connection. 2.4
    3.0
    http://tizen.org/feature/network.nfcSpecify this key, if the application requires the use of any API that, in turn, requires the Near Field Communication (NFC) feature.http://tizen.org/feature/network.nfcSpecify this key, if the application requires the use of any API that, in turn, requires the Near Field Communication (NFC) feature. 2.2.1
    http://tizen.org/feature/network.nfc.card_emulationSpecify this key, if the application requires the NFC card emulation feature.http://tizen.org/feature/network.nfc.card_emulationSpecify this key, if the application requires the NFC card emulation feature. 2.3
    http://tizen.org/feature/network.nfc.card_emulation.hce Specify this key, if the application requires the NFC host-based card emulation feature. 2.3.1
    http://tizen.org/feature/network.nfc.p2pSpecify this key, if the application requires the NFC p2p feature.http://tizen.org/feature/network.nfc.p2pSpecify this key, if the application requires the NFC p2p feature. 2.3.1
    http://tizen.org/feature/network.nfc.reserved_pushSpecify this key, if the application requires the NFC reserved push feature.2.2.1
    http://tizen.org/feature/network.nfc.reserved_pushSpecify this key, if the application requires the NFC reserved push feature.2.2.1
    http://tizen.org/feature/network.nfc.tagSpecify this key, if the application requires the NFC tag feature.http://tizen.org/feature/network.nfc.tagSpecify this key, if the application requires the NFC tag feature. 2.3.1
    http://tizen.org/feature/network.pushhttp://tizen.org/feature/network.push Specify this key, if the application requires the network-based push service. 2.2.1
    http://tizen.org/feature/network.secure_elementSpecify this key, if the application requires the secure element feature.http://tizen.org/feature/network.secure_elementSpecify this key, if the application requires the secure element feature. 2.2.1
    http://tizen.org/feature/network.secure_element.eseSpecify this key, if the application requires the ESE secure element feature.http://tizen.org/feature/network.secure_element.eseSpecify this key, if the application requires the ESE secure element feature. 2.3
    http://tizen.org/feature/network.secure_element.uiccSpecify this key, if the application requires the UICC secure element feature.http://tizen.org/feature/network.secure_element.uiccSpecify this key, if the application requires the UICC secure element feature. 2.3
    http://tizen.org/feature/network.service_discovery.dnssdSpecify this key, if the application requires the DNS-based Service Discovery Feature (DNSSD).http://tizen.org/feature/network.service_discovery.dnssdSpecify this key, if the application requires the DNS-based Service Discovery Feature (DNSSD). 3.0
    http://tizen.org/feature/network.service_discovery.ssdpSpecify this key, if the application requires the Simple Service Discovery Protocol feature (SSDP).http://tizen.org/feature/network.service_discovery.ssdpSpecify this key, if the application requires the Simple Service Discovery Protocol feature (SSDP). 3.0
    http://tizen.org/feature/network.telephonySpecify this key, if the application requires the use of any API that, in turn, requires the telephony feature.http://tizen.org/feature/network.telephonySpecify this key, if the application requires the use of any API that, in turn, requires the telephony feature. 2.2.1
    http://tizen.org/feature/network.telephony.mmsSpecify this key, if the application requires the MMS feature.http://tizen.org/feature/network.telephony.mmsSpecify this key, if the application requires the MMS feature. 2.2.1
    http://tizen.org/feature/network.telephony.smsSpecify this key, if the application requires the SMS feature.http://tizen.org/feature/network.telephony.smsSpecify this key, if the application requires the SMS feature. 2.4
    http://tizen.org/feature/network.telephony.sms.cbsSpecify this key, if the application requires the SMS Cell Broadcast Service (CBS) feature.http://tizen.org/feature/network.telephony.sms.cbsSpecify this key, if the application requires the SMS Cell Broadcast Service (CBS) feature. 2.2.1
    http://tizen.org/feature/network.tethering Specify this key, if the application requires any kind of tethering feature.2.3
    http://tizen.org/feature/network.vpnSpecify this key, if the application requires the Virtual Private Network feature (VPN).http://tizen.org/feature/network.vpnSpecify this key, if the application requires the Virtual Private Network feature (VPN). 3.0
    http://tizen.org/feature/network.wifiSpecify this key, if the application requires the use of any API that, in turn, requires the Wi-Fi feature.http://tizen.org/feature/network.wifiSpecify this key, if the application requires the use of any API that, in turn, requires the Wi-Fi feature. 2.2.1
    http://tizen.org/feature/network.wifi.directSpecify this key, if the application requires the Wi-Fi Direct™ feature.http://tizen.org/feature/network.wifi.directSpecify this key, if the application requires the Wi-Fi Direct™ feature. 2.2.1
    http://tizen.org/feature/network.wifi.direct.displaySpecify this key, if the application requires the Wi-Fi Direct™ display feature.http://tizen.org/feature/network.wifi.direct.displaySpecify this key, if the application requires the Wi-Fi Direct™ display feature. 2.3
    http://tizen.org/feature/network.wifi.direct.service_discoverySpecify this key, if the application requires the Wi-Fi Direct™ service discovery feature.http://tizen.org/feature/network.wifi.direct.service_discoverySpecify this key, if the application requires the Wi-Fi Direct™ service discovery feature. 2.3
    http://tizen.org/feature/network.wifi.tdlsSpecify this key, if the application requires the Wi-Fi Tunneled Direct Link Setup (TDLS).http://tizen.org/feature/network.wifi.tdlsSpecify this key, if the application requires the Wi-Fi Tunneled Direct Link Setup (TDLS). 3.0
    http://tizen.org/feature/opengles.texture_format.3dcSpecify this key, if the application requires the 3DC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.3dcSpecify this key, if the application requires the 3DC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.atcSpecify this key, if the application requires the ATC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.atcSpecify this key, if the application requires the ATC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.etcSpecify this key, if the application requires the ETC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.etcSpecify this key, if the application requires the ETC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.ptcSpecify this key, if the application requires the PTC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.ptcSpecify this key, if the application requires the PTC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.pvrtchttp://tizen.org/feature/opengles.texture_format.pvrtc Specify this key, if the application requires the PVRTC texture format for OpenGL® ES.2.2.12.2.1
    http://tizen.org/feature/opengles.texture_format.utcSpecify this key, if the application requires the UTC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.utcSpecify this key, if the application requires the UTC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.version.1_1http://tizen.org/feature/opengles.version.1_1 Specify this key, if the application requires OpenGL® ES version 1.1 at minimum.

    You can specify at most 1 openGL® ES version. If you specify multiple versions, only the highest one is considered.

    -     		2.2.1
    http://tizen.org/feature/opengles.version.2_0http://tizen.org/feature/opengles.version.2_0 Specify this key, if the application requires OpenGL® ES version 2.0.

    You can specify at most 1 openGL® ES version. If you specify multiple versions, only the highest one is considered.

    -     		2.2.1
    2.4
    http://tizen.org/feature/platform.core.cpu.arch.armv7Specify this key, if the application requires the ARMv7 CPU architecture.http://tizen.org/feature/platform.core.cpu.arch.armv7Specify this key, if the application requires the ARMv7 CPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.cpu.arch.x86Specify this key, if the application requires the x86 CPU architecture.http://tizen.org/feature/platform.core.cpu.arch.x86Specify this key, if the application requires the x86 CPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.sse2Specify this key, if the application requires the SSE2 Floating Point Unit (FPU) architecture.http://tizen.org/feature/platform.core.fpu.arch.sse2Specify this key, if the application requires the SSE2 Floating Point Unit (FPU) architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.sse3Specify this key, if the application requires the SSE3 FPU architecture.http://tizen.org/feature/platform.core.fpu.arch.sse3Specify this key, if the application requires the SSE3 FPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.ssse3Specify this key, if the application requires the SSSE3 FPU architecture.http://tizen.org/feature/platform.core.fpu.arch.ssse3Specify this key, if the application requires the SSSE3 FPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.vfpv3Specify this key, if the application requires the VFPv3 FPU architecture.http://tizen.org/feature/platform.core.fpu.arch.vfpv3Specify this key, if the application requires the VFPv3 FPU architecture. 2.2.1
    http://tizen.org/feature/platform.native.osp_compatibleSpecify this key, if the application requires OSP compatibility (the bada compatibility mode).http://tizen.org/feature/platform.native.osp_compatibleSpecify this key, if the application requires OSP compatibility (the bada compatibility mode). 2.2.1
    http://tizen.org/feature/screen.auto_rotationSpecify this key, if the application requires the automatic screen rotation feature.http://tizen.org/feature/screen.auto_rotationSpecify this key, if the application requires the automatic screen rotation feature. 2.2.1
    http://tizen.org/feature/screen.size.allSpecify this key, if the application supports all possible current and future screen sizes and all possible current and future resolutions per screen size.http://tizen.org/feature/screen.size.allSpecify this key, if the application supports all possible current and future screen sizes and all possible current and future resolutions per screen size. 2.2.1
    http://tizen.org/feature/screen.size.normalSpecify this key, if the application supports all possible current and future resolutions on the normal screen size.http://tizen.org/feature/screen.size.normalSpecify this key, if the application supports all possible current and future resolutions on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.240.400Specify this key, if the application supports the 240 x 400 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.240.400Specify this key, if the application supports the 240 x 400 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.320.320Specify this key, if the application supports the 320 x 320 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.320.320Specify this key, if the application supports the 320 x 320 resolution on the normal screen size. 2.3
    http://tizen.org/feature/screen.size.normal.320.480Specify this key, if the application supports the 320 x 480 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.320.480Specify this key, if the application supports the 320 x 480 resolution on the normal screen size. 2.2.1
    2.3.2
    http://tizen.org/feature/screen.size.normal.360.480Specify this key, if the application supports the 360 x 480 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.360.480Specify this key, if the application supports the 360 x 480 resolution on the normal screen size. 2.3
    http://tizen.org/feature/screen.size.normal.480.800Specify this key, if the application supports the 480 x 800 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.480.800Specify this key, if the application supports the 480 x 800 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.540.960Specify this key, if the application supports the 540 x 960 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.540.960Specify this key, if the application supports the 540 x 960 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.600.1024Specify this key, if the application supports the 600 x 1024 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.600.1024Specify this key, if the application supports the 600 x 1024 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.720.1280Specify this key, if the application supports the 720 x 1280 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.720.1280Specify this key, if the application supports the 720 x 1280 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.1080.1920Specify this key, if the application supports the 1080 x 1920 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.1080.1920Specify this key, if the application supports the 1080 x 1920 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/sensor.accelerometerSpecify this key, if the application requires an acceleration sensor.http://tizen.org/feature/sensor.accelerometerSpecify this key, if the application requires an acceleration sensor. 2.2.1
    http://tizen.org/feature/sensor.accelerometer.wakeupSpecify this key, if the application requires the acceleration sensor wake-up feature.http://tizen.org/feature/sensor.accelerometer.wakeupSpecify this key, if the application requires the acceleration sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.activity_recognitionhttp://tizen.org/feature/sensor.activity_recognition Specify this key, if the application requires an activity recognition sensor.2.3
    2.3
    http://tizen.org/feature/sensor.barometerhttp://tizen.org/feature/sensor.barometer Specify this key, if the application requires a barometer sensor.2.2.12.2.1
    http://tizen.org/feature/sensor.barometer.wakeupSpecify this key, if the application requires the barometer sensor wake-up feature.http://tizen.org/feature/sensor.barometer.wakeupSpecify this key, if the application requires the barometer sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.geomagnetic_rotation_vectorSpecify this key, if the application requires a geomagnetic-based rotation vector sensor.http://tizen.org/feature/sensor.geomagnetic_rotation_vectorSpecify this key, if the application requires a geomagnetic-based rotation vector sensor. 2.4
    http://tizen.org/feature/sensor.gesture_recognitionhttp://tizen.org/feature/sensor.gesture_recognition Specify this key, if the application requires a gesture recognition sensor.2.3
    2.3
    http://tizen.org/feature/sensor.gravitySpecify this key, if the application requires a gravity sensor.http://tizen.org/feature/sensor.gravitySpecify this key, if the application requires a gravity sensor. 2.3
    http://tizen.org/feature/sensor.gyroscopeSpecify this key, if the application requires a gyro sensor.http://tizen.org/feature/sensor.gyroscopeSpecify this key, if the application requires a gyro sensor. 2.2.1
    http://tizen.org/feature/sensor.gyroscope_rotation_vectorSpecify this key, if the application requires a gyroscope-based rotation vector sensor.http://tizen.org/feature/sensor.gyroscope_rotation_vectorSpecify this key, if the application requires a gyroscope-based rotation vector sensor. 2.4
    http://tizen.org/feature/sensor.gyroscope.uncalibratedSpecify this key, if the application requires an uncalibrated gyroscope sensor.http://tizen.org/feature/sensor.gyroscope.uncalibratedSpecify this key, if the application requires an uncalibrated gyroscope sensor. 2.4
    http://tizen.org/feature/sensor.gyroscope.wakeupSpecify this key, if the application requires the gyro sensor wake-up feature.http://tizen.org/feature/sensor.gyroscope.wakeupSpecify this key, if the application requires the gyro sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.heart_rate_monitorSpecify this key, if the application requires a heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitorSpecify this key, if the application requires a heart rate monitor sensor. 2.3
    http://tizen.org/feature/sensor.heart_rate_monitor.led_greenSpecify this key, if the application requires the LED green heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitor.led_greenSpecify this key, if the application requires the LED green heart rate monitor sensor. 2.3.1
    http://tizen.org/feature/sensor.heart_rate_monitor.led_irSpecify this key, if the application requires the LED infrared heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitor.led_irSpecify this key, if the application requires the LED infrared heart rate monitor sensor. 2.3.1
    http://tizen.org/feature/sensor.heart_rate_monitor.led_redSpecify this key, if the application requires the LED red heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitor.led_redSpecify this key, if the application requires the LED red heart rate monitor sensor. 2.3.1
    http://tizen.org/feature/sensor.humiditySpecify this key, if the application requires a humidity sensor.http://tizen.org/feature/sensor.humiditySpecify this key, if the application requires a humidity sensor. 2.3
    http://tizen.org/feature/sensor.linear_accelerationhttp://tizen.org/feature/sensor.linear_acceleration Specify this key, if the application requires a linear acceleration sensor.2.3
    2.3
    http://tizen.org/feature/sensor.magnetometerSpecify this key, if the application requires a magnetic sensor.http://tizen.org/feature/sensor.magnetometerSpecify this key, if the application requires a magnetic sensor. 2.2.1
    http://tizen.org/feature/sensor.magnetometer.uncalibratedSpecify this key, if the application requires an uncalibrated geomagnetic sensor.http://tizen.org/feature/sensor.magnetometer.uncalibratedSpecify this key, if the application requires an uncalibrated geomagnetic sensor. 2.4
    http://tizen.org/feature/sensor.magnetometer.wakeupSpecify this key, if the application requires the magnetic sensor wake-up feature.http://tizen.org/feature/sensor.magnetometer.wakeupSpecify this key, if the application requires the magnetic sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.pedometerSpecify this key, if the application requires a pedometer sensor.http://tizen.org/feature/sensor.pedometerSpecify this key, if the application requires a pedometer sensor. 2.3
    http://tizen.org/feature/sensor.photometerhttp://tizen.org/feature/sensor.photometer Specify this key, if the application requires a photometer sensor.2.2.12.2.1
    http://tizen.org/feature/sensor.photometer.wakeupSpecify this key, if the application requires the photometer sensor wake-up feature.http://tizen.org/feature/sensor.photometer.wakeupSpecify this key, if the application requires the photometer sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.proximitySpecify this key, if the application requires a proximity sensor.http://tizen.org/feature/sensor.proximitySpecify this key, if the application requires a proximity sensor. 2.2.1
    http://tizen.org/feature/sensor.proximity.wakeupSpecify this key, if the application requires the proximity sensor wake-up feature.http://tizen.org/feature/sensor.proximity.wakeupSpecify this key, if the application requires the proximity sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.rotation_vectorSpecify this key, if the application requires a rotation vector sensor.http://tizen.org/feature/sensor.rotation_vectorSpecify this key, if the application requires a rotation vector sensor. 2.3
    3.0
    http://tizen.org/feature/sensor.temperaturehttp://tizen.org/feature/sensor.temperature Specify this key, if the application requires a temperature sensor.2.3
    2.3
    http://tizen.org/feature/sensor.tiltmeterhttp://tizen.org/feature/sensor.tiltmeter Specify this key, if the application requires a tilt sensor.2.2.12.2.1
    http://tizen.org/feature/sensor.tiltmeter.wakeupSpecify this key, if the application requires the tilt sensor wake-up feature.http://tizen.org/feature/sensor.tiltmeter.wakeupSpecify this key, if the application requires the tilt sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.ultravioletSpecify this key, if the application requires a ultraviolet sensor.http://tizen.org/feature/sensor.ultravioletSpecify this key, if the application requires a ultraviolet sensor. 2.3
    http://tizen.org/feature/sensor.wrist_uphttp://tizen.org/feature/sensor.wrist_up Specify this key, if the application requires a wrist up sensor.2.32.3
    http://tizen.org/feature/shell.appwidgetSpecify this key, if the application requires the AppWidget (Dynamic Box) feature.http://tizen.org/feature/shell.appwidgetSpecify this key, if the application requires the AppWidget (Dynamic Box) feature. 2.2.1
    http://tizen.org/feature/sip.voipSpecify this key, if the application requires the Voice Over Internet Protocol (VOIP) feature.http://tizen.org/feature/sip.voipSpecify this key, if the application requires the Voice Over Internet Protocol (VOIP) feature. 2.2.1
    http://tizen.org/feature/speech.controlhttp://tizen.org/feature/speech.control Specify this key, if the application requires the voice control feature.2.42.4
    http://tizen.org/feature/speech.recognitionSpecify this key, if the application requires the speech recognition (STT) feature.http://tizen.org/feature/speech.recognitionSpecify this key, if the application requires the speech recognition (STT) feature. 2.2.1
    http://tizen.org/feature/speech.synthesisSpecify this key, if the application requires the speech synthesis (text to speech, TTS) feature.http://tizen.org/feature/speech.synthesisSpecify this key, if the application requires the speech synthesis (text to speech, TTS) feature. 2.2.1
    http://tizen.org/feature/usb.accessorySpecify this key, if the application requires the USB client (or accessory) feature.http://tizen.org/feature/usb.accessorySpecify this key, if the application requires the USB client (or accessory) feature. 2.2.1
    http://tizen.org/feature/usb.hostSpecify this key, if the application requires the USB host feature.http://tizen.org/feature/usb.hostSpecify this key, if the application requires the USB host feature. 2.2.1
    http://tizen.org/feature/vision.barcode_detectionSpecify this key, if the application requires the barcode detection feature.http://tizen.org/feature/vision.barcode_detectionSpecify this key, if the application requires the barcode detection feature. 2.4
    http://tizen.org/feature/vision.barcode_generationSpecify this key, if the application requires the barcode generation feature.http://tizen.org/feature/vision.barcode_generationSpecify this key, if the application requires the barcode generation feature. 2.4
    http://tizen.org/feature/vision.face_recognitionhttp://tizen.org/feature/vision.face_recognition Specify this key, if the application requires the face recognition feature.2.2.12.2.1
    http://tizen.org/feature/vision.image_recognitionhttp://tizen.org/feature/vision.image_recognition Specify this key, if the application requires the image recognition feature. 2.2.1
    http://tizen.org/feature/vision.qrcode_generationSpecify this key, if the application requires the QR code generation feature.http://tizen.org/feature/vision.qrcode_generationSpecify this key, if the application requires the QR code generation feature. 2.2.1
    http://tizen.org/feature/vision.qrcode_recognitionSpecify this key, if the application requires the QR code recognition feature.http://tizen.org/feature/vision.qrcode_recognitionSpecify this key, if the application requires the QR code recognition feature. 2.2.1
    - - + + - - + + - - + + - + - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - - + + - + - + - + - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - - + + - - + + - - + + - + - - + + - - + + - - + + @@ -1065,143 +1065,143 @@ - + - - + + - - + + - + - - + + - - - + + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - - + + + - - + + - + + - + + @@ -1210,80 +1210,80 @@

    You can specify at most 1 openGL® ES version. If you specify multiple versions, only the highest one is considered.

    - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - + - + - + - - + + - + - - + + - - + + - - + + - - + + @@ -1292,258 +1292,258 @@ - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - - - + + + + - - - + + + - - + + - - + + - + - - - - + + + + - - + + - + - - + + - - + + - - + + - + - - + + - - + + - + - - + + - + - - + + - + - - + + - + - - + + - + - - - - + + + + - - + + - - + + - + - - + + - - + + - + - - - + + + - - + + - - + + - - + + - - + + - + - - - - + + + + - - - + + + - - + + - - + + - - - + + + - - + + - - + + - - - - + + + + - - + + - - + + - - + + - - + + - - + + - - + + - + - - - + + + - - + + - - + + - - + + @@ -1561,27 +1561,27 @@ - - + + - - + + - - + + - - + +
    Feature keyDescriptionFeature keyDescription Since
    http://tizen.org/feature/cameraSpecify this key, if the application requires any kind of a camera.http://tizen.org/feature/cameraSpecify this key, if the application requires any kind of a camera. 2.2.1
    http://tizen.org/feature/camera.backSpecify this key, if the application requires a back-facing camera.http://tizen.org/feature/camera.backSpecify this key, if the application requires a back-facing camera. 2.2.1
    http://tizen.org/feature/camera.back.flashhttp://tizen.org/feature/camera.back.flash Specify this key, if the application requires a back-facing camera with a flash.2.2.12.2.1
    http://tizen.org/feature/camera.frontSpecify this key, if the application requires a front-facing camera.http://tizen.org/feature/camera.frontSpecify this key, if the application requires a front-facing camera. 2.2.1
    http://tizen.org/feature/camera.front.flashSpecify this key, if the application requires a front-facing camera with a flash.http://tizen.org/feature/camera.front.flashSpecify this key, if the application requires a front-facing camera with a flash. 2.2.1
    http://tizen.org/feature/consumer_irSpecify this key, if the application requires the Consumer Infrared (CIR) feature.http://tizen.org/feature/consumer_irSpecify this key, if the application requires the Consumer Infrared (CIR) feature. 3.0
    http://tizen.org/feature/convergence.d2dSpecify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices.http://tizen.org/feature/convergence.d2dSpecify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices. 3.0
    http://tizen.org/feature/database.encryptionSpecify this key, if the application requires the database encryption feature.http://tizen.org/feature/database.encryptionSpecify this key, if the application requires the database encryption feature. 2.2.1
    http://tizen.org/feature/fido.uafSpecify this key, if the application requires the FIDO (Fast Identity Online) UAF (Universal Authentication Framework) client API.http://tizen.org/feature/fido.uafSpecify this key, if the application requires the FIDO (Fast Identity Online) UAF (Universal Authentication Framework) client API. 3.0
    http://tizen.org/feature/fmradioSpecify this key, if the application requires an FM radio.http://tizen.org/feature/fmradioSpecify this key, if the application requires an FM radio. 2.2.1
    http://tizen.org/feature/graphics.accelerationSpecify this key, if the application requires hardware acceleration for both 2D and 3D graphics.http://tizen.org/feature/graphics.accelerationSpecify this key, if the application requires hardware acceleration for both 2D and 3D graphics. 2.2.1
    http://tizen.org/feature/input.keyboardSpecify this key, if the application requires a built-in physical keyboard.http://tizen.org/feature/input.keyboardSpecify this key, if the application requires a built-in physical keyboard. 2.2.1
    http://tizen.org/feature/input.keyboard.layoutSpecify this key with a specific keyboard layout (string type), if the application requires a built-in physical keyboard supporting the specified keyboard layout.http://tizen.org/feature/input.keyboard.layoutSpecify this key with a specific keyboard layout (string type), if the application requires a built-in physical keyboard supporting the specified keyboard layout. 2.2.1
    http://tizen.org/feature/input.rotating_bezel Specify this key, if the application requires rotating bezel input. 2.3.1
    http://tizen.org/feature/iot.ocf Specify this key, if the application requires the Open Connectivity Foundation (OCF) framework. 3.0
    http://tizen.org/feature/ledSpecify this key, if the application requires a LED.http://tizen.org/feature/ledSpecify this key, if the application requires a LED. 2.3
    http://tizen.org/feature/locationSpecify this key, if the application requires any location positioning features.http://tizen.org/feature/locationSpecify this key, if the application requires any location positioning features. 2.2.1
    http://tizen.org/feature/location.batchhttp://tizen.org/feature/location.batch Specify this key, if the application requires the location tracking with a position batch information feature.2.32.3
    http://tizen.org/feature/location.gpshttp://tizen.org/feature/location.gps Specify this key, if the application requires the Global Positioning System (GPS) feature.2.2.12.2.1
    http://tizen.org/feature/location.wpsSpecify this key, if the application requires the Wi-Fi-based Positioning System (WPS) feature.http://tizen.org/feature/location.wpsSpecify this key, if the application requires the Wi-Fi-based Positioning System (WPS) feature. 2.2.1
    http://tizen.org/feature/mapsSpecify this key, if the application requires the map service feature.http://tizen.org/feature/mapsSpecify this key, if the application requires the map service feature. 2.3.2
    http://tizen.org/feature/microphoneSpecify this key, if the application requires a microphone.http://tizen.org/feature/microphoneSpecify this key, if the application requires a microphone. 2.2.1
    http://tizen.org/feature/multimedia.transcoderSpecify this key, if the application requires the multimedia transcoder feature.http://tizen.org/feature/multimedia.transcoderSpecify this key, if the application requires the multimedia transcoder feature. 2.3
    http://tizen.org/feature/multi_point_touch.pinch_zoomSpecify this key, if the application requires a pinch-zoom gesture feature.http://tizen.org/feature/multi_point_touch.pinch_zoomSpecify this key, if the application requires a pinch-zoom gesture feature. 2.2.1
    http://tizen.org/feature/multi_point_touch.point_countSpecify this key with a specific number (int type), if the application requires the minimum of specified number of simultaneous touches in a multi-point touch.http://tizen.org/feature/multi_point_touch.point_countSpecify this key with a specific number (int type), if the application requires the minimum of specified number of simultaneous touches in a multi-point touch. 2.2.1
    http://tizen.org/feature/network.bluetoothSpecify this key, if the application requires the Bluetooth feature.http://tizen.org/feature/network.bluetoothSpecify this key, if the application requires the Bluetooth feature. 2.2.1
    http://tizen.org/feature/network.bluetooth.audio.callSpecify this key, if the application requires the Bluetooth Handsfree feature (HFP).http://tizen.org/feature/network.bluetooth.audio.callSpecify this key, if the application requires the Bluetooth Handsfree feature (HFP). 2.3
    http://tizen.org/feature/network.bluetooth.audio.controllerSpecify this key, if the application requires the Bluetooth Advanced Audio Distribution (A2DP) sink feature and the Bluetooth Audio Video Remote Control (AVRCP) controller feature.http://tizen.org/feature/network.bluetooth.audio.controllerSpecify this key, if the application requires the Bluetooth Advanced Audio Distribution (A2DP) sink feature and the Bluetooth Audio Video Remote Control (AVRCP) controller feature. 3.0
    http://tizen.org/feature/network.bluetooth.audio.mediaSpecify this key, if the application requires the Bluetooth Advanced Audio feature (A2DP).http://tizen.org/feature/network.bluetooth.audio.mediaSpecify this key, if the application requires the Bluetooth Advanced Audio feature (A2DP). 2.3
    http://tizen.org/feature/network.bluetooth.healthSpecify this key, if the application requires the Bluetooth Health feature (HDP).http://tizen.org/feature/network.bluetooth.healthSpecify this key, if the application requires the Bluetooth Health feature (HDP). 2.3
    http://tizen.org/feature/network.bluetooth.hidSpecify this key, if the application requires the Bluetooth Human Input Device feature (HID).http://tizen.org/feature/network.bluetooth.hidSpecify this key, if the application requires the Bluetooth Human Input Device feature (HID). 2.3
    http://tizen.org/feature/network.bluetooth.hid.deviceSpecify this key, if the application requires the Bluetooth Human Interface Device (HID) device feature.http://tizen.org/feature/network.bluetooth.hid.deviceSpecify this key, if the application requires the Bluetooth Human Interface Device (HID) device feature. 3.0
    http://tizen.org/feature/network.bluetooth.leSpecify this key, if the application requires the Bluetooth LE feature.http://tizen.org/feature/network.bluetooth.leSpecify this key, if the application requires the Bluetooth LE feature. 2.3
    http://tizen.org/feature/network.bluetooth.oppSpecify this key, if the application requires the Bluetooth Object Push feature (OPP).http://tizen.org/feature/network.bluetooth.oppSpecify this key, if the application requires the Bluetooth Object Push feature (OPP). 2.3
    http://tizen.org/feature/network.bluetooth.phonebook.clientSpecify this key, if the application requires the Bluetooth Phone Book Access (PBAP) client feature.http://tizen.org/feature/network.bluetooth.phonebook.clientSpecify this key, if the application requires the Bluetooth Phone Book Access (PBAP) client feature. 3.0
    http://tizen.org/feature/network.ethernetSpecify this key, if the application requires the ethernet connection.http://tizen.org/feature/network.ethernetSpecify this key, if the application requires the ethernet connection. 2.4
    http://tizen.org/feature/network.net_proxy Specify this key, if the application requires the net-proxy feature for the Internet connection. A net-proxy feature for a device acts as an intermediary between client (network service customer) and server (network service provider). 3.0
    http://tizen.org/feature/network.nfcSpecify this key, if the application requires the use of any API that, in turn, requires the Near Field Communication (NFC) feature.http://tizen.org/feature/network.nfcSpecify this key, if the application requires the use of any API that, in turn, requires the Near Field Communication (NFC) feature. 2.2.1
    http://tizen.org/feature/network.nfc.card_emulationSpecify this key, if the application requires the NFC card emulation feature.http://tizen.org/feature/network.nfc.card_emulationSpecify this key, if the application requires the NFC card emulation feature. 2.3
    http://tizen.org/feature/network.nfc.card_emulation.hce Specify this key, if the application requires the NFC host-based card emulation feature. 2.3.1
    http://tizen.org/feature/network.nfc.p2pSpecify this key, if the application requires the NFC p2p feature.http://tizen.org/feature/network.nfc.p2pSpecify this key, if the application requires the NFC p2p feature. 2.3.1
    http://tizen.org/feature/network.nfc.reserved_pushSpecify this key, if the application requires the NFC reserved push feature.2.2.1
    http://tizen.org/feature/network.nfc.reserved_pushSpecify this key, if the application requires the NFC reserved push feature.2.2.1
    http://tizen.org/feature/network.nfc.tagSpecify this key, if the application requires the NFC tag feature.http://tizen.org/feature/network.nfc.tagSpecify this key, if the application requires the NFC tag feature. 2.3.1
    http://tizen.org/feature/network.pushSpecify this key, if the application requires the network-based push service.http://tizen.org/feature/network.pushSpecify this key, if the application requires the network-based push service. 2.2.1
    http://tizen.org/feature/network.secure_elementSpecify this key, if the application requires the secure element feature.http://tizen.org/feature/network.secure_elementSpecify this key, if the application requires the secure element feature. 2.2.1
    http://tizen.org/feature/network.secure_element.eseSpecify this key, if the application requires the ESE secure element feature.http://tizen.org/feature/network.secure_element.eseSpecify this key, if the application requires the ESE secure element feature. 2.3
    http://tizen.org/feature/network.secure_element.uiccSpecify this key, if the application requires the UICC secure element feature.http://tizen.org/feature/network.secure_element.uiccSpecify this key, if the application requires the UICC secure element feature. 2.3
    http://tizen.org/feature/network.service_discovery.dnssdSpecify this key, if the application requires the DNS-based Service Discovery Feature (DNSSD).http://tizen.org/feature/network.service_discovery.dnssdSpecify this key, if the application requires the DNS-based Service Discovery Feature (DNSSD). 3.0
    http://tizen.org/feature/network.service_discovery.ssdpSpecify this key, if the application requires the Simple Service Discovery Protocol feature (SSDP).http://tizen.org/feature/network.service_discovery.ssdpSpecify this key, if the application requires the Simple Service Discovery Protocol feature (SSDP). 3.0
    http://tizen.org/feature/network.telephonySpecify this key, if the application requires the use of any API that, in turn, requires the telephony feature.http://tizen.org/feature/network.telephonySpecify this key, if the application requires the use of any API that, in turn, requires the telephony feature. 2.2.1
    http://tizen.org/feature/network.telephony.mmsSpecify this key, if the application requires the MMS feature.http://tizen.org/feature/network.telephony.mmsSpecify this key, if the application requires the MMS feature. 2.2.1
    http://tizen.org/feature/network.telephony.smsSpecify this key, if the application requires the SMS feature.http://tizen.org/feature/network.telephony.smsSpecify this key, if the application requires the SMS feature. 2.4
    http://tizen.org/feature/network.telephony.sms.cbsSpecify this key, if the application requires the SMS Cell Broadcast Service (CBS) feature.http://tizen.org/feature/network.telephony.sms.cbsSpecify this key, if the application requires the SMS Cell Broadcast Service (CBS) feature. 2.2.1
    http://tizen.org/feature/network.vpnSpecify this key, if the application requires the Virtual Private Network feature (VPN).http://tizen.org/feature/network.vpnSpecify this key, if the application requires the Virtual Private Network feature (VPN). 3.0
    http://tizen.org/feature/network.wifiSpecify this key, if the application requires the use of any API that, in turn, requires the Wi-Fi feature.http://tizen.org/feature/network.wifiSpecify this key, if the application requires the use of any API that, in turn, requires the Wi-Fi feature. 2.2.1
    http://tizen.org/feature/network.wifi.tdlsSpecify this key, if the application requires the Wi-Fi Tunneled Direct Link Setup (TDLS).http://tizen.org/feature/network.wifi.tdlsSpecify this key, if the application requires the Wi-Fi Tunneled Direct Link Setup (TDLS). 3.0
    http://tizen.org/feature/opengles.texture_format.3dcSpecify this key, if the application requires the 3DC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.3dcSpecify this key, if the application requires the 3DC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.atcSpecify this key, if the application requires the ATC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.atcSpecify this key, if the application requires the ATC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.etcSpecify this key, if the application requires the ETC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.etcSpecify this key, if the application requires the ETC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.ptcSpecify this key, if the application requires the PTC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.ptcSpecify this key, if the application requires the PTC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.texture_format.pvrtcSpecify this key, if the application requires the PVRTC texture format for OpenGL® ES.2.2.1http://tizen.org/feature/opengles.texture_format.pvrtcSpecify this key, if the application requires the PVRTC texture format for OpenGL® ES.2.2.1
    http://tizen.org/feature/opengles.texture_format.utcSpecify this key, if the application requires the UTC texture format for OpenGL® ES.http://tizen.org/feature/opengles.texture_format.utcSpecify this key, if the application requires the UTC texture format for OpenGL® ES. 2.2.1
    http://tizen.org/feature/opengles.version.1_1http://tizen.org/feature/opengles.version.1_1 Specify this key, if the application requires OpenGL® ES version 1.1 at minimum.

    You can specify at most 1 openGL® ES version. If you specify multiple versions, only the highest one is considered.

    -    		 2.2.1
    http://tizen.org/feature/opengles.version.2_0http://tizen.org/feature/opengles.version.2_0 Specify this key, if the application requires OpenGL® ES version 2.0.

    You can specify at most 1 openGL® ES version. If you specify multiple versions, only the highest one is considered.

    -    		 2.2.1
    2.4
    http://tizen.org/feature/platform.core.cpu.arch.armv7Specify this key, if the application requires the ARMv7 CPU architecture.http://tizen.org/feature/platform.core.cpu.arch.armv7Specify this key, if the application requires the ARMv7 CPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.cpu.arch.x86Specify this key, if the application requires the x86 CPU architecture.http://tizen.org/feature/platform.core.cpu.arch.x86Specify this key, if the application requires the x86 CPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.sse2Specify this key, if the application requires the SSE2 Floating Point Unit (FPU) architecture.http://tizen.org/feature/platform.core.fpu.arch.sse2Specify this key, if the application requires the SSE2 Floating Point Unit (FPU) architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.sse3Specify this key, if the application requires the SSE3 FPU architecture.http://tizen.org/feature/platform.core.fpu.arch.sse3Specify this key, if the application requires the SSE3 FPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.ssse3Specify this key, if the application requires the SSSE3 FPU architecture.http://tizen.org/feature/platform.core.fpu.arch.ssse3Specify this key, if the application requires the SSSE3 FPU architecture. 2.2.1
    http://tizen.org/feature/platform.core.fpu.arch.vfpv3Specify this key, if the application requires the VFPv3 FPU architecture.http://tizen.org/feature/platform.core.fpu.arch.vfpv3Specify this key, if the application requires the VFPv3 FPU architecture. 2.2.1
    http://tizen.org/feature/platform.native.osp_compatibleSpecify this key, if the application requires OSP compatibility (the bada compatibility mode).http://tizen.org/feature/platform.native.osp_compatibleSpecify this key, if the application requires OSP compatibility (the bada compatibility mode). 2.2.1
    http://tizen.org/feature/screen.auto_rotationSpecify this key, if the application requires the automatic screen rotation feature.http://tizen.org/feature/screen.auto_rotationSpecify this key, if the application requires the automatic screen rotation feature. 2.2.1
    http://tizen.org/feature/screen.shape.circle Specify this key, if the application requires a circle-shaped screen. 2.3.1
    http://tizen.org/feature/screen.shape.rectangle Specify this key, if the application requires a rectangle-shaped screen. 2.3.1
    http://tizen.org/feature/screen.size.allSpecify this key, if the application supports all possible current and future screen sizes and all possible current and future resolutions per screen size.http://tizen.org/feature/screen.size.allSpecify this key, if the application supports all possible current and future screen sizes and all possible current and future resolutions per screen size. 2.2.1
    http://tizen.org/feature/screen.size.normalSpecify this key, if the application supports all possible current and future resolutions on the normal screen size.http://tizen.org/feature/screen.size.normalSpecify this key, if the application supports all possible current and future resolutions on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.240.400Specify this key, if the application supports the 240 x 400 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.240.400Specify this key, if the application supports the 240 x 400 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.320.320Specify this key, if the application supports the 320 x 320 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.320.320Specify this key, if the application supports the 320 x 320 resolution on the normal screen size. 2.3
    http://tizen.org/feature/screen.size.normal.320.480Specify this key, if the application supports the 320 x 480 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.320.480Specify this key, if the application supports the 320 x 480 resolution on the normal screen size. 2.2.1
    2.3.2
    http://tizen.org/feature/screen.size.normal.360.480Specify this key, if the application supports the 360 x 480 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.360.480Specify this key, if the application supports the 360 x 480 resolution on the normal screen size. 2.3
    http://tizen.org/feature/screen.size.normal.480.800Specify this key, if the application supports the 480 x 800 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.480.800Specify this key, if the application supports the 480 x 800 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.540.960Specify this key, if the application supports the 540 x 960 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.540.960Specify this key, if the application supports the 540 x 960 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.600.1024Specify this key, if the application supports the 600 x 1024 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.600.1024Specify this key, if the application supports the 600 x 1024 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.720.1280Specify this key, if the application supports the 720 x 1280 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.720.1280Specify this key, if the application supports the 720 x 1280 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/screen.size.normal.1080.1920Specify this key, if the application supports the 1080 x 1920 resolution on the normal screen size.http://tizen.org/feature/screen.size.normal.1080.1920Specify this key, if the application supports the 1080 x 1920 resolution on the normal screen size. 2.2.1
    http://tizen.org/feature/sensor.accelerometerSpecify this key, if the application requires an acceleration sensor.http://tizen.org/feature/sensor.accelerometerSpecify this key, if the application requires an acceleration sensor. 2.2.1
    http://tizen.org/feature/sensor.accelerometer.wakeupSpecify this key, if the application requires the acceleration sensor wake-up feature.http://tizen.org/feature/sensor.accelerometer.wakeupSpecify this key, if the application requires the acceleration sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.activity_recognitionSpecify this key, if the application requires an activity recognition sensor.2.3
    http://tizen.org/feature/sensor.activity_recognitionSpecify this key, if the application requires an activity recognition sensor.2.3
    http://tizen.org/feature/sensor.barometerSpecify this key, if the application requires a barometer sensor.2.2.1http://tizen.org/feature/sensor.barometerSpecify this key, if the application requires a barometer sensor.2.2.1
    http://tizen.org/feature/sensor.barometer.wakeupSpecify this key, if the application requires the barometer sensor wake-up feature.http://tizen.org/feature/sensor.barometer.wakeupSpecify this key, if the application requires the barometer sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.geomagnetic_rotation_vectorSpecify this key, if the application requires a geomagnetic-based rotation vector sensor.http://tizen.org/feature/sensor.geomagnetic_rotation_vectorSpecify this key, if the application requires a geomagnetic-based rotation vector sensor. 2.4
    http://tizen.org/feature/sensor.gesture_recognitionSpecify this key, if the application requires a gesture recognition sensor.2.3
    http://tizen.org/feature/sensor.gesture_recognitionSpecify this key, if the application requires a gesture recognition sensor.2.3
    http://tizen.org/feature/sensor.gravitySpecify this key, if the application requires a gravity sensor.http://tizen.org/feature/sensor.gravitySpecify this key, if the application requires a gravity sensor. 2.3
    http://tizen.org/feature/sensor.gyroscopeSpecify this key, if the application requires a gyro sensor.http://tizen.org/feature/sensor.gyroscopeSpecify this key, if the application requires a gyro sensor. 2.2.1
    http://tizen.org/feature/sensor.gyroscope_rotation_vectorSpecify this key, if the application requires a gyroscope-based rotation vector sensor.http://tizen.org/feature/sensor.gyroscope_rotation_vectorSpecify this key, if the application requires a gyroscope-based rotation vector sensor. 2.4
    http://tizen.org/feature/sensor.gyroscope.uncalibratedSpecify this key, if the application requires an uncalibrated gyroscope sensor.http://tizen.org/feature/sensor.gyroscope.uncalibratedSpecify this key, if the application requires an uncalibrated gyroscope sensor. 2.4
    http://tizen.org/feature/sensor.gyroscope.wakeupSpecify this key, if the application requires the gyro sensor wake-up feature.http://tizen.org/feature/sensor.gyroscope.wakeupSpecify this key, if the application requires the gyro sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.heart_rate_monitorSpecify this key, if the application requires a heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitorSpecify this key, if the application requires a heart rate monitor sensor. 2.3
    http://tizen.org/feature/sensor.heart_rate_monitor.led_greenSpecify this key, if the application requires the LED green heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitor.led_greenSpecify this key, if the application requires the LED green heart rate monitor sensor. 2.3.1
    http://tizen.org/feature/sensor.heart_rate_monitor.led_irSpecify this key, if the application requires the LED infrared heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitor.led_irSpecify this key, if the application requires the LED infrared heart rate monitor sensor. 2.3.1
    http://tizen.org/feature/sensor.heart_rate_monitor.led_redSpecify this key, if the application requires the LED red heart rate monitor sensor.http://tizen.org/feature/sensor.heart_rate_monitor.led_redSpecify this key, if the application requires the LED red heart rate monitor sensor. 2.3.1
    http://tizen.org/feature/sensor.humiditySpecify this key, if the application requires a humidity sensor.http://tizen.org/feature/sensor.humiditySpecify this key, if the application requires a humidity sensor. 2.3
    http://tizen.org/feature/sensor.linear_accelerationSpecify this key, if the application requires a linear acceleration sensor.2.3
    http://tizen.org/feature/sensor.linear_accelerationSpecify this key, if the application requires a linear acceleration sensor.2.3
    http://tizen.org/feature/sensor.magnetometerSpecify this key, if the application requires a magnetic sensor.http://tizen.org/feature/sensor.magnetometerSpecify this key, if the application requires a magnetic sensor. 2.2.1
    http://tizen.org/feature/sensor.magnetometer.uncalibratedSpecify this key, if the application requires an uncalibrated geomagnetic sensor.http://tizen.org/feature/sensor.magnetometer.uncalibratedSpecify this key, if the application requires an uncalibrated geomagnetic sensor. 2.4
    http://tizen.org/feature/sensor.magnetometer.wakeupSpecify this key, if the application requires the magnetic sensor wake-up feature.http://tizen.org/feature/sensor.magnetometer.wakeupSpecify this key, if the application requires the magnetic sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.pedometerSpecify this key, if the application requires a pedometer sensor.http://tizen.org/feature/sensor.pedometerSpecify this key, if the application requires a pedometer sensor. 2.3
    http://tizen.org/feature/sensor.photometerSpecify this key, if the application requires a photometer sensor.2.2.1http://tizen.org/feature/sensor.photometerSpecify this key, if the application requires a photometer sensor.2.2.1
    http://tizen.org/feature/sensor.photometer.wakeupSpecify this key, if the application requires the photometer sensor wake-up feature.http://tizen.org/feature/sensor.photometer.wakeupSpecify this key, if the application requires the photometer sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.proximitySpecify this key, if the application requires a proximity sensor.http://tizen.org/feature/sensor.proximitySpecify this key, if the application requires a proximity sensor. 2.2.1
    http://tizen.org/feature/sensor.proximity.wakeupSpecify this key, if the application requires the proximity sensor wake-up feature.http://tizen.org/feature/sensor.proximity.wakeupSpecify this key, if the application requires the proximity sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.rotation_vectorSpecify this key, if the application requires a rotation vector sensor.http://tizen.org/feature/sensor.rotation_vectorSpecify this key, if the application requires a rotation vector sensor. 2.3
    http://tizen.org/feature/sensor.temperatureSpecify this key, if the application requires a temperature sensor.2.3
    http://tizen.org/feature/sensor.temperatureSpecify this key, if the application requires a temperature sensor.2.3
    http://tizen.org/feature/sensor.tiltmeterSpecify this key, if the application requires a tilt sensor.2.2.1http://tizen.org/feature/sensor.tiltmeterSpecify this key, if the application requires a tilt sensor.2.2.1
    http://tizen.org/feature/sensor.tiltmeter.wakeupSpecify this key, if the application requires the tilt sensor wake-up feature.http://tizen.org/feature/sensor.tiltmeter.wakeupSpecify this key, if the application requires the tilt sensor wake-up feature. 2.2.1
    http://tizen.org/feature/sensor.ultravioletSpecify this key, if the application requires a ultraviolet sensor.http://tizen.org/feature/sensor.ultravioletSpecify this key, if the application requires a ultraviolet sensor. 2.3
    http://tizen.org/feature/sensor.wrist_upSpecify this key, if the application requires a wrist up sensor.2.3http://tizen.org/feature/sensor.wrist_upSpecify this key, if the application requires a wrist up sensor.2.3
    http://tizen.org/feature/shell.appwidgetSpecify this key, if the application requires the AppWidget (Dynamic Box) feature.http://tizen.org/feature/shell.appwidgetSpecify this key, if the application requires the AppWidget (Dynamic Box) feature. 2.2.1
    http://tizen.org/feature/sip.voipSpecify this key, if the application requires the Voice Over Internet Protocol (VOIP) feature.http://tizen.org/feature/sip.voipSpecify this key, if the application requires the Voice Over Internet Protocol (VOIP) feature. 2.2.1
    http://tizen.org/feature/speech.controlSpecify this key, if the application requires the voice control feature.2.4
    http://tizen.org/feature/speech.controlSpecify this key, if the application requires the voice control feature.2.4
    http://tizen.org/feature/speech.recognitionSpecify this key, if the application requires the speech recognition (STT) feature.http://tizen.org/feature/speech.recognitionSpecify this key, if the application requires the speech recognition (STT) feature. 2.2.1
    http://tizen.org/feature/speech.synthesisSpecify this key, if the application requires the speech synthesis (text to speech, TTS) feature.http://tizen.org/feature/speech.synthesisSpecify this key, if the application requires the speech synthesis (text to speech, TTS) feature. 2.2.1
    http://tizen.org/feature/usb.accessorySpecify this key, if the application requires the USB client (or accessory) feature.http://tizen.org/feature/usb.accessorySpecify this key, if the application requires the USB client (or accessory) feature. 2.2.1
    http://tizen.org/feature/usb.hostSpecify this key, if the application requires the USB host feature.http://tizen.org/feature/usb.hostSpecify this key, if the application requires the USB host feature. 2.2.1
    http://tizen.org/feature/vision.barcode_detectionSpecify this key, if the application requires the barcode detection feature.http://tizen.org/feature/vision.barcode_detectionSpecify this key, if the application requires the barcode detection feature. 2.4
    http://tizen.org/feature/vision.barcode_generationSpecify this key, if the application requires the barcode generation feature.http://tizen.org/feature/vision.barcode_generationSpecify this key, if the application requires the barcode generation feature. 2.4
    http://tizen.org/feature/vision.face_recognitionSpecify this key, if the application requires the face recognition feature.2.2.1http://tizen.org/feature/vision.face_recognitionSpecify this key, if the application requires the face recognition feature.2.2.1
    http://tizen.org/feature/vision.image_recognitionSpecify this key, if the application requires the image recognition feature.http://tizen.org/feature/vision.image_recognitionSpecify this key, if the application requires the image recognition feature. 2.2.1
    http://tizen.org/feature/vision.qrcode_generationSpecify this key, if the application requires the QR code generation feature.http://tizen.org/feature/vision.qrcode_generationSpecify this key, if the application requires the QR code generation feature. 2.2.1
    http://tizen.org/feature/vision.qrcode_recognitionSpecify this key, if the application requires the QR code recognition feature.http://tizen.org/feature/vision.qrcode_recognitionSpecify this key, if the application requires the QR code recognition feature. 2.2.1
    Tizen profileProfile name attributeTizen profileProfile name attribute
    MobilemobileMobilemobile
    WearablewearableWearablewearable
    TVTVTVTV

    In a native application, the profile name element can be added to the tizen-manifest.xml file as follows:

    -<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1" ... >
-<profile name="mobile"/>
+<manifest xmlns="http://tizen.org/ns/packages" api-version="2.3.1" ... >
+<profile name="mobile"/>

    The Tizen Store compares the device profile and the profile name element in an application. The store only shows the applications with a profile name matching the device profile to prevent unsupported applications from being installed.

    diff --git a/org.tizen.training/html/native/details/deprecation_policy_n.htm b/org.tizen.training/html/native/details/deprecation_policy_n.htm index 4aa02ad..4eb2989 100644 --- a/org.tizen.training/html/native/details/deprecation_policy_n.htm +++ b/org.tizen.training/html/native/details/deprecation_policy_n.htm @@ -5,13 +5,13 @@ - + - API Versioning and Deprecation Policy of the Tizen Platform + API Versioning and Deprecation Policy of the Tizen Platform @@ -32,7 +32,7 @@
    - +

    API Versioning and Deprecation Policy of the Tizen Platform

    As much as the Tizen team wants to have a completely stable API, the evolution of both hardware technology and software capabilities is rapid. To be maximally useful, the API set must evolve to reflect those changes to enable the development of compelling applications that use those features. As an inevitable side effect, APIs may become obsolete and need to be replaced by more feature-rich versions.

    @@ -114,21 +114,21 @@ Gets the package with the given application context. Deprecated: -    Deprecated since 2.3.1. Use app_context_get_app_id() instead. + Deprecated since 2.3.1. Use app_context_get_app_id() instead. Since: -    2.3 + 2.3
  • Deprecated API in the Web API: 
     addAppInfoEventListener
-Adds a listener for receiving notifications for changes 
+Adds a listener for receiving notifications for changes
 in the list of installed applications on a device.
 Deprecated. It is deprecated since Tizen 2.4. Instead, set a listener for getting notified
 of the application changes (add/remove/update) on a device using tizen.package.setPackageInfoEventListener().
 
 long addAppInfoEventListener(ApplicationInformationEventCallback eventCallback);
-             
+
 Since: 2.0
    • @@ -137,9 +137,9 @@ of the application changes (add/remove/update) on a device using tizen.package.s enum telephony_call_state_e Enumeration for the call state. Deprecated: -    Deprecated Since 2.4. Use telephony_call_status_e instead. + Deprecated Since 2.4. Use telephony_call_status_e instead. Since: -    2.3 + 2.3
  • Deprecated type definition in the Native API: @@ -148,9 +148,9 @@ Enumeration for the call state. typedef void* bt_gatt_attribute_h The attribute handle of GATT (Generic Attribute Profile) Deprecated: -    Deprecated since 2.3.1. Use bt_gatt_h instead. + Deprecated since 2.3.1. Use bt_gatt_h instead. Since: -    2.3 + 2.3
    • @@ -167,8 +167,8 @@ will be removed from next release. Use app_context_get_app_id() instead.
  • In a build log message: 
     [2/3] Building src/basicuiwithedc.o
-../src/basicuiwithedc.c:26:19: warning: 'app_get_resource_path' is deprecated [-Wdeprecated-declarations]
-    char *res_path = app_get_resource_path();
+../src/basicuiwithedc.c:26:19: warning: 'app_get_resource_path' is deprecated [-Wdeprecated-declarations]
+    char *res_path = app_get_resource_path();
    • diff --git a/org.tizen.training/html/native/details/details_n.htm b/org.tizen.training/html/native/details/details_n.htm index f1a82ec..1c769fd 100644 --- a/org.tizen.training/html/native/details/details_n.htm +++ b/org.tizen.training/html/native/details/details_n.htm @@ -5,13 +5,13 @@ - + - Understanding Tizen Programming + Understanding Tizen Programming @@ -20,14 +20,14 @@

    Mobile native Wearable native

    - +

    Related Info

    +
    -
    +

    Understanding Tizen Programming

    @@ -40,8 +40,8 @@
  • Event Handling
  • Error Handling
  • File System Directory Hierarchy
    • -
  • API Versioning and Deprecation Policy of the Tizen Platform
    • -
  • Application Signing and Certificates
    • +
  • API Versioning and Deprecation Policy of the Tizen Platform
    • +
  • Application Signing and Certificates
    • diff --git a/org.tizen.training/html/native/details/error_handling_n.htm b/org.tizen.training/html/native/details/error_handling_n.htm index d65f04a..45f31f9 100644 --- a/org.tizen.training/html/native/details/error_handling_n.htm +++ b/org.tizen.training/html/native/details/error_handling_n.htm @@ -5,23 +5,23 @@ - + - Error Handling - + Error Handling + - +
    -
    +

    Mobile native Wearable native

    - +

    Error Handling

    How to query error codes for a certain API function is determined by how the function returns error codes. @@ -32,7 +32,7 @@ In this sense, there are 2 kinds of native APIs in Tizen:

    All API functions which return error codes have the following section in their description:

     Returns:
-    0 on success, otherwise a negative error value
+    0 on success, otherwise a negative error value

    To see all of the available error values, see the Return values section in each API function description.

    @@ -40,10 +40,10 @@ Returns: 
     Return values:
-    MESSAGES_ERROR_NONE /* Successful */
-    MESSAGES_ERROR_INVALID_PARAMETER /* Invalid parameter */
-    MESSAGES_ERROR_SERVER_NOT_READY /* Server is not ready */
-    MESSAGES_ERROR_COMMUNICATION_WITH_SERVER_FAILED /* Communication with server failed */
+    MESSAGES_ERROR_NONE /* Successful */
+    MESSAGES_ERROR_INVALID_PARAMETER /* Invalid parameter */
+    MESSAGES_ERROR_SERVER_NOT_READY /* Server is not ready */
+    MESSAGES_ERROR_COMMUNICATION_WITH_SERVER_FAILED /* Communication with server failed */
  • APIs returning values (indirectly returning error codes) @@ -72,15 +72,15 @@ location_manager_h location_handle; int result = location_manager_create(LOCATION_METHOD_GPS, location_handle); if (LOCATIONS_ERROR_NONE != result) { -    errMsg = get_error_message(result); -    dlog_print(DLOG_INFO, "MyTag", "%s", errMsg); + errMsg = get_error_message(result); + dlog_print(DLOG_INFO, "MyTag", "%s", errMsg); } -

    The get_error_message() function takes an error code as an input and returns its corresponding error messages, such as "Location service is not available".

    +

    The get_error_message() function takes an error code as an input and returns its corresponding error messages, such as "Location service is not available".

    • -

    Every error code in the Tizen native API is represented as an integer value.

    - +

    Every error code in the Tizen native API is represented as an integer value.

    + diff --git a/org.tizen.training/html/native/details/event_handling_n.htm b/org.tizen.training/html/native/details/event_handling_n.htm index 36f48a5..26cae79 100644 --- a/org.tizen.training/html/native/details/event_handling_n.htm +++ b/org.tizen.training/html/native/details/event_handling_n.htm @@ -5,13 +5,13 @@ - + - Event Handling + Event Handling @@ -27,10 +27,10 @@
  • Back Key Events
  • Rotary Events
  • Media Key Events
    • -
  • Ambient Events
    • +
  • Ambient Events
    • -
    +

    Event Handling

    @@ -50,8 +50,8 @@

    All Tizen mobile devices provide a Menu key, which is used to present users a context-dependent set of options. Pressing the Menu key shows a hierarchical option menu. The following figure illustrates the Menu key position and the option menu.

    -

    Figure: Menu key

    -

    Menu key

    +

    Figure: Menu key

    +

    Menu key

    Back Key Events in Mobile Applications

    @@ -66,12 +66,12 @@

    Rotary Events in Wearable Applications

    - -

    The Tizen platform supports rotary events for user interaction on a wearable rotary device or sensor. The rotary device can rotate clockwise or counter-clockwise, and dispatch an event for each movement. The rotary device has points called detent. If the rotary device detects the detent point while rotating, it dispatches a separate new event about the point. The number of the available detent points depends on the device hardware.

    + +

    The Tizen platform supports rotary events for user interaction on a wearable rotary device or sensor. The rotary device can rotate clockwise or counter-clockwise, and dispatch an event for each movement. The rotary device has points called detent. If the rotary device detects the detent point while rotating, it dispatches a separate new event about the point. The number of the available detent points depends on the device hardware.

    You can use the rotary events to change your application state (for example, change the value of the scroller or slider, change selected items, or zoom the image).

    -

    Figure: Rotary device

    +

    Figure: Rotary device

    Rotary device

    diff --git a/org.tizen.training/html/native/details/io_overview_n.htm b/org.tizen.training/html/native/details/io_overview_n.htm index bcddf87..33b6181 100644 --- a/org.tizen.training/html/native/details/io_overview_n.htm +++ b/org.tizen.training/html/native/details/io_overview_n.htm @@ -5,25 +5,25 @@ - + - File System Directory Hierarchy + File System Directory Hierarchy
    -
    +

    Mobile native Wearable native

    - +

    File System Directory Hierarchy

    The Tizen platform uses the underlying Linux file system.

    @@ -42,7 +42,7 @@

    The following table shows the application directory hierarchy:

    -

    Table: Application package directory hierarchy

    +

    Table: Application package directory hierarchy

    @@ -82,14 +82,14 @@ +

    Files stored in the shared/data directory can be read by other applications. Do not store application's private data in the shared/data directory.

    @@ -149,7 +149,7 @@ - +
    shared/data Used to share data with other applications.

    To get this directory path of your own application, call the app_get_shared_data_path() function of the App common module.

    -

    Files stored in the shared/data directory can be read by other applications. Do not store application's private data in the shared/data directory.

    		 Owner: Read and Write

    Others: Read
    shared/res Used to share resources with other applications. The resource files are delivered with the application package.

    To get this directory path of your own application, call the app_get_shared_resource_path() function of the App common module.

    -

    Files stored in the shared/res directory can be read by other applications. Do not pack application's private resource files in the shared/res directory.

    +

    Files stored in the shared/res directory can be read by other applications. Do not pack application's private resource files in the shared/res directory.

    		 Owner: Read

    Others: Read
    Others Used for other types.Read and WriteRead and Write
    @@ -202,7 +202,7 @@ - + diff --git a/org.tizen.training/html/native/details/sec_privileges_n.htm b/org.tizen.training/html/native/details/sec_privileges_n.htm index e11cfb2..db9ec23 100644 --- a/org.tizen.training/html/native/details/sec_privileges_n.htm +++ b/org.tizen.training/html/native/details/sec_privileges_n.htm @@ -5,7 +5,7 @@ - + @@ -15,19 +15,19 @@ +
    -
    +

    Mobile native Wearable native

    - +

    Security and API Privileges

    To effectively protect the device system and user private data, the Tizen security architecture is based on privileges and application signing of the Linux basic security model, which includes process isolation and mandatory access control. Since Tizen, as an open mobile platform, provides a wide range of features and experiences for users with a variety of applications, the users must be able to grant privileges for security-sensitive operations.

    @@ -45,7 +45,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } Note In applications with the platform version 3.0 or higher, if you use privacy-related privileged APIs, make sure that the user has switched the privilege on before making the function call. Otherwise, the application does not work as expected.
    - +

    The Tizen Studio also provides privilege checker tools to check whether the Tizen application source code contains any privilege violations. For more information, see Verifying APIs and Privileges.

    The following tables list the API privileges, which you must to declare when using security-sensitive API modules.

    @@ -53,35 +53,35 @@ tr.partner-level, tr.platform-level { background-color: #cff }

    Table: Mobile native API privileges

    - - + + - + - - - - + + + + - + - - + + - + - - + + - + - + @@ -107,7 +107,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + @@ -116,12 +116,12 @@ tr.partner-level, tr.platform-level { background-color: #cff } - - + + - + @@ -130,96 +130,96 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - - + + - + - - + + - + - - + + - + - - + + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + @@ -228,26 +228,26 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - - + + - + - + @@ -352,14 +352,14 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + @@ -368,35 +368,35 @@ tr.partner-level, tr.platform-level { background-color: #cff } - - + + - + - - + + - + - + - + - + - + @@ -431,47 +431,47 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + - + - + - + - + - + - + @@ -501,19 +501,19 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + @@ -522,124 +522,124 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - - + + - + - + - + - - + + - + - + - + - + - + @@ -648,40 +648,40 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + - + - + - + - + - + - + - + @@ -690,12 +690,12 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - - + + @@ -704,33 +704,33 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - - + + - + - + - + - + - +
    Privilege
    Privilege LevelPrivacyPrivacy SinceDescription
    http://tizen.org/privilege/account.readDescription
    http://tizen.org/privilege/account.read public Account 2.3The application can read accounts.The application can read accounts.
    http://tizen.org/privilege/account.write
    http://tizen.org/privilege/account.write public Account 2.3The application can create, edit, and delete accounts.The application can create, edit, and delete accounts.
    http://tizen.org/privilege/alarm.get
    http://tizen.org/privilege/alarm.get public 2.3The application can read information about the saved alarms.The application can read information about the saved alarms.
    http://tizen.org/privilege/alarm.set public partner 3.0The application can check the reputation of a Web address and determine whether accessing it can put the user's device at risk.The application can check the reputation of a Web address and determine whether accessing it can put the user's device at risk.
    http://tizen.org/privilege/apphistory.read2.4 The application can read the statistics of application usage, such as which applications have been used frequently or recently.
    http://tizen.org/privilege/appmanager.kill
    http://tizen.org/privilege/appmanager.kill platform 2.3The application can close other applications.The application can close other applications.
    http://tizen.org/privilege/appmanager.kill.bgapp2.4 The application can request to close applications running in the background.
    http://tizen.org/privilege/appmanager.launch public 2.3The application can open other applications.The application can open other applications.
    http://tizen.org/privilege/bluetooth
    http://tizen.org/privilege/bluetooth public 2.3The application can perform unrestricted actions using Bluetooth, such as scanning for and connecting to other devices.The application can perform unrestricted actions using Bluetooth, such as scanning for and connecting to other devices.
    http://tizen.org/privilege/bluetooth.admin
    http://tizen.org/privilege/bluetooth.admin platform 2.3The application can change Bluetooth settings, such as switching Bluetooth on or off, setting the device name, and enabling or disabling the AV remote control.The application can change Bluetooth settings, such as switching Bluetooth on or off, setting the device name, and enabling or disabling the AV remote control.
    http://tizen.org/privilege/bookmark.admin
    http://tizen.org/privilege/bookmark.admin platform Bookmark 2.3The application can retrieve, create, edit, and delete Internet bookmarks.The application can retrieve, create, edit, and delete Internet bookmarks.
    http://tizen.org/privilege/calendar.read
    http://tizen.org/privilege/calendar.read public Calendar 2.3The application can read events and tasks.The application can read events and tasks.
    http://tizen.org/privilege/calendar.write public Calendar 2.3The application can create, update, and delete events and tasks.The application can create, update, and delete events and tasks.
    http://tizen.org/privilege/call public Call 2.3The application can make phone calls to numbers when they are tapped without further confirmation. This can result in additional charges depending on the user's payment plan.The application can make phone calls to numbers when they are tapped without further confirmation. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/callhistory.read public User history 2.3The application can read call log items.The application can read call log items.
    http://tizen.org/privilege/callhistory.write public User history 2.3The application can create, update, and delete call log items.The application can create, update, and delete call log items.
    http://tizen.org/privilege/camera public Camera 2.3The application can take pictures and switch the camera flash on and off while using the camera.The application can take pictures and switch the camera flash on and off while using the camera.
    http://tizen.org/privilege/contact.read public Contacts 2.3The application can read the user profile, contacts, and contact history. Contact history can include social network activity.The application can read the user profile, contacts, and contact history. Contact history can include social network activity.
    http://tizen.org/privilege/contact.write public Contacts 2.3The application can create, update, and delete the user profile, contacts, and any contact history that is related to this application. Contact history can include social network activity.The application can create, update, and delete the user profile, contacts, and any contact history that is related to this application. Contact history can include social network activity.
    http://tizen.org/privilege/content.write public 2.3The application can change media information. This information can be used by other applications.The application can change media information. This information can be used by other applications.
    http://tizen.org/privilege/d2d.datasharing3.0 The application can share data with other devices.
    http://tizen.org/privilege/datasharing public 2.3The application can share data with other applications.The application can share data with other applications.
    http://tizen.org/privilege/display public 2.3The application can manage display settings, such as the brightness. This can increase battery consumption.2.3The application can manage display settings, such as the brightness. This can increase battery consumption.
    http://tizen.org/privilege/download public 2.3The application can manage HTTP downloads. This can result in additional charges depending on the user's payment plan.The application can manage HTTP downloads. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/dpm.bluetoothpartner 3.0The application can restrict the use of Wi-Fi networks and mobile hotspots. If the device cannot connect to a Wi-Fi network, it can connect to a mobile network. This can result in additional charges depending on the user's payment plan.

    Allowed to licensed partners.

    		The application can restrict the use of Wi-Fi networks and mobile hotspots. If the device cannot connect to a Wi-Fi network, it can connect to a mobile network. This can result in additional charges depending on the user's payment plan.

    Allowed to licensed partners.
    http://tizen.org/privilege/dpm.wipe partner 3.0The application can erase all data from the user's device and reset the user's device to its factory default settings.

    Allowed to licensed partners.

    		The application can erase all data from the user's device and reset the user's device to its factory default settings.

    Allowed to licensed partners.
    http://tizen.org/privilege/dpm.zone3.0 The application can create and remove containers. Containers are private workspaces which provide separate application runtime environments and data storage.

    Allowed to licensed partners.
    http://tizen.org/privilege/email
    http://tizen.org/privilege/email public 2.3The application can manage the user's email accounts, including the user's folders and emails, POP3 and IMAP downloads, and SMTP uploads. This can result in additional charges depending on the user's payment plan.The application can manage the user's email accounts, including the user's folders and emails, POP3 and IMAP downloads, and SMTP uploads. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/email.admin
    http://tizen.org/privilege/email.admin platform 2.3The application can manage the email application settings.The application can manage the email application settings.
    http://tizen.org/privilege/fido.client public 3.0The application can trigger authenticators in the user's device and it can request to use the user's PIN or biometrics (fingerprints or irises) for authentication.The application can trigger authenticators in the user's device and it can request to use the user's PIN or biometrics (fingerprints or irises) for authentication.
    http://tizen.org/privilege/haptic public 2.3The application can control vibration feedback.The application can control vibration feedback.
    http://tizen.org/privilege/healthinfo public Sensor2.4 The application can read actions involving special keys, such as the volume keys on this or other devices (such as TV remote controls), even when it is running in the background.
    http://tizen.org/privilege/keymanager public 2.3The application can save keys, certificates, and data to, and retrieve and delete them from, a password-protected storage. Checking the status of certificates while connected to a mobile network can result in additional charges depending on the user's payment plan.

    Deprecated since 3.0.

    		The application can save keys, certificates, and data to, and retrieve and delete them from, a password-protected storage. Checking the status of certificates while connected to a mobile network can result in additional charges depending on the user's payment plan.

    Deprecated since 3.0.
    http://tizen.org/privilege/keymanager.admin platform 2.3 The application can lock and unlock a password-protected storage, and manage password changes for it.

    Deprecated since 2.4.
    http://tizen.org/privilege/led public 2.3The application can switch LEDs on or off, such as the LED on the front of the device and the camera flash.The application can switch LEDs on or off, such as the LED on the front of the device and the camera flash.
    http://tizen.org/privilege/location public Location 2.3The application can read the user's location information.The application can read the user's location information.
    http://tizen.org/privilege/location.coarse public Location 3.0The application can determine the user's approximate location including the user device's Cell ID, LAC (Location Area Code), and TAC (Tracking Area Code).The application can determine the user's approximate location including the user device's Cell ID, LAC (Location Area Code), and TAC (Tracking Area Code).
    http://tizen.org/privilege/location.enable platform Location 2.3The application can control the user's location service settings.The application can control the user's location service settings.
    http://tizen.org/privilege/mapservice2.4 The application can read the statistics concerning the music and videos played on the device, such as the peak times for playing music or videos.
    http://tizen.org/privilege/message.read public Message 2.3The application can read text and multimedia messages, and any information related to them.The application can read text and multimedia messages, and any information related to them.
    http://tizen.org/privilege/message.write public Message 2.3The application can write, send, delete, and move text and multimedia messages, and change the settings and status of the messages, such as read or unread.The application can write, send, delete, and move text and multimedia messages, and change the settings and status of the messages, such as read or unread.
    http://tizen.org/privilege/minicontrol.provider2.4 The application can show a small toolbar on the notification panel or lock screen while it is open.

    Deprecated since 3.0.
    http://tizen.org/privilege/network.get public 2.3The application can retrieve network information, such as the status of each network, its type, and detailed network profile information.The application can retrieve network information, such as the status of each network, its type, and detailed network profile information.
    http://tizen.org/privilege/network.profile public 2.3The application can add, remove, and edit network profiles.The application can add, remove, and edit network profiles.
    http://tizen.org/privilege/network.set public 2.3The application can switch Wi-Fi on and off, and connect to and disconnect from Wi-Fi and mobile networks. This can result in additional charges depending on the user's payment plan.The application can switch Wi-Fi on and off, and connect to and disconnect from Wi-Fi and mobile networks. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/nfc public 2.3The application can read and write NFC tag information, and send NFC messages to other devices.The application can read and write NFC tag information, and send NFC messages to other devices.
    http://tizen.org/privilege/nfc.admin platform 2.3The application can change NFC settings, such as switching NFC on or off.The application can change NFC settings, such as switching NFC on or off.
    http://tizen.org/privilege/nfc.cardemulation public 2.3 The application can access smart card details, such as credit card details, and allow users to make payments using NFC.
    http://tizen.org/privilege/notification public 2.3The application can show and hide its own notifications and badges.The application can show and hide its own notifications and badges.
    http://tizen.org/privilege/packagemanager.admin platform 2.3The application can install and uninstall application packages.The application can install and uninstall application packages.
    http://tizen.org/privilege/packagemanager.clearcache public 2.4The application can clear other applications' caches.The application can clear other applications' caches.
    http://tizen.org/privilege/packagemanager.info public 2.3The application can retrieve detailed application package information.The application can retrieve detailed application package information.
    http://tizen.org/privilege/power public 2.3The application can control power-related settings, such as dimming the screen.The application can control power-related settings, such as dimming the screen.
    http://tizen.org/privilege/push public 2.3The application can receive notifications from the Internet. This can result in additional charges depending on the user's payment plan.The application can receive notifications from the Internet. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/reboot
    http://tizen.org/privilege/reboot platform 2.3.1The application can restart the device.The application can restart the device.
    http://tizen.org/privilege/recorder public Microphone 2.3The application can record video and audio.The application can record video and audio.
    http://tizen.org/privilege/screenshot
    http://tizen.org/privilege/screenshot platform 2.3The application can capture screenshots.The application can capture screenshots.
    http://tizen.org/privilege/secureelement public 2.3.1The application can access secure smart card chips, such as UICC/SIM, embedded secure elements, and secure SD cards.The application can access secure smart card chips, such as UICC/SIM, embedded secure elements, and secure SD cards.
    http://tizen.org/privilege/shortcut public 2.3The application can create and delete shortcuts.The application can create and delete shortcuts.
    http://tizen.org/privilege/systemmonitor2.4 The application can read system information, including information from the CPU and RAM.
    http://tizen.org/privilege/systemsettings public 2.3The application can read and write unrestricted system settings.

    Deprecated since 2.3.1.

    		The application can read and write unrestricted system settings.

    Deprecated since 2.3.1.
    http://tizen.org/privilege/systemsettings.admin platform 2.3The application can read and write all system settings.The application can read and write all system settings.
    http://tizen.org/privilege/telephony public 2.3The application can retrieve telephony information, such as the network and SIM card used, the IMEI, and the status of calls.The application can retrieve telephony information, such as the network and SIM card used, the IMEI, and the status of calls.
    http://tizen.org/privilege/telephony.adminplatformplatform 2.3The application can manage telephony settings, such as those for incoming and outgoing calls, forwarding and holding calls, networks, and SIM cards.The application can manage telephony settings, such as those for incoming and outgoing calls, forwarding and holding calls, networks, and SIM cards.
    http://tizen.org/privilege/tethering.admin platform 2.3The application can enable and disable tethering services. This can result in additional charges depending on the user's payment plan.The application can enable and disable tethering services. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/use_ir3.0 The application can use the infrared transmitter.
    http://tizen.org/privilege/volume.set public 2.3The application can adjust the volume for different features, such as notification alerts, ringtones, and media.2.3The application can adjust the volume for different features, such as notification alerts, ringtones, and media.
    http://tizen.org/privilege/vpnservice3.0 The application can manage the VPN (virtual private network) and change its settings.
    http://tizen.org/privilege/web-history.admin platform User history 2.3The application can manage the user's Internet history.The application can manage the user's Internet history.
    http://tizen.org/privilege/widget.viewer
    http://tizen.org/privilege/widget.viewer public 2.3.1The application can show widgets, and information from their associated applications, on the home screen.The application can show widgets, and information from their associated applications, on the home screen.
    http://tizen.org/privilege/wifidirect public 2.3The application can enable and disable Wi-Fi Direct™, manage Wi-Fi Direct™ connections, and change Wi-Fi Direct™ settings.The application can enable and disable Wi-Fi Direct™, manage Wi-Fi Direct™ connections, and change Wi-Fi Direct™ settings.
    http://tizen.org/privilege/window.priority.set public 2.3The application can appear on top of other windows and screens, including the lock screen, according to the order of priority of the windows. This can prevent the user from interacting with other applications or screens until the window for the application is closed.The application can appear on top of other windows and screens, including the lock screen, according to the order of priority of the windows. This can prevent the user from interacting with other applications or screens until the window for the application is closed.
    @@ -738,12 +738,12 @@ tr.partner-level, tr.platform-level { background-color: #cff }

    Table: Wearable native API privileges

    - + - - + + @@ -759,19 +759,19 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + @@ -792,14 +792,14 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + @@ -808,49 +808,49 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - - + + - + - - + + - + - - + + - + - + - + - + - + - + - + @@ -871,12 +871,12 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + @@ -885,26 +885,26 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - - + + - + - + - + - + @@ -1009,14 +1009,14 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + @@ -1030,28 +1030,28 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + - + - + @@ -1081,50 +1081,50 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + +

    Deprecated since 3.0.

    - + - + - + - + - + - + - + - + @@ -1145,131 +1145,131 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + @@ -1278,26 +1278,26 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - + - + - + @@ -1306,26 +1306,26 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + - + - + - - + + - + - +
    Privilege Level PrivacySinceDescriptionSinceDescription
    http://tizen.org/privilege/account.read3.0 The application can create, edit, and delete accounts.
    http://tizen.org/privilege/alarm.get public 2.3.1The application can read information about the saved alarms.The application can read information about the saved alarms.
    http://tizen.org/privilege/alarm.set public 2.3.1The application can set alarms and wake the device up at scheduled times.The application can set alarms and wake the device up at scheduled times.
    http://tizen.org/privilege/antivirus.adminpartner 3.0The application can check the reputation of a Web address and determine whether accessing it can put the user's device at risk.The application can check the reputation of a Web address and determine whether accessing it can put the user's device at risk.
    http://tizen.org/privilege/appmanager.kill platform 2.3.1The application can close other applications.The application can close other applications.
    http://tizen.org/privilege/appmanager.kill.bgapp3.0 The application can request to close applications running in the background.
    http://tizen.org/privilege/appmanager.launch public 2.3.1The application can open other applications.2.3.1The application can open other applications.
    http://tizen.org/privilege/bluetooth public 2.3.1The application can perform unrestricted actions using Bluetooth, such as scanning for and connecting to other devices.2.3.1The application can perform unrestricted actions using Bluetooth, such as scanning for and connecting to other devices.
    http://tizen.org/privilege/bluetooth.admin platform 2.3.1The application can change Bluetooth settings, such as switching Bluetooth on or off, setting the device name, and enabling or disabling the AV remote control.2.3.1The application can change Bluetooth settings, such as switching Bluetooth on or off, setting the device name, and enabling or disabling the AV remote control.
    http://tizen.org/privilege/call public Call 2.3.1The application can make phone calls to numbers when they are tapped without further confirmation. This can result in additional charges depending on the user's payment plan.The application can make phone calls to numbers when they are tapped without further confirmation. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/callhistory.read public User history 2.3.1The application can read call log items.The application can read call log items.
    http://tizen.org/privilege/callhistory.write public User history 2.3.1The application can create, update, and delete call log items.The application can create, update, and delete call log items.
    http://tizen.org/privilege/camera public Camera3.0 The application can create, update, and delete the user profile, contacts, and any contact history that is related to this application. Contact history can include social network activity.
    http://tizen.org/privilege/content.write public 2.3.1The application can change media information. This information can be used by other applications.The application can change media information. This information can be used by other applications.
    http://tizen.org/privilege/d2d.datasharing3.0 The application can share data with other devices.
    http://tizen.org/privilege/datasharing public 2.3.1The application can share data with other applications.2.3.1The application can share data with other applications.
    http://tizen.org/privilege/display public 2.3.1The application can manage display settings, such as the brightness. This can increase battery consumption.The application can manage display settings, such as the brightness. This can increase battery consumption.
    http://tizen.org/privilege/download public 2.3.1The application can manage HTTP downloads. This can result in additional charges depending on the user's payment plan.The application can manage HTTP downloads. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/dpm.bluetoothpartner 3.0The application can restrict the use of Wi-Fi networks and mobile hotspots. If the device cannot connect to a Wi-Fi network, it can connect to a mobile network. This can result in additional charges depending on the user's payment plan.

    Allowed to licensed partners.

    		The application can restrict the use of Wi-Fi networks and mobile hotspots. If the device cannot connect to a Wi-Fi network, it can connect to a mobile network. This can result in additional charges depending on the user's payment plan.

    Allowed to licensed partners.
    http://tizen.org/privilege/dpm.wipe partner 3.0The application can erase all data from the user's device and reset the user's device to its factory default settings.

    Allowed to licensed partners.

    		The application can erase all data from the user's device and reset the user's device to its factory default settings.

    Allowed to licensed partners.
    http://tizen.org/privilege/dpm.zonepublic 3.0The application can manage the user's email accounts, including the user's folders and emails, POP3 and IMAP downloads, and SMTP uploads. This can result in additional charges depending on the user's payment plan.The application can manage the user's email accounts, including the user's folders and emails, POP3 and IMAP downloads, and SMTP uploads. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/fido.client public 3.0The application can trigger authenticators in the user's device and it can request to use the user's PIN or biometrics (fingerprints or irises) for authentication.The application can trigger authenticators in the user's device and it can request to use the user's PIN or biometrics (fingerprints or irises) for authentication.
    http://tizen.org/privilege/haptic public 2.3.1The application can control vibration feedback.The application can control vibration feedback.
    http://tizen.org/privilege/healthinfo public Sensor 2.3.1The application can read health information gathered by the device sensors, such as the pedometer and heart rate monitor.The application can read health information gathered by the device sensors, such as the pedometer and heart rate monitor.
    http://tizen.org/privilege/ime3.0 The application can read actions involving special keys, such as the volume keys on this or other devices (such as TV remote controls), even when it is running in the background.
    http://tizen.org/privilege/keymanager public 2.3.1The application can save keys, certificates, and data to, and retrieve and delete them from, a password-protected storage.The application can save keys, certificates, and data to, and retrieve and delete them from, a password-protected storage.
    http://tizen.org/privilege/keymanager.admin platform 2.3.1 The application can lock and unlock a password-protected storage, and manage password changes for it. -

    Deprecated since 3.0.
    http://tizen.org/privilege/led public 2.3.1The application can switch LEDs on or off, such as the LED on the front of the device and the camera flash.The application can switch LEDs on or off, such as the LED on the front of the device and the camera flash.
    http://tizen.org/privilege/location public Location 2.3.1The application can read the user's location information.The application can read the user's location information.
    http://tizen.org/privilege/location.coarse public Location 3.0The application can determine the user's approximate location including the user device's Cell ID, LAC (Location Area Code), and TAC (Tracking Area Code).The application can determine the user's approximate location including the user device's Cell ID, LAC (Location Area Code), and TAC (Tracking Area Code).
    http://tizen.org/privilege/location.enable platform Location 2.3.1The application can control the user's location service settings.The application can control the user's location service settings.
    http://tizen.org/privilege/mapservice public 3.0 The application can send information about currently playing media to applications that are allowed to receive it, and can be controlled remotely by those applications.
    http://tizen.org/privilege/message.read public Message 2.3.1The application can read text and multimedia messages, and any information related to them.The application can read text and multimedia messages, and any information related to them.
    http://tizen.org/privilege/message.write public Message 2.3.1The application can write, send, delete, and move text and multimedia messages, download multimedia messages, and change the settings and status of the messages, such as read or unread. This can result in additional charges depending on the user's payment plan.The application can write, send, delete, and move text and multimedia messages, download multimedia messages, and change the settings and status of the messages, such as read or unread. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/network.get public 2.3.1The application can retrieve network information, such as the status of each network, its type, and detailed network profile information.The application can retrieve network information, such as the status of each network, its type, and detailed network profile information.
    http://tizen.org/privilege/network.profile public 2.3.1The application can add, remove, and edit network profiles.The application can add, remove, and edit network profiles.
    http://tizen.org/privilege/network.set public 2.3.1The application can switch Wi-Fi on and off, and connect to and disconnect from Wi-Fi and mobile networks. This can result in additional charges depending on the user's payment plan.The application can switch Wi-Fi on and off, and connect to and disconnect from Wi-Fi and mobile networks. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/nfc public 2.3.1The application can read and write NFC tag information, and send NFC messages to other devices.The application can read and write NFC tag information, and send NFC messages to other devices.
    http://tizen.org/privilege/nfc.admin platform 2.3.1The application can change NFC settings, such as switching NFC on or off.The application can change NFC settings, such as switching NFC on or off.
    http://tizen.org/privilege/nfc.cardemulation public 2.3.1The application can access smart card details, such as credit card details, and allow users to make payments using NFC.The application can access smart card details, such as credit card details, and allow users to make payments using NFC.
    http://tizen.org/privilege/notification public 2.3.1The application can show and hide its own notifications and badges.The application can show and hide its own notifications and badges.
    http://tizen.org/privilege/packagemanager.admin platform 2.3.1The application can install and uninstall application packages.The application can install and uninstall application packages.
    http://tizen.org/privilege/packagemanager.clearcache public 3.0The application can clear other applications' caches.The application can clear other applications' caches.
    http://tizen.org/privilege/packagemanager.info public 2.3.1The application can retrieve detailed application package information.The application can retrieve detailed application package information.
    http://tizen.org/privilege/power public 2.3.1The application can control power-related settings, such as dimming the screen.The application can control power-related settings, such as dimming the screen.
    http://tizen.org/privilege/push public 2.3.1The application can receive notifications from the Internet. This can result in additional charges depending on the user's payment plan.The application can receive notifications from the Internet. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/reboot platform 2.3.1The application can restart the device. The application can restart the device.
    http://tizen.org/privilege/recorder public Microphone 2.3.1The application can record video and audio.The application can record video and audio.
    http://tizen.org/privilege/screenshot platform 2.3.1The application can capture screenshots.The application can capture screenshots.
    http://tizen.org/privilege/secureelement public 2.3.1The application can access secure smart card chips, such as UICC/SIM, embedded secure elements, and secure SD cards.The application can access secure smart card chips, such as UICC/SIM, embedded secure elements, and secure SD cards.
    http://tizen.org/privilege/systemmonitor3.0 The application can read system information, including information from the CPU and RAM.
    http://tizen.org/privilege/systemsettings.admin platform 2.3.1The application can read and write all system settings.The application can read and write all system settings.
    http://tizen.org/privilege/telephony public 2.3.1The application can retrieve telephony information, such as the network and SIM card used, the IMEI, and the status of calls.The application can retrieve telephony information, such as the network and SIM card used, the IMEI, and the status of calls.
    http://tizen.org/privilege/telephony.admin platform 2.3.1The application can manage telephony settings, such as those for incoming and outgoing calls, forwarding and holding calls, networks, and SIM cards.The application can manage telephony settings, such as those for incoming and outgoing calls, forwarding and holding calls, networks, and SIM cards.
    http://tizen.org/privilege/use_ir3.0 The application can use the infrared transmitter.
    http://tizen.org/privilege/volume.set public 2.3.1The application can adjust the volume for different features, such as notification alerts, ringtones, and media.The application can adjust the volume for different features, such as notification alerts, ringtones, and media.
    http://tizen.org/privilege/widget.viewerhttp://tizen.org/privilege/widget.viewer public 2.3.1The application can show widgets, and information from their associated applications, on the home screen.2.3.1The application can show widgets, and information from their associated applications, on the home screen.
    http://tizen.org/privilege/window.priority.set public 2.3.1The application can appear on top of other windows and screens, including the lock screen, according to the order of priority of the windows. This can prevent the user from interacting with other applications or screens until the window for the application is closed.The application can appear on top of other windows and screens, including the lock screen, according to the order of priority of the windows. This can prevent the user from interacting with other applications or screens until the window for the application is closed.
    @@ -1339,40 +1339,40 @@ tr.partner-level, tr.platform-level { background-color: #cff }

    Table: Non-API bound privileges

    - + - - - + + + +

    If you are using the listen() and connect() functions between the local loopback interface (127.0.0.1), you cannot connect to a random application (due to sandboxing) no matter how you add this privilege. However, you can connect between multiple processes of the same application binary.

    - + +

    If your application does not have this privilege, no file operations into the media storage area succeed and you receive a permission denied error. If you have this privilege, you can read and write directories and files, create new files, and delete files in the storage area.

    - + +

    If your application does not have this privilege, all file operations fail with a permission denied error. If you have this privilege, you have full access to the external storage.

    - - + + +

    If your application does not have this privilege, no file operations with the application data stored in the external storage area succeed and you receive a permission denied error. If you have this privilege, you can store data in the application-specific directory of the external storage. You can find the path for storing data in the external storage with, for example, the app_get_external_data_path(), app_get_external_cache_path(), and app_get_external_shared_data_path() functions.

    @@ -1382,7 +1382,7 @@ tr.partner-level, tr.platform-level { background-color: #cff }

    The app_get_shared_data_path() and app_manager_get_shared_data_path() functions return an error when the application does not have this privilege. Note that the shared/data directory is writable for the application itself and readable for all other applications. You must be careful when you use this privilege and share data through the shared/data directory. For a more secure way of sharing files with another application, try to pass the file path through an application control.

    -
    Privilege Level Since

    (mobile/wearable)

    		Description
    Description
    http://tizen.org/privilege/internet public 2.3 / 2.3.1 Most of the mobile and wearable devices use a cellular network for IP communication. However, the cellular network can cause data costs and an application that sends data through the Internet can be crucial for user privacy. Due to the importance of the functionality, a privilege for controlling application Internet access has been added.

    The new privilege is coupled with IP addresses of the destination and source of the IP packets. If your socket is connecting to or listening for any IP address except 127.0.0.1, this privilege is required to communicate properly. If your application does not have this privilege, the connection is blocked in the kernel layer and returns an error in the connect() function as the permission is denied. If you are listening to a socket, you never receive any packets from the outside without errors on the socket functions.

    -

    If you are using the listen() and connect() functions between the local loopback interface (127.0.0.1), you cannot connect to a random application (due to sandboxing) no matter how you add this privilege. However, you can connect between multiple processes of the same application binary.
    http://tizen.org/privilege/mediastorage public 2.3 / 2.3.1 When you connect the device to a computer (Windows or Mac) through USB, you can access a dedicated media storage area shown as massive media storage. This region of the storage is called media storage and is usually used for multimedia files, such as photos, videos, and music files. Since this storage area is used for user private data, access to it must be protected with a privilege. -

    If your application does not have this privilege, no file operations into the media storage area succeed and you receive a permission denied error. If you have this privilege, you can read and write directories and files, create new files, and delete files in the storage area.
    http://tizen.org/privilege/externalstorage public 2.3 / 2.3.1 Similar to the media storage, many devices support external storages, such as MicroSD card or USB memory. As with the media storage, the access to an external storage must be protected with a privilege. You can find the absolute path of the external storage with the Storage API functions, such as storage_get_root_directory(). -

    If your application does not have this privilege, all file operations fail with a permission denied error. If you have this privilege, you have full access to the external storage.
    http://tizen.org/privilege/externalstorage.appdata
    http://tizen.org/privilege/externalstorage.appdata public 2.3 / 2.3.1 Many devices support external storages, such as MicroSD card or USB memory. As with the media storage, the access to an external storage must be protected with a privilege. -

    If your application does not have this privilege, no file operations with the application data stored in the external storage area succeed and you receive a permission denied error. If you have this privilege, you can store data in the application-specific directory of the external storage. You can find the path for storing data in the external storage with, for example, the app_get_external_data_path(), app_get_external_cache_path(), and app_get_external_shared_data_path() functions.
    http://tizen.org/privilege/appdir.shareddata
    + diff --git a/org.tizen.training/html/native/details/sign_certificate_n.htm b/org.tizen.training/html/native/details/sign_certificate_n.htm index a0501f5..c3f53c3 100644 --- a/org.tizen.training/html/native/details/sign_certificate_n.htm +++ b/org.tizen.training/html/native/details/sign_certificate_n.htm @@ -5,13 +5,13 @@ - + - Application Signing and Certificates + Application Signing and Certificates @@ -26,10 +26,10 @@
  • Signature Type
  • Certificate and API Privileges
  • Signing Flow and Getting Certificates
    • -
  • Signature Specification
    • +
  • Signature Specification
    • -
    +

    Application Signing and Certificates

    @@ -40,13 +40,13 @@

    Through application signing, Tizen achieves the following goals:

    • Ensuring application integrity: Users can download an application that has not been tampered with after development.
      • -
    • Identifying the application developer: The applications with the same signing key are regarded as developed by the same developer. A set of applications with same developer's signing key can share secured resources as the developer intended.
      • +
    • Identifying the application developer: The applications with the same signing key are regarded as developed by the same developer. A set of applications with same developer's signing key can share secured resources as the developer intended.
    • Proof of store validation: An application store performs some validation checks before distributing an application. As the proof of store validation, the application store signs the application.
    • Enforcing proper usage of privileged APIs: An application distributor, such as an application store, can restrict the API set used by the application by signing a key with a proper privilege.
    - +

    Signature Type

    - +

    All Tizen applications must have at least 2 signatures:

    • Author signature: @@ -54,7 +54,7 @@
    • You sign the author signature with your own author signing key in the Tizen Studio.
    • Applications with the same author signing key are regarded as developed by the same developer.
    • Application upgrade is allowed only when the author signature of the old version and the new version are signed with a same author signing key.
      • -
    • A set of applications with a same author's signing key can share secured resources as the author (developer) intended.
      • +
    • A set of applications with a same author's signing key can share secured resources as the author (developer) intended.
  • Distributor signature: @@ -110,7 +110,7 @@

    Signing Flow and Getting Certificates

    - +

    You can sign your application with your own author signing key and a testing distributor signing key in the Tizen Studio. With those, you can install and test the application on your test device and an emulator.

    When the application is submitted to a store after development, the store removes the testing distributor signature and adds the store distributor signature for the application release. Normal applications are signed with the public level distributor signing key in the store. Some applications granted from a device vendor are allowed to be signed with the partner level distributor signing key. Signing with the platform level distributor key is permitted only for the internal application of a device vendor or Tizen.

    @@ -122,7 +122,7 @@

    The testing distributor certificate and its signing key with the public level are preloaded in the Tizen Studio. The author certificate and its signing key can also be created in the Tizen Studio. For more information, see Working with the Certificate Profile.

    A device vendor can disallow unauthorized applications to be installed on its devices to protect its devices from viruses and malwares. Samsung also disallows unauthorized applications to be installed on its Tizen devices. In such cases, you must get an author certificate and a distributor certificate from the device vendor. For more information, see Issuing a Tizen Certificate and Running Applications in Commercial Devices.

    -

    Signature Specification

    +

    Signature Specification

    The application signing scheme of Tizen follows the specification of the XML Digital signature for widget specified by W3C.

    diff --git a/org.tizen.training/html/native/details/tizen_apis_n.htm b/org.tizen.training/html/native/details/tizen_apis_n.htm index 3e2ce4d..b5bb8c9 100644 --- a/org.tizen.training/html/native/details/tizen_apis_n.htm +++ b/org.tizen.training/html/native/details/tizen_apis_n.htm @@ -5,31 +5,31 @@ - + - Tizen APIs + Tizen APIs
    -
    +

    • Mobile native Wearable native

    - +

    Tizen APIs

    You can develop native applications using the native API modules. You can create diverse applications with a variety of features, and design versatile applications and intriguing user interfaces with text and graphics while taking advantage of many device functionalities, such as sensors and call operations. In addition, you can, for example, manage content and media files, use network and social services, and provide messaging and embedded Web browsing functionality.

    -

    The Tizen platform also provides a special kind of native application model, which consists of 1 UI native application and 1 or more native service applications.

    - +

    The Tizen platform also provides a special kind of native application model, which consists of 1 UI native application and 1 or more native service applications.

    +

    The native API specification consists of multiple API modules that represent the versatility and wide variety of features that you can implement in your native application. Each API module represents a set of logically similar submodule APIs which can be grouped into the same category. This structure was designed to make it easier for you to narrow down and find the specific methods that you require to implement a feature in your native application.

    There are 2 types of submodules - Tizen native modules and open source modules. The integration of open source modules in the native API structure allows you to add additional features by using well-known open source libraries. This is particularly advantageous for developers who are familiar with certain libraries because they can quickly add features and use previously written code in certain cases.

    @@ -42,14 +42,14 @@

    Table: Mobile native API modules

    - - - - - +
    API moduleAPI submodule
    + + + + - + @@ -63,7 +63,7 @@ - + - - - + - + - + - + - + - + - + - + @@ -157,11 +157,11 @@ - + - + @@ -169,19 +169,19 @@ - + - + - + - + @@ -195,16 +195,16 @@ - + - + - - + - + @@ -271,7 +271,7 @@ - + @@ -279,7 +279,7 @@ - + @@ -288,15 +288,15 @@ - + - - + + - + @@ -308,18 +308,18 @@ - + - + - - + + - + @@ -327,11 +327,11 @@ - + - + @@ -340,23 +340,23 @@ - + - + - + - + - + @@ -374,7 +374,7 @@ - + @@ -382,7 +382,7 @@ - + @@ -390,7 +390,7 @@ - + @@ -399,23 +399,23 @@ - + - - + + - + - + - + @@ -450,7 +450,7 @@ - + @@ -473,32 +473,32 @@ - + - + - + - + - + - + - + @@ -513,7 +513,7 @@ - + @@ -534,7 +534,7 @@ - + @@ -550,7 +550,7 @@ - + @@ -558,7 +558,7 @@ - + @@ -584,7 +584,7 @@ - + @@ -592,11 +592,11 @@ - + - + @@ -610,7 +610,7 @@ - +
    API moduleAPI submodule Functionality Description
    Account Account Manager
    FIDO Client

    (since 3.0)

    		Allows you to utilize the device's available authenticators for online service integration.Allows you to utilize the device's available authenticators for online service integration.
    OAuth 2.0 @@ -82,9 +82,9 @@
    Application Framework ApplicationManages the application's main event loop, state change events, and basic system events, and gets information about the application. It is also used to launch other applications. + Manages the application's main event loop, state change events, and basic system events, and gets information about the application. It is also used to launch other applications. The Application Framework API contains submodule APIs for application development. The submodule APIs enable application life-cycle management, usage of functionality that is exported by other applications, and access to a user's application preferences. + The Application Framework API contains submodule APIs for application development. The submodule APIs enable application life-cycle management, usage of functionality that is exported by other applications, and access to a user's application preferences.

    Guides:

    BadgeCreates and removes badges on the application's home screen icon. A badge is an image displayed on the application icon, which informs the user about notifications and events. This submodule can also be used to set and get the badge value and visibility.Creates and removes badges on the application's home screen icon. A badge is an image displayed on the application icon, which informs the user about notifications and events. This submodule can also be used to set and get the badge value and visibility.
    Bundle Provides a string-based dictionary abstract data type (ADT). A dictionary is an ordered or unordered list of key-element pairs. Keys are used to locate elements in the list. This submodule can be used to create and manage a dictionary.
    Data Control Exchanges data between applications by allowing an application to query the public database of another application that has opted to be a data provider.
    Message Port Sends and receives small messages between applications without interference from other applications and processes. Each message is a bundle.
    Notification Creates, inserts, and updates notifications so that applications can relay information to users. Visuals, sounds, or vibrations can be used as notifications.
    Package Manager Stores and receives information related to packages installed on the device. This is information can be, for example, the package name, path to the icon image, or the application version. It can also be used to check whether 2 package certificates match. If they match, they have been created by the same developer and can share resources securely.
    Shortcut Adds application shortcuts to the device home screen, the main landing screen of the device.
    Widget

    (since 2.3.1)

    		 Handles Tizen widget application state changes and system events. It is also used to start and exit the main event loop of widget applications.
    Base C++ Standard Library
    Glibc Provides a standard C library.
    Glib Provides low-level libraries and advanced data structures, such as linked lists and hash tables, for use in application development.
    i18n Provides internationalization (i18n) support, such as flexibly generating date formats and numbers, depending on the locale setting of the device.
    LibXML Used to parse XML documents such as the Application Manifest.
    Minizip Provides a library to process files in the .zip format. It can be used to zip, unzip and compress files.
    OpenMP Supports shared memory multiprocessing. This can be used for complex tasks on multicore processors.
    Sqlite Implements a lightweight SQL relational database. This is widely used for embedded client or local storage.
    Content Download
    MIME Type Maps MIME types to file extensions and vice versa. For example, the .jpeg file extension is mapped to the image/jpeg MIME type, which is required when using other API modules, such as the AppControl API in the Application submodule API, because it operates with MIME types.
    Media Content Connects and disconnects from the media content service. This connection is required to insert, update and remove media file information in the media content database. Common media data types, such as image, audio, and video can be managed through the database. Other queries, such as searching for content and content information and accessing EXIF information from image files, are also possible.
    Context Activity Recognition Detects user activities, such as walking, running, and being in a moving vehicle with a device.The Context API module contains submodule APIs to detect user information such as when a user is running with a device and device information such as gestures when a device is tilted. + The Context API module contains submodule APIs to detect user information such as when a user is running with a device and device information such as gestures when a device is tilted.

    Guides:

    Messages Allows composing, sending, and receiving of SMS, MMS, and WAP push messages.
    Push Allows receiving of push notifications from a push server.
    Multimedia Audio I/O
    Camera Accesses the camera preview to display photo previews, focuses images, and captures images.
    Image Util Encodes and decodes JPEG images. It also provides tools, such as crop, resize, and rotate, to transform images.
    libEXIF Supports an image file format that extends existing formats, such as JPEG and TIFF. Many Tizen devices have a camera and use the EXIF format, and libEXIF can be used to read and write EXIF metainformation to and from image files.
    Media Codec Provides interfaces for encoding and decoding audio and video data, such as AAC audio or MPEG-4 AVC video.Media Controller

    (since 2.4)

    		 Provides functions for communication between the media controller server and the media controller client.
    Media Demuxer

    (since 3.0)

    		 Provides functions for demuxing media data.
    Media Muxer

    (since 3.0)

    		 Provides functions for muxing media data.
    Media Streamer

    (since 3.0)

    		 Provides functions for building custom pipeline for streaming media.
    Metadata Extractor Extracts metadata information from an input media file.
    Metadata Editor

    (since 2.4)

    		 Provides functions for editing the metadata of several popular audio formats.
    Media Vision

    (since 2.4)

    		 Provides functionality for barcode detection and generation.
    OpenAL Renders multichannel 3D audio.
    Player Provides functions for media playback and can be used to control media playback attributes.
    Radio Supports radio usage. This submodule API can be used for tasks, such as starting and stopping the radio and scanning for radio channels.
    Recorder Controls the recording of multimedia content. Recording process attributes, such as setting the recording filename and file format, can also be configured with this API submodule.
    Screen Mirroring

    (since 2.4)

    		 Provides functions for screen mirroring as a sink.Sound Manager Provides functions to get and set sound parameters, such as output sound volume. Session policy, such as the handling of sound session interrupts, can also be configured with this API submodule.
    Thumbnail Util

    (since 2.4)

    		 Provides functions for creating the thumbnail from an input media file.
    Tone Player Plays and stops tones.
    Video Util Transcodes or converts media files from one encoding to another. This API supports certain video codecs, audio codecs, and file formats.
    WAV Player Plays and stops Waveform Audio File (WAV) format files.
    Network Bluetooth
    Curl Provides a client-side URL data transfer library supporting HTTP, HTTPS, FTP, and file URIs, among many other protocols. Allows applications to perform URL-related activities without a Web browser.
    DNSSD

    (since 3.0)

    		 Provides functions for network service discovery using DNSSD.
    HTTP

    (since 3.0)

    		 Allows you to connect to a Web server to fetch and transmit a Web resource.
    Iotcon

    (since 3.0)

    		 Provides functions for IoT connectivity.
    MTP

    (since 3.0)

    		 Manages Media Transfer Protocol (MTP) file transfers between 2 devices.
    NFC Allows management, such as registering and deregistering event listeners, of short-range wireless near field communication (NFC). This submodule API must also be used to read, write, receive, and send NFC messages.Smartcard

    (since 2.3.1)

    		 Provides application communication to the SE applet functions.
    SSDP

    (since 3.0)

    		 Provides functions for network service discovery using SSDP.
    VPN Service

    (since 3.0)

    		 Manages Virtual Private Network (VPN) connections between 2 VPN devices.
    Wi-Fi Manages Wi-Fi connections and monitors the state of Wi-Fi connections.
    Wi-Fi Direct Manages the settings of Wi-Fi Direct™. This submodule API also provides functions to connect and disconnect remote devices that use Wi-Fi Direct™.
    Security Key Manager
    Service Adaptor

    (since 2.4)

    		 Provides common interfaces, such as using a local service for various service infra.
    System Device
    Media key Provides functions to handle media keys from external devices that are connected to the Tizen device, such as the volume control buttons on a headset.
    Runtime informationObtains runtime information of a mobile device. For example, this submodule API can obtain information about the device's GPS.Obtains runtime information of a mobile device. For example, this submodule API can obtain information about the device's GPS.
    Sensor Starts and stops sensors and receives sensor data.
    Storage Obtains storage information, such as root directory, storage type (internal or external), storage status, and total available space size.
    System Information Obtains information about the device, such as the platform and API version, device model, supported device features, and screen dimensions.
    System Settings Manages system settings, such as the lock screen settings.
    T-trace

    (since 2.4)

    		 Provides functions for writing trace messages to the system trace buffer.
    dlog Sends log output and filters log messages from the dlog logging service.
    Phonenumber utils

    (since 2.4)

    		 Provides functions for parsing and formatting phone numbers.
    DALi Provides a cross-platform 3D UI Toolkit for embedded systems.
    EFL Provides a collection of libraries that are independent and can be built on top of each other to provide useful features that complement the existing environment.
    External Output Manager

    (since 2.4)

    		 Provides functions for external outputs.
    Fontconfig and Freetype Provides a text rendering library and font-handling library to let applications find a font or closely matching font.
    Minicontrol

    (since 2.4)

    		 Provides functions for creating and displaying an EFL socket window.
    TBM Surface Provides functions for the graphics buffer.
    Input Method

    (since 2.4)

    		 Provides functions for starting the IME application life-cycle, for interacting with the current UI state of the IME, and getting attributes and events.
    Input Method Manager

    (since 2.4)

    		 Provides functions for launching the input method editor (IME) list and selector settings.
    Voice control

    (since 2.4)

    		 Provides functions for registering commands and getting notifications when a registered command is recognized.
    Voice control elementary

    (since 2.4)

    		 Provides functions to control UI components through voice commands.
    Web Json-GlibWebView Displays and controls Web pages. This submodule API contains interfaces for browsing, tracking browsing history, and downloading Web content.

    The following table describes the API modules in the wearable profile and the functionality of all their submodule APIs within that module. The table also acts as reference sources for when you are planning a new feature for your application and need a way to efficiently compare different API modules to decide which APIs to use.

    @@ -619,16 +619,16 @@ Note Except as noted, the wearable native APIs are available since Tizen 2.3.1.
    - -

    Table: Wearable native API modules

    + +

    Table: Wearable native API modules

    - - - + + + - + @@ -642,8 +642,8 @@ - - + + @@ -657,13 +657,13 @@ - + - - - + - + - + - + - + - + @@ -718,15 +718,15 @@
  • Data Storage and Management
  • Internationalization
    • - + - + - + @@ -734,19 +734,19 @@ - + - + - + - + @@ -755,16 +755,16 @@

    Guides:

    - + - + - @@ -781,7 +781,7 @@

    Guides:

    - + @@ -791,11 +791,11 @@ - + - + @@ -808,7 +808,7 @@ - + @@ -816,20 +816,20 @@ - + - + - - + + - + @@ -840,11 +840,11 @@ - - + + - + @@ -852,24 +852,24 @@ - + - + - + - - + + - + @@ -887,7 +887,7 @@ - + @@ -895,7 +895,7 @@ - + @@ -903,7 +903,7 @@ - + @@ -912,15 +912,15 @@ - + - + - + @@ -937,7 +937,7 @@ - + @@ -946,7 +946,7 @@

    Guides:

    - + @@ -967,24 +967,24 @@ - + - + - + - + - + @@ -999,11 +999,11 @@ - + - + @@ -1017,7 +1017,7 @@ - + @@ -1029,11 +1029,11 @@ - + - + @@ -1060,14 +1060,14 @@

    Guides:

    - + - - -
    API moduleAPI submodule
    API moduleAPI submodule Functionality Description
    Account Account Manager
    FIDO Client

    (since 3.0)

    		Allows you to utilize the device's available authenticators for online service integration.
    Allows you to utilize the device's available authenticators for online service integration.
    OAuth 2.0

    (since 2.4)

    libOAuth Provides a library for using an open standard for secure authorization. This library enables users to securely log into an account on an application by using their logon credentials from another secondary account that they can have with another account provider or application.
    Application Framework ApplicationManages the application's main event loop, state change events, and basic system events, and gets information about the application. It is also used to launch other applications. + Manages the application's main event loop, state change events, and basic system events, and gets information about the application. It is also used to launch other applications. The Application Framework API contains submodule APIs for application development. The submodule APIs enable application life-cycle management, usage of functionality that is exported by other applications, and access to a user's application preferences. + The Application Framework API contains submodule APIs for application development. The submodule APIs enable application life-cycle management, usage of functionality that is exported by other applications, and access to a user's application preferences.

    Guides:

      @@ -681,24 +681,24 @@
    BadgeCreates and removes badges on the application's home screen icon. A badge is an image displayed on the application icon, which informs the user about notifications and events. This submodule can also be used to set and get the badge value and visibility.Creates and removes badges on the application's home screen icon. A badge is an image displayed on the application icon, which informs the user about notifications and events. This submodule can also be used to set and get the badge value and visibility.
    Bundle Provides a string-based dictionary abstract data type (ADT). A dictionary is an ordered or unordered list of key-element pairs. Keys are used to locate elements in the list. This submodule can be used to create and manage a dictionary.
    Data Control Exchanges data between applications by allowing an application to query the public database of another application that has opted to be a data provider.
    Message Port Sends and receives small messages between applications without interference from other applications and processes. Each message is a bundle.
    Package Manager Stores and receives information related to packages installed on the device. This is information can be, for example, the package name, path to the icon image, or the application version. It can also be used to check whether 2 package certificates match. If they match, they have been created by the same developer and can share resources securely.
    Watch Application Handles Tizen watch application state changes and system events. It is also used to start and exit the main event loop of watch applications. @@ -707,7 +707,7 @@
    Widget Handles Tizen widget application state changes and system events. It is also used to start and exit the main event loop of widget applications.
    Base C++ Standard Library
    EGlibc Provides a standard C library.
    Glib Provides low-level libraries and advanced data structures, such as linked lists and hash tables, for use in application development.
    i18n Provides internationalization (i18n) support, such as flexibly generating date formats and numbers, depending on the locale setting of the device.
    LibXML Used to parse XML documents such as the Application Manifest.
    Minizip Provides a library to process files in the .zip format. It can be used to zip, unzip and compress files.
    OpenMP Supports shared memory multiprocessing. This can be used for complex tasks on multicore processors.
    Sqlite Implements a lightweight SQL relational database. This is widely used for embedded client or local storage.
    Content MIME Type
    Media Content Connects and disconnects from the media content service. This connection is required to insert, update and remove media file information in the media content database. Common media data types, such as image, audio, and video can be managed through the database. Other queries, such as searching for content and content information and accessing EXIF information from image files, are also possible.
    Context Activity Recognition Detects user activities, such as walking, running, and being in a moving vehicle with a device.The Context API module contains submodule APIs to detect user information such as when a user is running with a device and device information such as gestures when a device is tilted. + The Context API module contains submodule APIs to detect user information such as when a user is running with a device and device information such as gestures when a device is tilted.

    Guides:
    Messaging Messages
    Push Allows receiving of push notifications from a push server.
    Multimedia Audio I/O
    Camera Accesses the camera preview to display photo previews, focuses images, and captures images.
    Image Util Encodes and decodes JPEG images. It also provides tools, such as crop, resize, and rotate, to transform images.
    libEXIF Supports an image file format that extends existing formats, such as JPEG and TIFF. Many Tizen devices have a camera and use the EXIF format, and libEXIF can be used to read and write EXIF metainformation to and from image files.
    Media Codec Provides interfaces for encoding and decoding audio and video data, such as AAC audio or MPEG-4 AVC video.
    Media Demuxer

    (since 3.0)

    		 Provides functions for demuxing media data.
    Media Muxer

    (since 3.0)

    		 Provides functions for muxing media data.
    Media Streamer

    (since 3.0)

    		 Provides functions for building custom pipeline for streaming media.
    Metadata Extractor Extracts metadata information from an input media file.
    OpenAL Renders efficiently multichannel 3D audio.
    Player Provides functions for media playback and can be used to control media playback attributes.
    Radio Supports radio usage. This submodule API can be used for tasks, such as starting and stopping the radio and scanning for radio channels.
    Recorder Controls the recording of multimedia content. Recording process attributes, such as setting the recording filename and file format, can also be configured with this API submodule.
    Sound Manager Provides functions to get and set sound parameters, such as output sound volume. Session policy, such as the handling of sound session interrupts, can also be configured with this API submodule.
    Tone Player Plays and stops tones.
    WAV Player Plays and stops Waveform Audio File (WAV) format files.
    Network Bluetooth
    Curl Provides a client-side URL data transfer library supporting HTTP, HTTPS, FTP, and file URIs, among many other protocols. Allows applications to perform URL-related activities without a Web browser.
    DNSSD

    (since 3.0)

    		 Provides functions for network service discovery using DNSSD.
    HTTP

    (since 3.0)

    		 Allows you to connect to a Web server to fetch and transmit a Web resource.
    Iotcon

    (since 3.0)

    		 Provides functions for IoT connectivity.
    MTP

    (since 3.0)

    		 Manages Media Transfer Protocol (MTP) file transfers between 2 devices.
    NFC Allows management, such as registering and deregistering event listeners, of short-range wireless near field communication (NFC). This submodule API must also be used to read, write, receive, and send NFC messages.Smartcard

    (since 2.3.1)

    		 Provides application communication to the SE applet functions.
    SSDP

    (since 3.0)

    		 Provides functions for network service discovery using SSDP.
    Wi-Fi Manages Wi-Fi connections and monitors the state of Wi-Fi connections.
    Security Key Manager
    Privilege Info Retrieves and displays privilege information. This can be used to show a user the privileges that an application contains when they are downloading it onto their device. This is so that they are aware of the resources which the application may access.
    Social Contacts

    (since 3.0)
    System Device
    Runtime informationObtains runtime information of a wearable device. For example, this submodule API can obtain information about the device's GPS.Obtains runtime information of a wearable device. For example, this submodule API can obtain information about the device's GPS.
    Sensor Starts and stops sensors and receives sensor data.
    Storage Obtains storage information, such as root directory, storage type (internal or external), storage status, and total available space size.
    System Information Obtains information about the device, such as the platform and API version, device model, supported device features, and screen dimensions.
    System Settings Manages system settings, such as the lock screen settings.
    dlog Sends log output and filters log messages from the dlog logging service.
    Phonenumber utils

    (since 3.0)

    		 Provides functions for parsing and formatting phone numbers.
    UI Framework Cairo
    DALi Provides a cross-platform 3D UI Toolkit for embedded systems.
    EFL Provides a collection of libraries that are independent and can be built on top of each other to provide useful features that complement the existing environment.
    EFL Extension Enhances the EFL libraries and includes device-specific features (such as support for rotary events).
    Fontconfig and Freetype Provides a text rendering library and font-handling library to let applications find a font or closely matching font.
    TBM Surface Provides functions for the graphics buffer.
    WebView Displays and controls Web pages. This submodule API contains interfaces for browsing, tracking browsing history, and downloading Web content.
    - + + + +
    diff --git a/org.tizen.training/html/native/feature/app_connectivity_n.htm b/org.tizen.training/html/native/feature/app_connectivity_n.htm index d48f49b..ea0c519 100644 --- a/org.tizen.training/html/native/feature/app_connectivity_n.htm +++ b/org.tizen.training/html/native/feature/app_connectivity_n.htm @@ -5,13 +5,13 @@ - + - Creating Applications with Connectivity and Network + Creating Applications with Connectivity and Network @@ -26,10 +26,10 @@
  • Connectivity and Wireless Guides
  • Network API for Mobile Native
  • Network API for Wearable Native
    • - +
    -
    -
    +
    +

    Creating Applications with Connectivity and Network

    If you want to create applications that offer connectivity and network features to the user, Tizen provides various options for you.

    diff --git a/org.tizen.training/html/native/feature/app_connectivity_operation_n.htm b/org.tizen.training/html/native/feature/app_connectivity_operation_n.htm index 8154884..c696b74 100644 --- a/org.tizen.training/html/native/feature/app_connectivity_operation_n.htm +++ b/org.tizen.training/html/native/feature/app_connectivity_operation_n.htm @@ -5,13 +5,13 @@ - + - Network Operations + Network Operations @@ -32,10 +32,10 @@
  • Connectivity and Wireless Guides
  • Network API for Mobile Native
  • Network API for Wearable Native
    • - +
    -
    -
    +
    +

    Network Operations

    The basic tasks involved in network operations are connecting to the network, downloading HTTP content, and parsing data in the XML and JSON format. The following sections provide you with the fundamental building blocks for creating Tizen applications that download content and parse data efficiently.

    @@ -52,7 +52,7 @@ 
     <privileges>
-   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/network.get</privilege>
 </privileges>
    @@ -77,7 +77,7 @@ 
     #include <tizen.h>
 #include <service_app.h>
-#include "service.h" /* Auto-generated header file by the Tizen Studio */
+#include "service.h" /* Auto-generated header file by the Tizen Studio */
 #include <net_connection.h>
 
 static connection_h connection;
@@ -85,33 +85,33 @@ static connection_h connection;
 bool
 service_app_create(void *data)
 {
-    int error_code;
-
-    /* Create a connection handle */
-    error_code = connection_create(&connection);
-    if (error_code != CONNECTION_ERROR_NONE)
-        return;
-
-    /*
-       Get the type of the current profile for data connection
-       net_state is the network type defined in the connection_type_e enumerator
-    */
-    connection_type_e net_state;
-    error_code = connection_get_type(connection, &net_state);
-    if (error_code == CONNECTION_ERROR_NONE) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Network connection type: %d", net_state);
-    }
-
-    return true;
+    int error_code;
+
+    /* Create a connection handle */
+    error_code = connection_create(&connection);
+    if (error_code != CONNECTION_ERROR_NONE)
+        return;
+
+    /*
+       Get the type of the current profile for data connection
+       net_state is the network type defined in the connection_type_e enumerator
+    */
+    connection_type_e net_state;
+    error_code = connection_get_type(connection, &net_state);
+    if (error_code == CONNECTION_ERROR_NONE) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Network connection type: %d", net_state);
+    }
+
+    return true;
 }
 
 void
 service_app_terminate(void *data)
 {
-    /* Destroy the created connection handle */
-    error_code = connection_destroy(connection);
+    /* Destroy the created connection handle */
+    error_code = connection_destroy(connection);
 
-    return;
+    return;
 }
 
 /* Assume that auto-generated functions from the Tizen Studio are here */
@@ -119,24 +119,24 @@ service_app_terminate(void *data)
 int
 main(int argc, char* argv[])
 {
-    char ad[50] = {0,};
-    service_app_lifecycle_callback_s event_callback;
-    app_event_handler_h handlers[5] = {NULL,};
-
-    event_callback.create = service_app_create;
-    event_callback.terminate = service_app_terminate;
-    event_callback.app_control = service_app_control;
-
-    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY,
-                                  service_app_low_battery, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
-                                  service_app_low_memory, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED,
-                                  service_app_lang_changed, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED,
-                                  service_app_region_changed, &ad);
-
-    return service_app_main(argc, argv, &event_callback, ad);
+    char ad[50] = {0,};
+    service_app_lifecycle_callback_s event_callback;
+    app_event_handler_h handlers[5] = {NULL,};
+
+    event_callback.create = service_app_create;
+    event_callback.terminate = service_app_terminate;
+    event_callback.app_control = service_app_control;
+
+    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY,
+                                  service_app_low_battery, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
+                                  service_app_low_memory, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED,
+                                  service_app_lang_changed, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED,
+                                  service_app_region_changed, &ad);
+
+    return service_app_main(argc, argv, &event_callback, ad);
 }
    @@ -157,8 +157,8 @@ main(int argc, char* argv[]) 
     <privileges>
-   <privilege>http://tizen.org/privilege/download</privilege>
-   <privilege>http://tizen.org/privilege/mediastorage</privilege>
+   <privilege>http://tizen.org/privilege/download</privilege>
+   <privilege>http://tizen.org/privilege/mediastorage</privilege>
 </privileges>
    @@ -171,7 +171,7 @@ main(int argc, char* argv[]) 
     #include <tizen.h>
 #include <service_app.h>
-#include "service.h" /* Auto-generated header file by the Tizen Studio */
+#include "service.h" /* Auto-generated header file by the Tizen Studio */
 #include <curl/curl.h>
 
 /*
@@ -181,21 +181,21 @@ main(int argc, char* argv[])
 static void
 start_downloading(void *data)
 {
-    appdata_s *ad = data;
-    Ecore_Thread *thread;
+    appdata_s *ad = data;
+    Ecore_Thread *thread;
 
-    /* Create a thread that communicates with the main thread */
-    thread = ecore_thread_feedback_run(download_thread_run_cb, download_feedback_cb,
-                                       download_thread_end_cb, download_thread_cancel_cb,
-                                       ad, EINA_FALSE);
+    /* Create a thread that communicates with the main thread */
+    thread = ecore_thread_feedback_run(download_thread_run_cb, download_feedback_cb,
+                                       download_thread_end_cb, download_thread_cancel_cb,
+                                       ad, EINA_FALSE);
 }
 
 bool
 service_app_create(void *data)
 {
-    start_downloading(data);
+    start_downloading(data);
 
-    return true;
+    return true;
 }
 
 /* Assume that auto-generated functions from the Tizen Studio are here */
@@ -203,24 +203,24 @@ service_app_create(void *data)
 int
 main(int argc, char* argv[])
 {
-    char ad[50] = {0,};
-    service_app_lifecycle_callback_s event_callback;
-    app_event_handler_h handlers[5] = {NULL,};
-
-    event_callback.create = service_app_create;
-    event_callback.terminate = service_app_terminate;
-    event_callback.app_control = service_app_control;
-
-    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY,
-                                  service_app_low_battery, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
-                                  service_app_low_memory, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED,
-                                  service_app_lang_changed, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED,
-                                  service_app_region_changed, &ad);
-
-    return service_app_main(argc, argv, &event_callback, ad);
+    char ad[50] = {0,};
+    service_app_lifecycle_callback_s event_callback;
+    app_event_handler_h handlers[5] = {NULL,};
+
+    event_callback.create = service_app_create;
+    event_callback.terminate = service_app_terminate;
+    event_callback.app_control = service_app_control;
+
+    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY,
+                                  service_app_low_battery, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
+                                  service_app_low_memory, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED,
+                                  service_app_lang_changed, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED,
+                                  service_app_region_changed, &ad);
+
+    return service_app_main(argc, argv, &event_callback, ad);
 }

    The ecore_thread_feedback() function allows the download_thread_run_cb() callback to call the download_feedback_cb() callback:

    @@ -229,79 +229,79 @@ main(int argc, char* argv[]) static void download_thread_run_cb(void *data, Ecore_Thread *thread) { -    download_contents(data); + download_contents(data); -    /* ecore_thread_feedback() invokes download_feedback_cb() registered by ecore_thread_feedback_run () */ -    ecore_thread_feedback(thread, data); + /* ecore_thread_feedback() invokes download_feedback_cb() registered by ecore_thread_feedback_run () */ + ecore_thread_feedback(thread, data); } static void download_contents(void *data) { -    if (data == NULL) { -        dlog_print(DLOG_ERROR, LOG_TAG, "data is NULL"); + if (data == NULL) { + dlog_print(DLOG_ERROR, LOG_TAG, "data is NULL"); -        return; -    } + return; + } -    appdata_s *ad = data; -    CURL *curl; + appdata_s *ad = data; + CURL *curl; -    const char error_message[BUFFER_SIZE]; + const char error_message[BUFFER_SIZE]; -    /* Initialize the curl session */ -    curl = curl_easy_init(); -    dlog_print(DLOG_DEBUG, LOG_TAG, "curl_easy_init()"); + /* Initialize the curl session */ + curl = curl_easy_init(); + dlog_print(DLOG_DEBUG, LOG_TAG, "curl_easy_init()"); -    /* Download the header */ -    if (curl) { -        /* Set URL to get */ -        CURLcode error_code = curl_easy_setopt(curl, CURLOPT_URL, "http://developer.tizen.org"); + /* Download the header */ + if (curl) { + /* Set URL to get */ + CURLcode error_code = curl_easy_setopt(curl, CURLOPT_URL, "http://developer.tizen.org"); -        /* Verify the SSL certificate */ -        curl_easy_setopt(curl_handle, CURLOPT_SSL_VERIFYPEER, 0L); + /* Verify the SSL certificate */ + curl_easy_setopt(curl_handle, CURLOPT_SSL_VERIFYPEER, 0L); -        /* Verify the host name in the SSL certificate */ -        curl_easy_setopt(curl_handle, CURLOPT_SSL_VERIFYHOST, 0L); + /* Verify the host name in the SSL certificate */ + curl_easy_setopt(curl_handle, CURLOPT_SSL_VERIFYHOST, 0L); -        /* Follow HTTP 3xx redirects */ -        curl_easy_setopt(curl_handle, CURLOPT_FOLLOWLOCATION, 1L); + /* Follow HTTP 3xx redirects */ + curl_easy_setopt(curl_handle, CURLOPT_FOLLOWLOCATION, 1L); -        /* Callback for writing data */ -        curl_easy_setopt(curl_handle, CURLOPT_WRITEFUNCTION, WriteMemoryCb); + /* Callback for writing data */ + curl_easy_setopt(curl_handle, CURLOPT_WRITEFUNCTION, WriteMemoryCb); -        /* Data pointer to pass to the write callback */ -        curl_easy_setopt(curl_handle, CURLOPT_WRITEDATA, (void *)&chunk); + /* Data pointer to pass to the write callback */ + curl_easy_setopt(curl_handle, CURLOPT_WRITEDATA, (void *)&chunk); -        /* User-Agent: header */ -        curl_easy_setopt(curl_handle, CURLOPT_USERAGENT, "TizenMaps/1.0"); + /* User-Agent: header */ + curl_easy_setopt(curl_handle, CURLOPT_USERAGENT, "TizenMaps/1.0"); -        /* Provide a buffer for storing errors */ -        curl_easy_setopt(curl_handle, CURLOPT_ERRORBUFFER, errbuf); + /* Provide a buffer for storing errors */ + curl_easy_setopt(curl_handle, CURLOPT_ERRORBUFFER, errbuf); -        /* Timeout for the entire request */ -        curl_easy_setopt(curl_handle, CURLOPT_TIMEOUT, TIZEN_CFG_CURL_TIMEOUT); + /* Timeout for the entire request */ + curl_easy_setopt(curl_handle, CURLOPT_TIMEOUT, TIZEN_CFG_CURL_TIMEOUT); -        /* Callback to progress meter function */ -        curl_easy_setopt(curl_handle, CURLOPT_XFERINFOFUNCTION, XferInfoCb); + /* Callback to progress meter function */ + curl_easy_setopt(curl_handle, CURLOPT_XFERINFOFUNCTION, XferInfoCb); -        /* Switch off the progress meter */ -        curl_easy_setopt(curl_handle, CURLOPT_NOPROGRESS, 0L); + /* Switch off the progress meter */ + curl_easy_setopt(curl_handle, CURLOPT_NOPROGRESS, 0L); -        /* Perform a blocking file transfer */ -        error_code = curl_easy_perform(curl); -        dlog_print(DLOG_DEBUG, LOG_TAG, "curl_easy_perform(curl): %s (%d)", -                   curl_easy_strerror(error_code), error_code); -        if (error_code == CURLE_ABORTED_BY_CALLBACK) -            /* Clean up and display cancel message */ -        else if (error_code != CURLE_OK) -            /* Display failure message */ + /* Perform a blocking file transfer */ + error_code = curl_easy_perform(curl); + dlog_print(DLOG_DEBUG, LOG_TAG, "curl_easy_perform(curl): %s (%d)", + curl_easy_strerror(error_code), error_code); + if (error_code == CURLE_ABORTED_BY_CALLBACK) + /* Clean up and display cancel message */ + else if (error_code != CURLE_OK) + /* Display failure message */ -        curl_easy_cleanup(curl); -        dlog_print(DLOG_DEBUG, LOG_TAG, "curl_easy_cleanup(ad->curl)"); -    } else { -        /* Display failure message */ -    } + curl_easy_cleanup(curl); + dlog_print(DLOG_DEBUG, LOG_TAG, "curl_easy_cleanup(ad->curl)"); + } else { + /* Display failure message */ + } } /* @@ -311,24 +311,24 @@ download_contents(void *data) static void download_feedback_cb(void *data, Ecore_Thread *thread, void *msg_data) { -    /* TODO: Something that you want here */ -    if (msg_data == NULL) { -        dlog_print(DLOG_ERROR, LOG_TAG, "msg_data is NULL"); + /* TODO: Something that you want here */ + if (msg_data == NULL) { + dlog_print(DLOG_ERROR, LOG_TAG, "msg_data is NULL"); -        return; -    } + return; + } } static void download_thread_end_cb(void *data, Ecore_Thread *thread) { -    dlog_print(DLOG_ERROR, LOG_TAG, "thread end!"); + dlog_print(DLOG_ERROR, LOG_TAG, "thread end!"); } static void download_thread_cancel_cb(void *data, Ecore_Thread *thread) { -    dlog_print(DLOG_ERROR, LOG_TAG, "thread cancel!"); + dlog_print(DLOG_ERROR, LOG_TAG, "thread cancel!"); } @@ -340,8 +340,8 @@ download_thread_cancel_cb(void *data, Ecore_Thread *thread)

    The following figure illustrates the download states:

    -

    Figure: Download states

    -

    Download states

    +

    Figure: Download states

    +

    Download states

    The Start step begins to download content. If the queue is empty, the state is transited to downloading (DOWNLOAD_STATE_COMPLETED). Otherwise, the request is queued. The application can pause, cancel, or resume the download based on user interaction. Whenever the user makes a request, the state of the download is transited accordingly to paused, canceled, or downloading.

    @@ -350,7 +350,7 @@ download_thread_cancel_cb(void *data, Ecore_Thread *thread) 
     #include <tizen.h>
 #include <service_app.h>
-#include "service.h" /* Auto-generated header file by the Tizen Studio */
+#include "service.h" /* Auto-generated header file by the Tizen Studio */
 #include <download.h>
 
 download_error_e error;
@@ -359,85 +359,85 @@ int download_id;
 void
 state_changed_cb(int download_id, download_state_e state, void *user_data)
 {
-    /* Download state is completed, failed, or canceled, destroy the handle */
-    if (state >= DOWNLOAD_STATE_COMPLETED) {
-        dlog_print(DLOG_INFO, LOG_TAG, "Download completed!");
-        if (download_destroy(download_id) == DOWNLOAD_ERROR_NONE) {
-            dlog_print(DLOG_INFO, LOG_TAG, "Successfully released the memory of a download request!");
-        }
-    }
+    /* Download state is completed, failed, or canceled, destroy the handle */
+    if (state >= DOWNLOAD_STATE_COMPLETED) {
+        dlog_print(DLOG_INFO, LOG_TAG, "Download completed!");
+        if (download_destroy(download_id) == DOWNLOAD_ERROR_NONE) {
+            dlog_print(DLOG_INFO, LOG_TAG, "Successfully released the memory of a download request!");
+        }
+    }
 }
 
 /* Callback to be triggered by download_set_progress_cb() */
 static void
 progress_cb(int download_id, unsigned long long received, void *user_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "received: %llu of %llu", received, *((unsigned long long*)user_data));
+    dlog_print(DLOG_INFO, LOG_TAG, "received: %llu of %llu", received, *((unsigned long long*)user_data));
 }
 
 /* Download the file with notification to default file name and location */
 int
 start_downloading()
 {
-    /* Create a download handle */
-    error = download_create(&download_id);
-
-    /* Set a callback to get the state */
-    error = download_set_state_changed_cb(download_id, state_changed_cb, NULL);
-    error = download_set_progress_cb(download_id, progress_cb, &content_size);
-
-    /* Set the URL for downloading content */
-    error = download_set_url(download_id, "http://developer.tizen.org");
-
-    /*
-       Set the destination path and file name
-       If the values are not given, the default storage and an auto-generated file name are used
-    */
-    char *data_path = app_get_data_path();
-    error = download_set_destination(download_id, data_path);
-    free(data_path);
-    error = download_set_file_name(download_id, "downloaded_file.bin");
-
-    /*
-       Set auto download
-       If you set the second parameter to true, the download manager continues downloading
-       even after the client process is terminated
-    */
-    error = download_set_auto_download(download_id, true);
-
-    /* Start content download */
-    error = download_start(download_id);
-
-    return error;
+    /* Create a download handle */
+    error = download_create(&download_id);
+
+    /* Set a callback to get the state */
+    error = download_set_state_changed_cb(download_id, state_changed_cb, NULL);
+    error = download_set_progress_cb(download_id, progress_cb, &content_size);
+
+    /* Set the URL for downloading content */
+    error = download_set_url(download_id, "http://developer.tizen.org");
+
+    /*
+       Set the destination path and file name
+       If the values are not given, the default storage and an auto-generated file name are used
+    */
+    char *data_path = app_get_data_path();
+    error = download_set_destination(download_id, data_path);
+    free(data_path);
+    error = download_set_file_name(download_id, "downloaded_file.bin");
+
+    /*
+       Set auto download
+       If you set the second parameter to true, the download manager continues downloading
+       even after the client process is terminated
+    */
+    error = download_set_auto_download(download_id, true);
+
+    /* Start content download */
+    error = download_start(download_id);
+
+    return error;
 }
 
 int
 end_downloading()
 {
-    /* Release callbacks */
-    download_unset_progress_cb(download_id);
-    download_unset_state_changed_cb(download_id);
+    /* Release callbacks */
+    download_unset_progress_cb(download_id);
+    download_unset_state_changed_cb(download_id);
 
-    /* Destroy the download handle */
-    error = download_destroy(download_id);
+    /* Destroy the download handle */
+    error = download_destroy(download_id);
 
-    return error;
+    return error;
 }
 
 bool
 service_app_create(void *data)
 {
-    start_downloading(data);
+    start_downloading(data);
 
-    return true;
+    return true;
 }
 
 void
 service_app_terminate(void *data)
 {
-    end_downloading();
+    end_downloading();
 
-    return;
+    return;
 }
 
 /* Assume that auto-generated functions from the Tizen Studio are here */
@@ -445,24 +445,24 @@ service_app_terminate(void *data)
 int
 main(int argc, char* argv[])
 {
-    char ad[50] = {0,};
-    service_app_lifecycle_callback_s event_callback;
-    app_event_handler_h handlers[5] = {NULL,};
-
-    event_callback.create = service_app_create;
-    event_callback.terminate = service_app_terminate;
-    event_callback.app_control = service_app_control;
-
-    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY,
-                                  service_app_low_battery, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
-                                  service_app_low_memory, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED,
-                                  service_app_lang_changed, &ad);
-    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED,
-                                  service_app_region_changed, &ad);
-
-    return service_app_main(argc, argv, &event_callback, ad);
+    char ad[50] = {0,};
+    service_app_lifecycle_callback_s event_callback;
+    app_event_handler_h handlers[5] = {NULL,};
+
+    event_callback.create = service_app_create;
+    event_callback.terminate = service_app_terminate;
+    event_callback.app_control = service_app_control;
+
+    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY,
+                                  service_app_low_battery, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY,
+                                  service_app_low_memory, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED,
+                                  service_app_lang_changed, &ad);
+    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED,
+                                  service_app_region_changed, &ad);
+
+    return service_app_main(argc, argv, &event_callback, ad);
 }
    @@ -478,8 +478,8 @@ main(int argc, char* argv[]) 
     <privileges>
-   <privilege>http://tizen.org/privilege/filesystem.read</privilege>
-   <privilege>http://tizen.org/privilege/filesystem.write</privilege>
+   <privilege>http://tizen.org/privilege/filesystem.read</privilege>
+   <privilege>http://tizen.org/privilege/filesystem.write</privilege>
 </privileges>
    @@ -497,95 +497,95 @@ main(int argc, char* argv[]) static void parse_downloaded(void *data) { -    char *file_name = NULL; -    download_get_downloaded_file_path((int)data, &file_name); -    dlog_print(DLOG_DEBUG, LOG_TAG, "got file %s", file_name); + char *file_name = NULL; + download_get_downloaded_file_path((int)data, &file_name); + dlog_print(DLOG_DEBUG, LOG_TAG, "got file %s", file_name); -    /* Parse a file */ -    call_parser(file_name); + /* Parse a file */ + call_parser(file_name); -    /* Remove the file when no longer used */ -    remove(file_name); + /* Remove the file when no longer used */ + remove(file_name); } static void call_parser(char *file_name) { -    int parse_reply = json_parse(file_name, ad_); -    if (parse_reply == -1) { -        elm_object_text_set(ad_->popup_label, "<align=center>This file is not in JSON format</align>"); -    } else if (parse_reply == 1) { -        elm_object_text_set(ad_->popup_label, "<align=center>File parsed, however some nodes " -                            "weren't imported due to the limit of nesting level</align>"); -    } else { -        elm_object_text_set(ad_->popup_label, "<align=center>File parsed</align>"); -    } + int parse_reply = json_parse(file_name, ad_); + if (parse_reply == -1) { + elm_object_text_set(ad_->popup_label, "<align=center>This file is not in JSON format</align>"); + } else if (parse_reply == 1) { + elm_object_text_set(ad_->popup_label, "<align=center>File parsed, however some nodes " + "weren't imported due to the limit of nesting level</align>"); + } else { + elm_object_text_set(ad_->popup_label, "<align=center>File parsed</align>"); + } } /* Parse a given JSON file */ int json_parse(char *file_name, void *data) { -    appdata_s *ad = (appdata_s *)data; -    GError *error = NULL; -    JsonParser *parser = json_parser_new(); + appdata_s *ad = (appdata_s *)data; + GError *error = NULL; + JsonParser *parser = json_parser_new(); -    /* Load a file to parse */ -    json_parser_load_from_file(parser, file_name, &error); + /* Load a file to parse */ + json_parser_load_from_file(parser, file_name, &error); -    dlog_print(DLOG_DEBUG, LOG_TAG, "parsing %s", file_name); + dlog_print(DLOG_DEBUG, LOG_TAG, "parsing %s", file_name); -    if (error) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "parsing failed"); -        g_object_unref(parser); -        g_error_free(error); + if (error) { + dlog_print(DLOG_DEBUG, LOG_TAG, "parsing failed"); + g_object_unref(parser); + g_error_free(error); -        return -1; -    } + return -1; + } -    /* Iterate through root members */ -    JsonNode *root = json_parser_get_root(parser); + /* Iterate through root members */ + JsonNode *root = json_parser_get_root(parser); -    if (json_node_get_node_type(root) == JSON_NODE_NULL -        || json_node_get_node_type(root) == JSON_NODE_VALUE) { -        dlog_print(DLOG_DEBUG, LOG_TAG, "not supported root"); -        g_object_unref(parser); + if (json_node_get_node_type(root) == JSON_NODE_NULL + || json_node_get_node_type(root) == JSON_NODE_VALUE) { + dlog_print(DLOG_DEBUG, LOG_TAG, "not supported root"); + g_object_unref(parser); -        return -1; -    } + return -1; + } -    ad->parsing_in_progress = true; + ad->parsing_in_progress = true; -    /* Show editor item */ -    create_editor_view(data, NULL, NULL); + /* Show editor item */ + create_editor_view(data, NULL, NULL); -    switch (json_node_get_node_type(root)) { -    case JSON_NODE_OBJECT: -        ; -        JsonObject *object; -        object = json_node_get_object(root); -        json_object_foreach_member(object, object_member_cb, (gpointer)root_associated); -        break; -    case JSON_NODE_ARRAY: -        ; -        JsonArray *array; -        array = json_node_get_array(root); -        json_array_foreach_element(array, array_element_cb, (gpointer)root_associated); -        break; -    default: -        ; -    } + switch (json_node_get_node_type(root)) { + case JSON_NODE_OBJECT: + ; + JsonObject *object; + object = json_node_get_object(root); + json_object_foreach_member(object, object_member_cb, (gpointer)root_associated); + break; + case JSON_NODE_ARRAY: + ; + JsonArray *array; + array = json_node_get_array(root); + json_array_foreach_element(array, array_element_cb, (gpointer)root_associated); + break; + default: + ; + } -    root_associated->type = json_node_get_node_type(root); + root_associated->type = json_node_get_node_type(root); -    ad->parsing_in_progress = false; + ad->parsing_in_progress = false; -    g_object_unref(parser); + g_object_unref(parser); -    if (nodes_omitted) -        return 1; + if (nodes_omitted) + return 1; -    return 0; + return 0; } @@ -626,53 +626,53 @@ json_parse(char *file_name, void *data) static void exampleFunc(const char *filename) { -    xmlParserCtxtPtr ctxt; /* Parser context */ -    xmlDocPtr doc; /* Resulting document tree */ - -    /* Create a parser context */ -    ctxt = xmlNewParserCtxt(); -    if (ctxt == NULL) { -        fprintf(stderr, "Failed to allocate parser context\n"); - -        return; -    } -    /* Parse the file, activating the DTD validation option */ -    doc = xmlCtxtReadFile(ctxt, filename, NULL, XML_PARSE_DTDVALID); -    /* Check whether parsing succeeds */ -    if (doc == NULL) { -        fprintf(stderr, "Failed to parse %s\n", filename); -    } else { -        /* Check whether validation succeeds */ -        if (ctxt->valid == 0) -            fprintf(stderr, "Failed to validate %s\n", filename); -        /* Free up the resulting document */ -        xmlFreeDoc(doc); -    } -    /* Free up the parser context */ -    xmlFreeParserCtxt(ctxt); + xmlParserCtxtPtr ctxt; /* Parser context */ + xmlDocPtr doc; /* Resulting document tree */ + + /* Create a parser context */ + ctxt = xmlNewParserCtxt(); + if (ctxt == NULL) { + fprintf(stderr, "Failed to allocate parser context\n"); + + return; + } + /* Parse the file, activating the DTD validation option */ + doc = xmlCtxtReadFile(ctxt, filename, NULL, XML_PARSE_DTDVALID); + /* Check whether parsing succeeds */ + if (doc == NULL) { + fprintf(stderr, "Failed to parse %s\n", filename); + } else { + /* Check whether validation succeeds */ + if (ctxt->valid == 0) + fprintf(stderr, "Failed to validate %s\n", filename); + /* Free up the resulting document */ + xmlFreeDoc(doc); + } + /* Free up the parser context */ + xmlFreeParserCtxt(ctxt); } int main(int argc, char **argv) { -    if (argc != 2) -        return(1); + if (argc != 2) + return(1); -    /* -     Initialize the library and check potential ABI mismatches -     between the version it was compiled for and the actual shared -     library used -    */ -    LIBXML_TEST_VERSION + /* + Initialize the library and check potential ABI mismatches + between the version it was compiled for and the actual shared + library used + */ + LIBXML_TEST_VERSION -    exampleFunc(argv[1]); + exampleFunc(argv[1]); -    /* Cleanup function for the XML library */ -    xmlCleanupParser(); -    /* This is to debug memory for regression tests */ -    xmlMemoryDump(); + /* Cleanup function for the XML library */ + xmlCleanupParser(); + /* This is to debug memory for regression tests */ + xmlMemoryDump(); -    return(0); + return(0); } diff --git a/org.tizen.training/html/native/feature/app_connectivity_p2p_n.htm b/org.tizen.training/html/native/feature/app_connectivity_p2p_n.htm index 4c1718d..9e99542 100644 --- a/org.tizen.training/html/native/feature/app_connectivity_p2p_n.htm +++ b/org.tizen.training/html/native/feature/app_connectivity_p2p_n.htm @@ -5,13 +5,13 @@ - + - P2P Connections with Wi-Fi Direct™ + P2P Connections with Wi-Fi Direct™ @@ -32,10 +32,10 @@ +
    -
    -
    +
    +

    P2P Connections with Wi-Fi Direct™

    Wi-Fi Direct™ (synonym for Wi-Fi P2P (Peer-to-Peer)) is a technology that allows you to find nearby Wi-Fi Direct™ devices and form a Wi-Fi Direct™ group to communicate over a peer-to-peer link without wireless access points (base stations) in the infrastructure mode.

    @@ -61,12 +61,12 @@ 
     <privileges>
-   <privilege>http://tizen.org/privilege/network.get</privilege>
-   <privilege>http://tizen.org/privilege/internet</privilege>
-   <privilege>http://tizen.org/privilege/wifidirect</privilege>
+   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/internet</privilege>
+   <privilege>http://tizen.org/privilege/wifidirect</privilege>
 </privileges>
    - +
    Note Wi-Fi Direct™ does not require an Internet connection, but it needs the http://tizen.org/privilege/internet privilege because it uses standard sockets. @@ -105,18 +105,18 @@ error_code = wifi_direct_initialize();
  • Activate Wi-Fi Direct™. -

    Define the device_state_changed_cb() callback function, which is invoked whenever a Wi-Fi Direct™ local device activates or deactivates:

    +

    Define the device_state_changed_cb() callback function, which is invoked whenever a Wi-Fi Direct™ local device activates or deactivates:

     /* Get the Wi-Fi Direct™ activation and deactivation events in device_state_changed_cb() callback */
 static void
 device_state_changed_cb(wifi_direct_error_e error_code,
-                        wifi_direct_discovery_state_e discovery_state, void *user_data)
+                        wifi_direct_discovery_state_e discovery_state, void *user_data)
 {
-    if (device_state == WIFI_DIRECT_DEVICE_STATE_ACTIVATED)
-        printf("Activate Wi-Fi Direct™ device!\n");
-    else if (device_state == WIFI_DIRECT_DEVICE_STATE_DEACTIVATED)
-        printf("Deactivate Wi-Fi Direct™ device!\n");
+    if (device_state == WIFI_DIRECT_DEVICE_STATE_ACTIVATED)
+        printf("Activate Wi-Fi Direct™ device!\n");
+    else if (device_state == WIFI_DIRECT_DEVICE_STATE_DEACTIVATED)
+        printf("Deactivate Wi-Fi Direct™ device!\n");
 }
 
 error_code = wifi_direct_set_device_state_changed_cb(device_state_changed_cb, NULL);
@@ -124,11 +124,11 @@ error_code = wifi_direct_set_device_state_changed_cb(device_state_changed_cb, NU
 /* Activate Wi-Fi Direct™ */
 error_code = wifi_direct_activate();
 if (error_code != WIFI_DIRECT_ERROR_NONE) {
-    dlog_print(DLOG_ERROR, LOG_TAG, "[wifi_direct_activate] Failed.");
+    dlog_print(DLOG_ERROR, LOG_TAG, "[wifi_direct_activate] Failed.");
 
-    return;
+    return;
 } else {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "[wifi_direct_activate] Succeeded.");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "[wifi_direct_activate] Succeeded.");
 }
    @@ -139,7 +139,7 @@ if (error_code != WIFI_DIRECT_ERROR_NONE) { 
     void
 discovery_state_changed_cb(wifi_direct_error_e error_code,
-                           wifi_direct_discovery_state_e discovery_state, void *user_data);
+                           wifi_direct_discovery_state_e discovery_state, void *user_data);
 
 error_code = wifi_direct_set_discovery_state_changed_cb(discovery_state_changed_cb, NULL);
 
@@ -160,32 +160,32 @@ char * mac_address = NULL;
 bool
 discovered_peer_cb(wifi_direct_discovered_peer_info_s *peer, void *user_data)
 {
-    if (NULL != peer) {
-        printf("\nDevice Name: %s", peer->device_name);
-        printf("\nMac Address: %s", peer->mac_address);
-        mac_address = strdup(peer->mac_address);
-        error_code = wifi_direct_connect(mac_address);
-        if (error_code != WIFI_DIRECT_ERROR_NONE) {
-            printf("Fail to connect\n");
-
-            return -1;
-        }
-
-        return 1;
-    }
+    if (NULL != peer) {
+        printf("\nDevice Name: %s", peer->device_name);
+        printf("\nMac Address: %s", peer->mac_address);
+        mac_address = strdup(peer->mac_address);
+        error_code = wifi_direct_connect(mac_address);
+        if (error_code != WIFI_DIRECT_ERROR_NONE) {
+            printf("Fail to connect\n");
+
+            return -1;
+        }
+
+        return 1;
+    }
 }
 
 int
 fetch_wifi_direct()
 {
-    int error_code;
+    int error_code;
 
-    int ret = wifi_direct_foreach_discovered_peers(discovered_peer_cb, &mac_address);
-    if (ret != WIFI_DIRECT_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "[wifi_direct_foreach_discovered_peers] Failed.");
+    int ret = wifi_direct_foreach_discovered_peers(discovered_peer_cb, &mac_address);
+    if (ret != WIFI_DIRECT_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "[wifi_direct_foreach_discovered_peers] Failed.");
 
-        return;
-    }
+        return;
+    }
 }
    • @@ -194,58 +194,58 @@ fetch_wifi_direct() 
     static void
 connection_state_changed_cb(wifi_direct_error_e error_code,
-                            wifi_direct_connection_state_e connection_state,
-                            const char *mac_address, void *user_data)
+                            wifi_direct_connection_state_e connection_state,
+                            const char *mac_address, void *user_data)
 {
-    printf("Connection state changed to: [%d] [%s]\n", connection_state,
-           test_wfd_convert_connection_state_to_string(connection_state));
-
-    bool accept_connection = false;
-    int rv = 0;
-
-    switch (connection_state) {
-    case WIFI_DIRECT_CONNECTION_WPS_REQ:
-        /* Outgoing requests */
-        wifi_direct_wps_type_e wps_mode;
-        wifi_direct_get_local_wps_type(&wps_mode);
-        /* Handle the event */
-        break;
-    case WIFI_DIRECT_CONNECTION_REQ:
-        /* Incoming requests */
-        wifi_direct_wps_type_e wps_mode;
-        wifi_direct_get_local_wps_type(&wps_mode);
-        /* Handle the event */
-        break;
-    case WIFI_DIRECT_INVITATION_REQ:
-        /* Invitation request from peer */
-        /* Handle the event */
-        break;
-    case WIFI_DIRECT_DISASSOCIATION_IND:
-    case WIFI_DIRECT_DISCONNECTION_IND:
-        printf("Peer: [%s] disconnected.\n", mac_address);
-        /* Handle the event */
-        break;
-    case WIFI_DIRECT_CONNECTION_IN_PROGRESS:
-        printf("Connection in progress\n");
-        /* Handle the event */
-    case WIFI_DIRECT_CONNECTION_RSP:
-        if (error_code == WIFI_DIRECT_ERROR_CONNECTION_FAILED) {
-            printf(MAKE_RED"Time Out or connection failed"RESET_COLOR"\n");
-            /* Handle the event */
-        }
-        break;
-    case WIFI_DIRECT_GROUP_CREATED:
-        /* Handle the event */
-        break;
-    case WIFI_DIRECT_GROUP_DESTROYED:
-        /* Handle the event */
-        break;
-    case WIFI_DIRECT_DISCONNECTION_RSP:
-        /* Handle the event */
-        break;
-    default:
-        printf("Unknown State Received\n");
-    }
+    printf("Connection state changed to: [%d] [%s]\n", connection_state,
+           test_wfd_convert_connection_state_to_string(connection_state));
+
+    bool accept_connection = false;
+    int rv = 0;
+
+    switch (connection_state) {
+    case WIFI_DIRECT_CONNECTION_WPS_REQ:
+        /* Outgoing requests */
+        wifi_direct_wps_type_e wps_mode;
+        wifi_direct_get_local_wps_type(&wps_mode);
+        /* Handle the event */
+        break;
+    case WIFI_DIRECT_CONNECTION_REQ:
+        /* Incoming requests */
+        wifi_direct_wps_type_e wps_mode;
+        wifi_direct_get_local_wps_type(&wps_mode);
+        /* Handle the event */
+        break;
+    case WIFI_DIRECT_INVITATION_REQ:
+        /* Invitation request from peer */
+        /* Handle the event */
+        break;
+    case WIFI_DIRECT_DISASSOCIATION_IND:
+    case WIFI_DIRECT_DISCONNECTION_IND:
+        printf("Peer: [%s] disconnected.\n", mac_address);
+        /* Handle the event */
+        break;
+    case WIFI_DIRECT_CONNECTION_IN_PROGRESS:
+        printf("Connection in progress\n");
+        /* Handle the event */
+    case WIFI_DIRECT_CONNECTION_RSP:
+        if (error_code == WIFI_DIRECT_ERROR_CONNECTION_FAILED) {
+            printf(MAKE_RED"Time Out or connection failed"RESET_COLOR"\n");
+            /* Handle the event */
+        }
+        break;
+    case WIFI_DIRECT_GROUP_CREATED:
+        /* Handle the event */
+        break;
+    case WIFI_DIRECT_GROUP_DESTROYED:
+        /* Handle the event */
+        break;
+    case WIFI_DIRECT_DISCONNECTION_RSP:
+        /* Handle the event */
+        break;
+    default:
+        printf("Unknown State Received\n");
+    }
 }
 
 error_code = wifi_direct_set_connection_state_changed_cb(connection_state_changed_cb, NULL);
@@ -256,9 +256,9 @@ error_code = wifi_direct_set_connection_state_changed_cb(connection_state_change
 
     error_code = wifi_direct_disconnect(mac_address);
 if (error_code != WIFI_DIRECT_ERROR_NONE) {
-    printf("Fail to disconnect\n");
+    printf("Fail to disconnect\n");
 
-    return -1;
+    return -1;
 }
 
    
 
@@ -308,7 +308,7 @@ wifi_direct_deinitialize();
 
 
    Wi-Fi Direct™ is a new technology defined by the Wi-Fi Alliance aimed at enhancing direct device to device communications in Wi-Fi. Wi-Fi Direct™ can be used to directly connect mobile phones, tablets, and PCs to peripherals, such as cameras, printers, gaming devices, or a wireless mouse, without the need for an access point. Devices can make a one-to-one connection, or a group of several devices can connect.
    
 
-
    Figure: Wi-Fi Direct™
     
+
    Figure: Wi-Fi Direct™
    
 
    Wi-Fi Direct
    
 
 
    Direct device to device connectivity was already possible in the original IEEE 802.11 standard by means of the ad-hoc mode of operation. However, this never became widely deployed. Wi-Fi Direct™ takes a different approach: in it, one of the devices acts as an access point. This means that legacy Wi-Fi devices can seamlessly connect to Wi-Fi Direct™ devices.
    
@@ -316,16 +316,16 @@ wifi_direct_deinitialize();
 
    TDLS (Tunneled Direct Link Setup)
    
 
 
    The IEEE 802.11z amendment is a mechanism that makes it possible to directly transfer data between 2 Wi-Fi clients that are part of the same Wi-Fi network.
    
-  
-
    Figure: TDLS
     
-
    TDLS
     
+
+
    Figure: TDLS
    
+
    TDLS
    
 
 
    Usually, in a Wi-Fi network, data is transferred from one client to another through an access point (AP). The IEEE 802.11z amendment defines mechanisms that allow IEEE 802.11 to set up a direct link between client devices while also remaining associated with the AP. These mechanisms are referred to as Tunneled Direct Link Setup (TDLS). This reduces the amount of traffic that is transferred in the network and prevents congestion at the AP.
    
 
 
    A TDLS direct link is set up automatically between the devices, without intervention from the AP or the user. The connection with the AP is maintained.
    
 
 
    TDLS is not the same as, nor does it replace Wi-Fi Direct™. TDLS is used to optimize the traffic flow in a network, while Wi-Fi Direct™ is used to quickly connect devices to one another while on the go, even when a Wi-Fi network is unavailable.
    
- 
+
    diff --git a/org.tizen.training/html/native/feature/app_connectivity_usage_n.htm b/org.tizen.training/html/native/feature/app_connectivity_usage_n.htm index ebf15ae..d9c683e 100644 --- a/org.tizen.training/html/native/feature/app_connectivity_usage_n.htm +++ b/org.tizen.training/html/native/feature/app_connectivity_usage_n.htm @@ -5,13 +5,13 @@ - + - Network Usage + Network Usage @@ -25,7 +25,7 @@ @@ -36,11 +36,11 @@
  • Network API for Wearable Native
    • -
    -
    +
    +

    Network Usage

    -

    The following sections describe how to create applications that have cost-efficient control over their usage of network resources. If your application performs a lot of network operations, you must provide user settings that allow the user to control your application's data behavior, such as how often the application syncs data, whether to perform uploads or downloads only when Wi-Fi is switched on, and whether to use data while roaming. With these controls available to them, users are much less likely to disable your application's access to background data when they approach their limits, because they can instead precisely control how much data your application uses.

    +

    The following sections describe how to create applications that have cost-efficient control over their usage of network resources. If your application performs a lot of network operations, you must provide user settings that allow the user to control your application's data behavior, such as how often the application syncs data, whether to perform uploads or downloads only when Wi-Fi is switched on, and whether to use data while roaming. With these controls available to them, users are much less likely to disable your application's access to background data when they approach their limits, because they can instead precisely control how much data your application uses.

    Required Privileges and Features

    @@ -50,7 +50,7 @@ 
     <privileges>
-   <privilege>http://tizen.org/privilege/network.get</privilege>
+   <privilege>http://tizen.org/privilege/network.get</privilege>
 </privileges>
    @@ -95,27 +95,27 @@ static void connection_changed_cb(connection_type_e type, void* user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "Type changed callback, connection type: %d", type); + dlog_print(DLOG_INFO, LOG_TAG, "Type changed callback, connection type: %d", type); } int get_network_connection() { -    int error_code; -    static connection_h connection; -    void *user_data; + int error_code; + static connection_h connection; + void *user_data; -    error_code = connection_create(&connection); -    if (error_code != CONNECTION_ERROR_NONE) -        return; + error_code = connection_create(&connection); + if (error_code != CONNECTION_ERROR_NONE) + return; -    error_code = connection_set_type_changed_cb(connection, connection_changed_cb, user_data); -    if (error_code != CONNECTION_ERROR_NONE) -        return; + error_code = connection_set_type_changed_cb(connection, connection_changed_cb, user_data); + if (error_code != CONNECTION_ERROR_NONE) + return; -    error_code = connection_destroy(connection); -    if (error_code != CONNECTION_ERROR_NONE) -        return; + error_code = connection_destroy(connection); + if (error_code != CONNECTION_ERROR_NONE) + return; } @@ -160,47 +160,47 @@ get_network_connection() char* _telephony_network_state_to_string(telephony_network_service_state_e network_state) { -    switch (network_state) { -    case TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE: -        return "TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE"; -    case TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE: -        return "TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE"; -    case TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY: -        return "TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY"; -    default: -        return "Unknown"; -    } + switch (network_state) { + case TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE: + return "TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE"; + case TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE: + return "TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE"; + case TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY: + return "TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY"; + default: + return "Unknown"; + } } void get_telephony_information(appdata_s *ad, Evas_Object *obj, void *event_info) { -    /* Create a telephony handle */ -    telephony_handle_list_s handle_list; -    ret = telephony_init(&handle_list); /* In case of a single SIM, you get only one handle */ - -    /* Print */ -    for (i = 0; i < app_data->handle_list.count; i++) { -        dlog_print(DLOG_INFO, "TEST", "telephony handle[%p] for subscription[%d]", -                   app_data->handle_list.handle[i], i); -    } - -    /* Get the network service state */ -    telephony_network_service_state_e network_service_state; -    char *state = NULL; -    ret = telephony_network_get_service_state(handle_list.handle[0], &network_service_state); -    state = _telephony_network_state_to_string(network_service_state); -    if (ret != TELEPHONY_ERROR_NONE) -        dlog_print(DLOG_DEBUG, LOG_TAG, "[telephony_network_get_service_state] failed"); -    else -        dlog_print(DLOG_DEBUG, LOG_TAG, "Network Service State [%s]", state); + /* Create a telephony handle */ + telephony_handle_list_s handle_list; + ret = telephony_init(&handle_list); /* In case of a single SIM, you get only one handle */ + + /* Print */ + for (i = 0; i < app_data->handle_list.count; i++) { + dlog_print(DLOG_INFO, "TEST", "telephony handle[%p] for subscription[%d]", + app_data->handle_list.handle[i], i); + } + + /* Get the network service state */ + telephony_network_service_state_e network_service_state; + char *state = NULL; + ret = telephony_network_get_service_state(handle_list.handle[0], &network_service_state); + state = _telephony_network_state_to_string(network_service_state); + if (ret != TELEPHONY_ERROR_NONE) + dlog_print(DLOG_DEBUG, LOG_TAG, "[telephony_network_get_service_state] failed"); + else + dlog_print(DLOG_DEBUG, LOG_TAG, "Network Service State [%s]", state); } static void app_terminate(void *data) { -    /* Release and free the created telephony handle */ -    telephony_deinit(&handle_list); + /* Release and free the created telephony handle */ + telephony_deinit(&handle_list); } /* Auto-generated functions (from the Tizen Studio) are not included */ @@ -208,25 +208,25 @@ app_terminate(void *data) int main(int argc, char* argv[]) { -    AppData app_data; /* Store telephony handle here */ -    service_app_lifecycle_callback_s event_callback; -    app_event_handler_h handlers[5] = {NULL,}; - -    event_callback.create = service_app_create; -    event_callback.terminate = service_app_terminate; -    event_callback.app_control = service_app_control; - -    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY, -                                  service_app_low_battery, &app_data); -    service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY, -                                  service_app_low_memory, &app_data); -    service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED, -                                  service_app_lang_changed, &app_data); -    service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED, -                                  service_app_region_changed, &app_data); - -    /* Set AppData as a user_data */ -    return service_app_main(argc, argv, &event_callback, &app_data); + AppData app_data; /* Store telephony handle here */ + service_app_lifecycle_callback_s event_callback; + app_event_handler_h handlers[5] = {NULL,}; + + event_callback.create = service_app_create; + event_callback.terminate = service_app_terminate; + event_callback.app_control = service_app_control; + + service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], APP_EVENT_LOW_BATTERY, + service_app_low_battery, &app_data); + service_app_add_event_handler(&handlers[APP_EVENT_LOW_MEMORY], APP_EVENT_LOW_MEMORY, + service_app_low_memory, &app_data); + service_app_add_event_handler(&handlers[APP_EVENT_LANGUAGE_CHANGED], APP_EVENT_LANGUAGE_CHANGED, + service_app_lang_changed, &app_data); + service_app_add_event_handler(&handlers[APP_EVENT_REGION_FORMAT_CHANGED], APP_EVENT_REGION_FORMAT_CHANGED, + service_app_region_changed, &app_data); + + /* Set AppData as a user_data */ + return service_app_main(argc, argv, &event_callback, &app_data); } @@ -276,11 +276,11 @@ main(int argc, char* argv[]) Default subscription TELEPHONY_NOTI_NETWORK_DEFAULT_SUBSCRIPTION - + - +

    The telephony_noti_e enumerator (in mobile and wearable applications) defines the available notification IDs. The callback function registered by the telephony_set_noti_cb() function (network_service_state_noti_cb() in the following example) delivers change notifications for a network asynchronously.

    - +

    The following example demonstrates how to register a notification for the mobile network state change:

    @@ -288,48 +288,48 @@ main(int argc, char* argv[])
 char*
 _telephony_network_state_to_string(telephony_network_service_state_e network_state)
 {
-    switch (network_state) {
-    case TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE:
-        return "TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE";
-    case TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE:
-        return "TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE";
-    case TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY:
-        return "TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY";
-    default:
-        return "Unknown";
-    }
+    switch (network_state) {
+    case TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE:
+        return "TELEPHONY_NETWORK_SERVICE_STATE_IN_SERVICE";
+    case TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE:
+        return "TELEPHONY_NETWORK_SERVICE_STATE_OUT_OF_SERVICE";
+    case TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY:
+        return "TELEPHONY_NETWORK_SERVICE_STATE_EMERGENCY_ONLY";
+    default:
+        return "Unknown";
+    }
 }
 
 /* This function is triggered, if the mobile network status is changed */
 void
 network_service_state_noti_cb(telephony_h handle, telephony_noti_e noti_id, void *data, void *user_data)
 {
-    telephony_network_service_state_e network_state = *(int *)data;
-    char *network_state_string = _telephony_network_state_to_string(network_state);
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Network service state: [%s]", network_state_string);
+    telephony_network_service_state_e network_state = *(int *)data;
+    char *network_state_string = _telephony_network_state_to_string(network_state);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Network service state: [%s]", network_state_string);
 }
 
 void
 monitor_telephony_information(appdata_s *ad, Evas_Object *obj, void *event_info)
 {
-    /*  Create a telephony handle */
-    telephony_handle_list_s handle_list;
-    ret = telephony_init(&handle_list); /* In case of a single SIM, you get only one handle */
-
-    /*
-       Register the network_service_state_noti_cb() callback function
-       to be notified if the Network Service state is changed
-    */
-    ret = telephony_set_noti_cb(handle_list.handle[0], TELEPHONY_NOTI_NETWORK_SERVICE_STATE, network_service_state_noti_cb, NULL);
-    if (ret != TELEPHONY_ERROR_NONE)
-        dlog_print(DLOG_DEBUG, LOG_TAG, "[telephony_set_noti_cb] failed");
+    /*  Create a telephony handle */
+    telephony_handle_list_s handle_list;
+    ret = telephony_init(&handle_list); /* In case of a single SIM, you get only one handle */
+
+    /*
+       Register the network_service_state_noti_cb() callback function
+       to be notified if the Network Service state is changed
+    */
+    ret = telephony_set_noti_cb(handle_list.handle[0], TELEPHONY_NOTI_NETWORK_SERVICE_STATE, network_service_state_noti_cb, NULL);
+    if (ret != TELEPHONY_ERROR_NONE)
+        dlog_print(DLOG_DEBUG, LOG_TAG, "[telephony_set_noti_cb] failed");
 }
 
 static void
 app_terminate(void *data)
 {
-    /* Release and free the created telephony handle */
-    telephony_deinit(&handle_list);
+    /* Release and free the created telephony handle */
+    telephony_deinit(&handle_list);
 }
    @@ -359,26 +359,26 @@ connection_cellular_state_e cellular_state; connection_get_cellular_state(connection, &cellular_state); switch (cellular_state) { case CONNECTION_CELLULAR_STATE_OUT_OF_SERVICE: -    dlog_print(DLOG_INFO, LOG_TAG, "Out of service"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Out of service"); + break; case CONNECTION_CELLULAR_STATE_FLIGHT_MODE: -    dlog_print(DLOG_INFO, LOG_TAG, "Flight mode"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Flight mode"); + break; case CONNECTION_CELLULAR_STATE_ROAMING_OFF: -    dlog_print(DLOG_INFO, LOG_TAG, "Roaming is switched off"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Roaming is switched off"); + break; case CONNECTION_CELLULAR_STATE_CALL_ONLY_AVAILABLE: -    dlog_print(DLOG_INFO, LOG_TAG, "Call only"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Call only"); + break; case CONNECTION_CELLULAR_STATE_AVAILABLE: -    dlog_print(DLOG_INFO, LOG_TAG, "Available"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Available"); + break; case CONNECTION_CELLULAR_STATE_CONNECTED: -    dlog_print(DLOG_INFO, LOG_TAG, "Connected"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Connected"); + break; default: -    dlog_print(DLOG_INFO, LOG_TAG, "error"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "error"); + break; } @@ -401,17 +401,17 @@ connection_wifi_state_e wifi_state; connection_get_wifi_state(connection, &wifi_state); switch (wifi_state) { case CONNECTION_WIFI_STATE_DEACTIVATED: -    dlog_print(DLOG_INFO, LOG_TAG, "Deactivated state"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Deactivated state"); + break; case CONNECTION_WIFI_STATE_DISCONNECTED: -    dlog_print(DLOG_INFO, LOG_TAG, "Disconnected state"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Disconnected state"); + break; case CONNECTION_WIFI_STATE_CONNECTED: -    dlog_print(DLOG_INFO, LOG_TAG, "Connected state"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "Connected state"); + break; default: -    dlog_print(DLOG_INFO, LOG_TAG, "error"); -    break; + dlog_print(DLOG_INFO, LOG_TAG, "error"); + break; } @@ -433,15 +433,15 @@ long long total_received_size; /* Gets statistics of total received data through the mobile network connection */ error_code = connection_get_statistics(connection, CONNECTION_TYPE_CELLULAR, -                                       CONNECTION_STATISTICS_TYPE_TOTAL_RECEIVED_DATA, -                                       &total_received_size); + CONNECTION_STATISTICS_TYPE_TOTAL_RECEIVED_DATA, + &total_received_size); long long total_sent_size; /* Gets statistics of total sent data through the mobile network connection */ error_code = connection_get_statistics(connection, CONNECTION_TYPE_CELLULAR, -                                       CONNECTION_STATISTICS_TYPE_TOTAL_SENT_DATA, -                                       &total_sent_size); + CONNECTION_STATISTICS_TYPE_TOTAL_SENT_DATA, + &total_sent_size); diff --git a/org.tizen.training/html/native/feature/app_contacts_basic_n.htm b/org.tizen.training/html/native/feature/app_contacts_basic_n.htm index bfef44b..4ed6907 100644 --- a/org.tizen.training/html/native/feature/app_contacts_basic_n.htm +++ b/org.tizen.training/html/native/feature/app_contacts_basic_n.htm @@ -5,13 +5,13 @@ - + - Basic Concepts + Basic Concepts @@ -31,10 +31,10 @@
  • Contacts Guide
  • Contacts API for Mobile Native
  • Contacts API for Wearable Native
    • - +
    -
    -
    +
    +

    Basic Concepts

    To be able to use contact features in your application, you must first understand how the basic concepts of contact and person are related, and how the contact information is stored in the Contacts database using records and views.

    @@ -50,8 +50,8 @@

    The following figure illustrates the contact structure. The example shows 3 instances of the same contact stored in different address books. Person1 is an aggregation of all 3 instances (Contact1, Contact2, and Contact3).

    -

    Figure: Contact structure

    -

    Contact structure

    +

    Figure: Contact structure

    +

    Contact structure

    Records and Views

    @@ -60,9 +60,9 @@

    Records contain properties of basic types:

    • integer
      • -
    • string
      • -
    • boolean
      • -
    • long integer
      • +
    • string
      • +
    • boolean
      • +
    • long integer
    • long long integer (lli)
    • double
    @@ -142,7 +142,7 @@ company Record - _contacts_company child record containing the contact's company details + _contacts_company child record containing the contact's company details address diff --git a/org.tizen.training/html/native/feature/app_contacts_group_n.htm b/org.tizen.training/html/native/feature/app_contacts_group_n.htm index c86e135..333bb0e 100644 --- a/org.tizen.training/html/native/feature/app_contacts_group_n.htm +++ b/org.tizen.training/html/native/feature/app_contacts_group_n.htm @@ -5,13 +5,13 @@ - + - Group Management + Group Management @@ -34,10 +34,10 @@
  • Contacts Guide
  • Contacts API for Mobile Native
  • Contacts API for Wearable Native
    • - +
    -
    -
    +
    +

    Group Management

    The basic tasks involved in group management operations are retrieving group information, creating, updating, and deleting groups, and managing group members. The following sections provide you with the fundamental building blocks for combining individual contacts to groups to manage them more efficiently.

    @@ -54,10 +54,10 @@ int error_code; error_code = contacts_db_get_record(_contacts_group._uri, group_id, &group); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "failed to get record: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "failed to get record: error code = %d", error_code); -

    The following example retrieves a list of groups, whose name contains the strings "neighbors" or "friend". You can search the groups meeting the condition using queries and filters:

    +

    The following example retrieves a list of groups, whose name contains the strings "neighbors" or "friend". You can search the groups meeting the condition using queries and filters:

    1. Create a filter handle.
      2. @@ -77,9 +77,9 @@ int error_code; error_code = contacts_query_create(_contacts_group._uri, &query); error_code = contacts_filter_create(_contacts_group._uri, &filter); -error_code = contacts_filter_add_str(filter, _contacts_group.name, CONTACTS_MATCH_CONTAINS, "neighbors"); +error_code = contacts_filter_add_str(filter, _contacts_group.name, CONTACTS_MATCH_CONTAINS, "neighbors"); error_code = contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_OR); -error_code = contacts_filter_add_str(filter, _contacts_group.name, CONTACTS_MATCH_CONTAINS, "friend"); +error_code = contacts_filter_add_str(filter, _contacts_group.name, CONTACTS_MATCH_CONTAINS, "friend"); error_code = contacts_query_set_filter(query, filter); error_code = contacts_db_get_records_with_query(query, 0, 0, &list); @@ -111,11 +111,11 @@ error_code = contacts_db_get_record(_contacts_group._uri, group_id, &group);

      The following example changes the name and image of the group:

      -error_code = contacts_record_set_str(group, _contacts_group.name, "Family");
+error_code = contacts_record_set_str(group, _contacts_group.name, "Family");
 
 char *resource_path = app_get_resource_path();
 char temp_path[1024];
-snprintf(temp_path, sizeof(temp_path), "%s/group_image_new.jpg", resource_path);
+snprintf(temp_path, sizeof(temp_path), "%s/group_image_new.jpg", resource_path);
 free(resource_path);
 error_code = contacts_record_set_str(group, _contacts_group.image_path, temp_path);
      @@ -151,14 +151,14 @@ error_code = contacts_record_create(_contacts_group._uri, &group);
    2. If you set the group name, which is a string type, use the contacts_record_set_str() function with the _contacts_group.name property as the second parameter: 
      -error_code = contacts_record_set_str(group, _contacts_group.name, "Neighbors");
+error_code = contacts_record_set_str(group, _contacts_group.name, "Neighbors");
    3. If you set the group image property, first define the image file path and then set it to the property similarly as the group name above: 
       char *resource_path = app_get_resource_path();
 char temp_path[1024];
-snprintf(temp_path, sizeof(temp_path), "%s/group_image.jpg", resource_path);
+snprintf(temp_path, sizeof(temp_path), "%s/group_image.jpg", resource_path);
 free(resource_path);
 error_code = contacts_record_set_str(group, _contacts_group.image_path, temp_path);
      @@ -235,17 +235,17 @@ contacts_record_h person = NULL; int error_code; while (contacts_list_get_current_record_p(list, &person) == CONTACTS_ERROR_NONE) { -    int person_id; -    contacts_record_get_int(person, _contacts_person_group_assigned.person_id, &person_id); -    dlog_print(DLOG_DEBUG, LOG_TAG, "Person id: %d", person_id); + int person_id; + contacts_record_get_int(person, _contacts_person_group_assigned.person_id, &person_id); + dlog_print(DLOG_DEBUG, LOG_TAG, "Person id: %d", person_id); -    char *display_name; -    contacts_record_get_str_p(person, _contacts_person_group_assigned.display_name, &display_name); -    dlog_print(DLOG_DEBUG, LOG_TAG, "Display name: %s", display_name); + char *display_name; + contacts_record_get_str_p(person, _contacts_person_group_assigned.display_name, &display_name); + dlog_print(DLOG_DEBUG, LOG_TAG, "Display name: %s", display_name); -    error_code = contacts_list_next(list); -    if (error_code != CONTACTS_ERROR_NONE) -        break; + error_code = contacts_list_next(list); + if (error_code != CONTACTS_ERROR_NONE) + break; }
      4. diff --git a/org.tizen.training/html/native/feature/app_contacts_management_n.htm b/org.tizen.training/html/native/feature/app_contacts_management_n.htm index 181feab..2be21e1 100644 --- a/org.tizen.training/html/native/feature/app_contacts_management_n.htm +++ b/org.tizen.training/html/native/feature/app_contacts_management_n.htm @@ -5,13 +5,13 @@ - + - Contact Management + Contact Management @@ -35,10 +35,10 @@
    4. Contacts Guide
    5. Contacts API for Mobile Native
    6. Contacts API for Wearable Native
      7. - +
    -
    -
    +
    +

    Contact Management

    The basic tasks involved in contact management operations are creating and updating contacts, retrieving and deleting persons, and linking contacts and persons. The following sections provide you with the fundamental building blocks for managing contact details in the Contacts database.

    @@ -54,19 +54,19 @@ int error_code; error_code = contacts_connect(); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "failed to connect contacts: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "failed to connect contacts: error code = %d", error_code);

    When you no longer need it, disconnect from the contact service using the contacts_disconnect() function.

    - +
    Note To use the Contacts API, your application has to request permission by adding the following privileges to the tizen-manifest.xml file in the application package: - + 
     <privileges>
-   <privilege>http://tizen.org/privilege/contact.read</privilege>
-   <privilege>http://tizen.org/privilege/contact.write</privilege>
+   <privilege>http://tizen.org/privilege/contact.read</privilege>
+   <privilege>http://tizen.org/privilege/contact.write</privilege>
 </privileges>
    @@ -77,7 +77,7 @@ if (error_code != CONTACTS_ERROR_NONE)
    • -

      If a person ID is known in your application, you can retrieve the person's details using the contacts_db_get_record() function, whose first parameter is the _contacts_person._uri view:

      +

      If a person ID is known in your application, you can retrieve the person's details using the contacts_db_get_record() function, whose first parameter is the _contacts_person._uri view:

       contacts_record_h person = NULL;
@@ -87,21 +87,21 @@ int error_code;
 error_code = contacts_db_get_record(_contacts_person._uri, person_id, &person);
 
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to get record: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to get record: error code = %d", error_code);

    • If you need to retrieve a list of persons matching a search keyword without knowing a specific person ID, you can use the contacts_db_search_records() function. The third parameter is the offset, meaning the record index from which to search, and the fourth parameter sets a limit to the number of results, where 0 means that all the matched records are retrieved.

      -

      The following example shows how to find all person records that contain the keyword "John".

      +

      The following example shows how to find all person records that contain the keyword "John".

       contacts_list_h list = NULL;
 
-error_code = contacts_db_search_records(_contacts_person._uri, "John", 0, 0, &list);
+error_code = contacts_db_search_records(_contacts_person._uri, "John", 0, 0, &list);
 
 if (error_code != CONTACTS_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to search records: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to search records: error code = %d", error_code);
      • @@ -119,77 +119,77 @@ if (error_code != CONTACTS_ERROR_NONE) static bool _get_associated_contacts(contacts_record_h record, contacts_list_h *associated_contacts) { -    int error_code; -    int person_id; -    contacts_query_h query = NULL; -    contacts_filter_h filter = NULL; + int error_code; + int person_id; + contacts_query_h query = NULL; + contacts_filter_h filter = NULL; -    /* Retrieve the person ID from the person record */ -    error_code = contacts_record_get_int(record, _contacts_person.id, &person_id); + /* Retrieve the person ID from the person record */ + error_code = contacts_record_get_int(record, _contacts_person.id, &person_id); -    /* Create a contact query with a filter for the person ID */ -    error_code = CONTACTS_ERROR_NONE; -    error_code += contacts_query_create(_contacts_contact._uri, &query); -    error_code += contacts_filter_create(_contacts_contact._uri, &filter); -    error_code += contacts_filter_add_int(filter, _contacts_contact.person_id, CONTACTS_MATCH_EQUAL, person_id); -    error_code += contacts_query_set_filter(query, filter); + /* Create a contact query with a filter for the person ID */ + error_code = CONTACTS_ERROR_NONE; + error_code += contacts_query_create(_contacts_contact._uri, &query); + error_code += contacts_filter_create(_contacts_contact._uri, &filter); + error_code += contacts_filter_add_int(filter, _contacts_contact.person_id, CONTACTS_MATCH_EQUAL, person_id); + error_code += contacts_query_set_filter(query, filter); -    /* Run the query to retrieve a list of all contacts associated with the person ID */ -    error_code += contacts_db_get_records_with_query(query, 0, 0, associated_contacts); + /* Run the query to retrieve a list of all contacts associated with the person ID */ + error_code += contacts_db_get_records_with_query(query, 0, 0, associated_contacts); -    /* Destroy the filter and query handles and release all their resources */ -    error_code += contacts_filter_destroy(filter); -    error_code += contacts_query_destroy(query); + /* Destroy the filter and query handles and release all their resources */ + error_code += contacts_filter_destroy(filter); + error_code += contacts_query_destroy(query); -    if (error_code != CONTACTS_ERROR_NONE) -        return false; + if (error_code != CONTACTS_ERROR_NONE) + return false; -    return true; + return true; } -

      The following example uses queries and filters to retrieve a person's default phone number. If a person is associated with multiple phone numbers, one of them is defined as the default phone number. To determine the default phone number, you can check the is_primary_default property of the _contacts_person_number view. For the default phone number, the property is set to true.

      +

      The following example uses queries and filters to retrieve a person's default phone number. If a person is associated with multiple phone numbers, one of them is defined as the default phone number. To determine the default phone number, you can check the is_primary_default property of the _contacts_person_number view. For the default phone number, the property is set to true.

       static bool
 _get_default_phone_number(contacts_record_h record, char **default_phone_number)
 {
-    contacts_query_h query = NULL;
-    contacts_filter_h filter = NULL;
-    contacts_list_h list = NULL;
-    contacts_record_h record_person_number = NULL;
-    int person_id;
-    int error_code = CONTACTS_ERROR_NONE;
-
-    /* Retrieve the person ID from the person record */
-    error_code += contacts_record_get_int(record, _contacts_person.id, &person_id);
-
-    /* Create a phone number query with filters for the person ID and default phone number */
-    error_code += contacts_query_create(_contacts_person_number._uri, &query);
-    error_code += contacts_filter_create(_contacts_person_number._uri, &filter);
-    error_code += contacts_filter_add_int(filter, _contacts_person_number.person_id, CONTACTS_MATCH_EQUAL, person_id);
-    error_code += contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_AND);
-    error_code += contacts_filter_add_bool(filter, _contacts_person_number.is_primary_default, true);
-    error_code += contacts_query_set_filter(query, filter);
-
-    /* Run the query to retrieve the phone number records containing the default phone number */
-    error_code += contacts_db_get_records_with_query(query, 0, 0, &list);
-
-    /* Retrieve the current record from the query list */
-    error_code += contacts_list_get_current_record_p(list, &record_person_number);
-
-    /* Retrieve the phone number from the phone number record */
-    error_code += contacts_record_get_str(record_person_number, _contacts_person_number.number, default_phone_number);
-
-    /* Destroy the list, filter, and query handles and release all their resources */
-    contacts_list_destroy(list, true);
-    contacts_filter_destroy(filter);
-    contacts_query_destroy(query);
-
-    if (error_code != CONTACTS_ERROR_NONE)
-        return false;
-
-    return true;
+    contacts_query_h query = NULL;
+    contacts_filter_h filter = NULL;
+    contacts_list_h list = NULL;
+    contacts_record_h record_person_number = NULL;
+    int person_id;
+    int error_code = CONTACTS_ERROR_NONE;
+
+    /* Retrieve the person ID from the person record */
+    error_code += contacts_record_get_int(record, _contacts_person.id, &person_id);
+
+    /* Create a phone number query with filters for the person ID and default phone number */
+    error_code += contacts_query_create(_contacts_person_number._uri, &query);
+    error_code += contacts_filter_create(_contacts_person_number._uri, &filter);
+    error_code += contacts_filter_add_int(filter, _contacts_person_number.person_id, CONTACTS_MATCH_EQUAL, person_id);
+    error_code += contacts_filter_add_operator(filter, CONTACTS_FILTER_OPERATOR_AND);
+    error_code += contacts_filter_add_bool(filter, _contacts_person_number.is_primary_default, true);
+    error_code += contacts_query_set_filter(query, filter);
+
+    /* Run the query to retrieve the phone number records containing the default phone number */
+    error_code += contacts_db_get_records_with_query(query, 0, 0, &list);
+
+    /* Retrieve the current record from the query list */
+    error_code += contacts_list_get_current_record_p(list, &record_person_number);
+
+    /* Retrieve the phone number from the phone number record */
+    error_code += contacts_record_get_str(record_person_number, _contacts_person_number.number, default_phone_number);
+
+    /* Destroy the list, filter, and query handles and release all their resources */
+    contacts_list_destroy(list, true);
+    contacts_filter_destroy(filter);
+    contacts_query_destroy(query);
+
+    if (error_code != CONTACTS_ERROR_NONE)
+        return false;
+
+    return true;
 }
      @@ -213,18 +213,18 @@ error_code = contacts_db_get_record(_contacts_contact._uri, contact_id, &con
      • The following example sets a new first name for the contact record by updating a child record: 
         contacts_record_h name = NULL;
-/* Retrieve the contact's name record */
-/* Record index is set to 0, since there is only 1 child record of type "name" */
+/* Retrieve the contact's name record */
+/* Record index is set to 0, since there is only 1 child record of type "name" */
 error_code = contacts_record_get_child_record_at_p(contact, _contacts_contact.name, 0, &name);
 /* Change the first name in the name record */
-error_code = contacts_record_set_str(name, _contacts_name.first, "Mark");
+error_code = contacts_record_set_str(name, _contacts_name.first, "Mark");
      • The following example set a new birthday event for the contact by updating another child record.

        The example assumes that the birthday is the only event for the contact, meaning that the event record can be retrieved using the contacts_record_get_child_record_at_p() function with index 0 as the second parameter. If the contact has multiple events, you must iterate through them.

         contacts_record_h event = NULL;
-/* Retrieve the contact's birthday event record */
+/* Retrieve the contact's birthday event record */
 error_code = contacts_record_get_child_record_at_p(contact, _contacts_contact.event, 0, &event);
 /* Change the date in the event record */
 int new_date = 1990 * 10000 + 6 * 100 + 21;
@@ -236,15 +236,15 @@ error_code = contacts_record_set_int(event, _contacts_event.date, new_date);
 
         int contact_id = ... /* Get the contact ID */
 int address_num = 0;
-int i = 0; 
+int i = 0;
 
 contacts_db_get_record(_contacts_contact._uri, contact_id, &contact);
 contacts_record_get_child_record_count(count, _contacts_contact.address, &address_num);
 
 for (i = 0; i < address_num; i++) {
-    contacts_record_h address = NULL;
-    contacts_record_get_child_record_at_p(contact, _contacts_contact.address, i, &address);
-    contacts_record_set_str(address, _contacts_address.country, "Korea");
+    contacts_record_h address = NULL;
+    contacts_record_get_child_record_at_p(contact, _contacts_contact.address, i, &address);
+    contacts_record_set_str(address, _contacts_address.country, "Korea");
 }
        • @@ -256,14 +256,14 @@ for (i = 0; i < address_num; i++) { error_code = contacts_db_update_record(contact); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "failed to update record: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "failed to update record: error code = %d", error_code);
        Note The contacts_record_set_XXX() functions only change the data in the memory object, not in the Contacts database. Normally, to update the database, you must update each record separately using the contacts_db_update_record() function. However, if you retrieve a child record using the contacts_record_get_child_record_at_p() function, you only need to update the parent record to the database; the child record is updated automatically with the parent record.
        - +
      • When no longer needed, destroy the contact handle and release all its resources using the contacts_record_destroy() function.

        If you set the second parameter to true, the function destroys any child records automatically, irrespective of how the child records were added (individually or along with their parent record).

        @@ -272,7 +272,7 @@ if (error_code != CONTACTS_ERROR_NONE) error_code = contacts_record_destroy(contact, true); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "failed to destroy record: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "failed to destroy record: error code = %d", error_code);
        • @@ -289,7 +289,7 @@ contacts_record_h contact; error_code = contacts_record_create(_contacts_contact._uri, &contact); if (error_code != CONTACTS_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "failed to create record: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "failed to create record: error code = %d", error_code);

        Remember that records created with the contacts_record_create() function are memory objects, with contacts_record_h type variables as their handles. If you change these objects, the changes are not reflected in the Contacts database until you explicitly insert or update the objects to the database using the contacts_db_insert_record() or contacts_db_update_record() function.

        @@ -298,7 +298,7 @@ if (error_code != CONTACTS_ERROR_NONE)

        To simplify the example code, error handling has been omitted.

        • Name -

          Create a name record, set the string values, "John" and "Smith", to the name, and set the name record as a child record of the contact record.

          +

          Create a name record, set the string values, "John" and "Smith", to the name, and set the name record as a child record of the contact record.

          When creating the name record, the first parameter of the contacts_record_create() function is the _contacts_name._uri property.

          @@ -306,8 +306,8 @@ contacts_record_h name;
 
 error_code = contacts_record_create(_contacts_name._uri, &name);
 
-error_code = contacts_record_set_str(name, _contacts_name.first, "John");
-error_code = contacts_record_set_str(name, _contacts_name.last, "Smith");
+error_code = contacts_record_set_str(name, _contacts_name.first, "John");
+error_code = contacts_record_set_str(name, _contacts_name.last, "Smith");
 
 error_code = contacts_record_add_child_record(contact, _contacts_contact.name, name);
          @@ -326,7 +326,7 @@ error_code = contacts_record_create(_contacts_image._uri, &image); char *resource_path = app_get_resource_path(); char caller_id_path[1024]; -snprintf(caller_id_path, sizeof(caller_id_path), "%s/caller_id.jpg", resource_path); +snprintf(caller_id_path, sizeof(caller_id_path), "%s/caller_id.jpg", resource_path); free(resource_path); error_code = contacts_record_set_str(image, _contacts_image.path, caller_id_path); @@ -343,13 +343,13 @@ contacts_record_h number; error_code = contacts_record_create(_contacts_number._uri, &number); -error_code = contacts_record_set_str(number, _contacts_number.number, "+8210-1234-5678"); +error_code = contacts_record_set_str(number, _contacts_number.number, "+8210-1234-5678"); error_code = contacts_record_add_child_record(contact, _contacts_contact.number, number);
        • Event -

          An event consists of a type, date, and other properties. You can set various types of events, as defined in the contacts_event_type_e enumeration (in mobile and wearable applications). If the event type is CUSTOM, you can set a custom label for the event using the _contacts_event.label property.

          +

          An event consists of a type, date, and other properties. You can set various types of events, as defined in the contacts_event_type_e enumeration (in mobile and wearable applications). If the event type is CUSTOM, you can set a custom label for the event using the _contacts_event.label property.

          The following example sets a birthday event:

            @@ -424,12 +424,12 @@ error_code += contacts_record_set_int(contact, _contacts_contact.link_mode, CONT contacts_record_h name = NULL; error_code += contacts_record_create(_contacts_name._uri, &name); -error_code += contacts_record_set_str(name, _contacts_name.first, "John"); +error_code += contacts_record_set_str(name, _contacts_name.first, "John"); error_code += contacts_record_add_child_record(contact, _contacts_contact.name, name); contacts_record_h number = NULL; error_code += contacts_record_create(_contacts_number._uri, &number); -error_code += contacts_record_set_str(number, _contacts_number.number, "+8210-1234-5678"); +error_code += contacts_record_set_str(number, _contacts_number.number, "+8210-1234-5678"); error_code += contacts_record_add_child_record(contact, _contacts_contact.number, number); /* Contact is linked automatically if an existing person has the same number in a different address book */ @@ -441,7 +441,7 @@ contacts_record_destroy(contact, true);

            You can modify the contact and person linking, as needed:

              -
            • To merge existing contacts into 1 person, use the contacts_person_link_person() function to link the contacts of one person to another person. The first parameter of the function is the ID of the person to be merged, and the second parameter is the ID of the person who will have all the merged contacts. After the linking, the former is deleted from the Contacts database. The latter person is left with both their original contacts and the other person's contacts. +
            • To merge existing contacts into 1 person, use the contacts_person_link_person() function to link the contacts of one person to another person. The first parameter of the function is the ID of the person to be merged, and the second parameter is the ID of the person who will have all the merged contacts. After the linking, the former is deleted from the Contacts database. The latter person is left with both their original contacts and the other person's contacts. 
               int person_id1 = ... /* Get the person ID whose contacts are merged elsewhere */
@@ -451,7 +451,7 @@ error_code = contacts_person_link_person(person_id1, person_id2);

              The following figure illustrates the process of linking a person. Even though the contacts have different address books, they can be linked to the same person. After linking, the person2 record is destroyed automatically.

              -

              Figure: Linking a person

              +

              Figure: Linking a person

              Linking a person

            • To separate (unlink) a contact record from the person record, use the contacts_person_unlink_contact() function. The function removes the contact from the person, creates a new person, and links the contact to the new person. @@ -466,7 +466,7 @@ error_code = contacts_person_unlink_contact(person_id, contact_id, &unlinked

              The following figure illustrates the process of unlinking a contact. After unlinking, the person3 record is newly created.

              -

              Figure: Unlinking a contact

              +

              Figure: Unlinking a contact

              Unlinking a contact

            diff --git a/org.tizen.training/html/native/feature/app_contacts_n.htm b/org.tizen.training/html/native/feature/app_contacts_n.htm index f48f33a..a7346ce 100644 --- a/org.tizen.training/html/native/feature/app_contacts_n.htm +++ b/org.tizen.training/html/native/feature/app_contacts_n.htm @@ -5,13 +5,13 @@ - + - Creating Applications with Contacts + Creating Applications with Contacts @@ -26,10 +26,10 @@
          • Contacts Guide
          • Contacts API for Mobile Native
          • Contacts API for Wearable Native
            • -
          +
    -
    -
    +
    +

    Creating Applications with Contacts

    If you want to create applications that offer contact management features to the user, Tizen provides various options for you.

    @@ -54,7 +54,7 @@
  • Group management
      -
    • You can ease the contact management tasks by grouping related contacts to various groups.
      • +
    • You can ease the contact management tasks by grouping related contacts to various groups.
    • You can create, update, and delete groups.
    • You can retrieve group information from the database with various filtered queries.
    • You can manage group members by adding and removing contacts within a group.
      • diff --git a/org.tizen.training/html/native/feature/app_contentshare_n.htm b/org.tizen.training/html/native/feature/app_contentshare_n.htm index 9d181ec..e3a5523 100644 --- a/org.tizen.training/html/native/feature/app_contentshare_n.htm +++ b/org.tizen.training/html/native/feature/app_contentshare_n.htm @@ -5,13 +5,13 @@ - + - Creating Applications with Content Sharing + Creating Applications with Content Sharing @@ -29,10 +29,10 @@
    • NFC API for Mobile Native
    • App Control API for Wearable Native
    • NFC API for Wearable Native
      • -
    +
    • -
    -
    +
    +

    Creating Applications with Content Sharing

    If you want to create applications that offer content sharing features to the user, Tizen provides various options for you.

    @@ -64,7 +64,7 @@ -

    To share content through application controls, you must use the App Control API (in mobile and wearable applications). Application controls are a way of sharing an application's functionality in Tizen. The App Control API provides functions for launching other applications with a specific operation, URI, MIME type, and extra data, and for settings and getting the details:

    +

    To share content through application controls, you must use the App Control API (in mobile and wearable applications). Application controls are a way of sharing an application's functionality in Tizen. The App Control API provides functions for launching other applications with a specific operation, URI, MIME type, and extra data, and for settings and getting the details:

    • The mandatory operation information defines the action to be performed.
    • The URI and MIME type contain information about the content to be handled.
      • diff --git a/org.tizen.training/html/native/feature/app_contentshare_nfc_n.htm b/org.tizen.training/html/native/feature/app_contentshare_nfc_n.htm index 49bd0ce..b6c2bf2 100644 --- a/org.tizen.training/html/native/feature/app_contentshare_nfc_n.htm +++ b/org.tizen.training/html/native/feature/app_contentshare_nfc_n.htm @@ -5,13 +5,13 @@ - + - Sharing through NFC + Sharing through NFC @@ -31,10 +31,10 @@
    • Near Field Communication (NFC) Guides
    • NFC API for Mobile Native
    • NFC API for Wearable Native
      • -
    +
    -
    -
    +
    +

    Sharing through NFC

    The basic tasks involved in sharing content through Near Field Communication (NFC) are to ensure that the device supports NFC, initialize the NFC feature, and exchange NDEF messages through the NFC P2P connection. The following sections provide you with the fundamental building blocks for sharing data with other devices.

    @@ -61,10 +61,10 @@ void Network_NFC_startup(void) { -    gmainloop = g_main_loop_new(NULL, FALSE); -    bool is_nfc_supported = nfc_manager_is_supported(); -    if (!is_nfc_supported) -        dlog_print(DLOG_INFO, LOG_TAG, "is_nfc_supported NOT SUPPORTED"); + gmainloop = g_main_loop_new(NULL, FALSE); + bool is_nfc_supported = nfc_manager_is_supported(); + if (!is_nfc_supported) + dlog_print(DLOG_INFO, LOG_TAG, "is_nfc_supported NOT SUPPORTED"); }

    The gmainloop created above is used to wait for the results of calling asynchronous functions.

    @@ -75,8 +75,8 @@ Network_NFC_startup(void) int error_code = NFC_ERROR_NONE; error_code = nfc_manager_initialize(); -if (error_code != NFC_ERROR_NONE) -    /* Error handling */ +if (error_code != NFC_ERROR_NONE) + /* Error handling */ g_timeout_add(1000, timeout_func, gmainloop); g_main_loop_run(gmainloop); @@ -101,13 +101,13 @@ nfc_ndef_record_h ndef_name_record = NULL; nfc_ndef_record_h ndef_phone_record = NULL; nfc_ndef_record_h ndef_email_record = NULL; -const char *name = "John Doe"; -const char *phone = "+82556666888"; -const char *email = "john.doe@tizen.org"; +const char *name = "John Doe"; +const char *phone = "+82556666888"; +const char *email = "john.doe@tizen.org"; -nfc_ndef_record_create_text(&ndef_name_record, name, "en-US", NFC_ENCODE_UTF_8); -nfc_ndef_record_create_text(&ndef_phone_record, phone, "en-US", NFC_ENCODE_UTF_8); -nfc_ndef_record_create_text(&ndef_email_record, email, "en-US", NFC_ENCODE_UTF_8); +nfc_ndef_record_create_text(&ndef_name_record, name, "en-US", NFC_ENCODE_UTF_8); +nfc_ndef_record_create_text(&ndef_phone_record, phone, "en-US", NFC_ENCODE_UTF_8); +nfc_ndef_record_create_text(&ndef_email_record, email, "en-US", NFC_ENCODE_UTF_8);
  • diff --git a/org.tizen.training/html/native/feature/app_contentshare_receive_n.htm b/org.tizen.training/html/native/feature/app_contentshare_receive_n.htm index 5b4ab0a..f9c2191 100644 --- a/org.tizen.training/html/native/feature/app_contentshare_receive_n.htm +++ b/org.tizen.training/html/native/feature/app_contentshare_receive_n.htm @@ -5,13 +5,13 @@ - + - Receiving Content from Other Applications + Receiving Content from Other Applications @@ -32,10 +32,10 @@
  • Application Controls Guides
  • App Control API for Mobile Native
  • App Control API for Wearable Native
    • - +
    -
    -
    +
    +

    Receiving Content from Other Applications

    The basic tasks involved in receiving content from other applications are advertising the features available in your application, handling the incoming content, and managing any extra data sent with the content. The following sections provide you with the fundamental building blocks for receiving content that other applications want to share with you.

    @@ -48,13 +48,13 @@ 
     <app-control>
-   <mime name = "application/xhtml+xml"/>
-   <operation name = "http://tizen.org/appcontrol/operation/view"/>
-   <uri name = "http"/>
+   <mime name = "application/xhtml+xml"/>
+   <operation name = "http://tizen.org/appcontrol/operation/view"/>
+   <uri name = "http"/>
 </app-control>
 <app-control>
-   <operation name = "http://tizen.org/appcontrol/operation/dial"/>
-   <uri name = "tel"/>
+   <operation name = "http://tizen.org/appcontrol/operation/dial"/>
+   <uri name = "tel"/>
 </app-control>
    @@ -66,7 +66,7 @@

    Handling Incoming Content

    -

    When another application sends an application control request to your application, the application framework calls your application's app_control_cb() callback just after your application enters the main loop. This callback is passed to the handler, app_control, containing the reason why your application was launched. For example, your application can be launched to open a file that another application is sharing with you.

    +

    When another application sends an application control request to your application, the application framework calls your application's app_control_cb() callback just after your application enters the main loop. This callback is passed to the handler, app_control, containing the reason why your application was launched. For example, your application can be launched to open a file that another application is sharing with you.

    When an application control request arrives, your application is responsible for checking and responding accordingly to the information of the app_control handler.

    @@ -76,44 +76,44 @@ int main(int argc, char *argv[]) { -    struct appdata ad; + struct appdata ad; -    ui_app_lifecycle_callback_s event_callback; + ui_app_lifecycle_callback_s event_callback; -    event_callback.create = app_create; -    event_callback.terminate = app_terminate; -    event_callback.pause = app_pause; -    event_callback.resume = app_resume; -    /* Register the app control callback */ -    event_callback.app_control = app_control; + event_callback.create = app_create; + event_callback.terminate = app_terminate; + event_callback.pause = app_pause; + event_callback.resume = app_resume; + /* Register the app control callback */ + event_callback.app_control = app_control; -    memset(&ad, 0x0, sizeof(struct appdata)); + memset(&ad, 0x0, sizeof(struct appdata)); -    return ui_app_main(argc, argv, &event_callback, &ad); + return ui_app_main(argc, argv, &event_callback, &ad); } /* App control callback */ static void app_control(app_control_h app_control, void *user_data) { -    struct appdata *ad = (struct appdata *)user_data; -    char *operation; -    char *uri; -    char *mime_type; + struct appdata *ad = (struct appdata *)user_data; + char *operation; + char *uri; + char *mime_type; -    app_control_get_operation(app_control, operation); + app_control_get_operation(app_control, operation); -    if (!strcmp(operation, APP_CONTROL_OPERATION_VIEW)) { -        app_control_get_uri(app_control, &uri); -        app_control_get_mime(app_control, &mime_type); + if (!strcmp(operation, APP_CONTROL_OPERATION_VIEW)) { + app_control_get_uri(app_control, &uri); + app_control_get_mime(app_control, &mime_type); -        if (uri && !strcmp(mime_type, "image/jpg")) -                /* Display the image file the other application is sharing with you */ -                display_image_file(ad, uri); -    } + if (uri && !strcmp(mime_type, "image/jpg")) + /* Display the image file the other application is sharing with you */ + display_image_file(ad, uri); + } -    if (ad->win) -        elm_win_activate(ad->win); + if (ad->win) + elm_win_activate(ad->win); } @@ -125,21 +125,21 @@ app_control(app_control_h app_control, void *user_data) bool _app_control_extra_data_cb(app_control_h app, const char *key, void *user_data) { -    int ret; -    char *value; + int ret; + char *value; -    ret = app_control_get_extra_data(app, key, &value); -    if (ret == APP_CONTROL_ERROR_NONE) -        dlog_print(DLOG_DEBUG, LOG_TAG, "[value] %s", value); -    else -        dlog_print(DLOG_ERROR, LOG_TAG, "app_control_get_extra_data() failed. err = %d", ret); + ret = app_control_get_extra_data(app, key, &value); + if (ret == APP_CONTROL_ERROR_NONE) + dlog_print(DLOG_DEBUG, LOG_TAG, "[value] %s", value); + else + dlog_print(DLOG_ERROR, LOG_TAG, "app_control_get_extra_data() failed. err = %d", ret); -    return true; + return true; } ret = app_control_foreach_extra_data(app, _app_control_extra_data_cb, 0); if (ret != APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "app_control_foreach_extra_data() failed. err = %d", ret); + dlog_print(DLOG_ERROR, LOG_TAG, "app_control_foreach_extra_data() failed. err = %d", ret); diff --git a/org.tizen.training/html/native/feature/app_contentshare_send_n.htm b/org.tizen.training/html/native/feature/app_contentshare_send_n.htm index f78f45d..f6362ed 100644 --- a/org.tizen.training/html/native/feature/app_contentshare_send_n.htm +++ b/org.tizen.training/html/native/feature/app_contentshare_send_n.htm @@ -5,13 +5,13 @@ - + - Sending Content to Other Applications + Sending Content to Other Applications @@ -32,10 +32,10 @@
  • Application Controls Guides
  • App Control API for Mobile Native
  • App Control API for Wearable Native
    • - +
    -
    -
    +
    +

    Sending Content to Other Applications

    You can send various types of content to other applications, including text, binaries, and files. The following sections provide you with the fundamental building blocks for sharing your application data with other applications.

    @@ -54,14 +54,14 @@ app_control_h app_control; app_control_create(&app_control); app_control_set_operation(app_control, APP_CONTROL_OPERATION_SHARE); -app_control_set_mime(app_control, "text/plain"); -app_control_add_extra_data(app_control, APP_CONTROL_DATA_TEXT, "Hello, World!"); +app_control_set_mime(app_control, "text/plain"); +app_control_add_extra_data(app_control, APP_CONTROL_DATA_TEXT, "Hello, World!"); app_control_send_launch_request(app_control, NULL, NULL);

    The above example has no explicit designation of the application to be called. When you request an implicit launch, the application launcher framework determines which application to launch by comparing the conditions: operation, URI (or scheme), and MIME type. If only one application is found to match the given conditions, that application is launched. If multiple matching applications are found, the application selector is shown and the user can select the application they want.

    - +
    Note When using application controls, pay attention to the following: @@ -83,14 +83,14 @@ app_control_send_launch_request(app_control, NULL, NULL); char *shared_res_path = app_get_shared_resource_path(); char img_path[PATH_MAX] = {0,}; -snprintf(img_path, PATH_MAX, "%s/image.jpg", shared_res_path); +snprintf(img_path, PATH_MAX, "%s/image.jpg", shared_res_path); free(shared_res_path); app_control_h service; app_control_create(&service); app_control_set_operation(service, APP_CONTROL_OPERATION_SHARE); -app_control_set_mime(service, "image/*"); +app_control_set_mime(service, "image/*"); app_control_add_extra_data(service, APP_CONTROL_DATA_PATH, img_path); app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP); @@ -104,15 +104,15 @@ char *shared_res_path = app_get_shared_resource_path(); char img1_path[PATH_MAX] = {0,}; char img2_path[PATH_MAX] = {0,}; const char *path_array[2] = {img1_path, img2_path}; -snprintf(img1_path, PATH_MAX, "%s/image.jpg", shared_res_path); -snprintf(img2_path, PATH_MAX, "%s/image2.jpg", shared_res_path); +snprintf(img1_path, PATH_MAX, "%s/image.jpg", shared_res_path); +snprintf(img2_path, PATH_MAX, "%s/image2.jpg", shared_res_path); free(shared_res_path); app_control_h service; app_control_create(&service); app_control_set_operation(service, APP_CONTROL_OPERATION_MULTI_SHARE); -app_control_set_mime(service, "image/*"); +app_control_set_mime(service, "image/*"); app_control_add_extra_data_array(service, APP_CONTROL_DATA_PATH, path_array, 2); app_control_set_launch_mode(service, APP_CONTROL_LAUNCH_MODE_GROUP); @@ -126,7 +126,7 @@ app_control_destroy(service);

    Sending Files

    When sharing files, you can use the app_control_set_uri() function to set the file URI with the file:// scheme.

    -

    Since Tizen 2.4, if the second parameter of the app_control_set_uri() function starts with file://, and it is a regular file in your application's data path which can be obtained by calling the app_get_data_path() function, the file is shared with the called application. The framework grants a temporary permission to the called application for this file, and revokes it when the called application is terminated. The called application can just read the file.

    +

    Since Tizen 2.4, if the second parameter of the app_control_set_uri() function starts with file://, and it is a regular file in your application's data path which can be obtained by calling the app_get_data_path() function, the file is shared with the called application. The framework grants a temporary permission to the called application for this file, and revokes it when the called application is terminated. The called application can just read the file.

    The following example launches a viewer application with the operation, URI, and MIME type:

    @@ -134,25 +134,25 @@ app_control_destroy(service); #include <app.h> #include <dlog.h> -#define TAG "MY_TAG" +#define TAG "MY_TAG" #define PATH_MAX 128 app_control_h app_control; -char* data_path = app_get_data_path(); +char* data_path = app_get_data_path(); char file_path[PATH_MAX] = {0,}; -snprintf(file_path, PATH_MAX, "%s/image.jpg", data_path); +snprintf(file_path, PATH_MAX, "%s/image.jpg", data_path); free(data_path); app_control_create(&app_control); app_control_set_operation(app_control, APP_CONTROL_OPERATION_VIEW); app_control_set_uri(app_control, file_path); -app_control_set_mime(app_control, "image/*"); +app_control_set_mime(app_control, "image/*"); if (app_control_send_launch_request(app_control, NULL, NULL) == APP_CONTROL_ERROR_NONE) -    dlog_print(DLOG_INFO, TAG, "Succeeded to launch a viewer app."); + dlog_print(DLOG_INFO, TAG, "Succeeded to launch a viewer app."); else -    dlog_print(DLOG_ERROR, TAG, "Failed to launch a viewer app."); + dlog_print(DLOG_ERROR, TAG, "Failed to launch a viewer app."); app_control_destroy(app_control); diff --git a/org.tizen.training/html/native/feature/app_graphics_animation_n.htm b/org.tizen.training/html/native/feature/app_graphics_animation_n.htm index 308f34d..df4dfaf 100644 --- a/org.tizen.training/html/native/feature/app_graphics_animation_n.htm +++ b/org.tizen.training/html/native/feature/app_graphics_animation_n.htm @@ -5,13 +5,13 @@ - + - Animations + Animations @@ -21,18 +21,18 @@

    Mobile native Wearable native

    -
    -
    +
    +

    Animations

    - +

    You can change an object on the screen at certain intervals using an animation. To create an animation, you must first determine the duration of the animation, and then define a callback function that performs the actual animation with that duration.

    In the following example, 2 square rectangles are animated. One of them simply moves on the screen, while the other also changes its color and size while moving.

    @@ -52,14 +52,14 @@

    The callback function can return ECORE_CALLBACK_RENEW to keep the animator running or ECORE_CALLBACK_CANCEL to stop it and automatically delete it at any time.

  • ecore_animator_add() creates an Animator object. The first parameter indicates the frame event callback function that actually defines the animation details, and the second parameter indicates the user data.

    The ecore_animator_timeline_add() function is just like the ecore_animator_add() function, except that the animator only runs for a limited time.

    • -
  • ecore_timer_add() creates a timer to call the given function in the given period of time. The first parameter is the interval in seconds, and the second parameter is the given function. +
  • ecore_timer_add() creates a timer to call the given function in the given period of time. The first parameter is the interval in seconds, and the second parameter is the given function.

    If this function returns ECORE_CALLBACK_RENEW, the timer is rescheduled for the next interval given in the first parameter. If it returns ECORE_CALLBACK_CANCEL, the timer is deleted automatically. The third parameter indicates the user data to pass to the function when it is called.

    • The label is not used in this example, so annotate it.

    -/* 
+/*
    Conformant
    Create and initialize elm_conformant
    elm_conformant is mandatory for the base GUI to have a proper size
@@ -77,11 +77,11 @@ evas_object_show(ad->conform);
    Modify this part to change the view
 */
 #if 0 /* _NOT_USED */
-    ad->label = elm_label_add(ad->conform);
-    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
-    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-    elm_object_content_set(ad->conform, ad->label);
-    evas_object_show(ad->label);
+    ad->label = elm_label_add(ad->conform);
+    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
+    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+    elm_object_content_set(ad->conform, ad->label);
+    evas_object_show(ad->label);
 #endif
 
 /* Evas */
@@ -130,60 +130,60 @@ evas_object_show(ad->win);
 static Eina_Bool
 _advance_frame(void *data, double pos)
 {
-    double frame = ecore_animator_pos_map(pos, ECORE_POS_MAP_LINEAR, 12, 15);
-    evas_object_resize(data, 50 * (1 + frame), 50 * (1 + frame));
-    evas_object_move(data, 100 * frame, 100 * frame);
-    evas_object_color_set(data, 255 * frame, 0, 255 * (1 - frame), 255);
+    double frame = ecore_animator_pos_map(pos, ECORE_POS_MAP_LINEAR, 12, 15);
+    evas_object_resize(data, 50 * (1 + frame), 50 * (1 + frame));
+    evas_object_move(data, 100 * frame, 100 * frame);
+    evas_object_color_set(data, 255 * frame, 0, 255 * (1 - frame), 255);
 
-    return ECORE_CALLBACK_RENEW;
+    return ECORE_CALLBACK_RENEW;
 }
 
 static Eina_Bool
 _advance_frame2(void *data, double pos)
 {
-    double frame = ecore_animator_pos_map(pos, ECORE_POS_MAP_BOUNCE, 1.2, 50);
-    evas_object_resize(data, 100 - (50 * frame), 100 - (50 * frame));
-    evas_object_move(data, 100 * (1 - frame), 100 * (1 - frame));
-    evas_object_color_set(data, 255 * (1 - frame), 0, 255 * frame, 255);
+    double frame = ecore_animator_pos_map(pos, ECORE_POS_MAP_BOUNCE, 1.2, 50);
+    evas_object_resize(data, 100 - (50 * frame), 100 - (50 * frame));
+    evas_object_move(data, 100 * (1 - frame), 100 * (1 - frame));
+    evas_object_color_set(data, 255 * (1 - frame), 0, 255 * frame, 255);
 
-    return ECORE_CALLBACK_RENEW;
+    return ECORE_CALLBACK_RENEW;
 }
 
 static Eina_Bool
 _advance_frame3(void * data)
 {
-    static int x = 0;
-    if (x >= 250)
-        x = 0;
-    evas_object_move(data, x += 2, 350);
+    static int x = 0;
+    if (x >= 250)
+        x = 0;
+    evas_object_move(data, x += 2, 350);
 
-    return ECORE_CALLBACK_RENEW;
+    return ECORE_CALLBACK_RENEW;
 }
 
 static Eina_Bool
 _start_second_anim(void *data)
 {
-    ecore_animator_frametime_set(1./10);
-    ecore_animator_timeline_add(20, _advance_frame2, data);
+    ecore_animator_frametime_set(1./10);
+    ecore_animator_timeline_add(20, _advance_frame2, data);
 
-    return ECORE_CALLBACK_CANCEL;
+    return ECORE_CALLBACK_CANCEL;
 }
 
 static Eina_Bool
 _freeze_third_anim(void *data)
 {
-    dlog_print(DLOG_ERROR, LOG_TAG, "ANIMATOR = %p", data);
-    ecore_animator_freeze(data);
+    dlog_print(DLOG_ERROR, LOG_TAG, "ANIMATOR = %p", data);
+    ecore_animator_freeze(data);
 
-    return ECORE_CALLBACK_CANCEL;
+    return ECORE_CALLBACK_CANCEL;
 }
 
 static Eina_Bool
 _thaw_third_anim(void *data)
 {
-    ecore_animator_thaw(data);
+    ecore_animator_thaw(data);
 
-    return ECORE_CALLBACK_CANCEL;
+    return ECORE_CALLBACK_CANCEL;
 }
    diff --git a/org.tizen.training/html/native/feature/app_graphics_n.htm b/org.tizen.training/html/native/feature/app_graphics_n.htm index f924b75..b8e148e 100644 --- a/org.tizen.training/html/native/feature/app_graphics_n.htm +++ b/org.tizen.training/html/native/feature/app_graphics_n.htm @@ -5,13 +5,13 @@ - + - Creating Applications with Graphics and Animation + Creating Applications with Graphics and Animation @@ -21,18 +21,18 @@

    Mobile native Wearable native

    -
    -
    +
    +

    Creating Applications with Graphics and Animation

    - +

    If you want to create applications that offer graphics features to the user, Tizen provides various options for you.

    You can draw various shapes, such as squares and polygons, on the screen, and you can animate screen elements to change their size, position, and color.

    diff --git a/org.tizen.training/html/native/feature/app_graphics_polygon_n.htm b/org.tizen.training/html/native/feature/app_graphics_polygon_n.htm index 332eb66..a6e3b32 100644 --- a/org.tizen.training/html/native/feature/app_graphics_polygon_n.htm +++ b/org.tizen.training/html/native/feature/app_graphics_polygon_n.htm @@ -5,13 +5,13 @@ - + - Polygons on the Canvas + Polygons on the Canvas @@ -21,18 +21,18 @@

    Mobile native Wearable native

    -
    -
    +
    +

    Polygons on the Canvas

    - +

    You can draw various polygons, such as triangles and pentagons, on a canvas.

    The following example uses the same Basic UI template as the square drawing example. For more information on how to create the project with the template, see Squares on the Canvas.

    @@ -70,10 +70,10 @@ evas_object_show(ad->conform); Modify this part to change the view */ #if 0 /* _NOT_USED */ -    ad->label = elm_label_add(ad->conform); -    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>"); -    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_object_content_set(ad->conform, ad->label); + ad->label = elm_label_add(ad->conform); + elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>"); + evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_object_content_set(ad->conform, ad->label); #endif /* Canvas */ diff --git a/org.tizen.training/html/native/feature/app_graphics_square_n.htm b/org.tizen.training/html/native/feature/app_graphics_square_n.htm index 9e5af3d..c7d3eea 100644 --- a/org.tizen.training/html/native/feature/app_graphics_square_n.htm +++ b/org.tizen.training/html/native/feature/app_graphics_square_n.htm @@ -5,13 +5,13 @@ - + - Squares on the Canvas + Squares on the Canvas @@ -21,18 +21,18 @@

    Mobile native Wearable native

    -
    -
    +
    +

    Squares on the Canvas

    - +

    To handle simple graphics elements in your application, start by learning how to draw a square on the screen. When you add multiple squares that overlap each other, you can see how their colors change due to the semi-transparent colors and overlays.

    To draw squares on the screen, you need to use a canvas. In EFL, the Evas library provides the canvas. All shapes drawn on Evas are created as Evas objects.

    @@ -64,7 +64,7 @@

    The label is not used in this example, so annotate it.

    -/* 
+/*
    Conformant
    Create and initialize elm_conformant
    elm_conformant is mandatory for the base GUI to have a proper size
@@ -82,10 +82,10 @@ evas_object_show(ad->conform);
    Modify this part to change the view
 */
 #if 0 /* _NOT_USED */
-    ad->label = elm_label_add(ad->conform);
-    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
-    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-    elm_object_content_set(ad->conform, ad->label);
+    ad->label = elm_label_add(ad->conform);
+    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
+    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+    elm_object_content_set(ad->conform, ad->label);
 #endif
 
 /* Evas */
diff --git a/org.tizen.training/html/native/feature/app_multimedia_audio_n.htm b/org.tizen.training/html/native/feature/app_multimedia_audio_n.htm
index 9fffccf..4893cfe 100644
--- a/org.tizen.training/html/native/feature/app_multimedia_audio_n.htm
+++ b/org.tizen.training/html/native/feature/app_multimedia_audio_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Audio Playback and Recording  
+	Audio Playback and Recording
 
 
 
@@ -26,17 +26,17 @@
 			
  • Playing Audio
    • 
 			
  • Recording Audio
    • 
 		
-        
    Related Info
    		
+        
    Related Info
    
         		
+
    -
    -
    +
    +

    Audio Playback and Recording

    - +

    Tizen enables your application to manage audio content. It also provides control functions for using audio resources. The resources can be media files stored on the device or streamed from a server through the network.

    Tizen supports various audio formats, including MP3, AAC, WMA, M4A, 3GA, WAV, and AMR. The available formats depend on the target device.

    @@ -65,22 +65,22 @@
  • Define a variable for the player handle, and create the handle: 
     struct appdata {
-    player_h player;
+    player_h player;
 };
 typedef struct appdata appdata_s;
 
 static void
 init_base_player(appdata_s *ad)
 {
-    int error_code = 0;
-    error_code = player_create(&ad->player);
-    if (error_code != PLAYER_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create");
-
-    /*
-       Perform more playback configuration, such as setting callbacks,
-       setting the source file URI, and preparing the player
-    */
+    int error_code = 0;
+    error_code = player_create(&ad->player);
+    if (error_code != PLAYER_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create");
+
+    /*
+       Perform more playback configuration, such as setting callbacks,
+       setting the source file URI, and preparing the player
+    */
 }
    • @@ -89,7 +89,7 @@ init_base_player(appdata_s *ad) 
     #include <storage.h>
 
-#define MP3_SAMPLE "SampleAudio.mp3";
+#define MP3_SAMPLE "SampleAudio.mp3";
 
 int internal_storage_id;
 char *audio_storage_path = NULL;
@@ -98,53 +98,53 @@ char *audio_path = NULL;
 static bool
 storage_cb(int storage_id, storage_type_e type, storage_state_e state, const char *path, void *user_data)
 {
-    if (type == STORAGE_TYPE_INTERNAL) {
-        internal_storage_id = storage_id;
+    if (type == STORAGE_TYPE_INTERNAL) {
+        internal_storage_id = storage_id;
 
-        return false;
-    }
+        return false;
+    }
 
-    return true;
+    return true;
 }
 
 void
 _get_storage_path()
 {
-    int error_code = 0;
-    char *path = NULL;
-
-    error_code = storage_foreach_device_supported(storage_cb, NULL);
-    error_code = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_MUSIC, &path);
-    if (error_code != STORAGE_ERROR_NONE) {
-        audio_storage_path = strdup(path);
-        free(path);
-    }
-
-    error_code = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_VIDEOS, &path);
-    if (error_code != STORAGE_ERROR_NONE) {
-        video_storage_path = strdup(path);
-        free(path);
-    }
+    int error_code = 0;
+    char *path = NULL;
+
+    error_code = storage_foreach_device_supported(storage_cb, NULL);
+    error_code = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_MUSIC, &path);
+    if (error_code != STORAGE_ERROR_NONE) {
+        audio_storage_path = strdup(path);
+        free(path);
+    }
+
+    error_code = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_VIDEOS, &path);
+    if (error_code != STORAGE_ERROR_NONE) {
+        video_storage_path = strdup(path);
+        free(path);
+    }
 }
 
 void
 _set_test_path()
 {
-    int path_len = 0;
+    int path_len = 0;
 
-    path_len = strlen(audio_storage_path) + strlen(MP3_SAMPLE) + 1;
-    audio_path = malloc(path_len);
-    memset(audio_path, 0x0, path_len);
+    path_len = strlen(audio_storage_path) + strlen(MP3_SAMPLE) + 1;
+    audio_path = malloc(path_len);
+    memset(audio_path, 0x0, path_len);
 
-    strncat(audio_path, audio_storage_path, strlen(audio_storage_path));
-    strncat(audio_path, MP3_SAMPLE, strlen(MP3_SAMPLE));
+    strncat(audio_path, audio_storage_path, strlen(audio_storage_path));
+    strncat(audio_path, MP3_SAMPLE, strlen(MP3_SAMPLE));
 }

    Once the storage path is set, you can specify the audio file to play using the player_set_uri() function with the player handle:

     error_code = player_set_uri(ad->player, audio_path);
 if (error_code != PLAYER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to set URI: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to set URI: error code = %d", error_code);
  • Create UI buttons and add callback functions for your application to control the playback: @@ -152,21 +152,21 @@ if (error_code != PLAYER_ERROR_NONE) static void create_base_gui(appdata_s *ad) { -    /* Create a window */ -    /* Create a button */ -    /* Add a callback to the button */ -    evas_object_smart_callback_add(button_init, "clicked", init_base_player, ad); -    evas_object_smart_callback_add(button_end, "clicked", release_base_player, ad); -    /* Create an Evas image object for the video surface */ + /* Create a window */ + /* Create a button */ + /* Add a callback to the button */ + evas_object_smart_callback_add(button_init, "clicked", init_base_player, ad); + evas_object_smart_callback_add(button_end, "clicked", release_base_player, ad); + /* Create an Evas image object for the video surface */ } static void app_create(void *data) { -    appdata_s *ad = data; -    create_base_gui(ad); + appdata_s *ad = data; + create_base_gui(ad); -    return true; + return true; }
    • @@ -178,22 +178,22 @@ app_create(void *data) static void _player_interrupted_cb(player_interrupted_code_e code, void *data) { -    appdata_s *ad = data; -    player_state_e state; + appdata_s *ad = data; + player_state_e state; -    /* All the interrupted_code_e is deprecated from Tizen 3.0 except PLAYER_INTERRUPTED_BY_RESOURCE_CONFLICT */ -    player_get_state(ad->player, &state); -    dlog_print(DLOG_INFO, LOG_TAG, "current player state = %d", state); -    /* If the state is PLAYER_STATE_PAUSED, update the UI (for example, button) */ + /* All the interrupted_code_e is deprecated from Tizen 3.0 except PLAYER_INTERRUPTED_BY_RESOURCE_CONFLICT */ + player_get_state(ad->player, &state); + dlog_print(DLOG_INFO, LOG_TAG, "current player state = %d", state); + /* If the state is PLAYER_STATE_PAUSED, update the UI (for example, button) */ } static void init_base_player(appdata_s *ad) { -    /* Set an interruption callback if the application wants to know the reason */ -    error_code = player_set_interrupted_cb(ad->player, _player_interrupted_cb, ad); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set interrupt cb"); + /* Set an interruption callback if the application wants to know the reason */ + error_code = player_set_interrupted_cb(ad->player, _player_interrupted_cb, ad); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set interrupt cb"); } @@ -202,17 +202,17 @@ init_base_player(appdata_s *ad) static void _player_completed_cb(void *data) { -    dlog_print(DLOG_INFO, LOG_TAG, "Playback End"); + dlog_print(DLOG_INFO, LOG_TAG, "Playback End"); } static void init_base_player(appdata_s *ad) { -    /* Set a completed callback if the application wants to know when the playback ends */ -    error_code = player_set_completed_cb(ad->player, _player_completed_cb, ad); + /* Set a completed callback if the application wants to know when the playback ends */ + error_code = player_set_completed_cb(ad->player, _player_completed_cb, ad); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set completed cb"); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set completed cb"); } @@ -221,15 +221,15 @@ init_base_player(appdata_s *ad) static void _player_error_cb(int error_code, void *user_data) { -    dlog_print(DLOG_ERROR, LOG_TAG, "playback failed, error = %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "playback failed, error = %x", error_code); } static void init_base_player(appdata_s *ad) { -    error_code = player_set_error_cb(ad->player, _player_error_cb, NULL); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set error cb"); + error_code = player_set_error_cb(ad->player, _player_error_cb, NULL); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set error cb"); } @@ -237,7 +237,7 @@ init_base_player(appdata_s *ad) -

    Managing Audio Playback

    +

    Managing Audio Playback

    When the player is created, it is in the PLAYER_STATE_IDLE state. To start playback, it must be in the PLAYER_STATE_READY state.

    @@ -249,7 +249,7 @@ init_base_player(appdata_s *ad) 
     error_code = player_prepare(ad->player);
 if (error_code != PLAYER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to prepare player: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to prepare player: error code = %d", error_code);
  • @@ -257,7 +257,7 @@ if (error_code != PLAYER_ERROR_NONE) 
     error_code = player_start(ad->player);
 if (error_code != PLAYER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to start player: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to start player: error code = %d", error_code);
  • @@ -280,7 +280,7 @@ error_code = player_unprepare(ad->player); error_code = player_destroy(ad->player); if (error_code != PLAYER_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy player: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy player: error code = %d", error_code);

    Recording Audio

    @@ -316,7 +316,7 @@ static recorder_h g_recorder; /* Create the audio recorder handle */ int error_code = recorder_create_audiorecorder(&g_recorder); if (error_code != RECORDER_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "fail to create an Audio Recorder: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "fail to create an Audio Recorder: error code = %d", error_code);
  • @@ -331,7 +331,7 @@ error_code = recorder_set_state_changed_cb(g_recorder, _state_changed_cb, NULL); static void _state_changed_cb(recorder_state_e previous, recorder_state_e current, bool by_policy, void *user_data) { -    dlog_print(DLOG_INFO, LOG_TAG, "_recorder_state_changed_cb (prev: %d, curr: %d)\n", previous, current); + dlog_print(DLOG_INFO, LOG_TAG, "_recorder_state_changed_cb (prev: %d, curr: %d)\n", previous, current); }
    • @@ -343,7 +343,7 @@ error_code = recorder_set_recording_limit_reached_cb(g_recorder, _recorder_recor static void _recorder_recording_limit_reached_cb(recorder_recording_limit_type_e type, void *user_data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "Recording limit reached: %d\n", type); + dlog_print(DLOG_DEBUG, LOG_TAG, "Recording limit reached: %d\n", type); } @@ -353,10 +353,10 @@ _recorder_recording_limit_reached_cb(recorder_recording_limit_type_e type, void
    • Set the audio codec for encoding the audio stream using the recorder_set_audio_encoder() function. The possible audio codec values are defined in the recorder_audio_codec_e enumeration (in mobile and wearable applications). 
      -#define FILENAME_PREFIX "AUDIO"
+#define FILENAME_PREFIX "AUDIO"
 struct tm localtime = {0};
 time_t rawtime = time(NULL);
-char filename[256] = {'\0'};
+char filename[256] = {'\0'};
 size_t size;
 
 /* Set the audio encoder */
@@ -373,12 +373,12 @@ error_code = recorder_set_file_format(g_recorder, RECORDER_FILE_FORMAT_3GP);
 
       /* Create the file name */
 if (localtime_r(&rawtime, &localtime) != NULL) {
-    size = snprintf(filename, sizeof(filename), "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.3gp",
-                    app_get_data_path(), FILENAME_PREFIX,
-                    localtime.tm_year + 1900, localtime.tm_mon + 1, localtime.tm_mday,
-                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
+    size = snprintf(filename, sizeof(filename), "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.3gp",
+                    app_get_data_path(), FILENAME_PREFIX,
+                    localtime.tm_year + 1900, localtime.tm_mon + 1, localtime.tm_mday,
+                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
 } else {
-    /* Error handling */
+    /* Error handling */
 }
 
 /* Set the full path and file name */
@@ -440,31 +440,31 @@ error_code = recorder_pause(g_recorder);
 static bool
 _recorder_expect_state(recorder_h recorder, recorder_state_e expected_state)
 {
-    recorder_state_e state;
-    int error_code = recorder_get_state(recorder, &state);
+    recorder_state_e state;
+    int error_code = recorder_get_state(recorder, &state);
 
-    dlog_print(DLOG_INFO, LOG_TAG, "recorder state = %d, expected recorder state = %d", state, expected_state);
-    if (state == expected_state)
-        return TRUE;
+    dlog_print(DLOG_INFO, LOG_TAG, "recorder state = %d, expected recorder state = %d", state, expected_state);
+    if (state == expected_state)
+        return TRUE;
 
-    return FALSE;
+    return FALSE;
 }
 
 /* Stop the recorder and save the recorded data to a file */
 if (_recorder_expect_state(g_recorder, RECORDER_STATE_RECORDING) || _recorder_expect_state(g_recorder, RECORDER_STATE_PAUSED)) {
-    error_code = recorder_commit(g_recorder);
-    if (error_code != RECORDER_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
+    error_code = recorder_commit(g_recorder);
+    if (error_code != RECORDER_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code);
 
-        return true;
-    }
+        return true;
+    }
 }
    -

    Terminating the Audio Recorder

    +

    Terminating the Audio Recorder

    After you finish audio recording, release all the resources allocated to the audio recorder:

      @@ -476,7 +476,7 @@ error_code = recorder_unprepare(g_recorder); error_code = recorder_destroy(g_recorder); if (error_code != RECORDER_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy recorder: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy recorder: error code = %d", error_code); diff --git a/org.tizen.training/html/native/feature/app_multimedia_camera_n.htm b/org.tizen.training/html/native/feature/app_multimedia_camera_n.htm index 517b037..c46653b 100644 --- a/org.tizen.training/html/native/feature/app_multimedia_camera_n.htm +++ b/org.tizen.training/html/native/feature/app_multimedia_camera_n.htm @@ -5,13 +5,13 @@ - + - Image Capturing with the Camera + Image Capturing with the Camera @@ -27,18 +27,18 @@
    1. Previewing and Capturing Images
    2. Stopping the Camera
      3. -

      Related Info

      +

      Related Info

      +
    -
    -
    +
    +

    Image Capturing with the Camera

    -

    You can capture still images with the device's internal camera and keep images on your target device using the Camera API (in mobile and wearable applications). The main features of the Camera API include:

    +

    You can capture still images with the device's internal camera and keep images on your target device using the Camera API (in mobile and wearable applications). The main features of the Camera API include:

    • Previewing images in real time
    • Capturing and saving images
      • @@ -71,10 +71,10 @@

      In the following example, create a g_camera camera handle, and define a camdata structure type, to store global data related to the camera handle:

       struct _camdata {
-    Evas_Object *win;
-    Evas_Object *rect;
-    Evas *evas;
-    camera_h g_camera; /* Camera handle */
+    Evas_Object *win;
+    Evas_Object *rect;
+    Evas *evas;
+    camera_h g_camera; /* Camera handle */
 };
 typedef struct _camdata camdata;
 
@@ -85,7 +85,7 @@ int error_code = 0;
 /* Create the camera handle */
 error_code = camera_create(CAMERA_DEVICE_CAMERA0, &cam_data.g_camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "fail to create camera: error code = %d", error_code);
+    dlog_print(DLOG_INFO, LOG_TAG, "fail to create camera: error code = %d", error_code);

      The CAMERA_DEVICE_CAMERA0 parameter means that the currently activated device camera is 0, which is the primary camera. You can select between the primary (0) and the secondary (1) camera, which are defined in the camera_device_e enumeration (in mobile and wearable applications). Since devices can have multiple camera sensors with different capabilities, you must create a camera handle with a proper camera_device_e value, determining which camera sensor is used. Usually, the primary sensor is located on the back side and the secondary sensor is on the front side of the device.

      @@ -107,12 +107,12 @@ error_code = camera_attr_set_image_quality(cam_data.g_camera, 100);

      Using the camera_set_display() function, you can set the display type for showing preview images. The display type is either CAMERA_DISPLAY_TYPE_EVAS or CAMERA_DISPLAY_TYPE_OVERLAY.

      The following example shows how to set the display according to the display_type parameter:

      - +
      Note The camera state must be CAMERA_STATE_CREATED and the create_base_gui() function must be called before previewing.
      - + 
       int error_code = CAMERA_ERROR_NONE;
 Evas_Object *g_eo = NULL;
@@ -120,50 +120,50 @@ Evas_Object *g_eo = NULL;
 static void
 create_base_gui(camdata *cam_data, camera_display_type_e display_type)
 {
-    /* Window */
-    elm_config_accel_preference_set("opengl");
-    /* PACKAGE contains the package name character info */
-    cam_data->win = elm_win_add(NULL, PACKAGE, ELM_WIN_BASIC);
-
-    evas_object_resize(cam_data->win, 240, 320);
-
-    evas_object_move(cam_data->win, 0, 0);
-    elm_win_autodel_set(cam_data->win, EINA_TRUE);
-
-    cam_data->evas = evas_object_evas_get(cam_data->win);
-
-    switch (display_type) {
-    case CAMERA_DISPLAY_TYPE_EVAS:
-        /* Set the Evas image object for drawing */
-        g_eo = evas_object_image_add(cam_data->evas);
-        evas_object_image_size_set(g_eo, 240, 320);
-        evas_object_image_fill_set(g_eo, 0, 0, 240, 320);
-        evas_object_resize(g_eo, 240, 320);
-        evas_object_show(g_eo);
-        evas_object_show(cam_data.win);
-        break;
-    case CAMERA_DISPLAY_TYPE_OVERLAY:
-        cam_data->rect = evas_object_rectangle_add(cam_data->evas);
-        evas_object_resize(cam_data->rect, 240, 320);
-        evas_object_move(cam_data->rect, 0, 0);
-        evas_object_color_set(cam_data->rect, 0, 0, 0, 0);
-        evas_object_render_op_set(cam_data->rect, EVAS_RENDER_COPY);
-        evas_object_size_hint_weight_set(cam_data->rect, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-        /* Show the window after the base GUI is set up */
-        evas_object_show(cam_data->win);
-        break;
-    case default:
-    break;
-    }
+    /* Window */
+    elm_config_accel_preference_set("opengl");
+    /* PACKAGE contains the package name character info */
+    cam_data->win = elm_win_add(NULL, PACKAGE, ELM_WIN_BASIC);
+
+    evas_object_resize(cam_data->win, 240, 320);
+
+    evas_object_move(cam_data->win, 0, 0);
+    elm_win_autodel_set(cam_data->win, EINA_TRUE);
+
+    cam_data->evas = evas_object_evas_get(cam_data->win);
+
+    switch (display_type) {
+    case CAMERA_DISPLAY_TYPE_EVAS:
+        /* Set the Evas image object for drawing */
+        g_eo = evas_object_image_add(cam_data->evas);
+        evas_object_image_size_set(g_eo, 240, 320);
+        evas_object_image_fill_set(g_eo, 0, 0, 240, 320);
+        evas_object_resize(g_eo, 240, 320);
+        evas_object_show(g_eo);
+        evas_object_show(cam_data.win);
+        break;
+    case CAMERA_DISPLAY_TYPE_OVERLAY:
+        cam_data->rect = evas_object_rectangle_add(cam_data->evas);
+        evas_object_resize(cam_data->rect, 240, 320);
+        evas_object_move(cam_data->rect, 0, 0);
+        evas_object_color_set(cam_data->rect, 0, 0, 0, 0);
+        evas_object_render_op_set(cam_data->rect, EVAS_RENDER_COPY);
+        evas_object_size_hint_weight_set(cam_data->rect, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+        /* Show the window after the base GUI is set up */
+        evas_object_show(cam_data->win);
+        break;
+    case default:
+    break;
+    }
 }
 
 error_code = camera_set_display(cam_data.g_camera, CAMERA_DISPLAY_TYPE_OVERLAY, GET_DISPLAY(cam_data.win));
 if (error_code != CAMERA_ERROR_NONE) {
-    dlog_print(DLOG_DEBUG, "camera_set_display failed [0x%x]", ret);
-    camera_destroy(cam_data.g_camera);
-    cam_data.g_camera = 0;
+    dlog_print(DLOG_DEBUG, "camera_set_display failed [0x%x]", ret);
+    camera_destroy(cam_data.g_camera);
+    cam_data.g_camera = 0;
 
-    return;
+    return;
 }
      @@ -177,11 +177,11 @@ int resolution[2]; static bool _preview_resolution_cb(int width, int height, void *user_data) { -    int *resolution = (int*)user_data; -    resolution[0] = width; -    resolution[1] = height; + int *resolution = (int*)user_data; + resolution[0] = width; + resolution[1] = height; -    return false; + return false; } /* Find a resolution that is supported by the device */ @@ -211,16 +211,16 @@ error_code = camera_set_preview_cb(cam_data.g_camera, _camera_preview_cb, NULL); static void _camera_preview_cb(camera_preview_data_s *frame, void *user_data) { -    int error_code = 0; + int error_code = 0; -    if (g_enable_focus == true) { -        error_code = camera_start_focusing(cam_data.g_camera, true); + if (g_enable_focus == true) { + error_code = camera_start_focusing(cam_data.g_camera, true); -        if (error_code == CAMERA_ERROR_NOT_SUPPORTED) -            error_code = camera_start_focusing(cam_data.g_camera, false); + if (error_code == CAMERA_ERROR_NOT_SUPPORTED) + error_code = camera_start_focusing(cam_data.g_camera, false); -        g_enable_focus = false; -    } + g_enable_focus = false; + } }

      The second parameter of the camera_start_focusing() function is a Boolean flag defining whether the camera must continuously maintain focus. The g_enable_focus flag is set to true at the application startup. For the first frame of the preview, the camera starts auto-focusing. Subsequent calls to the callback do not provoke any action, which prevents the auto-focusing process from starting after the first previewed frame.

      @@ -234,14 +234,14 @@ _camera_preview_cb(camera_preview_data_s *frame, void *user_data) static void _camera_focus_cb(camera_focus_state_e state, void *user_data) { -    int error_code; + int error_code; -    if (state == CAMERA_FOCUS_STATE_FOCUSED && g_enable_shot == true) { -        /* Start capturing */ -        error_code = camera_start_capture(cam_data.g_camera, _camera_capturing_cb, _camera_completed_cb, NULL); + if (state == CAMERA_FOCUS_STATE_FOCUSED && g_enable_shot == true) { + /* Start capturing */ + error_code = camera_start_capture(cam_data.g_camera, _camera_capturing_cb, _camera_completed_cb, NULL); -        g_enable_shot = false; -    } + g_enable_shot = false; + } }
    @@ -249,7 +249,7 @@ _camera_focus_cb(camera_focus_state_e state, void *user_data)

    Previewing and Capturing Images

    - +

    After initializing the camera, you can start the preview, auto-focus, and capturing processes to take a photo. The camera preview starts with the camera_start_preview() function call, and it draws frames on the screen and allows you to capture frames as still images:

     error_code = camera_start_preview(cam_data.g_camera);
@@ -267,13 +267,13 @@ error_code = camera_start_preview(cam_data.g_camera);
 static void
 _camera_capturing_cb(camera_image_data_s* image, camera_image_data_s* postview, camera_image_data_s* thumbnail, void *user_data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "Writing image to file");
-    FILE *file = fopen(g_fname, "w+");
+    dlog_print(DLOG_DEBUG, LOG_TAG, "Writing image to file");
+    FILE *file = fopen(g_fname, "w+");
 
-    if (image->data != NULL)
-        fwrite(image->data, 1, image->size, file);
+    if (image->data != NULL)
+        fwrite(image->data, 1, image->size, file);
 
-    fclose(file);
+    fclose(file);
 }
    @@ -284,14 +284,14 @@ _camera_capturing_cb(camera_image_data_s* image, camera_image_data_s* postview, static void _camera_completed_cb(void *user_data) { -    int error_code = 0; + int error_code = 0; -    usleep(25000); /* Display the captured image for 0.025 seconds */ + usleep(25000); /* Display the captured image for 0.025 seconds */ -    /* Restart the camera preview */ -    error_code = camera_start_preview(cam_data.g_camera); + /* Restart the camera preview */ + error_code = camera_start_preview(cam_data.g_camera); -    g_enable_focus = true; + g_enable_focus = true; } @@ -307,11 +307,11 @@ _camera_completed_cb(void *user_data) 
    -error_code = camera_stop_preview(cam_data.g_camera); 
+error_code = camera_stop_preview(cam_data.g_camera);
 error_code = camera_destroy(cam_data.g_camera);
 
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_INFO, LOG_TAG, "fail to destroy camera: error code = %d", error_code);
+    dlog_print(DLOG_INFO, LOG_TAG, "fail to destroy camera: error code = %d", error_code);
    diff --git a/org.tizen.training/html/native/feature/app_multimedia_n.htm b/org.tizen.training/html/native/feature/app_multimedia_n.htm index 34360a5..0fe669c 100644 --- a/org.tizen.training/html/native/feature/app_multimedia_n.htm +++ b/org.tizen.training/html/native/feature/app_multimedia_n.htm @@ -5,13 +5,13 @@ - + - Creating Applications with Multimedia + Creating Applications with Multimedia @@ -21,17 +21,17 @@

    Mobile native Wearable native

    -
    -
    +
    +

    Creating Applications with Multimedia

    - +

    If you want to create applications that offer multimedia features to the user, Tizen provides various options for you.

    Multimedia in the application allows the user to play and record audio and video, and use the device camera to take photos.

    diff --git a/org.tizen.training/html/native/feature/app_multimedia_video_n.htm b/org.tizen.training/html/native/feature/app_multimedia_video_n.htm index 9c69afd..fabd7d1 100644 --- a/org.tizen.training/html/native/feature/app_multimedia_video_n.htm +++ b/org.tizen.training/html/native/feature/app_multimedia_video_n.htm @@ -5,13 +5,13 @@ - + - Video Playback and Recording + Video Playback and Recording @@ -26,21 +26,21 @@
  • Playing Video
  • Recording Video
    • -

    Related Info

    +

    Related Info

    +
    -
    -
    +
    +

    Video Playback and Recording

    Tizen enables your application to manage video content and provides control functions for using video resources. To play and record video files, use the Player (in mobile and wearable applications) and Recorder (in mobile and wearable applications) APIs. Managing video files is very similar to managing audio content, but it requires more consideration to display the visual content.

    Tizen supports various video formats, including WMV, ASF, MP4, 3GP, AVI, MKV, and OGG. The available formats depend on the target device.

    - +

    Playing Video

    To play video files stored on the device, use the Player API (in mobile and wearable applications). The Player API also provides interfaces for getting media content information and controlling media operations, such as play, pause, resume, and stop.

    @@ -71,22 +71,22 @@
  • Define a variable for the player handle, and create the handle: 
     struct appdata {
-    player_h player;
+    player_h player;
 };
 typedef struct appdata appdata_s;
 
 static void
 init_base_player(appdata_s *ad)
 {
-    int error_code = 0;
-    error_code = player_create(&ad->player);
-    if (error_code != PLAYER_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create");
-
-    /*
-       Perform more playback configuration, such as setting callbacks,
-       setting the source file URI, and preparing the player
-    */
+    int error_code = 0;
+    error_code = player_create(&ad->player);
+    if (error_code != PLAYER_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to create");
+
+    /*
+       Perform more playback configuration, such as setting callbacks,
+       setting the source file URI, and preparing the player
+    */
 }
    • @@ -95,7 +95,7 @@ init_base_player(appdata_s *ad) 
     #include <storage.h>
 
-#define MP4_SAMPLE "SampleVideo.mp4";
+#define MP4_SAMPLE "SampleVideo.mp4";
 
 int internal_storage_id;
 char *video_storage_path = NULL;
@@ -104,48 +104,48 @@ char *video_path = NULL;
 static bool
 storage_cb(int storage_id, storage_type_e type, storage_state_e state, const char *path, void *user_data)
 {
-    if (type == STORAGE_TYPE_INTERNAL) {
-        internal_storage_id = storage_id;
+    if (type == STORAGE_TYPE_INTERNAL) {
+        internal_storage_id = storage_id;
 
-        return false;
-    }
+        return false;
+    }
 
-    return true;
+    return true;
 }
 
 void
 _get_storage_path()
 {
-    int error_code = 0;
-    char *path = NULL;
+    int error_code = 0;
+    char *path = NULL;
 
-    error_code = storage_foreach_device_supported(storage_cb, NULL);
+    error_code = storage_foreach_device_supported(storage_cb, NULL);
 
-    error_code = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_VIDEOS, &path);
-    if (error_code != STORAGE_ERROR_NONE) {
-        video_storage_path = strdup(path);
-        free(path);
-    }
+    error_code = storage_get_directory(internal_storage_id, STORAGE_DIRECTORY_VIDEOS, &path);
+    if (error_code != STORAGE_ERROR_NONE) {
+        video_storage_path = strdup(path);
+        free(path);
+    }
 }
 
 void
 _set_test_path()
 {
-    int path_len = 0;
+    int path_len = 0;
 
-    path_len = strlen(video_storage_path) + strlen(MP4_SAMPLE) + 1;
-    video_path = malloc(path_len);
-    memset(video_path, 0x0, path_len);
+    path_len = strlen(video_storage_path) + strlen(MP4_SAMPLE) + 1;
+    video_path = malloc(path_len);
+    memset(video_path, 0x0, path_len);
 
-    strncat(video_path, video_storage_path, strlen(video_storage_path));
-    strncat(video_path, MP4_SAMPLE, strlen(MP4_SAMPLE));
+    strncat(video_path, video_storage_path, strlen(video_storage_path));
+    strncat(video_path, MP4_SAMPLE, strlen(MP4_SAMPLE));
 }

    Once the storage path is set, you can specify the video file to play using the player_set_uri() function with the player handle:

     error_code = player_set_uri(ad->player, video_path);
 if (error_code != PLAYER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to set URI: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to set URI: error code = %d", error_code);
  • Create UI buttons and add callback functions for your application to control the playback: @@ -153,21 +153,21 @@ if (error_code != PLAYER_ERROR_NONE) static void create_base_gui(appdata_s *ad) { -    /* Create a window */ -    /* Create a button */ -    /* Add a callback to the button */ -    evas_object_smart_callback_add(button_init, "clicked", init_base_player, ad); -    evas_object_smart_callback_add(button_end, "clicked", release_base_player, ad); -    /* Create an Evas image object for the video surface */ + /* Create a window */ + /* Create a button */ + /* Add a callback to the button */ + evas_object_smart_callback_add(button_init, "clicked", init_base_player, ad); + evas_object_smart_callback_add(button_end, "clicked", release_base_player, ad); + /* Create an Evas image object for the video surface */ } static void app_create(void *data) { -    appdata_s *ad = data; -    create_base_gui(ad); + appdata_s *ad = data; + create_base_gui(ad); -    return true; + return true; }
    • @@ -179,39 +179,39 @@ app_create(void *data) static void _player_interrupted_cb(player_interrupted_code_e code, void *data) { -    appdata_s *ad = data; -    player_state_e state; + appdata_s *ad = data; + player_state_e state; -    /* All the interrupted_code_e is deprecated from Tizen 3.0 except PLAYER_INTERRUPTED_BY_RESOURCE_CONFLICT */ -    player_get_state(ad->player, &state); -    dlog_print(DLOG_INFO, LOG_TAG, "current player state = %d", state); -    /* If the state is PLAYER_STATE_PAUSED, update the UI (for example, button) */ + /* All the interrupted_code_e is deprecated from Tizen 3.0 except PLAYER_INTERRUPTED_BY_RESOURCE_CONFLICT */ + player_get_state(ad->player, &state); + dlog_print(DLOG_INFO, LOG_TAG, "current player state = %d", state); + /* If the state is PLAYER_STATE_PAUSED, update the UI (for example, button) */ } static void init_base_player(appdata_s *ad) { -    /* Set an interruption callback if the application wants to know the reason */ -    error_code = player_set_interrupted_cb(ad->player, _player_interrupted_cb, ad); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set interrupt cb"); + /* Set an interruption callback if the application wants to know the reason */ + error_code = player_set_interrupted_cb(ad->player, _player_interrupted_cb, ad); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set interrupt cb"); } -
  • End notifications: +
  • End notifications: 
     static void
 _player_completed_cb(void *_data)
 {
-    dlog_print(DLOG_INFO, LOG_TAG, "Playback End");
+    dlog_print(DLOG_INFO, LOG_TAG, "Playback End");
 }
 
 static void
 init_base_player(appdata_s *ad)
 {
-    error_code = player_set_completed_cb(ad->player, _player_completed_cb, ad);
-    if (error_code != PLAYER_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set completed cb");
+    error_code = player_set_completed_cb(ad->player, _player_completed_cb, ad);
+    if (error_code != PLAYER_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set completed cb");
 }
    • @@ -220,15 +220,15 @@ init_base_player(appdata_s *ad) static void _player_error_cb(int error_code, void *user_data) { -    dlog_print(DLOG_ERROR, LOG_TAG, "playback failed, error = %x", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "playback failed, error = %x", error_code); } static void init_base_player(appdata_s *ad) { -    error_code = player_set_error_cb(ad->player, _player_error_cb, NULL); -    if (error_code != PLAYER_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to set error cb"); + error_code = player_set_error_cb(ad->player, _player_error_cb, NULL); + if (error_code != PLAYER_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "failed to set error cb"); } @@ -253,7 +253,7 @@ error_code = player_set_display(ad->player, PLAYER_DISPLAY_TYPE_OVERLAY, GET_ 
     error_code = player_prepare(ad->player);
 if (error_code != PLAYER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to prepare player: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to prepare player: error code = %d", error_code);
  • @@ -261,7 +261,7 @@ if (error_code != PLAYER_ERROR_NONE) 
     error_code = player_start(ad->player);
 if (error_code != PLAYER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "failed to start player: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "failed to start player: error code = %d", error_code);
  • @@ -270,7 +270,7 @@ if (error_code != PLAYER_ERROR_NONE)
    • -

    Configuring the Video Playback

    +

    Configuring the Video Playback

    During video playback, you can manage the display settings – display mode and display orientation – as needed. Before setting the parameters, make sure that the player handle has been created, the display set, and the player started.

    @@ -283,11 +283,11 @@ if (error_code != PLAYER_ERROR_NONE) bool is_visible; error_code = player_is_display_visible(ad->player, &is_visible); -dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", error_code); +dlog_print(DLOG_ERROR, LOG_TAG, "player_is_display_visible = %d", error_code); if (!is_visible) { -    error_code = player_set_display_visible(ad->player, true); -    dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_visible = %d", error_code); + error_code = player_set_display_visible(ad->player, true); + dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_visible = %d", error_code); } @@ -295,14 +295,14 @@ if (!is_visible) {

    The available display modes are defined in the player_display_mode_e enumeration (in mobile and wearable applications). Note that the DST ROI mode is deprecated from Tizen 3.0.

     error_code = player_set_display_mode(ad->player, PLAYER_DISPLAY_MODE_FULL_SCREEN);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);
  • Set the display orientation.

    The display orientations are defined in the player_display_rotation_e enumeration (in mobile and wearable applications).

     error_code = player_set_display_rotation(ad->player, PLAYER_DISPLAY_ROTATION_90);
-dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);
+dlog_print(DLOG_ERROR, LOG_TAG, "player_set_display_mode = %d", error_code);
    • @@ -322,7 +322,7 @@ error_code = player_unprepare(ad->player); error_code = player_destroy(ad->player); if (error_code != PLAYER_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy player: error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy player: error code = %d", error_code); @@ -358,9 +358,9 @@ if (error_code != PLAYER_ERROR_NONE) #include <camera.h> struct recdata { -    bool shutdown; -    recorder_h recorder; -    camera_h camera; + bool shutdown; + recorder_h recorder; + camera_h camera; }; @@ -369,7 +369,7 @@ struct recdata { 
     static const int RECORD_TIME=2;
 static const int RECORD_LIMIT=4;
-#define FILENAME_PREFIX "VIDEO"
+#define FILENAME_PREFIX "VIDEO"
 static int g_bitrate = 288000;
 static int duration;
 static int playing=0;
@@ -391,7 +391,7 @@ rec_data.recorder = NULL;
 /* Create the camera handle */
 error_code = camera_create(CAMERA_DEVICE_CAMERA0, &rec_data.camera);
 if (error_code != CAMERA_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "fail to create camera: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "fail to create camera: error code = %d", error_code);
  • Configure the video recorder. @@ -400,7 +400,7 @@ if (error_code != CAMERA_ERROR_NONE) /* Create the video recorder handle */ error_code = recorder_create_videorecorder(rec_data.camera, &rec_data.recorder); if (error_code != RECORDER_ERROR_NONE) -    dlog_print(DLOG_INFO, LOG_TAG, "fail to create a Video Recorder: error code = %d", error_code); + dlog_print(DLOG_INFO, LOG_TAG, "fail to create a Video Recorder: error code = %d", error_code);
    • @@ -411,13 +411,13 @@ if (error_code != RECORDER_ERROR_NONE) /* Set the state change callback for the video recorder */ error_code = recorder_set_state_changed_cb(rec_data.recorder, on_state_changed_cb, NULL); if (error_code != RECORDER_ERROR_NONE) -    dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); + dlog_print(DLOG_ERROR, LOG_TAG, "error code = %d", error_code); /* Define the change callback for the video recorder */ static void on_state_changed_cb(recorder_state_e previous, recorder_state_e current, bool by_asm, void *data) { -    dlog_print(DLOG_DEBUG, LOG_TAG, "_recorder_state_changed_cb (prev: %d, curr: %d)\n", previous, current); + dlog_print(DLOG_DEBUG, LOG_TAG, "_recorder_state_changed_cb (prev: %d, curr: %d)\n", previous, current); } @@ -431,10 +431,10 @@ recorder_video_codec_e supported_codec; static bool _video_encoder_cb(recorder_video_codec_e codec, void *user_data) { -    recorder_video_codec_e * supported_codec = (recorder_video_codec_e*)user_data; -    *supported_codec = codec; + recorder_video_codec_e * supported_codec = (recorder_video_codec_e*)user_data; + *supported_codec = codec; -    return false; + return false; } error_code = recorder_foreach_supported_video_encoder(rec_data.recorder, _video_encoder_cb, &supported_codec); @@ -459,17 +459,17 @@ error_code = recorder_set_file_format(rec_data.recorder, RECORDER_FILE_FORMAT_MP 
     struct tm localtime = {0};
 time_t rawtime = time(NULL);
-char filename[256] = {'\0'};
+char filename[256] = {'\0'};
 size_t size;
 
 /* Create the file name */
 if (localtime_r(&rawtime, &localtime) != NULL) {
-    size = snprintf(filename, sizeof(filename), "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.mp4",
-                    app_get_data_path(), FILENAME_PREFIX,
-                    localtime.tm_year + 1900, localtime.tm_mon + 1, localtime.tm_mday,
-                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
+    size = snprintf(filename, sizeof(filename), "%s/%s-%04i-%02i-%02i_%02i:%02i:%02i.mp4",
+                    app_get_data_path(), FILENAME_PREFIX,
+                    localtime.tm_year + 1900, localtime.tm_mon + 1, localtime.tm_mday,
+                    localtime.tm_hour, localtime.tm_min, localtime.tm_sec);
 } else {
-    /* Error handling */
+    /* Error handling */
 }
 /* Set the full path and file name */
 error_code = recorder_set_filename(rec_data.recorder, filename);
@@ -530,7 +530,7 @@ error_code = recorder_unprepare(rec_data->recorder);
 error_code = recorder_destroy(rec_data.recorder);
 
 if (error_code != RECORDER_ERROR_NONE)
-    dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy recorder: error code = %d", error_code);
+    dlog_print(DLOG_ERROR, LOG_TAG, "fail to destroy recorder: error code = %d", error_code);
    diff --git a/org.tizen.training/html/native/feature/app_sensor_accelerator_n.htm b/org.tizen.training/html/native/feature/app_sensor_accelerator_n.htm index 583a5e3..e608c17 100644 --- a/org.tizen.training/html/native/feature/app_sensor_accelerator_n.htm +++ b/org.tizen.training/html/native/feature/app_sensor_accelerator_n.htm @@ -27,15 +27,15 @@
  • Requesting Sensor Events
  • Requesting the Maximum Acceleration Value
    • -

    Related Info

    +

    Related Info

    +
    -
    -
    +
    +

    Accelerator Sensor Usage

    The accelerator sensor can measure acceleration in the directions of the X, Y, and Z axes. Before attempting to measure the acceleration values, you need to know whether the device supports the accelerator sensor.

    @@ -43,25 +43,25 @@

    Determining Whether the Sensor Is Supported

    To determine whether the accelerator sensor is supported on the device:

    -
      +
      1. Create a new project in the Tizen Studio with the Basic UI template, and specify the project name as SensorAccelerator. -

        For more information on how to create a project, see Creating a Project (in mobile and wearable applications).

        2. +

        For more information on how to create a project, see Creating a Project (in mobile and wearable applications).

      2. In the new project, open the sensoraccelerator.c source file in the src folder and add the required library header file and variables:
        • The sensor.h file is a header file for various sensor libraries.
        • The purpose of the application is to display whether the accelerator sensor is supported, the current acceleration value, and the maximum value of acceleration. As a result, a variable is defined for each of these values.
        - + 
        -#include "sensoraccelerator.h"
+#include "sensoraccelerator.h"
 #include <sensor.h>
 
 struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label0; /* Whether the accelerator sensor is supported */
-    Evas_Object *label1; /* Current acceleration value */
-    Evas_Object *label2; /* Maximum acceleration value */
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label0; /* Whether the accelerator sensor is supported */
+    Evas_Object *label1; /* Current acceleration value */
+    Evas_Object *label2; /* Maximum acceleration value */
 };
 typedef struct appdata appdata_s;
        @@ -73,40 +73,40 @@ typedef struct appdata appdata_s;

        The sensor_is_supported() function requests the support information. Passing SENSOR_ACCELEROMETER as the first parameter makes the second parameter return the accelerator support information.

      3. The my_box_pack() function adds a UI component to a box container.
        4. - + 
         static void
 show_is_supported(appdata_s *ad)
 {
-    char buf[PATH_MAX];
-    bool is_supported = false;
-    sensor_is_supported(SENSOR_ACCELEROMETER, &is_supported);
-    sprintf(buf, "Acceleration Sensor is %s", is_supported ? "support" : "not support");
-    elm_object_text_set(ad->label0, buf);
+    char buf[PATH_MAX];
+    bool is_supported = false;
+    sensor_is_supported(SENSOR_ACCELEROMETER, &is_supported);
+    sprintf(buf, "Acceleration Sensor is %s", is_supported ? "support" : "not support");
+    elm_object_text_set(ad->label0, buf);
 }
 
 static void
 my_box_pack(Evas_Object *box, Evas_Object *child,
-            double h_weight, double v_weight, double h_align, double v_align)
+            double h_weight, double v_weight, double h_align, double v_align)
 {
-    /* Tell the child packed into the box to be able to expand */
-    evas_object_size_hint_weight_set(child, h_weight, v_weight);
-    /* Fill the expanded area (above) as opposed to centering in it */
-    evas_object_size_hint_align_set(child, h_align, v_align);
-    /* Set the child as the box content and show it */
-    evas_object_show(child);
-    elm_object_content_set(box, child);
-
-    /* Put the child into the box */
-    elm_box_pack_end(box, child);
-    /* Show the box */
-    evas_object_show(box);
+    /* Tell the child packed into the box to be able to expand */
+    evas_object_size_hint_weight_set(child, h_weight, v_weight);
+    /* Fill the expanded area (above) as opposed to centering in it */
+    evas_object_size_hint_align_set(child, h_align, v_align);
+    /* Set the child as the box content and show it */
+    evas_object_show(child);
+    elm_object_content_set(box, child);
+
+    /* Put the child into the box */
+    elm_box_pack_end(box, child);
+    /* Show the box */
+    evas_object_show(box);
 }
      4. To create the box, add the first and second label to the box, and call the show_is_supported() function to determine the sensor support, you must modify the source code at the bottom of the create_base_gui() function as follows: - + 
         /* Conformant */
 /*
@@ -130,12 +130,12 @@ evas_object_show(box);
 
 /* First label (for the sensor support) */
 ad->label0 = elm_label_add(ad->conform);
-elm_object_text_set(ad->label0, "Msg -");
+elm_object_text_set(ad->label0, "Msg -");
 my_box_pack(box, ad->label0, 1.0, 0.0, -1.0, -1.0);
 
 /* Second label (for the current acceleration value) */
 ad->label1 = elm_label_add(ad->conform);
-elm_object_text_set(ad->label1, "Value -");
+elm_object_text_set(ad->label1, "Value -");
 my_box_pack(box, ad->label1, 1.0, 1.0, -1.0, -1.0);
 
 /* Show the window after the base GUI is set up */
@@ -145,7 +145,7 @@ evas_object_show(ad->win);
 show_is_supported(ad);
        5. - +
      5. Build (in mobile and wearable applications) and run (in mobile and wearable applications) the application. If the accelerator sensor is supported, the Accelerator Sensor is support message is shown on the device screen.

        All smartphones do not support this sensor. In that case, test the application on the emulator.

        Accelerator Sensor is supported

        @@ -155,26 +155,26 @@ show_is_supported(ad);

        Requesting Sensor Events

        To implement a feature that requests the corresponding event as you shake the device, and displays the acceleration value on the screen:

        -
          +
          1. Add a structure for the sensor and a global variable to the top of the sensoraccelerator.c source file:
            • The sensorinfo_s structure includes a sensor handle and an event listener variable.
            • The sensor_info is a global variable of the sensorinfo_s structure.
            - + 
             struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label0;
-    Evas_Object *label1;
-    Evas_Object *label2;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label0;
+    Evas_Object *label1;
+    Evas_Object *label2;
 };
 typedef struct appdata appdata_s;
 
 struct _sensor_info {
-    sensor_h sensor; /* Sensor handle */
-    sensor_listener_h sensor_listener; /* Sensor listener */
+    sensor_h sensor; /* Sensor handle */
+    sensor_listener_h sensor_listener; /* Sensor listener */
 };
 typedef struct _sensor_info sensorinfo_s;
 
@@ -196,35 +196,35 @@ static sensorinfo_s sensor_info;
            2. - + 
             static void
 _new_sensor_value(sensor_h sensor, sensor_event_s *sensor_data, void *user_data)
 {
-    if (sensor_data->value_count < 3)
-        return;
-    char buf[PATH_MAX];
-    appdata_s *ad = (appdata_s*)user_data;
-
-    sprintf(buf, "Value -X : %0.1f / Y : %0.1f / Z : %0.1f",
-            sensor_data->values[0], sensor_data->values[1], sensor_data->values[2]);
-    elm_object_text_set(ad->label1, buf);
+    if (sensor_data->value_count < 3)
+        return;
+    char buf[PATH_MAX];
+    appdata_s *ad = (appdata_s*)user_data;
+
+    sprintf(buf, "Value -X : %0.1f / Y : %0.1f / Z : %0.1f",
+            sensor_data->values[0], sensor_data->values[1], sensor_data->values[2]);
+    elm_object_text_set(ad->label1, buf);
 }
 
 static void
 start_accelerator_sensor(appdata_s *ad)
 {
-    sensor_error_e err = SENSOR_ERROR_NONE;
-    sensor_get_default_sensor(SENSOR_ACCELEROMETER, &sensor_info.sensor);
-    err = sensor_create_listener(sensor_info.sensor, &sensor_info.sensor_listener);
-    sensor_listener_set_event_cb(sensor_info.sensor_listener, 100, _new_sensor_value, ad);
-    sensor_listener_start(sensor_info.sensor_listener);
+    sensor_error_e err = SENSOR_ERROR_NONE;
+    sensor_get_default_sensor(SENSOR_ACCELEROMETER, &sensor_info.sensor);
+    err = sensor_create_listener(sensor_info.sensor, &sensor_info.sensor_listener);
+    sensor_listener_set_event_cb(sensor_info.sensor_listener, 100, _new_sensor_value, ad);
+    sensor_listener_start(sensor_info.sensor_listener);
 }
            - +
          2. To operate the event listener automatically when the application starts running, invoke the above start_accelerator_sensor() function at the end of the create_base_gui() function: - + 
             /* Show the window after the base GUI is set up */
 evas_object_show(ad->win);
@@ -240,10 +240,10 @@ start_accelerator_sensor(ad);
 
          3. Right-click the emulator and select Control Panel.
 
            Emulator Control Panel
            
 	
            4. 
-	
+
 	
          4. In the control panel tree list on the left, select Event Injector > 3-Axis Sensors.
            5. 
 	
          5. Select the Acceleration tab.
            6. 
-	
+
 	
          6. Drag the 3 sliders one at a time. If the X, Y, and Z values change on the application screen, it means you have correctly received the acceleration data in your application.
 
            3-Axis Sensors
            
 	
            7. 
@@ -258,11 +258,11 @@ start_accelerator_sensor(ad);
 
 
              
 	
            1. Declare an array variable in a number format at the top of the sensoraccelerator.c source file and reset it to 0. This variable saves the maximum acceleration value.
-	
+
 
               struct _sensor_info {
-    sensor_h sensor;
-    sensor_listener_h sensor_listener;
+    sensor_h sensor;
+    sensor_listener_h sensor_listener;
 };
 typedef struct _sensor_info sensorinfo_s;
 
@@ -271,31 +271,31 @@ static sensorinfo_s sensor_info;
 static float max_acc_value[3] = {0.f, 0.f, 0.f};
 
              
 	
              2. 
-	
+
 	
            2. To create the third label and a button, add new code to the create_base_gui() function.
 	
              The button resets the maximum value to 0, when clicked.
              
-	
+
 
               /* Second label (for the current acceleration value) */
 ad->label1 = elm_label_add(ad->conform);
-elm_object_text_set(ad->label1, "Value -");
+elm_object_text_set(ad->label1, "Value -");
 my_box_pack(box, ad->label1, 1.0, 1.0, -1.0, -1.0);
 
 /* Button */
 Evas_Object *btn = elm_button_add(ad->conform);
-elm_object_text_set(btn, "Init Max Value");
-evas_object_smart_callback_add(btn, "clicked", btn_clicked_init_max_acc_value, ad);
+elm_object_text_set(btn, "Init Max Value");
+evas_object_smart_callback_add(btn, "clicked", btn_clicked_init_max_acc_value, ad);
 my_box_pack(box, btn, 1.0, 0.0, -1.0, -1.0);
 
 /* Third label (for the maximum value) */
 ad->label2 = elm_label_add(ad->conform);
-elm_object_text_set(ad->label2, "Max -");
+elm_object_text_set(ad->label2, "Max -");
 my_box_pack(box, ad->label2, 1.0, 1.0, 0.5, -1.0);
 
              
 	
              3. 
-	
+
 	
            3. Create 2 new functions and add new code to the _new_sensor_value() function:
-	
                	
+	
                  
 	
                • The get_absolute_max() function compares 2 values and returns the higher one by changing 2 real numbers to absolute values.
                  • 
 	
                • The new code in the _new_sensor_value() function saves the maximum values of the X, Y, and Z axis acceleration in the global variable and outputs them to the third label component.
                  • 
 	
                • The btn_clicked_init_max_acc_value() function resets the maximum value saved in the global variable to 0 when you click the button.
                  • 
@@ -304,43 +304,43 @@ my_box_pack(box, ad->label2, 1.0, 1.0, 0.5, -1.0);
 static float
 get_absolute_max(float value1, float value2)
 {
-    float v1 = value1 > 0.f ? value1 : -value1;
-    float v2 = value2 > 0.f ? value2 : -value2;
-    float result = v1 > v2 ? v1 : v2;
+    float v1 = value1 > 0.f ? value1 : -value1;
+    float v2 = value2 > 0.f ? value2 : -value2;
+    float result = v1 > v2 ? v1 : v2;
 
-    return result;
+    return result;
 }
 
 static void
 _new_sensor_value(sensor_h sensor, sensor_event_s *sensor_data, void *user_data)
 {
-    if (sensor_data->value_count < 3)
-        return;
-    char buf[PATH_MAX];
-    appdata_s *ad = (appdata_s*)user_data;
+    if (sensor_data->value_count < 3)
+        return;
+    char buf[PATH_MAX];
+    appdata_s *ad = (appdata_s*)user_data;
 
-    sprintf(buf, "Value -X : %0.1f / Y : %0.1f / Z : %0.1f",
-            sensor_data->values[0], sensor_data->values[1], sensor_data->values[2]);
-    elm_object_text_set(ad->label1, buf);
+    sprintf(buf, "Value -X : %0.1f / Y : %0.1f / Z : %0.1f",
+            sensor_data->values[0], sensor_data->values[1], sensor_data->values[2]);
+    elm_object_text_set(ad->label1, buf);
 
-    for (int i = 0; i < 3; i++)
-        max_acc_value[i] = get_absolute_max(max_acc_value[i], sensor_data->values[i]);
+    for (int i = 0; i < 3; i++)
+        max_acc_value[i] = get_absolute_max(max_acc_value[i], sensor_data->values[i]);
 
-    sprintf(buf, "Max -X: %0.1f / Y: %0.1f / Z: %0.1f",
-            max_acc_value[0], max_acc_value[1], max_acc_value[2]);
-    elm_object_text_set(ad->label2, buf);
+    sprintf(buf, "Max -X: %0.1f / Y: %0.1f / Z: %0.1f",
+            max_acc_value[0], max_acc_value[1], max_acc_value[2]);
+    elm_object_text_set(ad->label2, buf);
 }
 
 /* Button click event function */
 static void
 btn_clicked_init_max_acc_value(void *data, Evas_Object *obj, void *event_info)
 {
-    for (int i = 0; i < 3; i++)
-        max_acc_value[i] = 0.f;
+    for (int i = 0; i < 3; i++)
+        max_acc_value[i] = 0.f;
 }
            7. - +
          7. Run the application again and shake the phone. When you stop shaking, the value in the second label is reset, but the maximum value remains intact in the third label.

            To measure a new value, click the button and shake again.

            Emulator Control Panel

            8. diff --git a/org.tizen.training/html/native/feature/app_sensor_n.htm b/org.tizen.training/html/native/feature/app_sensor_n.htm index eae4dba..9bb9599 100644 --- a/org.tizen.training/html/native/feature/app_sensor_n.htm +++ b/org.tizen.training/html/native/feature/app_sensor_n.htm @@ -21,17 +21,17 @@

            Mobile native Wearable native

    -
    +
    -

    Creating Applications with Sensors

    +

    Creating Applications with Sensors

    A sensor is a device that detects or senses various signals or stimuli, such as acceleration, distance, orientation, and magnetic field strength, and transmits the resulting measurement. If you want to create applications that offer sensor features to the user, Tizen provides various options for you.

    diff --git a/org.tizen.training/html/native/feature/app_sensor_proximity_n.htm b/org.tizen.training/html/native/feature/app_sensor_proximity_n.htm index 952ac71..95ef37a 100644 --- a/org.tizen.training/html/native/feature/app_sensor_proximity_n.htm +++ b/org.tizen.training/html/native/feature/app_sensor_proximity_n.htm @@ -25,14 +25,14 @@
  • Determining Whether the Sensor Is Supported
  • Requesting Sensor Events
    • -

    Related Info

    +

    Related Info

    +
    -
    +

    Proximity Sensor Usage

    @@ -41,9 +41,9 @@

    Determining Whether the Sensor Is Supported

    To determine whether the proximity sensor is supported on the device:

    -
      +
      1. Create a new project in the Tizen Studio with the Basic UI template, and specify the project name as SensorProximity. -

        For more information on how to create a project, see Creating a Project (in mobile and wearable applications).

        2. +

        For more information on how to create a project, see Creating a Project (in mobile and wearable applications).

      2. In the new project, open the sensorproximity.c source file in the src folder and add the required library header file and variables:
        • The sensor.h file is a header file for various sensor libraries.
          • @@ -51,14 +51,14 @@ 
        -#include "sensorproximity.h"
+#include "sensorproximity.h"
 #include <sensor.h>
 
 struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label0; /* Whether the proximity sensor is supported */
-    Evas_Object *label1; /* Distance value */
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label0; /* Whether the proximity sensor is supported */
+    Evas_Object *label1; /* Distance value */
 };
 typedef struct appdata appdata_s;
        @@ -69,40 +69,40 @@ typedef struct appdata appdata_s;

        The sensor_is_supported() function requests the support information. Passing SENSOR_PROXIMITY as the first parameter makes the second parameter return the proximity support information.

      3. The my_box_pack() function adds a UI component to a box container.
        4. - + 
         static void
 show_is_supported(appdata_s *ad)
 {
-    char buf[PATH_MAX];
-    bool is_supported = false;
-    sensor_is_supported(SENSOR_PROXIMITY, &is_supported);
-    sprintf(buf, "Proximity Sensor is %s", is_supported ? "support" : "not support");
-    elm_object_text_set(ad->label0, buf);
+    char buf[PATH_MAX];
+    bool is_supported = false;
+    sensor_is_supported(SENSOR_PROXIMITY, &is_supported);
+    sprintf(buf, "Proximity Sensor is %s", is_supported ? "support" : "not support");
+    elm_object_text_set(ad->label0, buf);
 }
 
 static void
 my_box_pack(Evas_Object *box, Evas_Object *child,
-            double h_weight, double v_weight, double h_align, double v_align)
+            double h_weight, double v_weight, double h_align, double v_align)
 {
-    /* Tell the child packed into the box to be able to expand */
-    evas_object_size_hint_weight_set(child, h_weight, v_weight);
-    /* Fill the expanded area (above) as opposed to centering in it */
-    evas_object_size_hint_align_set(child, h_align, v_align);
-    /* Set the child as the box content and show it */
-    evas_object_show(child);
-    elm_object_content_set(box, child);
-
-    /* Put the child into the box */
-    elm_box_pack_end(box, child);
-    /* Show the box */
-    evas_object_show(box);
+    /* Tell the child packed into the box to be able to expand */
+    evas_object_size_hint_weight_set(child, h_weight, v_weight);
+    /* Fill the expanded area (above) as opposed to centering in it */
+    evas_object_size_hint_align_set(child, h_align, v_align);
+    /* Set the child as the box content and show it */
+    evas_object_show(child);
+    elm_object_content_set(box, child);
+
+    /* Put the child into the box */
+    elm_box_pack_end(box, child);
+    /* Show the box */
+    evas_object_show(box);
 }
        - +
      4. To create the box, add the 2 labels to the box, and call the show_is_supported() function to determine the sensor support, you must modify the source code at the bottom of the create_base_gui() function as follows: - + 
         /* Conformant */
 /*
@@ -126,12 +126,12 @@ evas_object_show(box);
 
 /* First label (for the sensor support) */
 ad->label0 = elm_label_add(ad->conform);
-elm_object_text_set(ad->label0, "Msg -");
+elm_object_text_set(ad->label0, "Msg -");
 my_box_pack(box, ad->label0, 1.0, 0.0, -1.0, -1.0);
 
 /* Second label (for the current distance value) */
 ad->label1 = elm_label_add(ad->conform);
-elm_object_text_set(ad->label1, "Value -");
+elm_object_text_set(ad->label1, "Value -");
 my_box_pack(box, ad->label1, 1.0, 1.0, -1.0, -1.0);
 
 /* Show the window after the base GUI is set up */
@@ -141,7 +141,7 @@ evas_object_show(ad->win);
 show_is_supported(ad);
        5. - +
      5. Build (in mobile and wearable applications) and run (in mobile and wearable applications) the application. If the proximity sensor is supported, the Proximity Sensor is support message is shown on the device screen.

        All smartphones do not support this sensor. In that case, test the application on the emulator.

        @@ -158,19 +158,19 @@ show_is_supported(ad);
      6. The sensorinfo_s structure includes a sensor handle and an event listener variable.
      7. The sensor_info is a global variable of the sensorinfo_s structure.
        8. - + 
         struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label0;
-    Evas_Object *label1;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label0;
+    Evas_Object *label1;
 };
 typedef struct appdata appdata_s;
 
 struct _sensor_info {
-    sensor_h sensor; /* Sensor handle */
-    sensor_listener_h sensor_listener; /* Sensor listener */
+    sensor_h sensor; /* Sensor handle */
+    sensor_listener_h sensor_listener; /* Sensor listener */
 };
 typedef struct _sensor_info sensorinfo_s;
 
@@ -192,34 +192,34 @@ static sensorinfo_s sensor_info;
 	
 	
 	
-	
+
 
         static void
 _new_sensor_value(sensor_h sensor, sensor_event_s *sensor_data, void *user_data)
 {
-    if (sensor_data->value_count < 1)
-        return;
-    char buf[PATH_MAX];
-    appdata_s *ad = (appdata_s*)user_data;
+    if (sensor_data->value_count < 1)
+        return;
+    char buf[PATH_MAX];
+    appdata_s *ad = (appdata_s*)user_data;
 
-    sprintf(buf, "Distance: %0.1f", sensor_data->values[0]);
-    elm_object_text_set(ad->label1, buf);
+    sprintf(buf, "Distance: %0.1f", sensor_data->values[0]);
+    elm_object_text_set(ad->label1, buf);
 }
 
 static void
 start_proximity_sensor(appdata_s *ad)
 {
-    sensor_error_e err = SENSOR_ERROR_NONE;
-    sensor_get_default_sensor(SENSOR_PROXIMITY, &sensor_info.sensor);
-    err = sensor_create_listener(sensor_info.sensor, &sensor_info.sensor_listener);
-    sensor_listener_set_event_cb(sensor_info.sensor_listener, 100, _new_sensor_value, ad);
-    sensor_listener_start(sensor_info.sensor_listener);
+    sensor_error_e err = SENSOR_ERROR_NONE;
+    sensor_get_default_sensor(SENSOR_PROXIMITY, &sensor_info.sensor);
+    err = sensor_create_listener(sensor_info.sensor, &sensor_info.sensor_listener);
+    sensor_listener_set_event_cb(sensor_info.sensor_listener, 100, _new_sensor_value, ad);
+    sensor_listener_start(sensor_info.sensor_listener);
 }
 
        
 	
-	
+
 	
      8. To operate the event listener automatically when the application starts running, invoke the above start_proximity_sensor() function at the end of the create_base_gui() function:
-	
+
 
         /* Show the window after the base GUI is set up */
 evas_object_show(ad->win);
@@ -233,7 +233,7 @@ start_proximity_sensor(ad);
 
        To test on the emulator, use the control panel:
        
 
          
 
        1. Right-click the emulator and select Control Panel.
          2. 
-	
+
 	
        2. In the control panel tree list on the left, select Event Injector > Proximity.
          3. 
 
 	
        3. Click ON on the right side of the screen in the control panel to display 0.0 in the second label component on the application screen. If you click OFF, the 5.0 value is displayed in the label component.
diff --git a/org.tizen.training/html/native/feature/best_practice_battery_n.htm b/org.tizen.training/html/native/feature/best_practice_battery_n.htm
index 36222c2..4354b06 100644
--- a/org.tizen.training/html/native/feature/best_practice_battery_n.htm
+++ b/org.tizen.training/html/native/feature/best_practice_battery_n.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Best Practices for Location  
+	Best Practices for Location
 
 
 
@@ -40,10 +40,10 @@
 			
        4. Application API for Wearable Native
          5. 
 			
        5. Ecore Timer API for Wearable Native
          6. 
 			
        6. Location Manager API for Wearable Native
          7. 
-        		
+
    -
    -
    +
    +

    Best Practices for Location

    If you want to create applications that offer reduced battery drain features to the user, Tizen provides various options for you.

    @@ -69,7 +69,7 @@

    Managing Life-cycles

    -

    Using the location received from GPS is potentially one of your application's most significant causes of battery drain. To minimize the battery drain associated with location service activities, it is critical that you understand the life-cycles of your application and location service, and synchronize the states between the 2 processes: location server and location application.

    +

    Using the location received from GPS is potentially one of your application's most significant causes of battery drain. To minimize the battery drain associated with location service activities, it is critical that you understand the life-cycles of your application and location service, and synchronize the states between the 2 processes: location server and location application.

    Application Life-cycle

    @@ -212,8 +212,8 @@ Location handle has been destroyed. - - + +

    Optimizing Power Consumption

    To reduce power consumption, you must select the optimal location method for the location service to determine the device location. You must also carefully synchronize the application and location service states to ensure that the location service is only running when the application is on the foreground.

    @@ -223,7 +223,7 @@

    Selecting the Location Method

  • The power consumption and location accuracy differ based on the location source. It is important for you to select the location method, as the location method decides which location sources are used to determine the device location.
    • -

    The location service provides different methods for determining the location, as illustrated in the following table.

    +

    The location service provides different methods for determining the location, as illustrated in the following table.

    Table: Location service methods

    @@ -249,7 +249,7 @@
    This method receives location information from an external positioning server that computes the approximate location based on the Wi-Fi or mobile network cell tower. It provides the lowest power consumption, and the weakest location accuracy.
    - +

    The following table shows how much power is consumed approximately by GPS at a standalone mode in the condition of no assistant GPS, such as SUPL (Secure User Plane Location) server.

    Table: GPS power consumption

    @@ -294,10 +294,10 @@ 
     <privileges>
-   <privilege>http://tizen.org/privilege/location</privilege>
-   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
-   <privilege>http://tizen.org/privilege/alarm.get</privilege>
-   <privilege>http://tizen.org/privilege/alarm.set</privilege>
+   <privilege>http://tizen.org/privilege/location</privilege>
+   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
+   <privilege>http://tizen.org/privilege/alarm.get</privilege>
+   <privilege>http://tizen.org/privilege/alarm.set</privilege>
 </privileges>
    @@ -314,155 +314,155 @@ static Evas_Object* create_panel_basic_content(Evas_Object *parent, appdata_s *ad) { -    Evas_Object *table; + Evas_Object *table; -    table = elm_table_add(parent); -    elm_table_padding_set(table, 10, 0); + table = elm_table_add(parent); + elm_table_padding_set(table, 10, 0); -    /* Add button for starting location service */ -    ad->create_btn = elm_button_add(table); -    evas_object_size_hint_weight_set(ad->create_btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_size_hint_align_set(ad->create_btn, EVAS_HINT_FILL, EVAS_HINT_FILL); -    elm_object_text_set(ad->create_btn, "<font_size=30>Start</font_size>"); -    elm_object_disabled_set(ad->create_btn, EINA_FALSE); -    evas_object_smart_callback_add(ad->create_btn, "clicked", _clicked_start_cb, ad); -    evas_object_show(ad->create_btn); -    elm_table_pack(table, ad->create_btn, 0, 0, 1, 1); + /* Add button for starting location service */ + ad->create_btn = elm_button_add(table); + evas_object_size_hint_weight_set(ad->create_btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_size_hint_align_set(ad->create_btn, EVAS_HINT_FILL, EVAS_HINT_FILL); + elm_object_text_set(ad->create_btn, "<font_size=30>Start</font_size>"); + elm_object_disabled_set(ad->create_btn, EINA_FALSE); + evas_object_smart_callback_add(ad->create_btn, "clicked", _clicked_start_cb, ad); + evas_object_show(ad->create_btn); + elm_table_pack(table, ad->create_btn, 0, 0, 1, 1); -    ad->destroy_btn = elm_button_add(table); -    evas_object_size_hint_weight_set(ad->destroy_btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_size_hint_align_set(ad->destroy_btn, EVAS_HINT_FILL, EVAS_HINT_FILL); -    elm_object_text_set(ad->destroy_btn, "<font_size=30>Stop</font_size>"); -    elm_object_disabled_set(ad->destroy_btn, EINA_TRUE); -    evas_object_smart_callback_add(ad->destroy_btn, "clicked", _clicked_stop_cb, ad); -    evas_object_show(ad->destroy_btn); -    elm_table_pack(table, ad->destroy_btn, 1, 4, 1, 1); + ad->destroy_btn = elm_button_add(table); + evas_object_size_hint_weight_set(ad->destroy_btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_size_hint_align_set(ad->destroy_btn, EVAS_HINT_FILL, EVAS_HINT_FILL); + elm_object_text_set(ad->destroy_btn, "<font_size=30>Stop</font_size>"); + elm_object_disabled_set(ad->destroy_btn, EINA_TRUE); + evas_object_smart_callback_add(ad->destroy_btn, "clicked", _clicked_stop_cb, ad); + evas_object_show(ad->destroy_btn); + elm_table_pack(table, ad->destroy_btn, 1, 4, 1, 1); -    evas_object_show(table); + evas_object_show(table); -    return table; + return table; } static Evas_Object* create_panel(Evas_Object *parent, appdata_s *ad) { -    Evas_Object *panel; -    Evas_Object *grid; + Evas_Object *panel; + Evas_Object *grid; -    /* Panel */ -    panel = elm_panel_add(parent); -    evas_object_show(panel); + /* Panel */ + panel = elm_panel_add(parent); + evas_object_show(panel); -    /* Grid */ -    grid = elm_grid_add(panel); -    evas_object_size_hint_weight_set(grid, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    evas_object_size_hint_align_set(grid, EVAS_HINT_FILL, EVAS_HINT_FILL); -    elm_object_content_set(panel, grid); + /* Grid */ + grid = elm_grid_add(panel); + evas_object_size_hint_weight_set(grid, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + evas_object_size_hint_align_set(grid, EVAS_HINT_FILL, EVAS_HINT_FILL); + elm_object_content_set(panel, grid); -    /* Panel basic content */ -    ad->basic_content = create_panel_basic_content(grid, ad); -    evas_object_size_hint_weight_set(ad->basic_content, EVAS_HINT_EXPAND, -                                     EVAS_HINT_EXPAND); -    evas_object_size_hint_align_set(ad->basic_content, EVAS_HINT_FILL, EVAS_HINT_FILL); -    elm_grid_pack(grid, ad->basic_content, 3, 3, 94, 94); + /* Panel basic content */ + ad->basic_content = create_panel_basic_content(grid, ad); + evas_object_size_hint_weight_set(ad->basic_content, EVAS_HINT_EXPAND, + EVAS_HINT_EXPAND); + evas_object_size_hint_align_set(ad->basic_content, EVAS_HINT_FILL, EVAS_HINT_FILL); + elm_grid_pack(grid, ad->basic_content, 3, 3, 94, 94); -    return panel; + return panel; } /* Callback invoked by updating the position */ void _position_updated_cb(double latitude, double longitude, double altitude, -                     time_t timestamp, void *data) + time_t timestamp, void *data) { -    char message[128]; -    int ret = 0; -    appdata_s *ad = (appdata_s *) data; + char message[128]; + int ret = 0; + appdata_s *ad = (appdata_s *) data; -    sprintf(message, "<align=left>[%ld] lat[%f] lon[%f] alt[%f] (ret=%d)\n</align>", -            timestamp, latitude, longitude, altitude, ret); -    elm_entry_entry_set(ad->entry, message); + sprintf(message, "<align=left>[%ld] lat[%f] lon[%f] alt[%f] (ret=%d)\n</align>", + timestamp, latitude, longitude, altitude, ret); + elm_entry_entry_set(ad->entry, message); -    /* Stop the location service after updating the first position */ -    stop_location_service(ad); + /* Stop the location service after updating the first position */ + stop_location_service(ad); } /* Create the location service */ static void create_location_service(void *data) { -    appdata_s *ad = (appdata_s *)data; -    location_h handle; -    int ret; + appdata_s *ad = (appdata_s *)data; + location_h handle; + int ret; -    /* Create the location service to use all positioning sources */ -    ret = location_manager_create(LOCATIONS_METHOD_HYBRID, &manager); -    if (ret != LOCATIONS_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_create() failed.(%d)", ret); -    } -    else { -        ad->location = manager; -        ret = location_manager_set_position_updated_cb(manager, _position_updated_cb, 0, -                                                       (void *)manager); -    } + /* Create the location service to use all positioning sources */ + ret = location_manager_create(LOCATIONS_METHOD_HYBRID, &manager); + if (ret != LOCATIONS_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_create() failed.(%d)", ret); + } + else { + ad->location = manager; + ret = location_manager_set_position_updated_cb(manager, _position_updated_cb, 0, + (void *)manager); + } } /* Destroy the location service */ static void -destroy_location_service(void *data) +destroy_location_service(void *data) { -    appdata_s *ad = (appdata_s *)data; -    int ret; + appdata_s *ad = (appdata_s *)data; + int ret; -    ret = location_manager_destroy(ad->location); -    if (ret != LOCATIONS_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_destroy() failed.(%d)", ret); -    else -        ad->location = NULL; + ret = location_manager_destroy(ad->location); + if (ret != LOCATIONS_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_destroy() failed.(%d)", ret); + else + ad->location = NULL; } /* Callback invoked by creating an application */ static bool app_create(void *data) { -    appdata_s *ad = (appdata_s *)data; + appdata_s *ad = (appdata_s *)data; -    create_location_service(ad); + create_location_service(ad); -    /* Panel */ -    panel = create_panel(grid, ad); + /* Panel */ + panel = create_panel(grid, ad); -    return true; + return true; } /* Callback invoked by terminating an application */ static void app_terminate(void *data) { -    appdata_s *ad = (appdata_s *)data; + appdata_s *ad = (appdata_s *)data; -    /* Destroy the location handle */ -    destroy_location_service(ad); + /* Destroy the location handle */ + destroy_location_service(ad); } int main(int argc, char *argv[]) { -    appdata_s ad; -    memset(&ad, 0x00, sizeof(appdata_s)); + appdata_s ad; + memset(&ad, 0x00, sizeof(appdata_s)); -    ui_app_lifecycle_callback_s event_callback; -    memset(&event_callback, 0x00, sizeof(ui_app_lifecycle_callback_s)); + ui_app_lifecycle_callback_s event_callback; + memset(&event_callback, 0x00, sizeof(ui_app_lifecycle_callback_s)); -    event_callback.create = app_create; -    event_callback.terminate = app_terminate; -    event_callback.pause = app_pause; -    event_callback.resume = app_resume; + event_callback.create = app_create; + event_callback.terminate = app_terminate; + event_callback.pause = app_pause; + event_callback.resume = app_resume; -    int ret = ui_app_main(argc, argv, &event_callback, &ad); -    if (ret != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "ui_app_main() failed with error: %d", ret); + int ret = ui_app_main(argc, argv, &event_callback, &ad); + if (ret != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "ui_app_main() failed with error: %d", ret); -    return ret; + return ret; } @@ -475,62 +475,62 @@ main(int argc, char *argv[]) static void start_location_service(void *data) { -    appdata_s *ad = (appdata_s *) data; + appdata_s *ad = (appdata_s *) data; -    ret = location_manager_start(ad->location); -    if (ret != LOCATIONS_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_start() failed. (%d)", ret); + ret = location_manager_start(ad->location); + if (ret != LOCATIONS_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_start() failed. (%d)", ret); } /* Stop the location service */ static void stop_location_service(void *data) { -    appdata_s *ad = (appdata_s *) data; + appdata_s *ad = (appdata_s *) data; -    ret = location_manager_stop(ad->location); -    if (ret != LOCATIONS_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_stop() failed. (%d)", ret); + ret = location_manager_stop(ad->location); + if (ret != LOCATIONS_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_stop() failed. (%d)", ret); } /* Callback invoked by user gesture */ static void _clicked_start_cb(void *data, Evas_Object *obj EINA_UNUSED, void *event_info EINA_UNUSED) { -    appdata_s *ad = (appdata_s *) data; -    char message[128]; + appdata_s *ad = (appdata_s *) data; + char message[128]; -    ret = location_manager_start(ad); -    sprintf(message, "<align=left>location service was started. (ret=%d\n)</align>", ret); -    elm_entry_entry_set(ad->entry, message); + ret = location_manager_start(ad); + sprintf(message, "<align=left>location service was started. (ret=%d\n)</align>", ret); + elm_entry_entry_set(ad->entry, message); } /* Callback invoked by user gesture */ static void _clicked_stop_cb(void *data, Evas_Object *obj EINA_UNUSED, void *event_info EINA_UNUSED) { -    appdata_s *ad = (appdata_s *) data; + appdata_s *ad = (appdata_s *) data; -    ret = location_manager_stop(ad); -    elm_entry_entry_set(ad->entry, "<align=left>location service was stopped.</align>"); + ret = location_manager_stop(ad); + elm_entry_entry_set(ad->entry, "<align=left>location service was stopped.</align>"); } /* Callback invoked by pausing an application */ static void app_pause(void *data) { -    appdata_s *ad = (appdata_s *)data; + appdata_s *ad = (appdata_s *)data; -    stop_location_service(ad); + stop_location_service(ad); } /* Callback invoked by resuming an application */ static void app_resume(void *data) { -    appdata_s *ad = (appdata_s *)data; + appdata_s *ad = (appdata_s *)data; -    start_location_service(ad); + start_location_service(ad); } @@ -547,13 +547,13 @@ app_resume(void *data) 
     #include <tizen.h>
 #include <service_app.h>
-#include "service.h" /* Auto-generated header file by the Tizen Studio */
+#include "service.h" /* Auto-generated header file by the Tizen Studio */
 #include <locations.h>
 #include <Ecore.h>
 
 struct appdata {
-    location_manager_h location;
-    Ecore_Timer *timer;
+    location_manager_h location;
+    Ecore_Timer *timer;
 };
 typedef struct appdata appdata_s;
 
@@ -561,119 +561,119 @@ typedef struct appdata appdata_s;
 static void
 _position_updated_cb(double latitude, double longitude, double altitude, time_t timestamp, void *data)
 {
-    dlog_print(DLOG_DEBUG, LOG_TAG, "[%ld] lat[%f] lon[%f] alt[%f]\n", timestamp,
-               latitude, longitude, altitude);
+    dlog_print(DLOG_DEBUG, LOG_TAG, "[%ld] lat[%f] lon[%f] alt[%f]\n", timestamp,
+               latitude, longitude, altitude);
 }
 
 /* Create the location service */
 static void
 create_location_service(void *data)
 {
-    appdata_s *ad = (appdata_s *)data;
-    location_manager_h manager;
-    int ret;
+    appdata_s *ad = (appdata_s *)data;
+    location_manager_h manager;
+    int ret;
 
-    ret = location_manager_create(LOCATIONS_METHOD_HYBRID, &manager);
-    if (ret != LOCATIONS_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_create() failed.(%d)", ret);
-    }
-    else {
-        ad->location = manager;
-        ret = location_manager_set_position_updated_cb(manager, _position_updated_cb, 1,
-                                                       (void *)manager);
-    }
+    ret = location_manager_create(LOCATIONS_METHOD_HYBRID, &manager);
+    if (ret != LOCATIONS_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_create() failed.(%d)", ret);
+    }
+    else {
+        ad->location = manager;
+        ret = location_manager_set_position_updated_cb(manager, _position_updated_cb, 1,
+                                                       (void *)manager);
+    }
 }
 
 /* Destroy the location service */
 static void
 destroy_location_service(void *data)
 {
-    appdata_s *ad = (appdata_s *)data;
-    int ret;
+    appdata_s *ad = (appdata_s *)data;
+    int ret;
 
-    if (ad->location) {
-        ret = location_manager_destroy(ad->location);
-        if (ret != LOCATIONS_ERROR_NONE)
-            dlog_print(DLOG_ERROR, LOG_TAG,
-                       "location_manager_destroy() failed.(%d)", ret);
-        else
-            ad->location = NULL;
-    }
+    if (ad->location) {
+        ret = location_manager_destroy(ad->location);
+        if (ret != LOCATIONS_ERROR_NONE)
+            dlog_print(DLOG_ERROR, LOG_TAG,
+                       "location_manager_destroy() failed.(%d)", ret);
+        else
+            ad->location = NULL;
+    }
 }
 
 /* Stop the location service after updating the first position */
 static void
 stop_location_service(void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
-    int ret = 0;
+    appdata_s *ad = (appdata_s *) data;
+    int ret = 0;
 
-    if (ad->location) {
-        ret = location_manager_stop(ad->location);
-        if (ret != LOCATIONS_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_stop() failed: %d", ret);
-        else
-            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was stopped.");
-    }
+    if (ad->location) {
+        ret = location_manager_stop(ad->location);
+        if (ret != LOCATIONS_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_stop() failed: %d", ret);
+        else
+            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was stopped.");
+    }
 }
 
 /* Callback invoked by the expired timer */
 static Eina_Bool
 _timeout_cb(void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
+    appdata_s *ad = (appdata_s *) data;
 
-    /* Call stopping the location service when the specific time is expired */
-    stop_location_service(ad);
+    /* Call stopping the location service when the specific time is expired */
+    stop_location_service(ad);
 
-    return ECORE_CALLBACK_CANCEL;
+    return ECORE_CALLBACK_CANCEL;
 }
 
 /* Start the location service and create a timer */
 static void
 start_location_service(void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
-    int ret = 0;
+    appdata_s *ad = (appdata_s *) data;
+    int ret = 0;
 
-    ret = location_manager_start(ad->location);
-    if (ad->location) {
-        if (ret != LOCATIONS_ERROR_NONE)
-            dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_start() failed: %d", ret);
-        else
-            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was started");
-        /* Set the timeout */
-        int TIMEOUT = 120;
-        /* Create a timer and set a callback function called after TIMEOUT */
-        Ecore_Timer *my_timer = ecore_timer_add(TIMEOUT, _timeout_cb, ad);
-        if (my_timer != NULL)
-            ad->timer = my_timer;
-    }
+    ret = location_manager_start(ad->location);
+    if (ad->location) {
+        if (ret != LOCATIONS_ERROR_NONE)
+            dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_start() failed: %d", ret);
+        else
+            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was started");
+        /* Set the timeout */
+        int TIMEOUT = 120;
+        /* Create a timer and set a callback function called after TIMEOUT */
+        Ecore_Timer *my_timer = ecore_timer_add(TIMEOUT, _timeout_cb, ad);
+        if (my_timer != NULL)
+            ad->timer = my_timer;
+    }
 }
 
 bool
 service_app_create(void *data)
 {
-    appdata_s *ad = (appdata_s *)data;
+    appdata_s *ad = (appdata_s *)data;
 
-    create_location_service(&ad->location);
-    if (ad->location)
-        start_location_service(ad);
+    create_location_service(&ad->location);
+    if (ad->location)
+        start_location_service(ad);
 
-    return true;
+    return true;
 }
 
 void
 service_app_terminate(void *data)
 {
-    appdata_s *ad = (appdata_s *)data;
+    appdata_s *ad = (appdata_s *)data;
 
-    if (ad->location)
-        destroy_location_service(ad);
-    if (ad->timer)
-        ecore_timer_del(ad->timer);
+    if (ad->location)
+        destroy_location_service(ad);
+    if (ad->timer)
+        ecore_timer_del(ad->timer);
 
-    return;
+    return;
 }
 
 
@@ -682,14 +682,14 @@ service_app_terminate(void *data)
 int
 main(int argc, char* argv[])
 {
-    appdata_s ad = {0,};
+    appdata_s ad = {0,};
 
-    service_app_lifecycle_callback_s event_callback;
-    app_event_handler_h handlers[5] = {NULL,};
+    service_app_lifecycle_callback_s event_callback;
+    app_event_handler_h handlers[5] = {NULL,};
 
-    event_callback.create = service_app_create;
-    event_callback.terminate = service_app_terminate;
-    return service_app_main(argc, argv, &event_callback, &ad);
+    event_callback.create = service_app_create;
+    event_callback.terminate = service_app_terminate;
+    return service_app_main(argc, argv, &event_callback, &ad);
 }
    @@ -707,7 +707,7 @@ main(int argc, char* argv[]) 
     #include <tizen.h>
 #include <service_app.h>
-#include "service.h" /* Auto-generated header file by the Tizen Studio */
+#include "service.h" /* Auto-generated header file by the Tizen Studio */
 #include <locations.h>
 #include <app_alarm.h>
 #include <app_control.h>
@@ -715,8 +715,8 @@ main(int argc, char* argv[])
 /* Same as above example except for the following code */
 
 struct appdata {
-    location_manager_h location;
-    int alarm_id;
+    location_manager_h location;
+    int alarm_id;
 };
 typedef struct appdata appdata_s;
 
@@ -724,129 +724,129 @@ typedef struct appdata appdata_s;
 static void
 stop_location_service(void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
-    int ret = 0;
+    appdata_s *ad = (appdata_s *) data;
+    int ret = 0;
 
-    if (ad->location) {
-        ret = location_manager_stop(ad->location);
-        if (ret != LOCATIONS_ERROR_NONE)
-            dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_stop() failed: %d", ret);
-        else
-            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was stopped.");
-        if (ad->alarm_id) {
-            alarm_cancel(ad->alarm_id);
-            ad->alarm_id = 0;
-        }
-    }
+    if (ad->location) {
+        ret = location_manager_stop(ad->location);
+        if (ret != LOCATIONS_ERROR_NONE)
+            dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_stop() failed: %d", ret);
+        else
+            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was stopped.");
+        if (ad->alarm_id) {
+            alarm_cancel(ad->alarm_id);
+            ad->alarm_id = 0;
+        }
+    }
 }
 
 /* Create an app control for the alarm */
 static bool
 _initialize_alarm(void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
+    appdata_s *ad = (appdata_s *) data;
 
-    int ret;
-    /* Set the delay time */
-    int DELAY = 120;
-    int alarm_id;
+    int ret;
+    /* Set the delay time */
+    int DELAY = 120;
+    int alarm_id;
 
-    app_control_h app_control = NULL;
-    ret = app_control_create(&app_control);
-    ret = app_control_set_operation(app_control, APP_CONTROL_OPERATION_DEFAULT);
+    app_control_h app_control = NULL;
+    ret = app_control_create(&app_control);
+    ret = app_control_set_operation(app_control, APP_CONTROL_OPERATION_DEFAULT);
 
-    /* Set app_id as the name of the application */
-    ret = app_control_set_app_id(app_control, "org.example.clockui");
+    /* Set app_id as the name of the application */
+    ret = app_control_set_app_id(app_control, "org.example.clockui");
 
-    /* Set the key ("location") and value ("stop") of a bundle */
-    ret = app_control_add_extra_data(app_control, "location", "stop");
+    /* Set the key ("location") and value ("stop") of a bundle */
+    ret = app_control_add_extra_data(app_control, "location", "stop");
 
-    /* In order to be called after DELAY */
-    ret = alarm_schedule_once_after_delay(app_control, DELAY, &alarm_id);
-    if (ret != ALARM_ERROR_NONE) {
-        char *err_msg = get_error_message(ret);
-        dlog_print(DLOG_ERROR, LOG_TAG,
-                   "alarm_schedule_once_after_delay() failed.(%d)", ret);
-        dlog_print(DLOG_INFO, LOG_TAG, "%s", err_msg);
+    /* In order to be called after DELAY */
+    ret = alarm_schedule_once_after_delay(app_control, DELAY, &alarm_id);
+    if (ret != ALARM_ERROR_NONE) {
+        char *err_msg = get_error_message(ret);
+        dlog_print(DLOG_ERROR, LOG_TAG,
+                   "alarm_schedule_once_after_delay() failed.(%d)", ret);
+        dlog_print(DLOG_INFO, LOG_TAG, "%s", err_msg);
 
-        return false;
-    }
+        return false;
+    }
 
-    ad->alarm_id = alarm_id;
+    ad->alarm_id = alarm_id;
 
-    ret = app_control_destroy(app_control);
-    if (ret != APP_CONTROL_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "app_control_destroy() failed.(%d)", ret);
-    else
-        dlog_print(DLOG_DEBUG, LOG_TAG, "Set the triggered time with alarm_id: %d",
-                   ad->alarm_id);
+    ret = app_control_destroy(app_control);
+    if (ret != APP_CONTROL_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "app_control_destroy() failed.(%d)", ret);
+    else
+        dlog_print(DLOG_DEBUG, LOG_TAG, "Set the triggered time with alarm_id: %d",
+                   ad->alarm_id);
 
-    return true;
+    return true;
 }
 
 /* Start the location service */
 void
 start_location_service(void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
-    int ret = 0;
+    appdata_s *ad = (appdata_s *) data;
+    int ret = 0;
 
-    ret = location_manager_start(ad->location);
-    if (ad->location) {
-        if (ret != LOCATIONS_ERROR_NONE)
-            dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_start() failed: %d", ret);
-        else
-            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was started");
+    ret = location_manager_start(ad->location);
+    if (ad->location) {
+        if (ret != LOCATIONS_ERROR_NONE)
+            dlog_print(DLOG_ERROR, LOG_TAG, "location_manager_start() failed: %d", ret);
+        else
+            dlog_print(DLOG_DEBUG, LOG_TAG, "location service was started");
 
-        /* Create a app control for the alarm */
-        ret = _initialize_alarm(ad);
-    }
+        /* Create a app control for the alarm */
+        ret = _initialize_alarm(ad);
+    }
 }
 
 /* Callback invoked by calling an app control */
 static void
 app_control(app_control_h app_control, void *data)
 {
-    appdata_s *ad = (appdata_s *) data;
-    char *value = NULL;
+    appdata_s *ad = (appdata_s *) data;
+    char *value = NULL;
 
-    dlog_print(DLOG_DEBUG, LOG_TAG, "app_control was called.");
-    /* Check whether the key and value of the bundle are as expected */
-    if (app_control_get_extra_data(app_control, "location", 
-                                   &value) == APP_CONTROL_ERROR_NONE) {
-        if (!strcmp(value, "stop")) {
-            if (ad->location)
-                stop_location_service(ad);
-        }
-        free(value);
-    }
+    dlog_print(DLOG_DEBUG, LOG_TAG, "app_control was called.");
+    /* Check whether the key and value of the bundle are as expected */
+    if (app_control_get_extra_data(app_control, "location",
+                                   &value) == APP_CONTROL_ERROR_NONE) {
+        if (!strcmp(value, "stop")) {
+            if (ad->location)
+                stop_location_service(ad);
+        }
+        free(value);
+    }
 }
 
 /* Callback invoked by creating an application */
 static bool
 app_create(void *data)
 {
-    appdata_s *ad = data;
+    appdata_s *ad = data;
 
-    create_base_gui(ad);
+    create_base_gui(ad);
 
-    create_location_service(ad);
+    create_location_service(ad);
 
-    if (ad->location)
-        start_location_service(ad);
+    if (ad->location)
+        start_location_service(ad);
 
-    return true;
+    return true;
 }
 
 /* Callback invoked by terminating an application */
 static void
 app_terminate(void *data)
 {
-    /* Release all resources */
-    appdata_s *ad = (appdata_s *)data;
+    /* Release all resources */
+    appdata_s *ad = (appdata_s *)data;
 
-    if (ad->location)
-        destroy_location_service(ad);
+    if (ad->location)
+        destroy_location_service(ad);
 }
 
 /* Assume that auto-generated functions from the Tizen Studio are here */
@@ -854,23 +854,23 @@ app_terminate(void *data)
 int
 main(int argc, char *argv[])
 {
-    appdata_s ad = {0,};
-    int ret = 0;
+    appdata_s ad = {0,};
+    int ret = 0;
 
-    ui_app_lifecycle_callback_s event_callback = {0,};
-    app_event_handler_h handlers[5] = {NULL,};
+    ui_app_lifecycle_callback_s event_callback = {0,};
+    app_event_handler_h handlers[5] = {NULL,};
 
-    event_callback.create = app_create;
-    event_callback.terminate = app_terminate;
-    event_callback.pause = app_pause;
-    event_callback.resume = app_resume;
-    event_callback.app_control = app_control;
+    event_callback.create = app_create;
+    event_callback.terminate = app_terminate;
+    event_callback.pause = app_pause;
+    event_callback.resume = app_resume;
+    event_callback.app_control = app_control;
 
-    ret = ui_app_main(argc, argv, &event_callback, &ad);
-    if (ret != APP_ERROR_NONE)
-        dlog_print(DLOG_ERROR, LOG_TAG, "ui_app_main() is failed. err = %d", ret);
+    ret = ui_app_main(argc, argv, &event_callback, &ad);
+    if (ret != APP_ERROR_NONE)
+        dlog_print(DLOG_ERROR, LOG_TAG, "ui_app_main() is failed. err = %d", ret);
 
-    return ret;
+    return ret;
 }
    @@ -885,11 +885,11 @@ main(int argc, char *argv[]) static void service_app_low_battery(app_event_info_h event_info, void *user_data) { -    / *APP_EVENT_LOW_BATTERY */ -    appdata_s *ad = (appdata_s *) user_data; + / *APP_EVENT_LOW_BATTERY */ + appdata_s *ad = (appdata_s *) user_data; -    if (ad->location) -        stop_location_service(ad); + if (ad->location) + stop_location_service(ad); } /* Assume that auto-generated functions from the Tizen Studio are here */ @@ -897,19 +897,19 @@ service_app_low_battery(app_event_info_h event_info, void *user_data) int main(int argc, char* argv[]) { -    appdata_s ad = {0,}; + appdata_s ad = {0,}; -    service_app_lifecycle_callback_s event_callback; -    app_event_handler_h handlers[5] = {NULL,}; + service_app_lifecycle_callback_s event_callback; + app_event_handler_h handlers[5] = {NULL,}; -    event_callback.create = service_app_create; -    event_callback.terminate = service_app_terminate; + event_callback.create = service_app_create; + event_callback.terminate = service_app_terminate; -    /* Set the callback for low battery event */ -    service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], -                                  APP_EVENT_LOW_BATTERY, service_app_low_battery, &ad); + /* Set the callback for low battery event */ + service_app_add_event_handler(&handlers[APP_EVENT_LOW_BATTERY], + APP_EVENT_LOW_BATTERY, service_app_low_battery, &ad); -    return service_app_main(argc, argv, &event_callback, &ad); + return service_app_main(argc, argv, &event_callback, &ad); } diff --git a/org.tizen.training/html/native/feature/ui_builder_app_design_mn.htm b/org.tizen.training/html/native/feature/ui_builder_app_design_mn.htm index 35af738..8a1fd6c 100644 --- a/org.tizen.training/html/native/feature/ui_builder_app_design_mn.htm +++ b/org.tizen.training/html/native/feature/ui_builder_app_design_mn.htm @@ -5,13 +5,13 @@ - + - Designing Your Native Application + Designing Your Native Application @@ -28,10 +28,10 @@
  • Binding an Event Handler to the UI Component
  • Adding an Event Handler from the Storyboard
  • Running the Application in the Emulator
    • - +
    -
    -
    +
    +

    Designing Your Native Application

    You can approach the task of designing a native application with several methods. On the one hand, you can edit the application in the Tizen Studio after creating it with a basic template. On the other hand, you can edit the application in another editor and build it with the CLI interface of the Tizen Studio. As a third option, you can use the native UI Builder in the Tizen Studio.

    @@ -55,7 +55,7 @@
  • In the Tizen Studio, select File > New > Tizen Project.
  • In the Project Wizard, create a template-based mobile native application, and select a Tizen native UI Builder project template.

    The UI Builder - Navigation View template creates an application with 3 default views, while the UI Builder - Single View template offers a single view. For more information on the Project Wizard and templates, see Creating Tizen Projects with Tizen Project Wizard.

    - +

    Project templates

  • Define the project details, and click Finish. @@ -64,7 +64,7 @@

    After you have created the project, the Tizen Studio changes to the UI Builder perspective with the applicable views, and the project structure is shown in the Project Explorer view.

    -

    Figure: UI Builder views and default project structure

    +

    Figure: UI Builder views and default project structure

    UI Builder views and default project structure

    The following table describes the content of the default project folders and files.

    @@ -108,7 +108,7 @@ Layout layout.xml Layout meta file - + Icon icon.png Application icon file @@ -116,7 +116,7 @@ Manifest tizen-manifest.xml Tizen native application manifest XML file - + @@ -127,12 +127,12 @@

    To create a UI with the WYSIWYG Editor:

      -
    1. Each view must have a root container as a top-level UI component (see the UI hierarchy structure figure). To design a view, first place the top-level UI component, the root container, on the canvas. +
    2. Each view must have a root container as a top-level UI component (see the UI hierarchy structure figure). To design a view, first place the top-level UI component, the root container, on the canvas.

      To place a top-level UI component, use the components in the UI container category of the Palette. You can drag and drop the component from the palette to the canvas, or select the component in the palette and click in the canvas. After you have added the component, you can see it in the Outline view.

      Drag a grid UI component from the Palette

      Root container in the Outline view

      3. - +
    3. After placing the root container, you can place any other UI components you want.

      The native UI Builder provides a useful visual feedback. When you drag a UI component on the canvas, a feedback shows whether you can place the component. If the component can be placed in the selected position, the cursor shows a + sign. If not, the canvas turns red and the cursor displays a rejection sign.

      The following figures show an example of positive and negative feedback.

      @@ -148,9 +148,9 @@

      Using the above steps, you can create a layout for your UI. For example, you can create a Login view by adding a grid, label, entry, button, and check UI components, and setting their properties and events.

      -

      Figure: Login view

      +

      Figure: Login view

      Login view

      - +

      Using the XML Editor

      Another UI programming method of the native UI Builder is to use the XML editor. You can edit your layout file in the Source tab. This section describes some of the features that are available in the Source tab.

      @@ -161,29 +161,29 @@
      • Source tab

        You can switch to the XML editor by clicking the Source tab at the top of the WYSIWYG Editor view. In the Source tab, you can edit the layout XML file.

        -

        Figure: Source tab

        +

        Figure: Source tab

        Source tab

      • Content assist

        The native UI Builder provides content assist functionality, which helps you to write code faster and more efficiently. To use this functionality, type a few characters of the word and press Ctrl+Space. The proposals are shown in a popup as in the following figure.

        -

        Figure: Content assist

        -

        Content assist

        +

        Figure: Content assist

        +

        Content assist

        • - +
      • Auto complete

        If you select a tag in the suggested list with content assist, the auto complete feature automatically adds the end tag.

        -

        Figure: Auto complete

        +

        Figure: Auto complete

        Auto complete

        • - +
      • Selection synchronization

        If you move a focus to another UI component in the Source tab, the selection in Preview pane is automatically synchronized. Similarly, if you change the selection in the preview pane, the focus in the Source tab moves accordingly.

        -

        Figure: Selection synchronization

        +

        Figure: Selection synchronization

        Selection synchronization

      - +

      Adding Views

      To add a new view:

      @@ -201,7 +201,7 @@
    4. To activate the view for editing, click it in the Outline view.
    5. After selecting the view, create a layout for it by adding UI components from the Palette and defining their properties in the Properties view.
      6. -
    +

    Binding an Event Handler to the UI Component

    @@ -217,11 +217,11 @@

    Event tab

    The Events panel shows all available event types for the selected UI component:

      -
    • To add an event handler for an event type, click Add next to the event type. +
    • To add an event handler for an event type, click Add next to the event type.

      The Events panel expands and you can see the suggested event handler name in gray color. Change the function name of the event handler, if needed. You can see the added event element in the Source tab.

    • To go to the event handler source, click Go.
    • To remove the event handler, click Remove.
      • -
    +

    Event in the layout

    • @@ -240,23 +240,23 @@ void view1_button1_onclicked(uib_view1_view_context *vc, Evas_Object *obj, void
  • vc: View context related to the event. You can access the UI component in the view through this structure. The following code example shows a sample of the view context. 
     struct _uib_view1_view_context {
-    /* Parent evas_object which was parameter of create function */
-    Evas_Object *parent;
-    /* Root container UI component of this view */
-    Evas_Object* root_container;
-    /* View class name */
-    const char *view_name;
-    /* Control context to control this view */
-    struct _uib_view1_control_context *cc;
-
-    /* UI components in this view */
-    Evas_Object *grid1;
-    Evas_Object *button1;
-    Evas_Object *check1;
-    Evas_Object *label1;
-    Evas_Object *label2;
-    Evas_Object *entry1;
-    Evas_Object *entry2;
+    /* Parent evas_object which was parameter of create function */
+    Evas_Object *parent;
+    /* Root container UI component of this view */
+    Evas_Object* root_container;
+    /* View class name */
+    const char *view_name;
+    /* Control context to control this view */
+    struct _uib_view1_control_context *cc;
+
+    /* UI components in this view */
+    Evas_Object *grid1;
+    Evas_Object *button1;
+    Evas_Object *check1;
+    Evas_Object *label1;
+    Evas_Object *label2;
+    Evas_Object *entry1;
+    Evas_Object *entry2;
 };
 typedef struct _uib_view1_view_context uib_view1_view_context;
    @@ -278,7 +278,7 @@ typedef struct _uib_view1_view_context uib_view1_view_context;

    Adding an Event Handler from the Storyboard

    To transition between pages in your application, use the Storyboard feature of the UI Builder. In the Storyboard tab, you can see all the views of your application. In the Storyboard, transitioning between the application views based on some UI component event is called a connection from a UI component to the target view. The target view is the view to be opened when performing a specific event on the UI component.

    - +

    To create a connection:

      @@ -323,10 +323,10 @@ typedef struct _uib_view1_view_context uib_view1_view_context;

      The following figure shows the running application. If you click the Login button, the text changes to Click to login.

      -

      Figure: Running Login application

      +

      Figure: Running Login application

      Running Login application

      - - + +
    • diff --git a/org.tizen.training/html/native/feature/ui_builder_overview_mn.htm b/org.tizen.training/html/native/feature/ui_builder_overview_mn.htm index d8e58ea..eff6ecb 100644 --- a/org.tizen.training/html/native/feature/ui_builder_overview_mn.htm +++ b/org.tizen.training/html/native/feature/ui_builder_overview_mn.htm @@ -5,13 +5,13 @@ - + - Overview of Tizen UI Development + Overview of Tizen UI Development @@ -28,17 +28,17 @@
  • EFL Structure on Tizen
  • UI Hierarchy Structure
  • Elementary UI Component Library
    • - +
    -
    -
    +
    +

    Overview of Tizen UI Development

    - +

    This guide gives a brief description of UI structures and demonstrates how you can develop and design native UI applications with tools.

    This documentation has been created based on the mobile profile.

    -

    When talking about the development of Tizen native UI applications, you cannot avoid EFL. Tizen platform uses EFL as a UI framework that provides both a visual outlook for user applications and significant performance benefits.

    +

    When talking about the development of Tizen native UI applications, you cannot avoid EFL. Tizen platform uses EFL as a UI framework that provides both a visual outlook for user applications and significant performance benefits.

    EFL stands for Enlightenment Foundation Libraries. Enlightenment is a project consisting of Enlightenment window manager, EFL libraries, and various utilities and applications. Originally, Enlightenment was a project to build a Window Manager for X11. However, it has grown much since then. At the moment, it still produces the Window Manager, but it has evolved to cover mobile, wearable, and TV UI needs (for example, for Tizen projects) as well as the traditional desktop UI. Although Tizen adopts EFL as the UI framework, the UI framework and EFL are not the same thing. Since EFL is mainly a project for the Window Manager, in the Tizen UI framework, its features are defined for mobile, wearable, and TV characteristics.

    Benefits of EFL

    @@ -47,7 +47,7 @@

    An important aspect of EFL is efficiency, both in speed and size:

      -
    • The core EFL libraries, even with Elementary, are about half the size of the equivalent "small stack" of GTK+ (used, for example, by GNOME), and about one quarter the size of Qt. Of course, with these kinds of numbers, you can always argue over what exactly constitutes an equivalent measurement.
      • +
    • The core EFL libraries, even with Elementary, are about half the size of the equivalent "small stack" of GTK+ (used, for example, by GNOME), and about one quarter the size of Qt. Of course, with these kinds of numbers, you can always argue over what exactly constitutes an equivalent measurement.
    • EFL is low on actual memory usage at runtime, with memory footprints a fraction the size of those in the GTK+ and Qt environments.
    • EFL is fast, considering what it does. Some libraries claim to be very fast - but then, it is easy to be fast when you only handle simple and straightforward tasks. EFL is fast, while also tackling the more complex rendering problems involving, for example, alpha blending, interpolated scaling, and transforms with dithering.
    @@ -69,7 +69,7 @@

    The main reason Tizen uses EFL is its speed. EFL is highly optimized by using a scene graph and retained-mode rendering, resulting in EFL being fast even in software rendering.

    A graphics system adopting the retained mode is basically responsible for responding to all repaint requests for rendering the application objects. Clients do not directly cause actual rendering, but objects are redrawn when parts of them are updated. In other words, since EFL (Evas) works with the retained mode, there is no need to command any drawing.

    -

    Figure: Retained-mode rendering

    +

    Figure: Retained-mode rendering

    Retained-mode rendering

    Separation of UI and Logic with Edje

    @@ -81,20 +81,20 @@

    The following figure describes the behavior of the EDC files.

    -

    Figure: EDC file behavior

    +

    Figure: EDC file behavior

    EDC file behavior

    EFL Structure on Tizen

    EFL is a collection of libraries that cover a range of functionality from managing the application life-cycle to rendering graphical objects. EFL libraries build on top of each other in layers, steadily becoming higher-level, yet allowing access to lower levels. The higher up you go, the less you have to do yourself. Elementary is at the top, but you still access the layers below it for common tasks, as there is no need for Elementary to wrap things that work perfectly well as-is.

    To learn more about each library, go to Introduction. This section only briefly describes the hierarchical structure of your application on Tizen.

    -

    Figure: EFL structure

    +

    Figure: EFL structure

    EFL structure

    - +

    When you create a basic EFL application, you use the following main libraries as a basis:

    • Elementary is the top-most library with which you create your EFL application. It provides all the functions you need to create a window, create simple and complex layouts, manage the life-cycle of a view, and add UI components (a full set with, for example, buttons, boxes, scrollers, and sliders).
      • -
    • EFL Core Library consists of several libraries that build on top of each other in layers, steadily becoming higher-level, yet allowing access to lower levels. +
    • EFL Core Library consists of several libraries that build on top of each other in layers, steadily becoming higher-level, yet allowing access to lower levels.

      EFL Core Library provides the following main libraries:

      • Edje library provides a powerful theme. You can use it to create your own UI components and use them in your application. You can also extend the default theme.
        • @@ -109,14 +109,14 @@

        To manage multiple views with EFL on Tizen applications, create a naviframe object. The naviframe can contain multiple views, and is a top-layer object which can help your application to manage and switch views. If your application has only one view, you do not need the naviframe.

        The following figure illustrates the most popular view hierarchy for managing multiple views.

        -

        Figure: View hierarchy for multiple views

        +

        Figure: View hierarchy for multiple views

        View hierarchy for multiple views

        • Window, which is the bottom-most UI component holding a canvas object for drawing, to represent a block of memory that gets composited to the screen.
          • -
        • Conformant, which shows the virtual keyboard, indicator, softkey, and clipboard areas. +
        • Conformant, which shows the virtual keyboard, indicator, softkey, and clipboard areas.

          If you do not need those components, you do not need the conformant either.

          • -
        • Naviframe, which is used in applications that show multiple views through their lives with back and forth transitions between them. +
        • Naviframe, which is used in applications that show multiple views through their lives with back and forth transitions between them.

          If you want to manage just 1 view, there is no need to add the naviframe.

        • UI Container (such as grid, table, or box), which helps to arrange UI components.
        • UI Component (such as button, background, icon, or image), which presents the UI layout.
          • @@ -124,7 +124,7 @@

          If you want to make a structure for each situation (single and multiple views), the following figure illustrates a possible structure.

          -

          Figure: UI hierarchy structure

          +

          Figure: UI hierarchy structure

          UI hierarchy structure

          Elementary UI Component Library

          @@ -170,7 +170,7 @@
        • Radio: The radio component can display 1 or more options, but the user can only select one of them. The UI component is composed of an indicator (selected/unselected), an optional icon, and an optional label. Even though it is usually grouped with 2 or more other radio components, it can also be used alone.
        - +
    diff --git a/org.tizen.training/html/native/getting_started_n.htm b/org.tizen.training/html/native/getting_started_n.htm index 6a16389..da423f5 100644 --- a/org.tizen.training/html/native/getting_started_n.htm +++ b/org.tizen.training/html/native/getting_started_n.htm @@ -5,25 +5,25 @@ - + - Getting Started with Native Applications + Getting Started with Native Applications
    -
    +

    Mobile native Wearable native

    - +

    Getting Started with Native Applications

    @@ -39,7 +39,7 @@
  • Wearable native widget application

    The wearable widget application is a small application that can be shown by specific UI applications (such as the home screen).

    • - +

    The first application examples show a simple application with a basic UI and minimal functionality. Get familiar with the example first, and afterwards you can use it as a basis to build more complex applications with the help of the extensive native API.

    diff --git a/org.tizen.training/html/native/mobile/first_app_mn.htm b/org.tizen.training/html/native/mobile/first_app_mn.htm index c276fb0..91936e9 100644 --- a/org.tizen.training/html/native/mobile/first_app_mn.htm +++ b/org.tizen.training/html/native/mobile/first_app_mn.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Mobile Native Application + Creating Your First Tizen Mobile Native Application @@ -26,7 +26,7 @@
  • Creating a Project
  • Building Your Application
  • Running Your Application
    • -
  • Building a Simple UI
    • +
  • Building a Simple UI

    • Related Info

    -
    +

    Creating Your First Tizen Mobile Native Application

    @@ -250,7 +250,7 @@
    1. In the Project Explorer view, right-click the project and select Run As > Tizen Native Application. -

      Running the application

      +

      Running the application

      Alternatively, you can also select the project in the Project Explorer view and do one of the following:

      • Press the Ctrl+F11 key.
        • @@ -258,7 +258,7 @@

        If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

        -

        Selecting the emulator to use

        +

        Selecting the emulator to use

      • Confirm that the application launches on the emulator. @@ -295,7 +295,7 @@
      • Run the application:
        1. In the Connection Explorer view, select the device.
          2. -
        2. In Project Explorer view, right-click the project and select Run As > Tizen Native Application. +
        3. In Project Explorer view, right-click the project and select Run As > Tizen Native Application.

          Running the application on a target device

          @@ -305,12 +305,12 @@

          If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

          -

          Selecting the device to use

          +

          Selecting the device to use

        4. Confirm that the application launches in the target device.
        - +
        Note The application is launched using the default debug run configuration. To create and use another configuration: @@ -320,19 +320,19 @@

        Run Configurations window

    - -

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    + +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    Building a Simple UI

    The following steps demonstrate how to create a simple user interface for a mobile device using EFL.

    - +

    This guide consists of the following:

      -
    1. Defining the data structure
      2. +
    2. Defining the data structure
    3. Registering life-cycle callbacks
    4. Creating UI objects
    @@ -343,9 +343,9 @@ 
     struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label;
 };
 typedef struct appdata appdata_s;
    @@ -354,11 +354,11 @@ typedef struct appdata appdata_s;

    The main() function has callbacks that manage specific parts of the application life-cycle:

      -
    • app_create +
    • app_create
      • Called when the application process starts.
      • Used to create UI components.
      • -
    • app_terminate +
    • app_terminate
      • Called while the application process is terminating.
      • Called after the main loop quits.
      • @@ -368,7 +368,7 @@ typedef struct appdata appdata_s;
    • app_pause (UI applications only)
      • Called when the application window is totally hidden.
      • -
    • app_control +
    • app_control
      • Called after the app_create callback when the process starts or called when a launch request is received while the process is running.
      • Can receive app_control data (parameters for launching the application).
      • Used to implement parameter-specific actions of the application.
        • @@ -378,23 +378,23 @@ typedef struct appdata appdata_s; int main(int argc, char *argv[]) { -    appdata_s ad = {0,}; -    int ret = 0; + appdata_s ad = {0,}; + int ret = 0; -    ui_app_lifecycle_callback_s event_callback = {0,}; -    app_event_handler_h handlers[5] = {NULL,}; + ui_app_lifecycle_callback_s event_callback = {0,}; + app_event_handler_h handlers[5] = {NULL,}; -    event_callback.create = app_create; -    event_callback.terminate = app_terminate; -    event_callback.pause = app_pause; -    event_callback.resume = app_resume; -    event_callback.app_control = app_control; + event_callback.create = app_create; + event_callback.terminate = app_terminate; + event_callback.pause = app_pause; + event_callback.resume = app_resume; + event_callback.app_control = app_control; -    ret = ui_app_main(argc, argv, &event_callback, &ad); -    if (ret != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "app_main() failed. Err=%d", ret); + ret = ui_app_main(argc, argv, &event_callback, &ad); + if (ret != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "app_main() failed. Err=%d", ret); -    return ret; + return ret; } @@ -405,17 +405,17 @@ main(int argc, char *argv[]) static bool app_create(void *data) { -    /* -     Hook to take necessary actions before the main event loop starts -     Initialize UI resources and application data -     If this function returns true, the application main loop starts -     If this function returns false, the application is terminated -    */ -    appdata_s *ad = data; + /* + Hook to take necessary actions before the main event loop starts + Initialize UI resources and application data + If this function returns true, the application main loop starts + If this function returns false, the application is terminated + */ + appdata_s *ad = data; -    create_base_gui(ad); + create_base_gui(ad); -    return true; + return true; } @@ -425,34 +425,34 @@ app_create(void *data) static void create_base_gui(appdata_s *ad) { -    /* Window */ -    ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -    elm_win_autodel_set(ad->win, EINA_TRUE); - -    if (elm_win_wm_rotation_supported_get(ad->win)) { -        int rots[4] = {0, 90, 180, 270}; -        elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); -    } - -    evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); -    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); - -    /* Conformant */ -    ad->conform = elm_conformant_add(ad->win); -    elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); -    elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE); -    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(ad->win, ad->conform); -    evas_object_show(ad->conform); - -    /* Label */ -    ad->label = elm_label_add(ad->conform); -    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>"); -    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_object_content_set(ad->conform, ad->label); - -    /* Show the window after the base GUI is set up */ -    evas_object_show(ad->win); + /* Window */ + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_autodel_set(ad->win, EINA_TRUE); + + if (elm_win_wm_rotation_supported_get(ad->win)) { + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + } + + evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + + /* Conformant */ + ad->conform = elm_conformant_add(ad->win); + elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); + elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE); + evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, ad->conform); + evas_object_show(ad->conform); + + /* Label */ + ad->label = elm_label_add(ad->conform); + elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>"); + evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_object_content_set(ad->conform, ad->label); + + /* Show the window after the base GUI is set up */ + evas_object_show(ad->win); } @@ -471,17 +471,17 @@ ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); elm_win_autodel_set(ad->win, EINA_TRUE); if (elm_win_wm_rotation_supported_get(ad->win)) { -    int rots[4] = {0, 90, 180, 270}; -    elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); } -evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); +evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad);
      • -

        You can create a conformant object that is based on the window. The conformant goes inside the window first.

        +

        You can create a conformant object that is based on the window. The conformant goes inside the window first.

        The elm_win_indicator_mode_set() function decides whether the indicator is visible, and the elm_win_indicator_opacity_set() function sets the indicator opacity mode.

        -

        You can set the conformant object as a resize object of the window by using the elm_win_resize_object_add() function. It means that the conformant size and position are controlled by the window object directly.

        +

        You can set the conformant object as a resize object of the window by using the elm_win_resize_object_add() function. It means that the conformant size and position are controlled by the window object directly.

        The evas_object_show() function makes the conformant object visible.

        @@ -509,7 +509,7 @@ evas_object_show(ad->conform);
    Modify this part to change the view
 */
 ad->label = elm_label_add(ad->conform);
-elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
+elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
 evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 elm_object_content_set(ad->conform, ad->label);
        diff --git a/org.tizen.training/html/native/process/app_dev_process_n.htm b/org.tizen.training/html/native/process/app_dev_process_n.htm index 826b493..4f648b1 100644 --- a/org.tizen.training/html/native/process/app_dev_process_n.htm +++ b/org.tizen.training/html/native/process/app_dev_process_n.htm @@ -5,13 +5,13 @@ - + - Native Application Development Process + Native Application Development Process @@ -34,12 +34,12 @@
      • Certifying and Publishing the Application
    -
    +

    Native Application Development Process

    -

    Tizen provides the tools required to manage your native application life-cycle from product conception, through development and release, to end-of-life application retirement:

    +

    Tizen provides the tools required to manage your native application life-cycle from product conception, through development and release, to end-of-life application retirement:

    1. Plan and design the application.
      2. @@ -51,195 +51,195 @@
    2. Package the application.
    3. Develop multi-projects (multiple applications within the same package).
    4. Certify and publish the application.
      5. -
    +

    Planning and Designing the Application

    -

    The first step in creating a Tizen native application is planning and designing the application using the design tools of your choice.

    +

    The first step in creating a Tizen native application is planning and designing the application using the design tools of your choice.

    -

    Once you have finished the application plan and design, you are ready to create the application project.

    +

    Once you have finished the application plan and design, you are ready to create the application project.

    Creating the Application Project

    The Tizen Studio provides various project templates that make it easier for you to start coding your application. When you create a new project, you can select a specific template or sample. Based on the selection, the Tizen native Project Wizard automatically creates basic functionalities that the application has to implement to be able to run. The default project files and folders are also created.

    - +

    Setting Project Properties

    - +

    After creating the application project, you can configure the project properties and create the application manifest to achieve the required functionality and features for your application.

    Designing the Application UI and Implementing Code

    -

    Implementing your application consists of:

    -
      -
    • Designing and creating the application UI (User Interface) -

      You can design and create the application UI (user interface) with UI Builder.

      +

      Implementing your application consists of:

      +
        +
      • Designing and creating the application UI (User Interface) +

        You can design and create the application UI (user interface) with UI Builder.

        UI Builder is included in the Tizen Studio, and functions as a WYSIWYG (What You See Is What You Get) design environment for creating UIs for native applications.

        Note You can also design the application UI using the controls defined in the User Interface guides.
        - +
        • -
      • Coding applications -

        Code your application in the Tizen Studio using the namespaces defined in the Native API Reference (in mobile and wearable applications).

        • -
      -

      If needed, update the privileges of the application.

      -

      Once you have finished implementing your application, you are ready to build your application.

      +
    • Coding applications +

      Code your application in the Tizen Studio using the namespaces defined in the Native API Reference (in mobile and wearable applications).

      • +
    +

    If needed, update the privileges of the application.

    +

    Once you have finished implementing your application, you are ready to build your application.

    Building the Application

    -

    You must build your native application project before you can run and debug the application.

    -

    The build configuration is the set of properties which are used in the build process. The build configuration includes the following properties:

    -
      -
    • Build (compile and link) options
      • -
    • Source files to build
      • +

      You must build your native application project before you can run and debug the application.

      +

      The build configuration is the set of properties which are used in the build process. The build configuration includes the following properties:

      +
        +
      • Build (compile and link) options
        • +
      • Source files to build
      • Compiler toolchain, such as compiler, linker, and archiver

      Running and Debugging the Application

      You can run your application in the emulator. The device emulator, provided with the Tizen Studio, imitates the target environment running Tizen native applications. Using this replicated environment, you can test your application before deploying it to the real target device.

      - - -

      You can also debug your application with the emulator. The emulator represents the almost identical functionality of the corresponding device model.

      The emulator provides the following debugging capabilities:

      -
        -
      • Injecting events with the Event Injector view
        • -
      • Simulating peripheral devices
        • -
      • Acting as a source-level debugger
        • -
      • Producing console output
        • -
      - - -

      You can make running and testing your application faster using the Rapid Development Support (RDS). For more information about the debugging methods and tools you can use, see Debugging Applications.

      - + + +

      You can also debug your application with the emulator. The emulator represents the almost identical functionality of the corresponding device model.

      The emulator provides the following debugging capabilities:

      +
        +
      • Injecting events with the Event Injector view
        • +
      • Simulating peripheral devices
        • +
      • Acting as a source-level debugger
        • +
      • Producing console output
        • +
      + + +

      You can make running and testing your application faster using the Rapid Development Support (RDS). For more information about the debugging methods and tools you can use, see Debugging Applications.

      +

      You can also optimize your application to achieve the best possible performance.

      - +

      To debug your application with the emulator or the target device, you must first build the application.

      Packaging the Application

      -

      You can package your application using the Tizen Studio. If you want to register your application in the Tizen store, register the author certificate before packaging your application.

      - -
        -

      1. If you have made changes to the application after testing it, rebuild the application.

        2. -

      2. Select the project in the Project Explorer view.

        3. +

        You can package your application using the Tizen Studio. If you want to register your application in the Tizen store, register the author certificate before packaging your application.

        + +
          +

        1. If you have made changes to the application after testing it, rebuild the application.

          2. +

        2. Select the project in the Project Explorer view.

        3. In the project context menu, select Project > Build Signed Package.

          4. - -
        -

        After the packaging process is complete, check the package in the project folder to ensure that the packaging was successful.

        +
      + +

      After the packaging process is complete, check the package in the project folder to ensure that the packaging was successful.

      Developing Multiple Projects as a Combined Package

      -

      Tizen supports multi-project applications that combine different types of application templates.

      +

      Tizen supports multi-project applications that combine different types of application templates.

      -

      You can develop a UI project with service or widget projects as a package.

      -

      To develop a multi-project native application:

      -
        -
      1. Create a UI application.
        2. -
      2. Create a service or widget application.
        3. -
      3. Package a multi-project application using Tizen Studio: +

        You can develop a UI project with service or widget projects as a package.

        +

        To develop a multi-project native application:

        +
          +
        1. Create a UI application.
          2. +
        2. Create a service or widget application.
          3. +
        3. Package a multi-project application using Tizen Studio:
            -
          1. In the Tizen Studio, make sure all the applications you want to include in the package are located in the Project Explorer view.

            To make the projects appear in the Project Explorer view, you can create new applications, or import existing projects or sample applications into the Tizen Studio.

            2. -

          2. To establish a project reference between a UI application and a service or widget application:

            -
              -
            • In the Project Explorer view, right-click the UI application.
              • -
            • Select Properties > Tizen Studio > Package > Multi.
              • -
            • Select the check box for the service or widget application, and click OK. -

              In the Project Explorer view, a message (with the UI application) appears next to the referenced project name for all the applications you have added to the package.

              • -
            3. -
          +
        4. In the Tizen Studio, make sure all the applications you want to include in the package are located in the Project Explorer view.

          To make the projects appear in the Project Explorer view, you can create new applications, or import existing projects or sample applications into the Tizen Studio.

          5. +

        5. To establish a project reference between a UI application and a service or widget application:

          +
            +
          • In the Project Explorer view, right-click the UI application.
            • +
          • Select Properties > Tizen Studio > Package > Multi.
            • +
          • Select the check box for the service or widget application, and click OK. +

            In the Project Explorer view, a message (with the UI application) appears next to the referenced project name for all the applications you have added to the package.

            • +
          6. +

        After packaging the multi-project application, the package consists of the application binary, resource, and data files of the root and referenced applications. Their tizen-manifest.xml files are merged into one. The application ID in the tizen-manifest.xml must be assigned with the package ID as a prefix.

        -
        4. -
      4. Build and run the UI application.

        The service or widget application is built and run automatically while the UI application is built and run.

        5. -
      + +
    • Build and run the UI application.

      The service or widget application is built and run automatically while the UI application is built and run.

      • +
      Note Tizen has limited a multi-project application combination policy for device usability. If you do not follow the policy, the submission of your application to the Tizen Store can be rejected.

      For your convenience, some policies can be allowed in the Tizen Studio only. For example, you can make a STANDALONE service application or STANDALONE widget application in the Tizen Studio, but these applications can be rejected in the Tizen Store.

      -
      - -

      The following table shows the possible combinations for a native multi-project. 1 means that only one application can be packaged as a sub application, while M means that multiple applications can be packaged as sub applications. The STANDALONE column defines whether the application can be packaged alone as the main application.

      +
    + +

    The following table shows the possible combinations for a native multi-project. 1 means that only one application can be packaged as a sub application, while M means that multiple applications can be packaged as sub applications. The STANDALONE column defines whether the application can be packaged alone as the main application.

    Table: Combinations

    - - + + - - - - - + + + + + - - - - - - + + + + + + - - - - - - + + + + + + - - - - - - + + + + + + - - - - - - + + + + + + - - - - - - + + + + + + - + -
    Main projectSub projectMain projectSub project
    STANDALONEUISERVICEWATCHWIDGETSTANDALONEUISERVICEWATCHWIDGET IME
    UIYesNoMNoMUIYesNoMNoM No
    SERVICENoNoNoNoNoSERVICENoNoNoNoNo No
    WATCHYesNoMNoNoWATCHYesNoMNoNo No
    WIDGETNoNoNoNoNoWIDGETNoNoNoNoNo No
    IMEYesMMNoNoIMEYesMMNoNo No
    - + +

    The following examples illustrate how to read the above table:

    • Main UI project alone: Allowed
    • Main UI project + 3 service projects packaged together: Allowed
    • Main UI project + 1 widget project packaged together: Allowed
    • Main service project alone: Not allowed
      • -
    • Main widget project alone: Not allowed
      • +
    • Main widget project alone: Not allowed
    - - + +

    Certifying and Publishing the Application

    -

    After you have packaged your application, you are ready to certify and publish your application.

    -

    To certify and publish your application:

    +

    After you have packaged your application, you are ready to certify and publish your application.

    +

    To certify and publish your application:

    • Upload your mobile native application to the Tizen Store or your wearable native application to the Samsung Galaxy Apps Store for registration.

      After the application is uploaded, the application is signed as a certified application installer package and the <Application_name>.tpk archive format, which contains the distributor signature, is added by the Tizen Store or Samsung Galaxy Apps Store.

      @@ -248,15 +248,15 @@

      The Tizen Store or Samsung Galaxy Apps Store checks whether your application functions properly.

    - -

    For detailed instructions on how to register your application and submit it for validation and publication in the Tizen Store, see Tizen Store Overview and other subtopics within the Distribution section of the Tizen Developers site.

    - -

    You can also upgrade your application after certification. If you want to withdraw your application from distribution and operation, you need to request for application retirement from the Tizen Store or Samsung Galaxy Apps Store.

    -

    The following figure illustrates the process of developing a Tizen native application.

    -

    Figure: Native application development process

    +

    For detailed instructions on how to register your application and submit it for validation and publication in the Tizen Store, see Tizen Store Overview and other subtopics within the Distribution section of the Tizen Developers site.

    + +

    You can also upgrade your application after certification. If you want to withdraw your application from distribution and operation, you need to request for application retirement from the Tizen Store or Samsung Galaxy Apps Store.

    + +

    The following figure illustrates the process of developing a Tizen native application.

    +

    Figure: Native application development process

    Native application development process

    - + diff --git a/org.tizen.training/html/native/process/building_app_n.htm b/org.tizen.training/html/native/process/building_app_n.htm index afedf92..0897e3a 100644 --- a/org.tizen.training/html/native/process/building_app_n.htm +++ b/org.tizen.training/html/native/process/building_app_n.htm @@ -5,13 +5,13 @@ - + - Building Applications + Building Applications @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - +

    Content

    -
    +
    -

    Building Applications

    - -

    In the Tizen Studio, different build configurations are available for different development steps:

    -
      -
    • The Debug build is used to debug and test the application.

      The binary, data, and debug files are stored in a Debug folder under the project in the workspace.

      This is the default build configuration.

      In the debug mode, the debug level is Maximum (-g3) and optimization level is None (-O0).

      • -
    • The Release build is used for the tested, release-ready version of the application. -

      The compiled binary file is stored in a Release folder - under the project in the workspace.

      -

      In the release mode, the debug level is Default (-g) and optimization level is Optimize most (-O3).

      -

      The release mode build itself does not strip the debug symbol. - Stripping is done only in the packaging step for the ARM architecture.

      - - +

      Building Applications

      + +

      In the Tizen Studio, different build configurations are available for different development steps:

      +
        +
      • The Debug build is used to debug and test the application.

        The binary, data, and debug files are stored in a Debug folder under the project in the workspace.

        This is the default build configuration.

        In the debug mode, the debug level is Maximum (-g3) and optimization level is None (-O0).

        • +
      • The Release build is used for the tested, release-ready version of the application. +

        The compiled binary file is stored in a Release folder + under the project in the workspace.

        +

        In the release mode, the debug level is Default (-g) and optimization level is Optimize most (-O3).

        +

        The release mode build itself does not strip the debug symbol. + Stripping is done only in the packaging step for the ARM architecture.

        + +
        Note The Tizen Studio automatically switches application logging off in the release mode. To enable logging in the release mode: -
          -
        1. In the Tizen Studio menu, select Project > Properties.
          2. -
        2. In the Properties window, go to C/C++Build > Settings > C Complier > Debugging.
          3. -
        3. Select the Enable application logging check box.
          4. +
            +
          1. In the Tizen Studio menu, select Project > Properties.
            2. +
          2. In the Properties window, go to C/C++Build > Settings > C Complier > Debugging.
            3. +
          3. Select the Enable application logging check box.
          -
        • +

    To set the target architecture:

    -
      -
    1. In the Tizen Studio menu, select Project > Properties.
      2. -
    2. In the Properties window, go to C/C++Build > Tizen Settings > Platform.
      3. -
    3. From the Architecture drop-down list, select the appropriate architecture.
      4. +
        +
      1. In the Tizen Studio menu, select Project > Properties.
        2. +
      2. In the Properties window, go to C/C++Build > Tizen Settings > Platform.
        3. +
      3. From the Architecture drop-down list, select the appropriate architecture.
      - -

      Building the Application in the Tizen Studio

      -

      To create an application project build:

      -
        -

      1. Select the build configuration:

        -
          -

        1. Right-click the project in the Tizen Studio Project Explorer view.

          2. -

        2. Select Build Configurations > Set Active, and select the build configuration you need.

          3. -
        2. -

      2. Build the project:

        -
          -
        • Automatic build

          If you select Project > Build Automatically in the Tizen Studio menu, whenever you make any change to a source or resource and save the project, the Tizen Studio automatically recognizes the change and rebuilds the changed source on your project.

          • -
        • Manual build

          Build the application binaries for executing the code:

          -
            -

          1. Select the project in the Project Explorer view.

            2. -

          2. In the Tizen Studio menu, select Project > Build Project.

            3. -
          • -
        3. -

      3. Check your application project source code for any -API or privilege violations, which are displayed in the Problems view.

        4. -
      - - - -

      Build Properties

      -

      To build project, you can choose many options. For example, optimization level, debugging support, or include path and library link options.

      -

      To set the build properties:

      -
        -
      1. In the Tizen Studio menu, select Project > Properties.
        2. -
      2. In the Properties window, go to C/C++ Build > Tizen Settings.
        3. + +

        Building the Application in the Tizen Studio

        +

        To create an application project build:

        +
          +

        1. Select the build configuration:

          +
            +

          1. Right-click the project in the Tizen Studio Project Explorer view.

            2. +

          2. Select Build Configurations > Set Active, and select the build configuration you need.

            3. +
          2. +

        2. Build the project:

          +
            +
          • Automatic build

            If you select Project > Build Automatically in the Tizen Studio menu, whenever you make any change to a source or resource and save the project, the Tizen Studio automatically recognizes the change and rebuilds the changed source on your project.

            • +
          • Manual build

            Build the application binaries for executing the code:

            +
              +

            1. Select the project in the Project Explorer view.

              2. +

            2. In the Tizen Studio menu, select Project > Build Project.

              3. +
            • +
          3. +

        3. Check your application project source code for any +API or privilege violations, which are displayed in the Problems view.

          4. +
        + + + +

        Build Properties

        +

        To build project, you can choose many options. For example, optimization level, debugging support, or include path and library link options.

        +

        To set the build properties:

        +
          +
        1. In the Tizen Studio menu, select Project > Properties.
          2. +
        2. In the Properties window, go to C/C++ Build > Tizen Settings.
        3. On the Platform tab, set the detailed target and tool information. -
            +
            • Rootstrap Informations

              Shows the rootstrap-related information:

                @@ -100,7 +100,7 @@ API or privilege violations, which are displayed in the ProblemsSet the platform version.

              • Architecture

                Set the target architecture.

                -

                To run the application on the x86 emulator, select X86. +

                To run the application on the x86 emulator, select X86.

              • Name @@ -112,58 +112,58 @@ API or privilege violations, which are displayed in the ProblemsPlatform

                Set the compiler toolchain used to build the application.

            -
          • On the Framework tab, set the detailed customization of the Tizen framework: -
              -
            • Framework

              Search a framework by name filtering and select the frameworks.

              • -
            • Selected Framework

              Shows the all selected frameworks.

              • -
            • Description

              Shows the description of the selected framework.

              • -
            • - -
          • In the Properties window, go to C/C++ Build > Settings > Tool Settings.

            This tab includes a build toolchain on left tree view. A toolchain has 3 main items:

            -
              -
            • Compiler
              • -
            • Linker
              • -
            • Assembler
              • +
            • On the Framework tab, set the detailed customization of the Tizen framework: +
                +
              • Framework

                Search a framework by name filtering and select the frameworks.

                • +
              • Selected Framework

                Shows the all selected frameworks.

                • +
              • Description

                Shows the description of the selected framework.

                • +
              • + +
            • In the Properties window, go to C/C++ Build > Settings > Tool Settings.

              This tab includes a build toolchain on left tree view. A toolchain has 3 main items:

              +
                +
              • Compiler
                • +
              • Linker
                • +
              • Assembler

              Each tool is configured by selecting its sub-items.

              -
                -
              • C++ Compiler

                Shows the compiler binary name and summarizes compile options

                -
                  -
                • Preprocessor

                  Set the preprocessor option

                  • -
                • Includes

                  Set the include path or files

                  • -
                • Optimization

                  Set optimization options

                  • -
                • Debugging

                  Set debugging options

                  - +
                    +
                  • C++ Compiler

                    Shows the compiler binary name and summarizes compile options

                    +
                      +
                    • Preprocessor

                      Set the preprocessor option

                      • +
                    • Includes

                      Set the include path or files

                      • +
                    • Optimization

                      Set optimization options

                      • +
                    • Debugging

                      Set debugging options

                      +
                      Note The Enable Application logging option is enabled for the Debug build configuration. The option is disabled in the Release configuration.
                      - -
                      • -
                    • Warnings

                      Set warning options

                      • -
                    • Miscellaneous

                      Set miscellaneous options

                      • -
                    • -
                  • C Compiler

                    Shows the compiler binary name and summarizes compile options

                    -
                      -
                    • Preprocessor

                      Set the preprocessor option

                      • -
                    • Symbols

                      Define or undefine the symbols used in the compilation

                      • -
                    • Includes

                      Set the include path or files

                      • -
                    • Optimization

                      Set optimization options

                      • -
                    • Debugging

                      Set debugging options

                      • -
                    • Warnings

                      Set warning options

                      • -
                    • Miscellaneous

                      Set miscellaneous options

                      • -
                    • -
                  • C++ Linker

                    Shows the linker binary name and summarizes link options

                    -
                      -
                    • General

                      Set general options

                      • -
                    • Libraries

                      Set the library and library paths

                      • -
                    • Miscellaneous

                      Set miscellaneous linker options

                      • -
                    • Shared Library Settings

                      Set options for shared library linking

                      • -
                    • -
                  • Assembler

                    Shows the assembler binary name and summarizes assembling options

                    • -
                  • -
        -

        For more information about build configuration, see the CDT guide.

        - + + +
      3. Warnings

        Set warning options

        4. +
      4. Miscellaneous

        Set miscellaneous options

        5. + +
      5. C Compiler

        Shows the compiler binary name and summarizes compile options

        +
          +
        • Preprocessor

          Set the preprocessor option

          • +
        • Symbols

          Define or undefine the symbols used in the compilation

          • +
        • Includes

          Set the include path or files

          • +
        • Optimization

          Set optimization options

          • +
        • Debugging

          Set debugging options

          • +
        • Warnings

          Set warning options

          • +
        • Miscellaneous

          Set miscellaneous options

          • +
        6. +
      6. C++ Linker

        Shows the linker binary name and summarizes link options

        +
          +
        • General

          Set general options

          • +
        • Libraries

          Set the library and library paths

          • +
        • Miscellaneous

          Set miscellaneous linker options

          • +
        • Shared Library Settings

          Set options for shared library linking

          • +
        7. +
      7. Assembler

        Shows the assembler binary name and summarizes assembling options

        8. + +
      +

      For more information about build configuration, see the CDT guide.

      +
    diff --git a/org.tizen.training/html/native/process/creating_app_project_n.htm b/org.tizen.training/html/native/process/creating_app_project_n.htm index e76ca29..66f31ad 100644 --- a/org.tizen.training/html/native/process/creating_app_project_n.htm +++ b/org.tizen.training/html/native/process/creating_app_project_n.htm @@ -5,13 +5,13 @@ - + - Creating the Application Project + Creating the Application Project @@ -22,20 +22,20 @@

    Mobile native Wearable native

    - -

    Creating the Application Project

    -

    You can create a native application project by selecting from a variety of templates and samples. The following instructions are specific for creating the project with a template.

    -

    To create a native application project:

    -
      -
    1. In the Tizen Studio, select File > New > Tizen Project. +

      Creating the Application Project

      + +

      You can create a native application project by selecting from a variety of templates and samples. The following instructions are specific for creating the project with a template.

      +

      To create a native application project:

      +
        +
      1. In the Tizen Studio, select File > New > Tizen Project.

        Creating a new project

        -

        The Project Wizard opens.

        2. +

        The Project Wizard opens.

      2. In the Project Wizard, define the project details.

        The Project Wizard is used to create the basic application skeleton with the required folder structure and mandatory files. You can easily create different applications by selecting an applicable template or sample for the Project Wizard to use.

        -
          +

          1. Select the Template project type and click Next.

            Selecting the project type

            2. @@ -50,7 +50,7 @@

          2. Define the project properties and click Finish.

            You can fill the project name. You can also select the location and working sets by clicking More properties.

            - +
            Note The Tizen API names cannot be used as project names. The project name must be more than 2 characters and is restricted to the following regular expression: [a-zA-Z][a-zA-Z0-9-]{2,49}. @@ -59,10 +59,10 @@

            The Project Wizard sets up the project, creates the application files using the default content from the template, and closes. For more information about the Project Wizard and the available templates, see Creating Tizen Projects with Tizen Project Wizard.

        -

        The new application project is shown in the Project Explorer view of the Tizen Studio, with default content in the tizen-manifest.xml file as well as in several project folders.

        - -

        Importing a Project

        -

        If you have an existing Tizen application project, you can import it into the Tizen Studio:

        +

        The new application project is shown in the Project Explorer view of the Tizen Studio, with default content in the tizen-manifest.xml file as well as in several project folders.

        + +

        Importing a Project

        +

        If you have an existing Tizen application project, you can import it into the Tizen Studio:

        1. In the Tizen Studio menu, go to File > Import > Tizen > Tizen Project, and click Next.
        2. Select the location of the root directory or archive file of the Tizen project and click Next.
          3. @@ -70,7 +70,7 @@
        3. Click Finish.

        The project appears in the Project Explorer view.

        - +
    diff --git a/org.tizen.training/html/native/process/debugging_app_n.htm b/org.tizen.training/html/native/process/debugging_app_n.htm index bd3419c..dff10a3 100644 --- a/org.tizen.training/html/native/process/debugging_app_n.htm +++ b/org.tizen.training/html/native/process/debugging_app_n.htm @@ -5,13 +5,13 @@ - + - Debugging Applications + Debugging Applications @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - +

    Content

    -
    +
    -

    Debugging Applications

    -

    Debugging your application enables you to understand its flow of control. With the Tizen Studio, you can use various application debugging methods. However, remember that the best way to debug an application is to not make bugs in the first place, so learn how to prevent bugs by using logs.

    -

    The debugging environment uses GDB (GNU Debugger) for debugging with the emulator and a target device. GDB can debug both locally and remotely. To ease the debugging process, you can set break points, step in, step out, and step over break points, and watch variables to track the changes in their values in the Debug view.

    -

    Debugging native applications with Tizen Studio is same as with Eclipse CDT. For more information, see Debugging in Eclipse.

    -

    Debug View

    -

    The Debug view provides debug control buttons that help you to track source code easily.

    - -

    You can control debug execution in various ways. After a break point suspends the program execution, you can step through your program or suspend the program by force. To control the execution, use the following control buttons in the Debug view.

    +

    Debugging Applications

    +

    Debugging your application enables you to understand its flow of control. With the Tizen Studio, you can use various application debugging methods. However, remember that the best way to debug an application is to not make bugs in the first place, so learn how to prevent bugs by using logs.

    +

    The debugging environment uses GDB (GNU Debugger) for debugging with the emulator and a target device. GDB can debug both locally and remotely. To ease the debugging process, you can set break points, step in, step out, and step over break points, and watch variables to track the changes in their values in the Debug view.

    +

    Debugging native applications with Tizen Studio is same as with Eclipse CDT. For more information, see Debugging in Eclipse.

    +

    Debug View

    +

    The Debug view provides debug control buttons that help you to track source code easily.

    + +

    You can control debug execution in various ways. After a break point suspends the program execution, you can step through your program or suspend the program by force. To control the execution, use the following control buttons in the Debug view.

    Table: Debug view control buttons

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    ButtonKeyboard shortcutDescription
    ResumeF8Resumes a suspended thread.
    Step IntoF5Steps into the highlighted statement.

    Executes the current line, and if the line contains a method, steps into the method.

    Step OverF6Steps over the highlighted statement.

    Executes the current line, and if the line contains a method, executes the method without entering it.

    Step ReturnF7Step out of the current method.
    Suspend-Suspends the selected thread.
    TerminateCtrl + F2Terminates the selected debug target.
    - -

    Application Debugging Methods

    -

    You can apply the normal or attached method for debugging a Tizen application.

    - -

    Normal Debugging

    -

    The normal debugging method is used to debug from start to finish an executable Tizen application, which can be run as a standalone. To debug the application:

    -
      -

    1. In the Project Explorer view, right-click the project and select Debug As > Tizen Native Application.

      Debugging starts.

      2. -

    2. To stop the program execution, select Run > Suspend in the Tizen Studio menu. The program can be stopped also by a break point you have set before debugging.

      3. -
    -

    You can debug the source code by, for example, checking variables, registers, and memory. You can also use the Step Over, Step In, and Resume buttons in the Debug view for step-by-step debugging actions.

    - -

    Attached Debugging

    -

    The attached debugging method is effective for debugging Tizen applications that have no external interaction with the UI, such as middle-ware and libraries. This method attaches the "GDB" debugger to an application which is running in a target.

    -

    If the Tizen Studio workspace has a project that contains the source code of the application currently running on the target, you can apply "attach debugging" at a source level.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    ButtonKeyboard shortcutDescription
    ResumeF8Resumes a suspended thread.
    Step IntoF5Steps into the highlighted statement.

    Executes the current line, and if the line contains a method, steps into the method.

    Step OverF6Steps over the highlighted statement.

    Executes the current line, and if the line contains a method, executes the method without entering it.

    Step ReturnF7Step out of the current method.
    Suspend-Suspends the selected thread.
    TerminateCtrl + F2Terminates the selected debug target.
    + +

    Application Debugging Methods

    +

    You can apply the normal or attached method for debugging a Tizen application.

    + +

    Normal Debugging

    +

    The normal debugging method is used to debug from start to finish an executable Tizen application, which can be run as a standalone. To debug the application:

    +
      +

    1. In the Project Explorer view, right-click the project and select Debug As > Tizen Native Application.

      Debugging starts.

      2. +

    2. To stop the program execution, select Run > Suspend in the Tizen Studio menu. The program can be stopped also by a break point you have set before debugging.

      3. +
    +

    You can debug the source code by, for example, checking variables, registers, and memory. You can also use the Step Over, Step In, and Resume buttons in the Debug view for step-by-step debugging actions.

    + +

    Attached Debugging

    +

    The attached debugging method is effective for debugging Tizen applications that have no external interaction with the UI, such as middle-ware and libraries. This method attaches the "GDB" debugger to an application which is running in a target.

    +

    If the Tizen Studio workspace has a project that contains the source code of the application currently running on the target, you can apply "attach debugging" at a source level.

    To debug an application that is already running on the emulator or a device:

    • In the Project Explorer view, right-click the project and select Debug As > Tizen Native Application - Attach.

      Note that the source code of the project must be related to the application that is running on the target.

    -

    Remote Debugging

    -

    The Tizen Studio supports remote debugging. Remote debugging is used to debug the OS Kernel or a system which cannot support local debugging. Remote debugging requires a "GDB client" on the host side and a "GDB server" on the target side. Both sides must be connected by serial or TCP/IP communication.

    -

    Figure: Remote debugging

    -

    Remote debugging

    -

    Remote Debugging Process

    -

    A cross remote debugging environment is used to support the armel architecture of the Tizen devices. This means that the "cross GDB" and "GDB server" are used instead of native GDB and GDB server. Tizen also supports native (i386) remote debugging for the i386 emulator.

    -

    The Eclipse CDT based Tizen Studio supports the UI and control of the debugging process. The following figure shows the control flow of the remote debugging process.

    -

    Figure: Remote debugging control flow

    -

    Remote debugging control flow

    - +

    Remote Debugging

    +

    The Tizen Studio supports remote debugging. Remote debugging is used to debug the OS Kernel or a system which cannot support local debugging. Remote debugging requires a "GDB client" on the host side and a "GDB server" on the target side. Both sides must be connected by serial or TCP/IP communication.

    +

    Figure: Remote debugging

    +

    Remote debugging

    +

    Remote Debugging Process

    +

    A cross remote debugging environment is used to support the armel architecture of the Tizen devices. This means that the "cross GDB" and "GDB server" are used instead of native GDB and GDB server. Tizen also supports native (i386) remote debugging for the i386 emulator.

    +

    The Eclipse CDT based Tizen Studio supports the UI and control of the debugging process. The following figure shows the control flow of the remote debugging process.

    +

    Figure: Remote debugging control flow

    +

    Remote debugging control flow

    +

    Debugging with Logs

    EFL provides a tool (EINA_LOG) for logging information. It has the following levels:

    @@ -144,7 +144,7 @@ export EINA_LOG_LEVEL=1 ERR<4268>:ecore ecore.c:558 _ecore_magic_fail() *** ECORE ERROR: Ecore Magic Check Failed!!! *** IN FUNCTION: ecore_idler_del() -ERR<4268>:ecore ecore.c:562 _ecore_magic_fail()   Input handle has already been freed! +ERR<4268>:ecore ecore.c:562 _ecore_magic_fail() Input handle has already been freed! ERR<4268>:ecore ecore.c:571 _ecore_magic_fail() *** NAUGHTY PROGRAMMER!!! *** SPANK SPANK SPANK!!! *** Now go fix your code. Tut tut tut! @@ -163,16 +163,16 @@ Ecore_Idler *myidler = ecore_idler_add(_idler_cb, data); static Eina_Bool _idler_cb(void *data) { -    myidler = NULL; + myidler = NULL; -    return ECORE_CALLBACK_CANCEL; + return ECORE_CALLBACK_CANCEL; }

    Similarly, if you use the ecore_idler_del() function, add myidler = NULL:

     if (myidler) {
-    ecore_idler_del(myidler);
-    myidler = NULL;
+    ecore_idler_del(myidler);
+    myidler = NULL;
 }
    @@ -182,9 +182,9 @@ if (myidler) { ERR<4266>:ecore ecore.c:558 _ecore_magic_fail() *** ECORE ERROR: Ecore Magic Check Failed!!! *** IN FUNCTION: ecore_idler_del() -ERR<4266>:ecore ecore.c:568 _ecore_magic_fail()   Input handle is wrong type -   Expected: f7c614f3 - Ecore_Idler (Idler) -   Supplied: 71737723 - <UNKNOWN> +ERR<4266>:ecore ecore.c:568 _ecore_magic_fail() Input handle is wrong type + Expected: f7c614f3 - Ecore_Idler (Idler) + Supplied: 71737723 - <UNKNOWN> ERR<4266>:ecore ecore.c:571 _ecore_magic_fail() *** NAUGHTY PROGRAMMER!!! *** SPANK SPANK SPANK!!! *** Now go fix your code. Tut tut tut! @@ -196,7 +196,7 @@ ERR<4266>:ecore ecore.c:571 _ecore_magic_fail() *** NAUGHTY PROGRAMMER!!!

    The elm_object_part_content_set() function is often used as follows:

     btn = elm_button_add(win)
-elm_object_part_content_set(btn, "hahaha", tmp);
+elm_object_part_content_set(btn, "hahaha", tmp);

    The following log is shown when the hahaha swallow part does not exist:

    @@ -222,107 +222,107 @@ ERR<4639>:evas_main lib/evas/canvas/evas_object_main.c:1313 _evas_object_c
 
     collections
 {
-   group
-   {
-      name: "circular_dependency";
-      parts
-      {
-         part
-         {
-            name: "bg";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               color: 255 255 255 255;
-            }
-         }
-         part
-         {
-            name: "part1";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               color: 127 0 0 127;
-               min: 100 100;
-               /* FIXME: Circular Dependency !! */
-               rel1.to: "part2";
-               rel2.to: "part2";
-            }
-         }
-         part
-         {
-            name: "part2";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               color: 0 0 127 127;
-               min: 100 100;
-               /* FIXME: Circular Dependency !! */
-               rel1.to: "part1";
-               rel2.to: "part1";
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "circular_dependency";
+      parts
+      {
+         part
+         {
+            name: "bg";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               color: 255 255 255 255;
+            }
+         }
+         part
+         {
+            name: "part1";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               color: 127 0 0 127;
+               min: 100 100;
+               /* FIXME: Circular Dependency !! */
+               rel1.to: "part2";
+               rel2.to: "part2";
+            }
+         }
+         part
+         {
+            name: "part2";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               color: 0 0 127 127;
+               min: 100 100;
+               /* FIXME: Circular Dependency !! */
+               rel1.to: "part1";
+               rel2.to: "part1";
+            }
+         }
+      }
+   }
 }
 
    
 
 
    If you write the EDC code like above, part1 is calculated by part2 and part2 is calculated by part1. The following log is shown because a recursive calculation has happened:
    
 
 
    -ERR<4365>:edje lib/edje/edje_calc.c:3144 _edje_part_recalc() Circular dependency when calculating part "part1". Already calculating XY [03] axes. Need to calculate Y [02] axes
+ERR<4365>:edje lib/edje/edje_calc.c:3144 _edje_part_recalc() Circular dependency when calculating part "part1". Already calculating XY [03] axes. Need to calculate Y [02] axes
 
    
 
 
  •  collections
 {
-   group
-   {
-      name: "fixed";
-      parts
-      {
-         part
-         {
-            name: "bg";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               color: 255 255 255 255;
-            }
-         }
-         part
-         {
-            name: "part1";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               color: 127 0 0 127;
-               min: 100 100;
-               /* FIXME: Ambiguous Size Setting */
-               rel1.to: "part2";
-               rel2.to: "part2";
-            }
-         }
-         part
-         {
-            name: "part2";
-            type: RECT;
-            description
-            {
-               state: "default" 0.0;
-               color: 0 0 127 127;
-               min: 50 50;
-               max: 50 50;
-               fixed: 1 1;
-            }
-         }
-      }
-   }
+   group
+   {
+      name: "fixed";
+      parts
+      {
+         part
+         {
+            name: "bg";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               color: 255 255 255 255;
+            }
+         }
+         part
+         {
+            name: "part1";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               color: 127 0 0 127;
+               min: 100 100;
+               /* FIXME: Ambiguous Size Setting */
+               rel1.to: "part2";
+               rel2.to: "part2";
+            }
+         }
+         part
+         {
+            name: "part2";
+            type: RECT;
+            description
+            {
+               state: "default" 0.0;
+               color: 0 0 127 127;
+               min: 50 50;
+               max: 50 50;
+               fixed: 1 1;
+            }
+         }
+      }
+   }
 }
 
    
 
@@ -332,15 +332,15 @@ collections
 ERR<4357>:edje lib/edje/edje_util.c:3069 _edje_object_size_min_restricted_calc() file, group fixed has a non-fixed part 'part1'. Adding 'fixed: 1 1;' to source EDC may help. Continuing discarding faulty part.
    • -

    Break Points

    -

    A break point suspends the execution of a program at the location where the break point is set.

    -

    To set or unset a break point, right-click in the marker bar area on the left side of the editor, and select Toggle Breakpoint.

    +

    Break Points

    +

    A break point suspends the execution of a program at the location where the break point is set.

    +

    To set or unset a break point, right-click in the marker bar area on the left side of the editor, and select Toggle Breakpoint.

    -

    You can view and manage the existing break points in the Breakpoints view:

    -
      -
    • To remove a break point, right-click it and select Remove.

      When you remove a break point, the corresponding icon is removed from the marker bar are in the editor too.

      • -
    • To enable or disable a break point, toggle the check box of the break point, or right-click the break point and select Enable or Disable.

      This allows you to temporarily disable a break point without losing the information it contains.

      • -
    +

    You can view and manage the existing break points in the Breakpoints view:

    +
      +
    • To remove a break point, right-click it and select Remove.

      When you remove a break point, the corresponding icon is removed from the marker bar are in the editor too.

      • +
    • To enable or disable a break point, toggle the check box of the break point, or right-click the break point and select Enable or Disable.

      This allows you to temporarily disable a break point without losing the information it contains.

      • +

    Break Point Properties

    You can set break point properties for actions that are executed along with the break point code.

    @@ -354,9 +354,9 @@ ERR<4357>:edje lib/edje/edje_util.c:3069 _edje_object_size_min_restricted_
  • Log Action

    You can see log messages in the Console view.

  • Resume Action

    The program execution continues after a specified time.

  • External Tool Action

    You can make your own action.

    • - + Click Attach after setting the action attributes. -
  • To define common properties where the break point stops, select Common in the left side menu. +
  • To define common properties where the break point stops, select Common in the left side menu.

    For example, you can specify a condition using an expression. The break point stops the execution only if the condition is matched. The Ignore count field defines the count where the break point stops.

    • @@ -371,58 +371,58 @@ ERR<4357>:edje lib/edje/edje_util.c:3069 _edje_object_size_min_restricted_

    Watch point details

    The added watch points are displayed in the Breakpoints view.

    To execute watch points, set the read/write access of the expression you want to watch. When running the application, the program breaks when the address of the expression is valid.

    - -

    Expressions View

    -

    The Expressions view allows you to evaluate the data related to expressions.

    -

    The Expressions view can be used in the following ways:

    -
      -
    • In the Expressions view: -
        -
      1. Right-click and select Add Watch Expression.
        2. -
      2. Type the expression that you want to evaluate.
        3. -
      • -
    • In the Variables view: -
        -
      1. Select the variable to watch.
        2. -
      2. Drag and drop it into the Expressions view.
        3. -
      • -
    -

    Figure: Expressions view

    -

    Expressions view

    - -

    Debugging Applications on the Emulator

    -

    You can debug Tizen native applications on the emulator using the Project Explorer view or the Tizen Studio menu.

    -

    To debug your application on the emulator:

    -
      -
    1. Start the emulator in the Connections view.
      2. -

    2. Start the debugging by doing one of the following:

      -
        -
      • In the Project Explorer view, right-click the project and select Debug As > Tizen Native Application.
        • -
      • In the Tizen Studio menu, go to Run > Debug As > Tizen Native Application.
        • -
      • On the Tizen Studio toolbar, click Debug.
        • -

      If the application binary does not exist, it is built automatically for the emulator.

      If many active emulator instances are connected, select the emulator to run the application from the dialog box.

      3. -

    3. The debug messages are displayed in the Tizen Studio Console view. To see the GDB console, in the Console view, click the Display Selected Console button and select the option containing gdb. With the GDB console, you can also execute GDB commands.

      To display verbose GDB output in the GDB console:

      + +

      Expressions View

      +

      The Expressions view allows you to evaluate the data related to expressions.

      +

      The Expressions view can be used in the following ways:

      +
        +
      • In the Expressions view: +
          +
        1. Right-click and select Add Watch Expression.
          2. +
        2. Type the expression that you want to evaluate.
          3. +
        • +
      • In the Variables view: +
          +
        1. Select the variable to watch.
          2. +
        2. Drag and drop it into the Expressions view.
          3. +
        • +
      +

      Figure: Expressions view

      +

      Expressions view

      + +

      Debugging Applications on the Emulator

      +

      You can debug Tizen native applications on the emulator using the Project Explorer view or the Tizen Studio menu.

      +

      To debug your application on the emulator:

      +
        +
      1. Start the emulator in the Connections view.
        2. +

      2. Start the debugging by doing one of the following:

        +
          +
        • In the Project Explorer view, right-click the project and select Debug As > Tizen Native Application.
          • +
        • In the Tizen Studio menu, go to Run > Debug As > Tizen Native Application.
          • +
        • On the Tizen Studio toolbar, click Debug.
          • +

        If the application binary does not exist, it is built automatically for the emulator.

        If many active emulator instances are connected, select the emulator to run the application from the dialog box.

        3. +

      3. The debug messages are displayed in the Tizen Studio Console view. To see the GDB console, in the Console view, click the Display Selected Console button and select the option containing gdb. With the GDB console, you can also execute GDB commands.

        To display verbose GDB output in the GDB console:

        • Right-click the Project Explorer view and select Debug As > Debug Configurations.
        • On the Remote tab, select the Show verbose messages in console check box.
        • Click Debug.
        4. -

      4. Use the application in the emulator as you would in a target device.

        +

      5. Use the application in the emulator as you would in a target device.

        While the application is running, the Tizen Studio Log view shows the log, debug, and exception messages from the methods defined in the log macros.

        6. - -

      6. To stop debugging, do one of the following:

        -
          -
        • In the Tizen Studio, in the Console or Debug view, click the Terminate button. If the application execution is not suspended before you click the Terminate button, touch an arbitrary control on the screen or press a hard key on the emulator after clicking Terminate.
          • -
        • On the emulator, press the End key.
          • -
        7. -
      -

      After debugging, run your application again to check its functionality and to ensure that the bugs detected during the debugging process are fixed.

      -

      In the emulator settings, you can change the display language settings, keyboard language settings, proxy address, and location settings. In addition, you can use the - Emulator Control Panel to generate application events (such as sensor data, incoming calls, or location data) for debugging and testing purposes.

      - - - + +

    4. To stop debugging, do one of the following:

      +
        +
      • In the Tizen Studio, in the Console or Debug view, click the Terminate button. If the application execution is not suspended before you click the Terminate button, touch an arbitrary control on the screen or press a hard key on the emulator after clicking Terminate.
        • +
      • On the emulator, press the End key.
        • +
      5. +
    +

    After debugging, run your application again to check its functionality and to ensure that the bugs detected during the debugging process are fixed.

    +

    In the emulator settings, you can change the display language settings, keyboard language settings, proxy address, and location settings. In addition, you can use the + Emulator Control Panel to generate application events (such as sensor data, incoming calls, or location data) for debugging and testing purposes.

    + + +
    diff --git a/org.tizen.training/html/native/process/performance_n.htm b/org.tizen.training/html/native/process/performance_n.htm index 33b897b..de74bbe 100644 --- a/org.tizen.training/html/native/process/performance_n.htm +++ b/org.tizen.training/html/native/process/performance_n.htm @@ -11,7 +11,7 @@ - Optimizing Application Performance + Optimizing Application Performance @@ -46,7 +46,7 @@

    Most processors that are used today in mobile phones are based on multi-core technologies and so you must consider utilizing this hardware feature. To effectively utilize multi-core capabilities, you need to divide your code to run on several cores simultaneously. Traditionally, this is done by using pthreads, but this method has an overhead of initialization and termination of threads, and can generate potential runtime errors. Several solutions exist to exploit multi-core capabilities easily. These solutions abstract pthreads, allowing you to focus on the application development without worrying about thread level management.

    To improve the performance of an application:

    -
      +
      1. Identify the bottlenecks which need to be optimized.
      2. Optimize the bottlenecks by code refactoring.
      3. Measure performance to compare refactoring gains.
        4. @@ -70,7 +70,7 @@

        A faster application can increase battery life. If your application is not as fast as expected, you can look at profiling data to identify bottlenecks. Fixing these bottlenecks increases the application speed with minimal effort.

        Some general tips to improve the performance of your application are:

        -
          +
          • Select the most appropriate algorithm and data structures.
          • High-level optimization is important, because it can change the order of complexity. If your code includes sort, search, or compare, use optimal algorithms and data structures.
          • Split a task, which contains both high and low priority jobs, to prevent low priority jobs delaying high priority jobs. Running high and low priority jobs in a single task causes delays.
            • @@ -93,9 +93,9 @@

            Running Dynamic Analyzer

            You can launch the Dynamic Analyzer in the Tizen Studio or as a standalone application from the Tizen Studio submenu.

            -
              +
              • To launch the Dynamic Analyzer in the Tizen Studio: -
                  +
                  1. Right-click your project in the Tizen Studio Project Explorer view.
                  2. Select Profile As > Profile with Dynamic Analyzer.

                    The selected project is built, packaged, and installed on the target device. The Dynamic Analyzer is launched and the profiling starts automatically.

                    @@ -103,7 +103,7 @@
                1. To run the Dynamic Analyzer as a standalone from the Tizen Studio submenu: -
                    +
                    1. Launch the Dynamic Analyzer from the Tizen Studio Tools > Dynamic Analyzer menu.
                    2. Select the target device and the application to be traced from the combo box in the Dynamic Analyzer toolbar.
                    3. Click the Start button.
                      4. @@ -116,7 +116,7 @@

                      Using the Command Line Interface to Access Dynamic Analyzer Features

                      The Dynamic Analyzer provides access to its features through the Command Line Interface (CLI) tool. This possibility can be useful, for example, in the following cases:

                      -
                        +
                        • CLI tool can be used in testing and profiling automation scenarios.
                        • CLI tool can be used in GUI-less environments, and the collected profile data can be transferred into other environment where it can be further analyzed with the Dynamic Analyzer GUI.
                        • CLI tool can be used by people who do not like to use graphical user interfaces at all.
                          • @@ -145,7 +145,7 @@

                          You can use the Dynamic Analyzer to analyze application performance and identify bottlenecks. After identifying bottlenecks, you can modify the code to eliminate them. That increases application performance significantly, and extends the battery life of the device running the application.

                          To analyze performance of the application with the Dynamic Analyzer, use the following features:

                          -
                            +
                            • Function profiling

                              When analyzing application performance, execution time of each method is one of the most significant factors. You can improve the performance of an application by identifying unexpected bottleneck locations, and analyzing and optimizing the most commonly used methods in the Dynamic Analyzer.

                              To detect and fix the methods consuming the most time:

                              @@ -172,7 +172,7 @@
                            • Thread load

                              If you use threads in your application code, you need to analyze the load of each thread during the application execution. The thread load feature helps to distribute the thread load. You can modify the code to optimize the thread load, while maintaining a single thread.

                              The thread load is displayed in the Thread tab. The thread line displayed in blue indicates the thread load within a time frame. The darker the color, the higher the load.

                              - +

                              Figure: Thread load

                              Thread load

                              • @@ -185,215 +185,215 @@

                              Understanding the thread execution in multi-threaded applications can be challenging. The GDB (GNU Debugger) supports the process of debugging multi-threaded applications, but since it uses synchronization objects, the debugging can be quite difficult. The Dynamic Analyzer, on the other hand, provides effective thread analysis features. For more information, see Performing Thread Analysis.

                              -

                              Valgrind Analysis

                              -

                              Valgrind helps you to detect memory errors or leaks in your application at runtime.

                              -

                              The following instructions and examples help you to use Valgrind effectively:

                              - - -

                              Running Valgrind

                              -

                              To set the Valgrind options for your application:

                              -
                                -
                              1. In the Project Explorer view, right-click the project and select Profile As > Profile Configurations.
                                2. -
                              2. In the Profile Configurations window, right-click the Profile with Valgrind and select New.
                                3. -
                              3. Select the created configuration.
                                4. -
                              4. Go to the Memory Profile Options > Collect data tab:

                                Select from 2 types of memory profiling settings:

                                -
                                  -
                                • Memory error and memory leak checking

                                  This option uses the Memcheck tool to profile your application.

                                  • -
                                • Heap memory profiling

                                  This option uses the Massif tool to profile your application. -

                                  • -
                                5. +

                                Valgrind Analysis

                                +

                                Valgrind helps you to detect memory errors or leaks in your application at runtime.

                                +

                                The following instructions and examples help you to use Valgrind effectively:

                                + + +

                                Running Valgrind

                                +

                                To set the Valgrind options for your application:

                                +
                                  +
                                1. In the Project Explorer view, right-click the project and select Profile As > Profile Configurations.
                                  2. +
                                2. In the Profile Configurations window, right-click the Profile with Valgrind and select New.
                                  3. +
                                3. Select the created configuration.
                                  4. +
                                4. Go to the Memory Profile Options > Collect data tab:

                                  Select from 2 types of memory profiling settings:

                                  +
                                    +
                                  • Memory error and memory leak checking

                                    This option uses the Memcheck tool to profile your application.

                                    • +
                                  • Heap memory profiling

                                    This option uses the Massif tool to profile your application. +

                                    • +

                                5. On the General setting tab, set the general Valgrind options. These options are used for both Memcheck and Massif profiling.

                                  -

                                  Figure: Memory error and memory leak data options

                                  -

                                  Memory error and memory leak data options

                                  -

                                  Table: General setting options

                                  - - - - - - - - - - - - +

                                  Figure: Memory error and memory leak data options

                                  +

                                  Memory error and memory leak data options

                                  +

                                  Table: General setting options

                                  +
                                  Option nameDescription
                                  trace children on execWhen enabled, Valgrind traces into sub-processes initiated through the exec system call. This is necessary for multi-project applications. Valgrind does trace into the child of a fork (it would be difficult not to, since fork makes an identical copy of a process), so this option is arguably badly named. However, most children of fork calls immediately call exec anyway.
                                  run __libc_freeres() on exit
                                  + + + + + + + + + + + - - - - - - - +

                                  The GNU C library (libc.so), which is used by all applications, can allocate memory for its own uses. Usually it does not free that memory when the application ends, since the Linux kernel reclaims all process resources when a process exits anyway. The glibc authors realized that this behavior causes leak checkers, such as Valgrind, to falsely report leaks in glibc, when a leak check is done at exit. In order to avoid this, they provided a routine called __libc_freeres() specifically to make glibc release all memory it has allocated. Memcheck therefore tries to run __libc_freeres() at exit. Unfortunately, in some very old versions of glibc, __libc_freeres() is sufficiently buggy to cause segmentation faults. This was particularly noticeable on Red Hat 7.1. So this option is provided in order to inhibit the run of __libc_freeres(). If your application seems to run fine on Valgrind, but segfaults at exit, disabling this option can fix the problem, although at the cost of possibly falsely reporting space leaks in libc.so.

                                  + + + + + + + - - - - - - - - - - - +

                                  The maximum value for this option is 50. Note that higher settings make Valgrind run more slowly and take more memory, but can be useful when working with applications with deeply-nested call chains.

                                  + + + + + + + + + + + - - - - - - -
                                  Option nameDescription
                                  trace children on execWhen enabled, Valgrind traces into sub-processes initiated through the exec system call. This is necessary for multi-project applications. Valgrind does trace into the child of a fork (it would be difficult not to, since fork makes an identical copy of a process), so this option is arguably badly named. However, most children of fork calls immediately call exec anyway.
                                  run __libc_freeres() on exit This option is only relevant when running Valgrind on Linux. -

                                  The GNU C library (libc.so), which is used by all applications, can allocate memory for its own uses. Usually it does not free that memory when the application ends, since the Linux kernel reclaims all process resources when a process exits anyway. The glibc authors realized that this behavior causes leak checkers, such as Valgrind, to falsely report leaks in glibc, when a leak check is done at exit. In order to avoid this, they provided a routine called __libc_freeres() specifically to make glibc release all memory it has allocated. Memcheck therefore tries to run __libc_freeres() at exit. Unfortunately, in some very old versions of glibc, __libc_freeres() is sufficiently buggy to cause segmentation faults. This was particularly noticeable on Red Hat 7.1. So this option is provided in order to inhibit the run of __libc_freeres(). If your application seems to run fine on Valgrind, but segfaults at exit, disabling this option can fix the problem, although at the cost of possibly falsely reporting space leaks in libc.so.

                                  demangle C++ namesAutomatic demangling (decoding) of C++ names is enabled by default. When enabled, Valgrind attempts to translate encoded C++ names back to something approaching the original. The demangler handles symbols mangled by g++ versions 2.X, 3.X, and 4.X. -

                                  An important fact about demangling is that method names mentioned in suppressions files must be in their mangled form. Valgrind does not demangle method names when searching for applicable suppressions, because to do otherwise would make suppression file contents dependent on the state of Valgrind's demangling machinery, and also slow down suppression matching.

                                  num callers in stack trace
                                  demangle C++ namesAutomatic demangling (decoding) of C++ names is enabled by default. When enabled, Valgrind attempts to translate encoded C++ names back to something approaching the original. The demangler handles symbols mangled by g++ versions 2.X, 3.X, and 4.X. +

                                  An important fact about demangling is that method names mentioned in suppressions files must be in their mangled form. Valgrind does not demangle method names when searching for applicable suppressions, because to do otherwise would make suppression file contents dependent on the state of Valgrind's demangling machinery, and also slow down suppression matching.

                                  num callers in stack trace This option specifies the maximum number of entries shown in stack traces that identify application locations. Errors are commoned up using only the top 4 method locations (the place in the current method, and that of its 3 immediate callers). So this does not affect the total number of errors reported. -

                                  The maximum value for this option is 50. Note that higher settings make Valgrind run more slowly and take more memory, but can be useful when working with applications with deeply-nested call chains.

                                  limit errors reportedWhen enabled, Valgrind stops reporting errors after 10,000,000 in total, or 1,000 different ones, have been seen. This is to stop the error tracking machinery from becoming a huge performance overhead in applications with many errors.
                                  show errors below mainBy default, stack traces for errors do not show any methods that appear beneath main(). Alternatively, if main() is not present in the stack trace, it does not show any methods below main()-like methods, such as glibc's __libc_start_main(). Furthermore, if main()-like methods are present in the trace, they are normalized (below main()), in order to make the output more deterministic. If this option is enabled, all stack trace entries are shown and main()-like methods are not normalized.
                                  max size of stack frame
                                  limit errors reportedWhen enabled, Valgrind stops reporting errors after 10,000,000 in total, or 1,000 different ones, have been seen. This is to stop the error tracking machinery from becoming a huge performance overhead in applications with many errors.
                                  show errors below mainBy default, stack traces for errors do not show any methods that appear beneath main(). Alternatively, if main() is not present in the stack trace, it does not show any methods below main()-like methods, such as glibc's __libc_start_main(). Furthermore, if main()-like methods are present in the trace, they are normalized (below main()), in order to make the output more deterministic. If this option is enabled, all stack trace entries are shown and main()-like methods are not normalized.
                                  max size of stack frame This option specifies the maximum size of a stack frame. If the stack pointer moves by more than this amount, Valgrind assumes that the application is switching to a different stack. -

                                  You can to use this option if your application has large stack-allocated arrays. Valgrind keeps track of your application's stack pointer. If it changes by more than the threshold amount, Valgrind assumes your application is switching to a different stack, and Memcheck behaves differently than it would for a stack pointer change smaller than the threshold. Usually this heuristic works well. However, if your application allocates large structures on the stack, this heuristic is fooled, and Memcheck subsequently reports large numbers of invalid stack accesses. This option allows you to change the threshold to a different value.

                                  -

                                  You must only consider the use of this option if Valgrind's debug output directs you to do so. In that case, it tells you the new threshold you must specify.

                                  -

                                  In general, allocating large structures on the stack is a bad idea, because you can easily run out of stack space, especially on systems with limited memory or which expect to support large numbers of threads each with a small stack, and also because the error checking performed by Memcheck is more effective for heap-allocated data than for stack-allocated data. If you have to use this option, consider rewriting your code to allocate on the heap rather than on the stack.

                                  suppressions fileThis option specifies an extra file from which to read descriptions of errors to suppress. You can use up to 100 extra suppression files.
                                  6. +

                                  You can to use this option if your application has large stack-allocated arrays. Valgrind keeps track of your application's stack pointer. If it changes by more than the threshold amount, Valgrind assumes your application is switching to a different stack, and Memcheck behaves differently than it would for a stack pointer change smaller than the threshold. Usually this heuristic works well. However, if your application allocates large structures on the stack, this heuristic is fooled, and Memcheck subsequently reports large numbers of invalid stack accesses. This option allows you to change the threshold to a different value.

                                  +

                                  You must only consider the use of this option if Valgrind's debug output directs you to do so. In that case, it tells you the new threshold you must specify.

                                  +

                                  In general, allocating large structures on the stack is a bad idea, because you can easily run out of stack space, especially on systems with limited memory or which expect to support large numbers of threads each with a small stack, and also because the error checking performed by Memcheck is more effective for heap-allocated data than for stack-allocated data. If you have to use this option, consider rewriting your code to allocate on the heap rather than on the stack.

                                  + + + suppressions file + This option specifies an extra file from which to read descriptions of errors to suppress. You can use up to 100 extra suppression files. + + +
                                6. On the Tool Advanced setting tab, set the advanced options. -

                                  The tab content depends on the selection you have made on the Collect data tab.

                                  +

                                  The tab content depends on the selection you have made on the Collect data tab.

                                  Table: Tool Advanced setting options for memory error and memory leak profiling

                                  - - - - - - - - - - - + + + + + + + + + + + - - - +

                                  For hardcore leak debugging, you probably want to use --leak-resolution=high together with --num-callers=40 or a similar large number. The --leak-resolution setting does not affect Memcheck's ability to find leaks. It only changes how the results are presented.

                                  + + + - - - - - - - +

                                  This option specifies the maximum total size, in bytes, of the blocks in the queue. The default value is 20 million bytes. Increasing this increases the total amount of memory used by Memcheck, but can result in the detection of invalid uses of freed blocks which would otherwise go undetected.

                                  + + + + + + + - - - - - - -
                                  Option nameDescription
                                  leak checkThis option, when enabled, searches for memory leaks when the client application finishes. If set to summary, it lists out how many leaks occurred. If set to full or yes, it also gives details of each individual leak.
                                  leak resolution
                                  Option nameDescription
                                  leak checkThis option, when enabled, searches for memory leaks when the client application finishes. If set to summary, it lists out how many leaks occurred. If set to full or yes, it also gives details of each individual leak.
                                  leak resolution When performing leak checks, this option determines how willing Memcheck is to consider different backtraces to be the same for the purposes of merging multiple leaks into a single leak report. When set to low, only the first 2 entries need match. When set to med, 4 entries have to match. When high, all entries need to match. -

                                  For hardcore leak debugging, you probably want to use --leak-resolution=high together with --num-callers=40 or a similar large number. The --leak-resolution setting does not affect Memcheck's ability to find leaks. It only changes how the results are presented.

                                  freelist size (blocks)
                                  freelist size (blocks) When the client application releases memory using free (in C) or delete (C++), that memory is not immediately made available for re-allocation. Instead, it is marked inaccessible and placed in a queue of freed blocks. The purpose is to defer as long as possible the point at which freed-up memory comes back into circulation. This increases the chance that Memcheck is able to detect invalid accesses to blocks for some significant period of time after they have been freed. -

                                  This option specifies the maximum total size, in bytes, of the blocks in the queue. The default value is 20 million bytes. Increasing this increases the total amount of memory used by Memcheck, but can result in the detection of invalid uses of freed blocks which would otherwise go undetected.

                                  show reachable blocksWhen disabled, the memory leak detector only shows "definitely lost" and "possibly lost" blocks. When enabled, the leak detector also shows "reachable" and "indirectly lost" blocks. It shows all blocks, except suppressed ones, so --show-all would be a better name for it.
                                  allow partial loads
                                  show reachable blocksWhen disabled, the memory leak detector only shows "definitely lost" and "possibly lost" blocks. When enabled, the leak detector also shows "reachable" and "indirectly lost" blocks. It shows all blocks, except suppressed ones, so --show-all would be a better name for it.
                                  allow partial loads This option controls how Memcheck handles word-sized, word-aligned loads from addresses for which some bytes are addressable and others are not. When set to yes, such loads do not produce an address error. Instead, loaded bytes originating from illegal addresses are marked as uninitialized, and those corresponding to legal addresses are handled in the normal way. -

                                  When set to no, loads from partially invalid addresses are treated the same as loads from completely invalid addresses, an illegal-address error is issued, and the resulting bytes are marked as initialized.

                                  The code that behaves in this way is in violation of the ISO C/C++ standards, and must be considered broken. If at all possible, such code must be fixed. This option must be used only as a last resort.

                                  undef value errorsThis option controls whether Memcheck reports uses of undefined value errors. If you do not want to see undefined value errors, set this to no. It also has the side effect of slightly speeding up Memcheck.
                                  +

                                  When set to no, loads from partially invalid addresses are treated the same as loads from completely invalid addresses, an illegal-address error is issued, and the resulting bytes are marked as initialized.

                                  The code that behaves in this way is in violation of the ISO C/C++ standards, and must be considered broken. If at all possible, such code must be fixed. This option must be used only as a last resort.

                                  + + + undef value errors + This option controls whether Memcheck reports uses of undefined value errors. If you do not want to see undefined value errors, set this to no. It also has the side effect of slightly speeding up Memcheck. + + +

                                  Table: Tool Advanced setting options for heap memory profiling

                                  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
                                  Option nameDescription
                                  profile heapThis option specifies whether heap profiling is done.
                                  administrative bytes per blockIf heap profiling is enabled, this option gives the number of administrative bytes per block to use. This must be an estimate of the average, since it can vary. For example, the allocator used by glibc on Linux requires somewhere between 4 to 15 bytes per block, depending on various factors. That allocator also requires admin space for freed blocks, but Massif cannot account for this.
                                  profile stackThis option specifies whether stack profiling must be done. This option slows Massif down greatly, and so is off by default. Massif assumes that the main stack has size zero at start-up. This is not true, but doing otherwise accurately is difficult. Furthermore, starting at zero better indicates the size of the part of the main stack that a user application actually has control over.
                                  allocation tree depthThe maximum depth of the allocation trees recorded for detailed snapshots. Increasing it makes Massif run somewhat more slowly, use more memory, and produce bigger output files.
                                  heap allocation thresholdThe significance threshold for heap allocations is a percentage of the total memory size. The allocation tree entries that account for less than this are aggregated. This must be specified in tandem with ms_print's option of the same name.
                                  allocation peak inaccuracyMassif does not necessarily record the actual global memory allocation peak. By default, it records a peak only when the global memory allocation size exceeds the previous peak by at least 1.0%. This is because there can be many local allocation peaks along the way, and doing a detailed snapshot for each is expensive and wasteful, as all but one of them are later discarded. This inaccuracy can be changed (even to 0.0%) through this option, but Massif runs drastically slower as the number approaches zero.
                                  time unitThis option specifies the time unit used for the profiling. There are 3 possibilities: -
                                    -
                                  • Instructions executed (i)

                                    Good for most cases

                                    • -
                                  • Real (wall clock) time (in milliseconds)

                                    It is useful sometimes

                                    • -
                                  • Bytes allocated/deallocated on the heap or stack (B)

                                    It is useful for very short-run programs, and for testing purposes, because it is the most reproducible across different machines.

                                    • -
                                  detailed snapshot frequencyThis option specifies the frequency of detailed snapshots. With --detailed-freq=1, every snapshot is detailed.
                                  max snapshotsThis option specifies the maximum number of snapshots recorded. If set to N, for all programs except very short-running ones, the final number of snapshots is between N/2 and N.
                                  minimum heap block alignmentBy default, Valgrind's malloc, realloc, and so on return a block whose starting address is 8-byte-aligned or 16-byte-aligned. The value depends on the platform and matches the platform default. This option allows you to specify a different alignment. The supplied value must be greater than or equal to the default, less than or equal to 4096, and must be a power of 2.
                                  allocation functionsMethods specified with this option are treated as though they were a heap allocation method, such as malloc. This is useful for methods that are wrappers to malloc or new, which can fill up the allocation trees with uninteresting information. This option can be specified multiple times on the command line, to name multiple methods.

                                  The named method is only treated this way if it is the top entry in a stack trace, or just below another method treated this way. For example, if you have a method malloc1 that wraps malloc, and malloc2 that wraps malloc1, just specifying --alloc-fn=malloc2 has no effect. You need to specify --alloc-fn=malloc1 as well. This is a little inconvenient, but the reason is that checking for allocation methods is slow, and it saves a lot of time if Massif can stop looking through the stack trace entries as soon as it finds one that does not match rather than having to continue through all the entries.

                                  7. -
                                7. To save the settings, click Apply.
                                  8. -
                                8. To run Valgrind, click Profile.
                                  9. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
                                  Option nameDescription
                                  profile heapThis option specifies whether heap profiling is done.
                                  administrative bytes per blockIf heap profiling is enabled, this option gives the number of administrative bytes per block to use. This must be an estimate of the average, since it can vary. For example, the allocator used by glibc on Linux requires somewhere between 4 to 15 bytes per block, depending on various factors. That allocator also requires admin space for freed blocks, but Massif cannot account for this.
                                  profile stackThis option specifies whether stack profiling must be done. This option slows Massif down greatly, and so is off by default. Massif assumes that the main stack has size zero at start-up. This is not true, but doing otherwise accurately is difficult. Furthermore, starting at zero better indicates the size of the part of the main stack that a user application actually has control over.
                                  allocation tree depthThe maximum depth of the allocation trees recorded for detailed snapshots. Increasing it makes Massif run somewhat more slowly, use more memory, and produce bigger output files.
                                  heap allocation thresholdThe significance threshold for heap allocations is a percentage of the total memory size. The allocation tree entries that account for less than this are aggregated. This must be specified in tandem with ms_print's option of the same name.
                                  allocation peak inaccuracyMassif does not necessarily record the actual global memory allocation peak. By default, it records a peak only when the global memory allocation size exceeds the previous peak by at least 1.0%. This is because there can be many local allocation peaks along the way, and doing a detailed snapshot for each is expensive and wasteful, as all but one of them are later discarded. This inaccuracy can be changed (even to 0.0%) through this option, but Massif runs drastically slower as the number approaches zero.
                                  time unitThis option specifies the time unit used for the profiling. There are 3 possibilities: +
                                    +
                                  • Instructions executed (i)

                                    Good for most cases

                                    • +
                                  • Real (wall clock) time (in milliseconds)

                                    It is useful sometimes

                                    • +
                                  • Bytes allocated/deallocated on the heap or stack (B)

                                    It is useful for very short-run programs, and for testing purposes, because it is the most reproducible across different machines.

                                    • +
                                  detailed snapshot frequencyThis option specifies the frequency of detailed snapshots. With --detailed-freq=1, every snapshot is detailed.
                                  max snapshotsThis option specifies the maximum number of snapshots recorded. If set to N, for all programs except very short-running ones, the final number of snapshots is between N/2 and N.
                                  minimum heap block alignmentBy default, Valgrind's malloc, realloc, and so on return a block whose starting address is 8-byte-aligned or 16-byte-aligned. The value depends on the platform and matches the platform default. This option allows you to specify a different alignment. The supplied value must be greater than or equal to the default, less than or equal to 4096, and must be a power of 2.
                                  allocation functionsMethods specified with this option are treated as though they were a heap allocation method, such as malloc. This is useful for methods that are wrappers to malloc or new, which can fill up the allocation trees with uninteresting information. This option can be specified multiple times on the command line, to name multiple methods.

                                  The named method is only treated this way if it is the top entry in a stack trace, or just below another method treated this way. For example, if you have a method malloc1 that wraps malloc, and malloc2 that wraps malloc1, just specifying --alloc-fn=malloc2 has no effect. You need to specify --alloc-fn=malloc1 as well. This is a little inconvenient, but the reason is that checking for allocation methods is slow, and it saves a lot of time if Massif can stop looking through the stack trace entries as soon as it finds one that does not match rather than having to continue through all the entries.

                                  +
                                9. To save the settings, click Apply.
                                  10. +
                                10. To run Valgrind, click Profile.
                                - -

                                Viewing Valgrind Result

                                -

                                After the memory profiling is terminated, you can view the profiling results.

                                -

                                Memory Error and Leak Results

                                -

                                The memory error table displays memory leaks that occurred during the profiling process:

                                - -
                                  -
                                • Memory error or Memory leak: Error or leak type
                                  • -
                                • Function name: Location where the error occurred
                                  • -
                                • Sizes: Memory size of the error
                                  • -
                                • Address: Code memory address
                                  • -
                                • Location: Source or executable path, or library path, where the error occurred
                                  • + +

                                  Viewing Valgrind Result

                                  +

                                  After the memory profiling is terminated, you can view the profiling results.

                                  +

                                  Memory Error and Leak Results

                                  +

                                  The memory error table displays memory leaks that occurred during the profiling process:

                                  + +
                                    +
                                  • Memory error or Memory leak: Error or leak type
                                    • +
                                  • Function name: Location where the error occurred
                                    • +
                                  • Sizes: Memory size of the error
                                    • +
                                  • Address: Code memory address
                                    • +
                                  • Location: Source or executable path, or library path, where the error occurred
                                  • pid: Process ID
                                    • -
                                  • tid: Thread ID

                                    • -
                                  -

                                  If you expand an error entry, you can see the callstack of the method.

                                  -

                                  Heap Memory Profiling Results

                                  -

                                  The heap memory profiling table displays the heap memory consumed and allocated during the profiling process:

                                  -
                                    -
                                  • Snapshot: Index number of the snapshot
                                    • -
                                  • Time (i): Number of instructions being executed
                                    • -
                                  • Total (B): Total heap memory consumption byte size
                                    • -
                                  • Useful Heap (B): Size of the heap memory used by the program
                                    • -
                                  • Extra Heap (B): Size of the heap memory allocated in excess of what the program is using. The source of the extra heap memory is: -
                                      -
                                    • Administrative bytes of the heap memory block
                                      • -
                                    • Aligned bytes of the requested memory size
                                      • -
                                    • -
                                  • Stack (B): Size of the stacks. By default, stack profiling is disabled as it slows profiling. It is enabled using the profile stack option.
                                    • -
                                  -

                                  Figure: Heap memory profiling results

                                  +
                                • tid: Thread ID

                                  • +
                                +

                                If you expand an error entry, you can see the callstack of the method.

                                +

                                Heap Memory Profiling Results

                                +

                                The heap memory profiling table displays the heap memory consumed and allocated during the profiling process:

                                +
                                  +
                                • Snapshot: Index number of the snapshot
                                  • +
                                • Time (i): Number of instructions being executed
                                  • +
                                • Total (B): Total heap memory consumption byte size
                                  • +
                                • Useful Heap (B): Size of the heap memory used by the program
                                  • +
                                • Extra Heap (B): Size of the heap memory allocated in excess of what the program is using. The source of the extra heap memory is: +
                                    +
                                  • Administrative bytes of the heap memory block
                                    • +
                                  • Aligned bytes of the requested memory size
                                    • +
                                  • +
                                • Stack (B): Size of the stacks. By default, stack profiling is disabled as it slows profiling. It is enabled using the profile stack option.
                                  • +
                                +

                                Figure: Heap memory profiling results

                                Heap memory profiling results

                                - -

                                A snapshot with a green icon in front has a heap tree with a callstack. Double-click the entry to see the callstack details.

                                + +

                                A snapshot with a green icon in front has a heap tree with a callstack. Double-click the entry to see the callstack details.

                                For information on executing Valgrind on the command line interface, see the Valgrind User Manual.

                                Managing Results

                                -

                                To save a Valgrind profiling result, click Save file on the Valgrind result view toolbar.

                                +

                                To save a Valgrind profiling result, click Save file on the Valgrind result view toolbar.

                                -

                                To load a saved Valgrind result file, select File > Open File in the Tizen Studio menu.

                                +

                                To load a saved Valgrind result file, select File > Open File in the Tizen Studio menu.

                                diff --git a/org.tizen.training/html/native/process/running_app_n.htm b/org.tizen.training/html/native/process/running_app_n.htm index 22ce19f..e561441 100644 --- a/org.tizen.training/html/native/process/running_app_n.htm +++ b/org.tizen.training/html/native/process/running_app_n.htm @@ -5,68 +5,68 @@ - + - Running Applications + Running Applications
                                -
                                +

    Mobile native Wearable native

    -

    Running Applications

    -

    You can run Tizen native applications on the emulator using the Project Explorer view or the Tizen Studio menu.

    -

    To run your application on the emulator:

    -
      +

      Running Applications

      +

      You can run Tizen native applications on the emulator using the Project Explorer view or the Tizen Studio menu.

      +

      To run your application on the emulator:

      +

      1. Before you run the application, you must sign your application package by generating an author certificate and registering it in the Tizen Studio.

        If you have already registered your certificate in the Tizen Studio, the signature is generated automatically while running your application.

        2. -
      2. Start the emulator in the Connections view.
        3. -

      3. Start the run by doing one of the following:

        -
          -
        • In the Project Explorer view, right-click the project and select Run As > Tizen Native Application.
          • -
        • In the Tizen Studio menu, go to Run > Run As > Tizen Native Application.
          • -
        • On the Tizen Studio toolbar, click Run.
          • -

        If the application binary does not exist, it is built automatically for the emulator.

        -

        If many active emulator instances are connected, select the emulator to run the application from the dialog box.

        4. -

      4. Use the application in the emulator as you would in a target device.

        -

        While the application is running, the Tizen Studio Log view shows the log, debug, and exception messages from the methods defined in the log macros.

        5. -

      5. To terminate the run, exit the application on the emulator.

        6. -
      -

      In the emulator settings, you can change the display language settings, keyboard language settings, proxy address, and location settings. In addition, you can use the Event Injector view to generate application events (such as sensor data, incoming calls, or location data) for debugging and testing purposes.

      +
    1. Start the emulator in the Connections view.
      2. +

    2. Start the run by doing one of the following:

      +
        +
      • In the Project Explorer view, right-click the project and select Run As > Tizen Native Application.
        • +
      • In the Tizen Studio menu, go to Run > Run As > Tizen Native Application.
        • +
      • On the Tizen Studio toolbar, click Run.
        • +

      If the application binary does not exist, it is built automatically for the emulator.

      +

      If many active emulator instances are connected, select the emulator to run the application from the dialog box.

      3. +

    3. Use the application in the emulator as you would in a target device.

      +

      While the application is running, the Tizen Studio Log view shows the log, debug, and exception messages from the methods defined in the log macros.

      4. +

    4. To terminate the run, exit the application on the emulator.

      5. +
    +

    In the emulator settings, you can change the display language settings, keyboard language settings, proxy address, and location settings. In addition, you can use the Event Injector view to generate application events (such as sensor data, incoming calls, or location data) for debugging and testing purposes.

    -

    Rapid Development Support

    -

    Rapid Development Support (RDS) lets you develop a Tizen application rapidly by saving deployment time.

    -

    When using RDS, the application is first launched normally. After the first launch, the packaging process is skipped and only modified, added, and deleted files are installed in the target. If an error occurs while launching, the normal mode is executed.

    -

    To launch the application in the normal mode:

    -
      -
    1. Package the application.
      2. -
    2. Transfer the packaged file to the target.
      3. -
    3. Install the packaged file in the target. If the application is already installed, uninstall it before the installation.
      4. -
    -

    To launch the application in the RDS mode:

    -
      -
    1. Search for the delta files (changed, added, and deleted files).
      2. -
    2. Transfer the delta files to the target.
      3. -
    3. If the tizen-manifest.xml file has been modified, execute directory installation.
      4. -
    -

    The RDS option is enabled as default. To disable it, in the Tizen Studio, go to Window > Preferences > Tizen Studio > Rapid Development Support.

    +

    Rapid Development Support

    +

    Rapid Development Support (RDS) lets you develop a Tizen application rapidly by saving deployment time.

    +

    When using RDS, the application is first launched normally. After the first launch, the packaging process is skipped and only modified, added, and deleted files are installed in the target. If an error occurs while launching, the normal mode is executed.

    +

    To launch the application in the normal mode:

    +
      +
    1. Package the application.
      2. +
    2. Transfer the packaged file to the target.
      3. +
    3. Install the packaged file in the target. If the application is already installed, uninstall it before the installation.
      4. +
    +

    To launch the application in the RDS mode:

    +
      +
    1. Search for the delta files (changed, added, and deleted files).
      2. +
    2. Transfer the delta files to the target.
      3. +
    3. If the tizen-manifest.xml file has been modified, execute directory installation.
      4. +
    +

    The RDS option is enabled as default. To disable it, in the Tizen Studio, go to Window > Preferences > Tizen Studio > Rapid Development Support.

    Note Currently, this option is not supported in multi-app projects.
    - - - + + +
    diff --git a/org.tizen.training/html/native/process/setting_properties_n.htm b/org.tizen.training/html/native/process/setting_properties_n.htm index de398e1..edcb24d 100644 --- a/org.tizen.training/html/native/process/setting_properties_n.htm +++ b/org.tizen.training/html/native/process/setting_properties_n.htm @@ -5,13 +5,13 @@ - + - Setting Project Properties + Setting Project Properties @@ -20,7 +20,7 @@

    Mobile native Wearable native

    - + -
    +
    -

    Setting Project Properties

    +

    Setting Project Properties

    Before you implement the actual application functionality, define all the necessary properties for your application project:

    - + - +

    After you have finished setting the project properties, you are ready to design the UI and implement the application code.

    - -

    Checking API and Privilege Usage

    -

    You can check the source code in your project for any violation of API and privilege usage. To enable the non-default checks (the default checks are always performed):

    + +

    Checking API and Privilege Usage

    +

    You can check the source code in your project for any violation of API and privilege usage. To enable the non-default checks (the default checks are always performed):

      -

    1. In the Properties window, select C/C++ Build > Tizen Settings > API and Privilege Checker Properties.

      2. +

    2. In the Properties window, select C/C++ Build > Tizen Settings > API and Privilege Checker Properties.

    3. -

      Select the required checks in the Privilege Check panel.

      4. +

      Select the required checks in the Privilege Check panel.

    -

    To perform the usage checks automatically during specific tasks, select the required option in the Launching panel:

    +

    To perform the usage checks automatically during specific tasks, select the required option in the Launching panel:

    • During the build process, select the Run API and privilege checks with build option.
      • -
    • During code editing, select the Run API and privilege checks while editing option.
      • +
    • During code editing, select the Run API and privilege checks while editing option.

    You can also perform the usage checks manually after building the application, by right-clicking the project in the Project Explorer view and selecting Check API and Privilege Violations With Build. The results are displayed in the Problems view.

    @@ -73,7 +73,7 @@ If the application has conflicting API versions, the build fails and the results are displayed in the Problems view.
    -

    Setting the Application Manifest

    +

    Setting the Application Manifest

    The application manifest consists of application information, such as package, version, features, and privileges, which are available for the application. To configure the application information in the manifest editor, double-click the application tizen-manifest.xml file in the Project Explorer view.

    Figure: Setting the application manifest

    @@ -83,19 +83,19 @@

    Defining and Editing General Information in the Overview Tab

    -

    You can set and edit general and project-related information about the application, such as application package, version, author, and description, in the Overview tab of the manifest editor.

    -

    You can perform the following tasks using the Overview tab:

    +

    You can set and edit general and project-related information about the application, such as application package, version, author, and description, in the Overview tab of the manifest editor.

    +

    You can perform the following tasks using the Overview tab:

    • View the application ID.

      The Tizen Studio creates automatically an application ID, which uniquely identifies the application within the package.

    • Set the package name of the application.

      The package name represents the package identifier of the application

    • Set the application version (x.y.z).

      The application version format has the following constraints: 0 ≤ {x, y} ≤ 255, 0 ≤ z ≤ 65535. You can change the application version in the Version field.

      • -
    • Set the API version.

      The API version format is "x.y.z".

      • +
    • Set the API version.

      The API version format is "x.y.z".

    • Set the application label.

      The application label represents the name of the application.

    • View the application executable file path.
      • -
    • Add an application icon.

      You can add a launcher icon to your application by defining it in the Icon panel. If your application supports both HD and WVGA, it is best to provide an icon for HD for better image quality in both cases.

      +
    • Add an application icon.

      You can add a launcher icon to your application by defining it in the Icon panel. If your application supports both HD and WVGA, it is best to provide an icon for HD for better image quality in both cases.

      The following table describes the available icons.

      - -

      Table: Application icons

      + +

      Table: Application icons

      @@ -104,41 +104,41 @@ - + - - - - + + + + - - - + + + - - - - - + + + + + - - - - - - + + + + + +
      ProfileMandatoryFormatSizeDescriptionMandatoryFormatSizeDescription
      Xhigh (HD)High (WVGA)
      Xhigh (HD)High (WVGA)
      MobileYes32-bit PNG with alpha117 x 117 pixels78 x 78 pixelsImage displayed in the main menu.Yes32-bit PNG with alpha117 x 117 pixels78 x 78 pixelsImage displayed in the main menu.
      WearableYes32-bit PNG with alpha152 x 152 pixelsImage displayed in the main menu.
      WearableYes32-bit PNG with alpha152 x 152 pixelsImage displayed in the main menu.
      -
      • +
    • Set the application author.

      The application author represents the creator of the Tizen native application package. You can set the name, email ID, and Web site of the author.

      -
      • +
    • Set the application description.

      The application description represents the human-readable description of the Tizen native application package.

      • @@ -147,8 +147,8 @@

      Declaring Required Software or Hardware Features in the Features Tab

      You can declare any device software or hardware features that your application requires to run properly. The declaration can be used for application filtering in the Tizen Store.

      - -

      To enable filtering for your native application:

      + +

      To enable filtering for your native application:

      1. In the Features tab, click +.
      2. Select a feature from the predefined list of features available for filtering. @@ -156,38 +156,38 @@
      3. Click OK.
      4. Upload and publish the application package on the Tizen Store. -

        If a Tizen-powered device requests applications, the store displays a list containing only applications compatible with the user's device.

        -
        5. +

        If a Tizen-powered device requests applications, the store displays a list containing only applications compatible with the user's device.

        +

      After setting the feature information with the manifest editor, you can see the added code in the Source tab:

      -<feature name="http://tizen.org/feature/network.nfc">true</feature>
+<feature name="http://tizen.org/feature/network.nfc">true</feature>

      Specifying Privileges in the Privileges Tab

      -

      You can use features and services provided by privileged APIs, which handle platform and user-sensitive data. You can specify a privilege in the Privileges tab of the manifest editor.

      -

      To add a privilege:

      -
        -
      1. In the Privileges tab, click +.
        2. +

        You can use features and services provided by privileged APIs, which handle platform and user-sensitive data. You can specify a privilege in the Privileges tab of the manifest editor.

        +

        To add a privilege:

        +
          +
        1. In the Privileges tab, click +.
        2. Select a privilege from the predefined list of available API privileges.
        3. Click OK.
        - +

        After setting the privilege information with the manifest editor, you can see the added code in the Source tab:

         <privileges>
-   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
+   <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
 </privileges>

        Adding Localized Application Details in the Localization Tab

        -

        You can provide localized versions of the application name (label) and description in the Localization tab of the manifest editor.

        +

        You can provide localized versions of the application name (label) and description in the Localization tab of the manifest editor.

        To add a localized name or description:

          @@ -195,13 +195,13 @@

          The following example shows the setting in the tizen-manifest.xml file code:

          -<label xml:lang="en-us">This is a sample</label>
+<label xml:lang="en-us">This is a sample</label>
        • In the Description panel, click +. Select the language, define the application description text for that language, and click OK.

          The following example shows the setting in the tizen-manifest.xml file code:

          -<description xml:lang="en-us">This is a sample</description>
+<description xml:lang="en-us">This is a sample</description>
        @@ -211,14 +211,14 @@

        Defining Advanced Features in the Advanced Tab

        -

        You can define advanced application features, such as metadata and data and application control functionalities, account, and miscellaneous options, in the Advanced tab of the manifest editor.

        -

        You can perform the following tasks using the Advanced tab:

        +

        You can define advanced application features, such as metadata and data and application control functionalities, account, and miscellaneous options, in the Advanced tab of the manifest editor.

        +

        You can perform the following tasks using the Advanced tab:

          -
        • Add metadata.

          In the Meta Data section, you can add user-defined key-value pairs to the application to be used for filtering in the package manager.

          • -
        • Export data control functionality. -

          A service application can act as a service provider and allow other applications to access specific data.

          -

          To define the kind of access and data your service application provides to other applications, click + in the Data Control section, and define the data control details.

          • -
        • Set miscellaneous options. +
        • Add metadata.

          In the Meta Data section, you can add user-defined key-value pairs to the application to be used for filtering in the package manager.

          • +
        • Export data control functionality. +

          A service application can act as a service provider and allow other applications to access specific data.

          +

          To define the kind of access and data your service application provides to other applications, click + in the Data Control section, and define the data control details.

          • +
        • Set miscellaneous options.

          In the Miscellaneous Options section, you can set various application options:

          • Manage task @@ -229,55 +229,55 @@

            Define whether hardware acceleration is enabled for the application.

          • Launch Mode

            Define the launch mode of the application (whether the application is launched as a main or sub application, or whether a caller application defines the launch mode when the application is launched by an application control request).

            • -
          -
          • +
        +
      2. Define application controls.

        You can export the application control functionality of your application.

        -

        To define an application control used to access the functionality of your application, click + in the Application Control section.

        -

        Each application control can have multiple operation, MIME type, and URI attributes.

        3. +

        To define an application control used to access the functionality of your application, click + in the Application Control section.

        +

        Each application control can have multiple operation, MIME type, and URI attributes.

      3. Add accounts (in mobile applications only).

        Account providers, such as Google and Facebook, represent specific service provider-related information or protocol that provides user accounts. To add, update, or remove accounts, you must register a specific account provider in your application.

        To register an account provider, click + in the Account section and define the account provider information, as described in the following table.

        -

        Table: Account provider properties

        +

        Table: Account provider properties

        - - - + + + - + +bool + - + +String + - + +String + - + +String + - + +String + - + +String + - - - + + + +
        Account propertyData typeProperty typeAccount propertyData typeProperty type
        Multiple accountMultiple account -bool

        Indicates whether multiple accounts are supported.

        This is a mandatory property.

        -
        Provider IDProvider ID -String

        ID of the account provider.

        -
        Default labelDefault label -String

        Display name of the account provider.

        This is a mandatory property.

        -
        IconsIconIcon -String

        File path of the account provider icon.

        The icon size is:

          @@ -286,12 +286,12 @@

        Since the icon is used in Settings > Accounts, place the icon in a shared directory.

        This is a mandatory property.

        -
        Icon smallIcon small -String

        File path of the account provider icon.

        The icon size is:

          @@ -300,56 +300,56 @@

        Since the small icon is used in other applications, place the icon in a shared directory.

        This is a mandatory property.

        -
        NameName -String

        Localization support for the display name.

        To add a localized name, click + in the Name panel, select the language, define the display name for that language, and click OK.

        -
        CapabilitiesString
        CapabilitiesString

        Capability of the account provider.

        -

        Capabilities are defined in the http://<VENDOR_INFORMATION>/accounts/capability/<NAME> IRI format.

        The following predefined capabilities can be used in Tizen:

        +

        Capabilities are defined in the http://<VENDOR_INFORMATION>/accounts/capability/<NAME> IRI format.

        The following predefined capabilities can be used in Tizen:

        • http://tizen.org/account/capability/calendar

          Used when the account is related to a calendar.

          -
          • +
        • http://tizen.org/account/capability/contact

          Used when the account is related to contacts.

          -
          • +
        • http://tizen.org/account/capability/document

          Used when the account is related to a document.

        • http://tizen.org/account/capability/email

          Used when the account is related to email.

          -
          • +
        • http://tizen.org/account/capability/game

          Used when the account is related to a game.

          -
          • +
        • http://tizen.org/account/capability/message

          Used when the account is related to a message.

          -
          • +
        • http://tizen.org/account/capability/music

          Used when the account is related to music.

          -
          • +
        • http://tizen.org/account/capability/photo

          Used when the account is related to a photo.

          -
          • +
        • http://tizen.org/account/capability/video

          Used when the account is related to a video.

          -
          • +

        To add a capability, click + in the Capabilities panel. A default capability is added to the table. Click the default capability and change it to the one you need.

        This is an optional property.

        -
        @@ -358,7 +358,7 @@
      4. Add the background category type (since Tizen 2.4).

        You can describe the background category of your Tizen native application.

        To add background category types to allow running on the background, click + in the Background Category panel, select the category type, and click OK.

      5. Add shortcuts.

        To add a shortcut for the application, click + in the Shortcut List panel and define the shortcut details, as described in the following table.

        - +

        Table: Shortcut properties

        @@ -399,10 +399,10 @@ - + -

        Localization support for the display name.

        To add a localized name, click + in the Name panel, select the language, define the display name for that language, and click OK.
        - + +
    @@ -410,7 +410,7 @@

    The Source tab of the manifest editor shows the code of the tizen-manifest.xml file. You can edit the basic syntax of the XML document and also see how changes made on the other tabs are reflected in the raw XML source content.

    - +
    Note If you edit application information manually in the tizen-manifest.xml file source code, you can introduce errors preventing the application from running normally. @@ -418,7 +418,7 @@ - +
    diff --git a/org.tizen.training/html/native/wearable/first_app_wn.htm b/org.tizen.training/html/native/wearable/first_app_wn.htm index b57a5d2..b3f91d7 100644 --- a/org.tizen.training/html/native/wearable/first_app_wn.htm +++ b/org.tizen.training/html/native/wearable/first_app_wn.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Wearable Native Application + Creating Your First Tizen Wearable Native Application @@ -25,7 +25,7 @@
  • Creating a Project
  • Building Your Application
  • Running Your Application
    • -
  • Building a Simple UI
    • +
  • Building a Simple UI

    • Related Info

    -
    +

    Creating Your First Tizen Wearable Native Application

    @@ -173,7 +173,7 @@

    For more information about configuring the application, see Setting the Application Manifest.

    - +

    Building Your Application

    After you have created the application project, you can implement the required features. In this example, only the default features from the project template are used, and no code changes are required.

    @@ -214,7 +214,7 @@

    After you have built the application, run it.

    - +

    Running Your Application

    You can run the application on the emulator or a real target device.

    @@ -252,12 +252,12 @@
  • Click the run icon in the toolbar.

    • If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

    -

    Selecting the emulator to use

    +

    Selecting the emulator to use

  • Confirm that the application launches on the emulator.

    Application running in the emulator

    - +
    Note If the emulator display has switched off, you cannot see the application launch. To switch the display on, click the Power key (in the right bottom corner of the emulator). @@ -325,7 +325,7 @@
  • Run the application:
    1. In the Connection Explorer view, select the device.
      2. -
    2. In Project Explorer view, right-click the project and select Run As > Tizen Native Application. +
    3. In Project Explorer view, right-click the project and select Run As > Tizen Native Application.

      Run the application on a target device

      @@ -335,13 +335,13 @@

      If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

      -

      Selecting the device to use

      +

      Selecting the device to use

    4. Confirm that the application launches in the target device.
    - +
    Note The application is launched using the default debug run configuration. To create and use another configuration: @@ -351,21 +351,21 @@

    Run Configurations window

    • - -

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    + +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    Building a Simple UI

    The following steps demonstrate how to create a simple user interface for a circular wearable device using EFL. The following figure shows the screen you can create with these instructions.

    - -

    Figure: Wearable native UI

    -

    Wearable native UI

    + +

    Figure: Wearable native UI

    +

    Wearable native UI

    This guide consists of the following:

      -
    1. Defining the data structure
      2. +
    2. Defining the data structure
    3. Registering life-cycle callbacks
    4. Creating UI objects
    @@ -376,9 +376,9 @@ 
     struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label;
 };
 typedef struct appdata appdata_s;
    @@ -387,11 +387,11 @@ typedef struct appdata appdata_s;

    The main() function has callbacks that manage specific parts of the application life-cycle:

      -
    • app_create +
    • app_create
      • Called when the application process starts.
      • Used to create UI components.
      • -
    • app_terminate +
    • app_terminate
      • Called while the application process is terminating.
      • Called after the main loop quits.
      • @@ -401,7 +401,7 @@ typedef struct appdata appdata_s;
    • app_pause (UI applications only)
      • Called when the application window is totally hidden.
      • -
    • app_control +
    • app_control
      • Called after the app_create callback when the process starts or called when a launch request is received while the process is running.
      • Can receive app_control data (parameters for launching the application).
      • Used to implement parameter-specific actions of the application.
        • @@ -411,22 +411,22 @@ typedef struct appdata appdata_s; int main(int argc, char *argv[]) { -    appdata_s ad = {0,}; -    int ret = 0; -    ui_app_lifecycle_callback_s event_callback = {0,}; -    app_event_handler_h handlers[5] = {NULL,}; - -    event_callback.create = app_create; -    event_callback.terminate = app_terminate; -    event_callback.pause = app_pause; -    event_callback.resume = app_resume; -    event_callback.app_control = app_control; - -    ret = ui_app_main(argc, argv, &event_callback, &ad); -    if (ret != APP_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "app_main() failed. Err=%d", ret); - -    return ret; + appdata_s ad = {0,}; + int ret = 0; + ui_app_lifecycle_callback_s event_callback = {0,}; + app_event_handler_h handlers[5] = {NULL,}; + + event_callback.create = app_create; + event_callback.terminate = app_terminate; + event_callback.pause = app_pause; + event_callback.resume = app_resume; + event_callback.app_control = app_control; + + ret = ui_app_main(argc, argv, &event_callback, &ad); + if (ret != APP_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "app_main() failed. Err=%d", ret); + + return ret; } @@ -437,17 +437,17 @@ main(int argc, char *argv[]) static bool app_create(void *data) { -    /* -     Hook to take necessary actions before the main event loop starts -     Initialize UI resources and application data -     If this function returns true, the application main loop starts -     If this function returns false, the application is terminated -    */ -    appdata_s *ad = data; + /* + Hook to take necessary actions before the main event loop starts + Initialize UI resources and application data + If this function returns true, the application main loop starts + If this function returns false, the application is terminated + */ + appdata_s *ad = data; -    create_base_gui(ad); + create_base_gui(ad); -    return true; + return true; } @@ -457,34 +457,34 @@ app_create(void *data) static void create_base_gui(appdata_s *ad) { -    /* Window */ -    ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); -    elm_win_autodel_set(ad->win, EINA_TRUE); - -    if (elm_win_wm_rotation_supported_get(ad->win)) { -        int rots[4] = {0, 90, 180, 270}; -        elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); -    } - -    evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); -    eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); - -    /* Conformant */ -    ad->conform = elm_conformant_add(ad->win); -    elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); -    elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE); -    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(ad->win, ad->conform); -    evas_object_show(ad->conform); - -    /* Label */ -    ad->label = elm_label_add(ad->conform); -    elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>"); -    evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_object_content_set(ad->conform, ad->label); - -    /* Show the window after the base GUI is set up */ -    evas_object_show(ad->win); + /* Window */ + ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); + elm_win_autodel_set(ad->win, EINA_TRUE); + + if (elm_win_wm_rotation_supported_get(ad->win)) { + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + } + + evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); + eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad); + + /* Conformant */ + ad->conform = elm_conformant_add(ad->win); + elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW); + elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE); + evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(ad->win, ad->conform); + evas_object_show(ad->conform); + + /* Label */ + ad->label = elm_label_add(ad->conform); + elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>"); + evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_object_content_set(ad->conform, ad->label); + + /* Show the window after the base GUI is set up */ + evas_object_show(ad->win); } @@ -500,17 +500,17 @@ ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE); elm_win_autodel_set(ad->win, EINA_TRUE); if (elm_win_wm_rotation_supported_get(ad->win)) { -    int rots[4] = {0, 90, 180, 270}; -    elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); + int rots[4] = {0, 90, 180, 270}; + elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4); } -evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); +evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL); eext_object_event_callback_add(ad->win, EEXT_CALLBACK_BACK, win_back_cb, ad);
      • -

        You can create a conformant object that is based on the window.

        +

        You can create a conformant object that is based on the window.

        The elm_win_indicator_mode_set() function decides whether the indicator is visible, and the elm_win_indicator_opacity_set() function sets the indicator opacity mode.

        -

        You can set the conformant object as a resize object of the window by using the elm_win_resize_object_add() function. It means that the conformant size and position are controlled by the window object directly.

        +

        You can set the conformant object as a resize object of the window by using the elm_win_resize_object_add() function. It means that the conformant size and position are controlled by the window object directly.

        The evas_object_show() function makes the conformant object visible.

        @@ -530,7 +530,7 @@ evas_object_show(ad->conform);
 
         /* Label */
 ad->label = elm_label_add(ad->conform);
-elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
+elm_object_text_set(ad->label, "<align=center>Hello Tizen</align>");
 evas_object_size_hint_weight_set(ad->label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
 elm_object_content_set(ad->conform, ad->label);
 
        
@@ -544,7 +544,7 @@ evas_object_show(ad->win);
      - + diff --git a/org.tizen.training/html/native/wearable_watch/first_app_watch_wn.htm b/org.tizen.training/html/native/wearable_watch/first_app_watch_wn.htm index 70d102d..422ca91 100644 --- a/org.tizen.training/html/native/wearable_watch/first_app_watch_wn.htm +++ b/org.tizen.training/html/native/wearable_watch/first_app_watch_wn.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Wearable Native Watch Application + Creating Your First Tizen Wearable Native Watch Application @@ -26,7 +26,7 @@
    • Creating a Project
    • Building Your Application
    • Running Your Application
      • -
    • Building a Simple UI
      • +
    • Building a Simple UI

    Related Info

    @@ -257,15 +257,15 @@
  • Click the run icon in the toolbar.

    • If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

    -

    Selecting the emulator to use

    +

    Selecting the emulator to use

    In the Console view, you can see that the application is successfully installed. However, it does not run on the emulator screen until you change the watch face in the emulator Settings menu.

    -

    Successful installation

    +

    Successful installation

  • Change the watch face.

    When a watch application is successfully installed on the emulator, the watch UI is visible in the emulator Clock menu.

    To change the watch face and make the watch application visible:

    -

    Changing the watch face

    +

    Changing the watch face

    1. If the emulator display has been switched off, activate it by pressing the Power key (in the bottom right corner of the emulator).
      2. @@ -335,7 +335,7 @@ cd tizen-sdk/tools
    2. Run the application:
      1. In the Connection Explorer view, select the device.
        2. -
      2. In Project Explorer view, right-click the project and select Run As > Tizen Native Application. +
      3. In Project Explorer view, right-click the project and select Run As > Tizen Native Application.

        Run the application on a target device

        @@ -345,7 +345,7 @@ cd tizen-sdk/tools

        If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

        -

        Selecting the device to use

        +

        Selecting the device to use

      4. Confirm that the application launches in the target device. @@ -362,7 +362,7 @@ cd tizen-sdk/tools
    • -

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    @@ -388,16 +388,16 @@ cd tizen-sdk/tools int main(int argc, char* argv[]) { -    appdata_s ad = {0,}; -    int ret = 0; -    watch_app_lifecycle_callback_s event_callback = {0,}; + appdata_s ad = {0,}; + int ret = 0; + watch_app_lifecycle_callback_s event_callback = {0,}; -    event_callback.create = app_create; -    event_callback.time_tick = app_time_tick; + event_callback.create = app_create; + event_callback.time_tick = app_time_tick; -    ret = watch_app_main(argc, argv, &event_callback, &ad); + ret = watch_app_main(argc, argv, &event_callback, &ad); -    return ret; + return ret; } @@ -407,12 +407,12 @@ main(int argc, char* argv[]) static bool app_create(int width, int height, void* data) { -    /* -     Hook to take necessary actions before the main event loop starts -     This usually means initializing the UI and application data -    */ + /* + Hook to take necessary actions before the main event loop starts + This usually means initializing the UI and application data + */ -    return true; + return true; } @@ -421,8 +421,8 @@ app_create(int width, int height, void* data) static void app_time_tick(watch_time_h watch_time, void* data) { -    /* Called at least once per second */ -    /* Draw a normal watch with the hour, minute, and second */ + /* Called at least once per second */ + /* Draw a normal watch with the hour, minute, and second */ } @@ -443,60 +443,60 @@ app_time_tick(watch_time_h watch_time, void* data) 
     struct appdata {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label;
 };
 typedef struct appdata appdata_s;
 
 static void
 create_base_gui(appdata_s *ad, int width, int height)
 {
-    int ret;
-    watch_time_h watch_time = NULL;
+    int ret;
+    watch_time_h watch_time = NULL;
 
-    ret = watch_app_get_elm_win(&ad->win);
+    ret = watch_app_get_elm_win(&ad->win);
 
-    if (ret != APP_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret);
+    if (ret != APP_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret);
 
-        return;
-    }
+        return;
+    }
 
-    evas_object_resize(ad->win, width, height);
+    evas_object_resize(ad->win, width, height);
 
-    ad->conform = elm_conformant_add(ad->win);
-    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-    elm_win_resize_object_add(ad->win, ad->conform);
-    evas_object_show(ad->conform);
+    ad->conform = elm_conformant_add(ad->win);
+    evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+    elm_win_resize_object_add(ad->win, ad->conform);
+    evas_object_show(ad->conform);
 
-    ad->label = elm_label_add(ad->conform);
-    evas_object_resize(ad->label, width, height / 3);
-    evas_object_move(ad->label, 0, height / 3);
-    evas_object_show(ad->label);
+    ad->label = elm_label_add(ad->conform);
+    evas_object_resize(ad->label, width, height / 3);
+    evas_object_move(ad->label, 0, height / 3);
+    evas_object_show(ad->label);
 
-    ret = watch_time_get_current_time(&watch_time);
+    ret = watch_time_get_current_time(&watch_time);
 
-    if (ret != APP_ERROR_NONE) {
-        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get current time. err = %d", ret);
+    if (ret != APP_ERROR_NONE) {
+        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get current time. err = %d", ret);
 
-        return;
-    }
+        return;
+    }
 
-    update_watch(ad, watch_time, 0);
-    watch_time_delete(watch_time);
-    evas_object_show(ad->win);
+    update_watch(ad, watch_time, 0);
+    watch_time_delete(watch_time);
+    evas_object_show(ad->win);
 }
 
 static bool
 app_create(int width, int height, void *date)
 {
-    /* Define system callbacks */
+    /* Define system callbacks */
 
-    appdata_s *ad = data;
-    create_base_gui(ad, width, height);
+    appdata_s *ad = data;
+    create_base_gui(ad, width, height);
 
-    return true;
+    return true;
 }
    @@ -505,34 +505,34 @@ app_create(int width, int height, void *date) static void update_watch(appdata_s *ad, watch_time_h watch_time, int ambient) { -    char watch_text[TEXT_BUF_SIZE]; -    int hour24; -    int minute; -    int second; -    if (watch_time == NULL) -        return; - -    watch_time_get_hour24(watch_time, &hour24); -    watch_time_get_minute(watch_time, &minute); -    watch_time_get_second(watch_time, &second); -    if (!ambient) { -        snprintf(watch_text, TEXT_BUF_SIZE, -                 "<align=center>Hello Watch<br/>%02d:%02d:%02d</align>", -                 hour24, minute, second); -    } else { -        snprintf(watch_text, TEXT_BUF_SIZE, -                 "<align=center>Hello Watch<br/>%02d:%02d</align>", -                 hour24, minute); -    } - -    elm_object_text_set(ad->label, watch_text); + char watch_text[TEXT_BUF_SIZE]; + int hour24; + int minute; + int second; + if (watch_time == NULL) + return; + + watch_time_get_hour24(watch_time, &hour24); + watch_time_get_minute(watch_time, &minute); + watch_time_get_second(watch_time, &second); + if (!ambient) { + snprintf(watch_text, TEXT_BUF_SIZE, + "<align=center>Hello Watch<br/>%02d:%02d:%02d</align>", + hour24, minute, second); + } else { + snprintf(watch_text, TEXT_BUF_SIZE, + "<align=center>Hello Watch<br/>%02d:%02d</align>", + hour24, minute); + } + + elm_object_text_set(ad->label, watch_text); } static void app_time_tick(watch_time_h watch_time, void* data) { -    appdata_s *ad = data; -    update_watch(ad, watch_time, 0); + appdata_s *ad = data; + update_watch(ad, watch_time, 0); } @@ -545,7 +545,7 @@ app_time_tick(watch_time_h watch_time, void* data) Note To use the ambient mode, the user must enable it in the device settings. In addition, in the Gear S2 device, the ambient mode activates only when you are wearing the watch on the wrist.
    - +

    To use the ambient mode:

      @@ -557,17 +557,17 @@ app_time_tick(watch_time_h watch_time, void* data) static void app_ambient_tick(watch_time_h watch_time, void* data) { -    appdata_s *ad = data; -    update_watch(ad, watch_time, 1); + appdata_s *ad = data; + update_watch(ad, watch_time, 1); } static void app_ambient_changed(bool ambient_mode, void* data) { -    if (ambient_mode) -        /* Prepare to enter the ambient mode */ -    else -        /* Prepare to exit the ambient mode */ + if (ambient_mode) + /* Prepare to enter the ambient mode */ + else + /* Prepare to exit the ambient mode */ } @@ -577,19 +577,19 @@ app_ambient_changed(bool ambient_mode, void* data) int main(int argc, char* argv[]) { -    appdata_s ad = {0,}; -    int ret = 0; -    watch_app_lifecycle_callback_s event_callback = {0,}; + appdata_s ad = {0,}; + int ret = 0; + watch_app_lifecycle_callback_s event_callback = {0,}; -    event_callback.create = app_create; -    event_callback.time_tick = app_time_tick; + event_callback.create = app_create; + event_callback.time_tick = app_time_tick; -    event_callback.ambient_tick = app_ambient_tick; -    event_callback.ambient_changed = app_ambient_changed; + event_callback.ambient_tick = app_ambient_tick; + event_callback.ambient_changed = app_ambient_changed; -    ret = watch_app_main(argc, argv, &event_callback, &ad); + ret = watch_app_main(argc, argv, &event_callback, &ad); -    return ret; + return ret; } diff --git a/org.tizen.training/html/native/wearable_widget/first_app_widget_wn.htm b/org.tizen.training/html/native/wearable_widget/first_app_widget_wn.htm index ee98b0c..9472f88 100644 --- a/org.tizen.training/html/native/wearable_widget/first_app_widget_wn.htm +++ b/org.tizen.training/html/native/wearable_widget/first_app_widget_wn.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Wearable Native Widget Application + Creating Your First Tizen Wearable Native Widget Application @@ -40,7 +40,7 @@
    - +

    Creating Your First Tizen Wearable Native Widget Application

    Welcome to Tizen wearable native widget application development!

    @@ -48,10 +48,10 @@

    A wearable native widget application is created using the C language, and can be run on Tizen wearable devices. The application uses the native API, which provides various interfaces to the device hardware allowing you to take advantage of numerous capabilities tailored to run with limited device resources.

    A widget application is one of the Tizen application types. It can be shown by specific UI applications (such as the home screen and lock screen) that can contain widget applications.

    - -

    Figure: Widget application in a wearable device

    -

    Widget application in a wearable device

    - + +

    Figure: Widget application in a wearable device

    +

    Widget application in a wearable device

    +

    Study the following instructions to help familiarize yourself with the Tizen native application development process as well as using the Tizen Studio and installing the created application on the emulator or target device. With the instructions, you can create and run a basic wearable native widget application, which displays some text on the screen with no user interaction:

    @@ -267,13 +267,13 @@
  • Click the run icon in the toolbar.

    • If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

    -

    Selecting the emulator to use

    +

    Selecting the emulator to use

  • Confirm that the application launches on the emulator.

    Application running in the emulator

    - +
    Note If the emulator display has switched off, you cannot see the application launch. To switch the display on, click the Power key (in the right bottom corner of the emulator). @@ -286,16 +286,16 @@
  • Swipe the home screen to the right and select +.
  • Scroll down until you see your widget application, and select it.
    • -

    Adding to home screen

    +

    Adding to home screen

    You can see the added widget on the home screen. To access the widget from the home screen, swipe right.

    -

    Home screen widget

    +

    Home screen widget

    While the application is running, the Log view in the Tizen Studio shows the log, debug, and exception messages from the methods defined in the log macros. To see the view, in the Tizen Studio menu, go to Window > Show View > Log.

    - +

    For more information on using the emulator features, see Using Emulator Control Keys, Menu, and Panel and Using Extended Emulator Features.

    Running on a Target Device

    @@ -349,7 +349,7 @@ cd tizen-sdk/tools
  • Run the application:
    1. In the Connection Explorer view, select the device.
      2. -
    2. In Project Explorer view, right-click the project and select Run As > Tizen Native Application. +
    3. In Project Explorer view, right-click the project and select Run As > Tizen Native Application.

      Run the application on a target device

      @@ -359,13 +359,13 @@ cd tizen-sdk/tools

      If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

      -

      Selecting the device to use

      +

      Selecting the device to use

    4. Confirm that the application launches in the target device.

      Like with the emulator, you must add the widget to the home screen before you can see it.

      5. -
    - + +
    Note The application is launched using the default debug run configuration. To create and use another configuration: @@ -376,7 +376,7 @@ cd tizen-sdk/tools
    -

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    • @@ -413,17 +413,17 @@ cd tizen-sdk/tools int main(int argc, char *argv[]) { -    widget_app_lifecycle_callback_s ops = {0,}; -    int ret; + widget_app_lifecycle_callback_s ops = {0,}; + int ret; -    ops.create = widget_app_create; -    ops.terminate = widget_app_terminate; + ops.create = widget_app_create; + ops.terminate = widget_app_terminate; -    ret = widget_app_main(argc, argv, &ops, NULL); -    if (ret != WIDGET_ERROR_NONE) -        dlog_print(DLOG_ERROR, LOG_TAG, "widget_app_main() failed. Err = %d", ret); + ret = widget_app_main(argc, argv, &ops, NULL); + if (ret != WIDGET_ERROR_NONE) + dlog_print(DLOG_ERROR, LOG_TAG, "widget_app_main() failed. Err = %d", ret); -    return ret; + return ret; }
  • Use the widget_app_create() life-cycle function of the Widget Application API to initialize any resources that can be shared among widget instances. This function is called before the main event loop starts. @@ -432,8 +432,8 @@ main(int argc, char *argv[]) static widget_class_h widget_app_create(void *user_data) { -    /* Hook to take necessary actions before the main event loop starts */ -    widget_instance_lifecycle_callback_s ops = {NULL,}; + /* Hook to take necessary actions before the main event loop starts */ + widget_instance_lifecycle_callback_s ops = {NULL,};
  • Register the callback functions and make a class for widget instances. @@ -441,7 +441,7 @@ widget_app_create(void *user_data)

    At the end of the widget_app_create() function, remember to create a widget instance class and return a handle for it, so that the handle can be used for making widget instances.

    -    return widget_app_class_create(ops, user_data);
+    return widget_app_class_create(ops, user_data);
 }
    • @@ -451,7 +451,7 @@ widget_app_create(void *user_data) static void widget_app_terminate(void *user_data) { -    /* Release all resources */ + /* Release all resources */ } @@ -471,18 +471,18 @@ widget_app_terminate(void *user_data) 
     static int
 widget_instance_create(widget_context_h context, bundle *content,
-                       int w, int h, void *user_data)
+                       int w, int h, void *user_data)
 {
-    widget_instance_data_s *wid = (widget_instance_data_s*)
-                                  malloc(sizeof(widget_instance_data_s));
-    int ret;
+    widget_instance_data_s *wid = (widget_instance_data_s*)
+                                  malloc(sizeof(widget_instance_data_s));
+    int ret;
 
-    if (content != NULL)
-        /* Recover the previous status with the bundle object */
+    if (content != NULL)
+        /* Recover the previous status with the bundle object */
 
-    /* Create the UI */
+    /* Create the UI */
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
  • This callback is triggered when the widget instance is destroyed. @@ -491,12 +491,12 @@ widget_instance_create(widget_context_h context, bundle *content, 
     static int
 widget_instance_destroy(widget_context_h context, widget_app_destroy_type_e reason,
-                        bundle *content, void *user_data)
+                        bundle *content, void *user_data)
 {
-    if (reason != WIDGET_APP_DESTROY_TYPE_PERMANENT)
-        /* Save the current status at the bundle object */
+    if (reason != WIDGET_APP_DESTROY_TYPE_PERMANENT)
+        /* Save the current status at the bundle object */
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
  • This callback is triggered when the widget instance is paused. @@ -506,7 +506,7 @@ widget_instance_destroy(widget_context_h context, widget_app_destroy_type_e reas static int widget_instance_pause(widget_context_h context, void *user_data) { -    return WIDGET_ERROR_NONE; + return WIDGET_ERROR_NONE; }
  • This callback is triggered when the widget instance is resumed. @@ -516,7 +516,7 @@ widget_instance_pause(widget_context_h context, void *user_data) static int widget_instance_resume(widget_context_h context, void *user_data) { -    return WIDGET_ERROR_NONE; + return WIDGET_ERROR_NONE; }
  • This callback is triggered when a widget update event is received. @@ -526,7 +526,7 @@ widget_instance_resume(widget_context_h context, void *user_data) static int widget_instance_update(widget_context_h context, bundle *content, int force, void *user_data) { -    return WIDGET_ERROR_NONE; + return WIDGET_ERROR_NONE; }
    • @@ -536,15 +536,15 @@ widget_instance_update(widget_context_h context, bundle *content, int force, voi static widget_class_h widget_app_create(void *user_data) { -    widget_instance_lifecycle_callback_s ops = { -        .create = widget_instance_create, -        .destroy = widget_instance_destroy, -        .pause = widget_instance_pause, -        .resume = widget_instance_resume, -        .update = widget_instance_update, -    }; - -    return widget_app_class_create(ops, user_data); + widget_instance_lifecycle_callback_s ops = { + .create = widget_instance_create, + .destroy = widget_instance_destroy, + .pause = widget_instance_pause, + .resume = widget_instance_resume, + .update = widget_instance_update, + }; + + return widget_app_class_create(ops, user_data); } @@ -557,52 +557,52 @@ widget_app_create(void *user_data) #include <widget_app_efl.h> struct widget_instance_data { -    Evas_Object *win; -    Evas_Object *conform; -    Evas_Object *label; + Evas_Object *win; + Evas_Object *conform; + Evas_Object *label; }; typedef struct widget_instance_data widget_instance_data_s; static int widget_instance_create(widget_context_h context, bundle *content, -                       int w, int h, void *user_data) + int w, int h, void *user_data) { -    widget_instance_data_s *wid = (widget_instance_data_s*) -                                  malloc(sizeof(widget_instance_data_s)); + widget_instance_data_s *wid = (widget_instance_data_s*) + malloc(sizeof(widget_instance_data_s)); -    int ret; -    if (content != NULL) -        /* Recover the previous status with the bundle object */ + int ret; + if (content != NULL) + /* Recover the previous status with the bundle object */ -    /* Window */ -    ret = widget_app_get_elm_win(context, &wid->win); -    if (ret != WIDGET_ERROR_NONE) { -        dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret); + /* Window */ + ret = widget_app_get_elm_win(context, &wid->win); + if (ret != WIDGET_ERROR_NONE) { + dlog_print(DLOG_ERROR, LOG_TAG, "failed to get window. err = %d", ret); -        return WIDGET_ERROR_FAULT; -    } + return WIDGET_ERROR_FAULT; + } -    evas_object_resize(wid->win, w, h); + evas_object_resize(wid->win, w, h); -    /* Conformant */ -    wid->conform = elm_conformant_add(wid->win); -    evas_object_size_hint_weight_set(wid->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); -    elm_win_resize_object_add(wid->win, wid->conform); -    evas_object_show(wid->conform); + /* Conformant */ + wid->conform = elm_conformant_add(wid->win); + evas_object_size_hint_weight_set(wid->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); + elm_win_resize_object_add(wid->win, wid->conform); + evas_object_show(wid->conform); -    /* Label */ -    wid->label = elm_label_add(wid->conform); -    evas_object_resize(wid->label, w, h / 3); -    evas_object_move(wid->label, w / 4, h / 3); -    evas_object_show(wid->label); -    elm_object_text_set(wid->label, "Hello widget"); + /* Label */ + wid->label = elm_label_add(wid->conform); + evas_object_resize(wid->label, w, h / 3); + evas_object_move(wid->label, w / 4, h / 3); + evas_object_show(wid->label); + elm_object_text_set(wid->label, "Hello widget"); -    /* Show the window after the base GUI is set up */ -    evas_object_show(wid->win); + /* Show the window after the base GUI is set up */ + evas_object_show(wid->win); -    widget_app_context_set_tag(context, wid); + widget_app_context_set_tag(context, wid); -    return WIDGET_ERROR_NONE; + return WIDGET_ERROR_NONE; } @@ -615,24 +615,24 @@ widget_instance_create(widget_context_h context, bundle *content, 
     struct widget_instance_data {
-    Evas_Object *win;
-    Evas_Object *conform;
-    Evas_Object *label;
+    Evas_Object *win;
+    Evas_Object *conform;
+    Evas_Object *label;
 };
 typedef struct widget_instance_data widget_instance_data_s;
 
 static int
 widget_instance_create(widget_context_h context, bundle *content,
-                       int w, int h, void *user_data)
+                       int w, int h, void *user_data)
 {
-    widget_instance_data_s *wid = (widget_instance_data_s*)
-                                  malloc(sizeof(widget_instance_data_s));
+    widget_instance_data_s *wid = (widget_instance_data_s*)
+                                  malloc(sizeof(widget_instance_data_s));
 
-    ret = widget_app_get_elm_win(context, &wid->win);
+    ret = widget_app_get_elm_win(context, &wid->win);
 
-    wid->label = elm_label_add(wid->conform);
+    wid->label = elm_label_add(wid->conform);
 
-    widget_app_context_set_tag(context, wid);
+    widget_app_context_set_tag(context, wid);
 }
    @@ -642,31 +642,31 @@ widget_instance_create(widget_context_h context, bundle *content, 
     static int
 widget_instance_update(widget_context_h context, bundle *content,
-                       int force, void *user_data)
+                       int force, void *user_data)
 {
-    widget_instance_data_s *wid = NULL;
-    widget_app_context_get_tag(context, (void**)&wid);
-    if (wid->label)
-        elm_object_text_set(wid->label, "Update Widget");
+    widget_instance_data_s *wid = NULL;
+    widget_app_context_get_tag(context, (void**)&wid);
+    if (wid->label)
+        elm_object_text_set(wid->label, "Update Widget");
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
  • Make sure that all the resources that you allocate are freed in the callback function for the widget instance destructor: 
     static int
 widget_instance_destroy(widget_context_h context,
-                        widget_app_destroy_type_e reason, bundle *content, void *user_data)
+                        widget_app_destroy_type_e reason, bundle *content, void *user_data)
 {
-    widget_instance_data_s *wid = NULL;
-    widget_app_context_get_tag(context, (void**)&wid);
+    widget_instance_data_s *wid = NULL;
+    widget_app_context_get_tag(context, (void**)&wid);
 
-    if (wid->win)
-        evas_object_del(wid->win);
+    if (wid->win)
+        evas_object_del(wid->win);
 
-    free(wid);
+    free(wid);
 
-    return WIDGET_ERROR_NONE;
+    return WIDGET_ERROR_NONE;
 }
    • diff --git a/org.tizen.training/html/web/app_model/application_model_w.htm b/org.tizen.training/html/web/app_model/application_model_w.htm index 04229aa..58098c9 100644 --- a/org.tizen.training/html/web/app_model/application_model_w.htm +++ b/org.tizen.training/html/web/app_model/application_model_w.htm @@ -5,13 +5,13 @@ - + - Tizen Web Application Model + Tizen Web Application Model @@ -20,38 +20,38 @@

    Mobile Web Wearable Web TV Web

    - + -
    +
    -

    Tizen Web Application Model

    -

    The Tizen Studio enables you to create Web applications for mobile, wearable, and TV devices. A Web application comprises HTML, JavaScript, and CSS combined in a package, which can be installed on the Tizen device.

    -

    A Web application package includes all the support files that are needed by the Web application. Therefore, a Web application can run without any additional external resources or network connectivity after installation.

    -

    The application model supports a rich set of standard W3C/HTML5 features, which include various JavaScript APIs as well as additional HTML markups and CSS features. These features along with the Tizen Device APIs and UI framework support can be used to create rich Web applications in a variety of categories, such as contact, messaging, device information access, multimedia, graphics, and games.

    +

    Tizen Web Application Model

    +

    The Tizen Studio enables you to create Web applications for mobile, wearable, and TV devices. A Web application comprises HTML, JavaScript, and CSS combined in a package, which can be installed on the Tizen device.

    +

    A Web application package includes all the support files that are needed by the Web application. Therefore, a Web application can run without any additional external resources or network connectivity after installation.

    +

    The application model supports a rich set of standard W3C/HTML5 features, which include various JavaScript APIs as well as additional HTML markups and CSS features. These features along with the Tizen Device APIs and UI framework support can be used to create rich Web applications in a variety of categories, such as contact, messaging, device information access, multimedia, graphics, and games.

    Tizen supports both Web application packages and hybrid application packages, which combine a Web application and 1 or more native service applications.

    Applications in the same package follow the same installation life-cycle, handled by the application package manager.

    - -

    Application Package Manager

    -

    The application package manager is one of the core modules of the Tizen application framework, and responsible for installing, uninstalling, and updating packages, and storing their information. Using the package manager, you can also retrieve information related to the packages that are installed on the device.

    + +

    Application Package Manager

    +

    The application package manager is one of the core modules of the Tizen application framework, and responsible for installing, uninstalling, and updating packages, and storing their information. Using the package manager, you can also retrieve information related to the packages that are installed on the device.

    The application package manager module is expandable to support various types of applications, and designated installation modules can be added to it.

    -

    Figure: Application package manager

    -

    Application package manager

    +

    Figure: Application package manager

    +

    Application package manager

    -

    Web Package Configuration

    +

    Web Package Configuration

    Each Web application package has a configuration file, config.xml, which indicates a packaging format and metadata for the application.

    The Tizen Web application must follow the guidelines of W3C Widget Packaging and Tizen extended configuration (in mobile and wearable applications).

    For more information on the configuration elements, see Configuration Element Hierarchy.

    - -

    Web Application Package

    -

    The Tizen platform supports Web applications based on HTML, JavaScript, and CSS, and packaged according to the W3C specification. The platform also provides device APIs to access the platform capabilities, enabling a rich Web application development environment.

    + +

    Web Application Package

    +

    The Tizen platform supports Web applications based on HTML, JavaScript, and CSS, and packaged according to the W3C specification. The platform also provides device APIs to access the platform capabilities, enabling a rich Web application development environment.

    A Web application package must conform to the following conventions:

    • Package format and file extension @@ -73,81 +73,81 @@

      Table: Package content

      - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + - - + + - - + + - - + + - - - + + + - - + + - - + + - - + + - - + + - - - - + + + + - -
      NameTypeDescription
      config.xmlFileApplication configuration document
      icon.gifApplication default icon
      icon.ico
      NameTypeDescription
      config.xmlFileApplication configuration document
      icon.gifApplication default icon
      icon.ico
      icon.jpg
      icon.jpg
      icon.png
      icon.png
      icon.svg
      icon.svg
      index.htmlApplication default start file
      index.htmlApplication default start file
      index.htm
      index.htm
      index.svg
      index.svg
      index.xhtml
      index.xhtml
      index.xht
      index.xht
      localesFolderContainer for localized content
      localesFolderContainer for localized content
      + +
  • Directory hierarchy (after installation on device)

    The following figure and table illustrate the Web application package directory structure.

    Web application directory structure

    -

    Table: Web application package structure

    +

    Table: Web application package structure

    - - - - - - - - - + + + + + + + + + - - - - + + + +
    PackageRoot directoryApplication IDCore XML file
    App
    PackageRoot directoryApplication IDCore XML file
    App home/owner/apps_rw/<Package ID>

    (For example: home/owner/apps_rw/qik37po9ck)

    		<Package ID>.<Name>

    (For example: qik37po9ck.Sample)

    		opt/share/packages/<Package ID>.xml

    (For example: opt/share/packages/qik37po9ck.xml)

    <Package ID>.<Name>

    (For example: qik37po9ck.Sample)

    		opt/share/packages/<Package ID>.xml

    (For example: opt/share/packages/qik37po9ck.xml)
    • - - -

    Hybrid Application Package

    + + +

    Hybrid Application Package

    A hybrid application package must conform to the following conventions:

    • Package format and file extension @@ -159,94 +159,94 @@
    • Package content
      • File and folders: The root of the hybrid package is the path of the ZIP archive and contains reserved folders. The following table shows the content of a package. -

        Table: Package content

        +

        Table: Package content

        - - - - - - + + + + + + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - - - + + +
        NameTypeDescription
        NameTypeDescription
        binbin FolderNative application executable binaryNative application executable binary
        datadataWeb or native application private dataWeb or native application private data
        infoinfoNative application metadataNative application metadata
        liblibNative application librariesNative application libraries
        resresNative application resources or Web application contentNative application resources or Web application content
        res/wgtres/wgtWeb application project rootWeb application project root
        res/wgt/index.htmlres/wgt/index.html FileDefault HTML file for the Web applicationDefault HTML file for the Web application
        settingsetting FolderNative application settingNative application setting
        sharedNative application shared resourcessharedNative application shared resources
      • - +
    • Directory hierarchy (after installation on device)

      The following figure and table illustrate the hybrid application package directory structure.

      -

      Figure: Hybrid application directory structure

      -

      Hybrid application directory structure

      +

      Figure: Hybrid application directory structure

      +

      Hybrid application directory structure

      Table: Hybrid application package structure

      - - - - - - - - - - - - - - - - - - - - - - - +
      PackageRoot directoryApplication IDCore XML file
      App1

      (Web)

      		home/owner/apps_rw/<Package ID>

      (For example: home/owner/apps_rw/qik37po9ck)

      		<Package ID>.<Name>

      (For example: qik37po9ck.Sample)

      		opt/share/packages/<Package ID>.xml

      (For example: opt/share/packages/qik37po9ck.xml)

      App2

      (Native)

      		<Package ID>.<ExecutableName1>

      (For example: qik37po9ck.Service)

      App3

      (Native)

      		<Package ID>.<ExecutableName2>

      (For example: qik37po9ck.Downloader)

      + + + + + + + + + + + + + + + + + + + + + +
      PackageRoot directoryApplication IDCore XML file
      App1

      (Web)

      		home/owner/apps_rw/<Package ID>

      (For example: home/owner/apps_rw/qik37po9ck)

      		<Package ID>.<Name>

      (For example: qik37po9ck.Sample)

      		opt/share/packages/<Package ID>.xml

      (For example: opt/share/packages/qik37po9ck.xml)

      App2

      (Native)

      		<Package ID>.<ExecutableName1>

      (For example: qik37po9ck.Service)

      App3

      (Native)

      		<Package ID>.<ExecutableName2>

      (For example: qik37po9ck.Downloader)
      • -
    - - + + +
    diff --git a/org.tizen.training/html/web/cover_page_w.htm b/org.tizen.training/html/web/cover_page_w.htm index 810f99e..bb52443 100644 --- a/org.tizen.training/html/web/cover_page_w.htm +++ b/org.tizen.training/html/web/cover_page_w.htm @@ -5,25 +5,25 @@ - + - Introduction to Web Applications + Introduction to Web Applications
    -
    +

    Mobile Web Wearable Web TV Web

    - +

    Introduction to Web Applications

    @@ -44,7 +44,7 @@ - +
    diff --git a/org.tizen.training/html/web/details/app_filtering_w.htm b/org.tizen.training/html/web/details/app_filtering_w.htm index e2d38e1..40030be 100644 --- a/org.tizen.training/html/web/details/app_filtering_w.htm +++ b/org.tizen.training/html/web/details/app_filtering_w.htm @@ -5,13 +5,13 @@ - + - Application Filtering + Application Filtering @@ -28,32 +28,32 @@
  • Single Web Application for Multiple Profiles
    • -
    +

    Application Filtering

    The Tizen platform provides a wide range of features across a variety of hardware and software components. Among the features, there are some that can be selectively supported by the Tizen device manufacturer. For application stores to correctly select your application for installation on an appropriate device, the feature and profile information must be correctly declared in your application.

    - +

    Feature-based Filtering

    Some features can be selectively supported by the Tizen device manufacturer. To prevent problems when the user is trying to run your application on a device that does not support all the features your application is using, do one of the following:

    • When the application is running, check whether the device supports the needed features. If not, the application can use other features, which are supported by the device, as a workaround.

      For example, if an application wants to use location information, it can check the device capability by using the getCapability() method of the SystemInfo interface (in mobile, wearable, and TV applications). If the device supports GPS, the application uses GPS information, and if the device supports WPS only, the application uses WPS information instead of GPS.

      • -
    • Use feature-based filtering to prevent your application from being shown in the application list on the Tizen Store, if the user's device does not support all the features of your application. This way you can prevent the application from being installed on an unsupportive device in the first place. +
    • Use feature-based filtering to prevent your application from being shown in the application list on the Tizen Store, if the user's device does not support all the features of your application. This way you can prevent the application from being installed on an unsupportive device in the first place.

      Be careful when defining the feature list for feature-based filtering. The feature list can dramatically reduce your chances of getting the application downloaded by reducing the number of devices which can support the application.

    - +

    If the config.xml file of the application package includes a feature list, the Tizen Store compares the capabilities of the device with the required feature conditions of the application. The store only lists the applications whose conditions match the capabilities of the device, and thus prevents unsupported applications from being installed.

    -

    Figure: Feature-based filtering

    -

    Feature-based filtering

    - -

    When multiple features are defined in the feature list for feature-based filtering, the Tizen Store creates the filtering condition for all using the "AND" operation. For example, if there are http://tizen.org/feature/network.nfc and http://tizen.org/feature/network.bluetooth features in the feature list of the application package, only a device that has both those features can show the application on the Tizen Store application list for downloading.

    +

    Figure: Feature-based filtering

    +

    Feature-based filtering

    + +

    When multiple features are defined in the feature list for feature-based filtering, the Tizen Store creates the filtering condition for all using the "AND" operation. For example, if there are http://tizen.org/feature/network.nfc and http://tizen.org/feature/network.bluetooth features in the feature list of the application package, only a device that has both those features can show the application on the Tizen Store application list for downloading.

    Screen Size Feature

    -

    The screen size feature is the only exception to the normal feature handling process described above. When the screen size is defined in the feature list, the Tizen Store creates the filtering condition with the "OR" operation. For example, if the http://tizen.org/feature/screen.size.normal.480.800 and http://tizen.org/feature/screen.size.normal.720.1280 features are defined in your application feature list, a device that supports one or the other of those features can show the application on the Tizen Store application list.

    +

    The screen size feature is the only exception to the normal feature handling process described above. When the screen size is defined in the feature list, the Tizen Store creates the filtering condition with the "OR" operation. For example, if the http://tizen.org/feature/screen.size.normal.480.800 and http://tizen.org/feature/screen.size.normal.720.1280 features are defined in your application feature list, a device that supports one or the other of those features can show the application on the Tizen Store application list.

    If you do not specify a proper screen size in the config.xml file, your application can be rejected from the Tizen store.

    The following tables list the available screen size features.

    Table: Available screen size features for mobile applications

    @@ -72,19 +72,19 @@ 2.2.1 - http://tizen.org/feature/screen.size.normal.240.400 + http://tizen.org/feature/screen.size.normal.240.400 Specify this key, if the application supports the 240 x 400 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    2.2.1 - + http://tizen.org/feature/screen.size.normal.320.320 Specify this key, if the application supports the 320 x 320 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    2.3 - + http://tizen.org/feature/screen.size.normal.320.480 Specify this key, if the application supports the 320 x 480 resolution on the normal screen size. @@ -102,7 +102,7 @@ Specify this key, if the application supports the 360 x 480 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    2.3 - + http://tizen.org/feature/screen.size.normal.480.800 Specify this key, if the application supports the 480 x 800 resolution on the normal screen size. @@ -141,7 +141,7 @@ - +

    Table: Available screen size features for wearable applications

    @@ -175,8 +175,8 @@ - - + +
    Specify this key, if the application supports the 360 x 480 resolution on the normal screen size.

    You can specify multiple http://tizen.org/feature/screen.size.normal.* keys, if your application supports multiple screen resolutions on the normal screen size. However, you cannot specify keys on both screen.size.* and screen.size.normal.* levels simultaneously.

    If no screen size key is declared, it is assumed that the application supports only screen.size.normal.720.1280. To avoid this, specify at least 1 screen size key.

    		 2.3
    http://tizen.org/feature/screen.size.all Specify this key, if the application supports all possible current and future screen sizes and all possible current and future resolutions per screen size. @@ -185,9 +185,9 @@
    - - -

    Feature Hierarchy

    + + +

    Feature Hierarchy

    The feature keys have a hierarchy. For example, consider the http://tizen.org/feature/location, http://tizen.org/feature/location.gps, and http://tizen.org/feature/location.wps features:

      @@ -195,9 +195,9 @@
    • If the feature list includes the http://tizen.org/feature/location feature, a device which has the http://tizen.org/feature/location.gps, http://tizen.org/feature/location.wps, or http://tizen.org/feature/location feature can show the application on the Tizen Store application list.

      This means that the Tizen Store considers the http://tizen.org/feature/location feature as the http://tizen.org/feature/location.gps OR http://tizen.org/feature/location.wps feature. (If the feature list includes the http://tizen.org/feature/location.gps and http://tizen.org/feature/location.wps features together, only a device which supports both those features can show the application.)

    -

    Adding the Feature List

    - -

    To enable filtering for your Web application, add the feature list for the application config.xml file:

    +

    Adding the Feature List

    + +

    To enable filtering for your Web application, add the feature list for the application config.xml file:

    1. To open the Web application configuration editor in the Tizen Studio, double-click the config.xml file in the Project Explorer view.
    2. In the Feature tab, click Add.
      3. @@ -209,7 +209,7 @@

      The following example shows the setting in the config.xml file code:

      -<tizen:feature name="http://tizen.org/feature/network.nfc"/>
+<tizen:feature name="http://tizen.org/feature/network.nfc"/>

      The following tables show the available requirements for Tizen Web application package.

      @@ -222,8 +222,8 @@ Since -http://tizen.org/feature/convergence.d2d - Specify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices. +http://tizen.org/feature/convergence.d2d + Specify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices. 3.0 @@ -256,7 +256,7 @@ Specify this key, if the application requires the LED feature. 2.4 - + http://tizen.org/feature/location.batch Specify this key, if the application requires the location tracking with a position batch information feature for using the Human Activity Monitor (GPS Type) API. 2.3 @@ -285,7 +285,7 @@ http://tizen.org/feature/network.net_proxy Specify this key, if the application requires the net-proxy feature for the Internet connection. A net-proxy feature for a device acts as an intermediary between client (network service customer) and server (network service provider). 3.0 - + http://tizen.org/feature/network.nfc Specify this key, if the application requires the use of any API that, in turn, requires the Near Field Communication (NFC) feature. @@ -332,10 +332,10 @@ 2.2.1 -http://tizen.org/feature/network.telephony.sms - Specify this key, if the application requires the SMS feature. +http://tizen.org/feature/network.telephony.sms + Specify this key, if the application requires the SMS feature. 2.4 - + http://tizen.org/feature/network.wifi Specify this key, if the application requires the use of any API that, in turn, requires the Wi-Fi feature. @@ -357,18 +357,18 @@ 2.3 -http://tizen.org/feature/sensor.heart_rate_monitor.led_green - Specify this key, if the application requires the LED green heart rate monitor sensor. +http://tizen.org/feature/sensor.heart_rate_monitor.led_green + Specify this key, if the application requires the LED green heart rate monitor sensor. 2.3.1 - + -http://tizen.org/feature/sensor.heart_rate_monitor.led_ir - Specify this key, if the application requires the LED infrared heart rate monitor sensor. +http://tizen.org/feature/sensor.heart_rate_monitor.led_ir + Specify this key, if the application requires the LED infrared heart rate monitor sensor. 2.3.1 - + -http://tizen.org/feature/sensor.heart_rate_monitor.led_red - Specify this key, if the application requires the LED red heart rate monitor sensor. +http://tizen.org/feature/sensor.heart_rate_monitor.led_red + Specify this key, if the application requires the LED red heart rate monitor sensor. 2.3.1 @@ -385,7 +385,7 @@ http://tizen.org/feature/sensor.photometer Specify this key, if the application requires a photometer sensor for using the Sensor (LIGHT Type) API. 2.2.1 - + http://tizen.org/feature/sensor.proximity Specify this key, if the application requires a proximity sensor for using the Sensor (PROXIMITY Type) API. @@ -433,7 +433,7 @@ Specify this key, if the application requires a microphone for using the getUserMedia or HTML Media Capture API. 2.2.1 - + http://tizen.org/feature/sensor.accelerometer Specify this key, if the application requires an acceleration sensor for using the DeviceOrientation Event Specification API. 2.2.1 @@ -465,8 +465,8 @@ Since -http://tizen.org/feature/shell.appwidget - Specify this key, if the application requires the Widget feature. Since 2.3.1, this key indicates only the native Widget. +http://tizen.org/feature/shell.appwidget + Specify this key, if the application requires the Widget feature. Since 2.3.1, this key indicates only the native Widget. 2.2.1 @@ -481,8 +481,8 @@ Since -http://tizen.org/feature/convergence.d2d - Specify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices. +http://tizen.org/feature/convergence.d2d + Specify this key, if the application requires the Device-to-Device (D2D) Convergence feature, which provides the service to discover near-by devices and to communicate information and data to the remote devices. 3.0 @@ -547,7 +547,7 @@ http://tizen.org/feature/network.net_proxy Specify this key, if the application requires the net-proxy feature for the Internet connection. A net-proxy feature for a device acts as an intermediary between client (network service customer) and server (network service provider). 3.0 - + http://tizen.org/feature/network.nfc Specify this key, if the application requires the use of any API that, in turn, requires the Near Field Communication (NFC) feature. @@ -582,17 +582,17 @@ http://tizen.org/feature/network.secure_element Specify this key, if the application requires the secure element feature. 2.2.1 - + http://tizen.org/feature/network.telephony Specify this key, if the application requires the use of any API that, in turn, requires the telephony feature. 2.2.1 -http://tizen.org/feature/network.telephony.sms - Specify this key, if the application requires the SMS feature. +http://tizen.org/feature/network.telephony.sms + Specify this key, if the application requires the SMS feature. 2.4 - + http://tizen.org/feature/network.wifi Specify this key, if the application requires the use of any API that, in turn, requires the Wi-Fi feature (for example, the Download API). @@ -614,20 +614,20 @@ 2.3 -http://tizen.org/feature/sensor.heart_rate_monitor.led_green - Specify this key, if the application requires the LED green heart rate monitor sensor. +http://tizen.org/feature/sensor.heart_rate_monitor.led_green + Specify this key, if the application requires the LED green heart rate monitor sensor. 2.3.1 - + -http://tizen.org/feature/sensor.heart_rate_monitor.led_ir - Specify this key, if the application requires the LED infrared heart rate monitor sensor. +http://tizen.org/feature/sensor.heart_rate_monitor.led_ir + Specify this key, if the application requires the LED infrared heart rate monitor sensor. 2.3.1 - + -http://tizen.org/feature/sensor.heart_rate_monitor.led_red - Specify this key, if the application requires the LED red heart rate monitor sensor. +http://tizen.org/feature/sensor.heart_rate_monitor.led_red + Specify this key, if the application requires the LED red heart rate monitor sensor. 2.3.1 - + http://tizen.org/feature/sensor.magnetometer Specify this key, if the application requires a magnetic sensor. @@ -684,7 +684,7 @@ http://tizen.org/feature/input.rotating_bezel Specify this key, if the application requires rotating bezel input. 2.3.1 - + http://tizen.org/feature/location.gps Specify this key, if the application requires the Global Positioning System (GPS) feature for using the GeoLocation API. @@ -699,18 +699,18 @@ http://tizen.org/feature/network.internet Specify this key, if the application requires Internet access for using the WebSocket API, XMLHttpRequest Level 1, or Cross-Origin Resource Sharing API. 2.3.1 - - + + http://tizen.org/feature/screen.shape.circle Specify this key, if the application requires a circle-shaped screen. 2.3.1 - + http://tizen.org/feature/screen.shape.rectangle Specify this key, if the application requires a rectangle-shaped screen. 2.3.1 - - + + http://tizen.org/feature/sensor.accelerometer Specify this key, if the application requires an acceleration sensor for using the DeviceOrientation Event Specification API. 2.2.1 @@ -740,7 +740,7 @@ http://tizen.org/feature/media.audio_recording Specify this key, if the application requires the audio recording functionality of the device for using the Camera API (Tizen Extension) (Audio Recording) API. 2.3 - + http://tizen.org/feature/media.image_capture Specify this key, if the application requires the image capture functionality of the device for using the Camera API (Tizen Extension) (Image Recording) API. @@ -763,8 +763,8 @@ Since -http://tizen.org/feature/shell.appwidget - Specify this key, if the application requires the Widget feature. Since 2.3.1, this key indicates only the native Widget. +http://tizen.org/feature/shell.appwidget + Specify this key, if the application requires the Widget feature. Since 2.3.1, this key indicates only the native Widget. 2.2.1 @@ -785,36 +785,36 @@ - - + + - - + + - - + + - - + +
      Tizen profileProfile name attributeTizen profileProfile name attribute
      MobilemobileMobilemobile
      WearablewearableWearablewearable
      TVTVTVTV

      In a Web application, the profile name element can be added to the config.xml file as follows:

      -<widget xmlns="http://www.w3.org/ns/widgets" xmlns:tizen="http://tizen.org/ns/widgets" ... >
-<tizen:profile name="mobile"/>
+<widget xmlns="http://www.w3.org/ns/widgets" xmlns:tizen="http://tizen.org/ns/widgets" ... >
+<tizen:profile name="mobile"/>
 <!--OR-->
-<tizen:profile name="wearable"/>
+<tizen:profile name="wearable"/>

      The Tizen Store compares the device profile and the profile name element in an application. The store only shows the applications with a profile name matching the device profile to prevent unsupported applications from being installed.

      -

      Single Web Application for Multiple Profiles

      -

      Applications are created for a single specific target profile and can only run on devices compliant to that profile. However, it is easily possible to develop a Web application on one profile and make it work on another profile if you use Web APIs that are common to both the profiles. You just modify the <tizen:profile> tag to switch profiles. You may also have to make other changes, like adapting your application to different screen sizes and input events. It is recommended that you test this modified application to ensure it performs as desired.

      - +

      Single Web Application for Multiple Profiles

      +

      Applications are created for a single specific target profile and can only run on devices compliant to that profile. However, it is easily possible to develop a Web application on one profile and make it work on another profile if you use Web APIs that are common to both the profiles. You just modify the <tizen:profile> tag to switch profiles. You may also have to make other changes, like adapting your application to different screen sizes and input events. It is recommended that you test this modified application to ensure it performs as desired.

      + diff --git a/org.tizen.training/html/web/details/deprecation_policy_w.htm b/org.tizen.training/html/web/details/deprecation_policy_w.htm index 4aa02ad..4eb2989 100644 --- a/org.tizen.training/html/web/details/deprecation_policy_w.htm +++ b/org.tizen.training/html/web/details/deprecation_policy_w.htm @@ -5,13 +5,13 @@ - + - API Versioning and Deprecation Policy of the Tizen Platform + API Versioning and Deprecation Policy of the Tizen Platform @@ -32,7 +32,7 @@
    - +

    API Versioning and Deprecation Policy of the Tizen Platform

    As much as the Tizen team wants to have a completely stable API, the evolution of both hardware technology and software capabilities is rapid. To be maximally useful, the API set must evolve to reflect those changes to enable the development of compelling applications that use those features. As an inevitable side effect, APIs may become obsolete and need to be replaced by more feature-rich versions.

    @@ -114,21 +114,21 @@ Gets the package with the given application context. Deprecated: -    Deprecated since 2.3.1. Use app_context_get_app_id() instead. + Deprecated since 2.3.1. Use app_context_get_app_id() instead. Since: -    2.3 + 2.3
  • Deprecated API in the Web API: 
     addAppInfoEventListener
-Adds a listener for receiving notifications for changes 
+Adds a listener for receiving notifications for changes
 in the list of installed applications on a device.
 Deprecated. It is deprecated since Tizen 2.4. Instead, set a listener for getting notified
 of the application changes (add/remove/update) on a device using tizen.package.setPackageInfoEventListener().
 
 long addAppInfoEventListener(ApplicationInformationEventCallback eventCallback);
-             
+
 Since: 2.0
    • @@ -137,9 +137,9 @@ of the application changes (add/remove/update) on a device using tizen.package.s enum telephony_call_state_e Enumeration for the call state. Deprecated: -    Deprecated Since 2.4. Use telephony_call_status_e instead. + Deprecated Since 2.4. Use telephony_call_status_e instead. Since: -    2.3 + 2.3
  • Deprecated type definition in the Native API: @@ -148,9 +148,9 @@ Enumeration for the call state. typedef void* bt_gatt_attribute_h The attribute handle of GATT (Generic Attribute Profile) Deprecated: -    Deprecated since 2.3.1. Use bt_gatt_h instead. + Deprecated since 2.3.1. Use bt_gatt_h instead. Since: -    2.3 + 2.3
    • @@ -167,8 +167,8 @@ will be removed from next release. Use app_context_get_app_id() instead.
  • In a build log message: 
     [2/3] Building src/basicuiwithedc.o
-../src/basicuiwithedc.c:26:19: warning: 'app_get_resource_path' is deprecated [-Wdeprecated-declarations]
-    char *res_path = app_get_resource_path();
+../src/basicuiwithedc.c:26:19: warning: 'app_get_resource_path' is deprecated [-Wdeprecated-declarations]
+    char *res_path = app_get_resource_path();
    • diff --git a/org.tizen.training/html/web/details/details_w.htm b/org.tizen.training/html/web/details/details_w.htm index 992cc97..c1fe50d 100644 --- a/org.tizen.training/html/web/details/details_w.htm +++ b/org.tizen.training/html/web/details/details_w.htm @@ -5,13 +5,13 @@ - + - Understanding Tizen Programming + Understanding Tizen Programming @@ -20,19 +20,19 @@

    Mobile Web Wearable Web TV Web

    - +

    Related Info

    +
    -
    +

    Understanding Tizen Programming

    -

    When designing Tizen Web applications, you need to take into account the following programming concepts:

    +

    When designing Tizen Web applications, you need to take into account the following programming concepts:

    - +
    diff --git a/org.tizen.training/html/web/details/event_handling_w.htm b/org.tizen.training/html/web/details/event_handling_w.htm index cf580c2..9a93d35 100644 --- a/org.tizen.training/html/web/details/event_handling_w.htm +++ b/org.tizen.training/html/web/details/event_handling_w.htm @@ -5,13 +5,13 @@ - + - Event Handling + Event Handling @@ -38,10 +38,10 @@

    This feature is supported in wearable applications only.

    Rotary Events

    - -

    The Tizen platform supports rotary events for user interaction on a wearable rotary device or sensor. The rotary device can rotate clockwise or counter-clockwise, and dispatch an event for each movement. The rotary device has points called detent. If the rotary device detects the detent point while rotating, it dispatches a separate new event about the point. The number of the available detent points depends on the device hardware.

    -

    Figure: Rotary device

    +

    The Tizen platform supports rotary events for user interaction on a wearable rotary device or sensor. The rotary device can rotate clockwise or counter-clockwise, and dispatch an event for each movement. The rotary device has points called detent. If the rotary device detects the detent point while rotating, it dispatches a separate new event about the point. The number of the available detent points depends on the device hardware.

    + +

    Figure: Rotary device

    Rotary device

    Rotary events are used to deliver the rotary device or sensor data to the application. The following table describes the rotary events.

    @@ -64,21 +64,21 @@

    To bind an event callback on rotary events, use the following code:

    -document.addEventListener("rotarydetent", function(ev) 
+document.addEventListener("rotarydetent", function(ev)
 {
-   /* Get the direction value from the event */
-   var direction = ev.detail.direction;
-   
-   if (direction == "CW")
-   {
-      /* Add behavior for clockwise rotation */
-      console.log("clockwise");
-   }
-   else if (direction == "CCW")
-   {
-      /* Add behavior for counter-clockwise rotation */
-      console.log("counter-clockwise");
-   }
+   /* Get the direction value from the event */
+   var direction = ev.detail.direction;
+
+   if (direction == "CW")
+   {
+      /* Add behavior for clockwise rotation */
+      console.log("clockwise");
+   }
+   else if (direction == "CCW")
+   {
+      /* Add behavior for counter-clockwise rotation */
+      console.log("counter-clockwise");
+   }
 });
    @@ -92,7 +92,7 @@ document.addEventListener("rotarydetent", function(ev) 
     /* Check whether high color mode is supported */
-var isHighColorMode = tizen.systeminfo.getCapability("http://tizen.org/feature/screen.always_on.high_color");
+var isHighColorMode = tizen.systeminfo.getCapability("http://tizen.org/feature/screen.always_on.high_color");

    The following table describes the ambient mode events.

    @@ -128,22 +128,22 @@ var isHighColorMode = tizen.systeminfo.getCapability("http://tizen.org/feat

    To bind an event callback on ambient events, use the following code:

    -document.addEventListener("ambientmodechanged", function(ev) 
+document.addEventListener("ambientmodechanged", function(ev)
 {
-   var mode = ev.detail.ambientMode; 
-   if (mode == true) 
-   {
-      /* Change the UI for ambient mode */
-   } 
-   else 
-   {
-      /* Change the UI for normal mode */
-   }
+   var mode = ev.detail.ambientMode;
+   if (mode == true)
+   {
+      /* Change the UI for ambient mode */
+   }
+   else
+   {
+      /* Change the UI for normal mode */
+   }
 });
 
-document.addEventListener("timetick", function(ev) 
+document.addEventListener("timetick", function(ev)
 {
-   /* Update the UI */ 
+   /* Update the UI */
 });
    diff --git a/org.tizen.training/html/web/details/sec_privileges_w.htm b/org.tizen.training/html/web/details/sec_privileges_w.htm index 423b059..e00e4ff 100644 --- a/org.tizen.training/html/web/details/sec_privileges_w.htm +++ b/org.tizen.training/html/web/details/sec_privileges_w.htm @@ -5,7 +5,7 @@ - + @@ -21,15 +21,15 @@ tr.partner-level, tr.platform-level { background-color: #cff }
    -
    +

    Mobile Web Wearable Web TV Web

    - +

    Security and API Privileges

    - +

    To effectively protect the device system and user private data, the Tizen security architecture is based on privileges and application signing of the Linux basic security model, which includes process isolation and mandatory access control. Since Tizen, as an open platform, provides a wide range of features and experiences for users with a variety of applications, the users must be able to grant privileges for security-sensitive operations.

    Tizen provides API-level access control for security-sensitive operations which, if not used correctly, can harm user privacy and system stability. Therefore, applications that use such sensitive APIs must declare the required privileges in the config.xml file. Privileges are categorized into public, partner, and platform levels according to their hierarchy:

    @@ -40,17 +40,17 @@ tr.partner-level, tr.platform-level { background-color: #cff }

    Since Tizen platform 3.0, some privileges are categorized as privacy-related and give an option to the user to switch them on and off. If an application invokes a privacy-related privileged API, the Tizen system checks whether the privilege is allowed for the application. For the application to use the API, the privilege must be declared in the config.xml file and the user must have switched it on.

    - +
    Note In applications with the platform version 3.0 or higher, if you use privacy-related privileged APIs, make sure that the user has switched the privilege on before making the function call. Otherwise, the application does not work as expected.

    The Tizen Studio also provides privilege checker tools to check whether the Tizen application source code contains any privilege violations. For more information, see Verifying Privilege Usage.

    - +

    The following tables list the API privileges, which you must to declare when using security-sensitive API modules.

    -

    Table: Mobile Web Device API privileges

    +

    Table: Mobile Web Device API privileges

    @@ -188,7 +188,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + @@ -279,7 +279,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + @@ -300,7 +300,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + @@ -526,7 +526,7 @@ tr.partner-level, tr.platform-level { background-color: #cff }
    public Call 2.3The application can make phone calls to numbers when they are tapped without further confirmation. This can result in additional charges depending on the user's payment plan.The application can make phone calls to numbers when they are tapped without further confirmation. This can result in additional charges depending on the user's payment plan.
    http://tizen.org/privilege/callhistory.readpublic Sensor 2.3The application can read the user's health information gathered by device sensors, such as pedometer or heart rate monitor.The application can read the user's health information gathered by device sensors, such as pedometer or heart rate monitor.
    http://tizen.org/privilege/imepublic Location 2.2.1The application can read the user's location information.The application can read the user's location information.
    http://tizen.org/privilege/mediacontroller.client
    -

    Table: Mobile Web Supplementary API privileges

    +

    Table: Mobile Web Supplementary API privileges

    @@ -546,7 +546,7 @@ tr.partner-level, tr.platform-level { background-color: #cff }
    -

    Table: Wearable Web Device API privileges

    +

    Table: Wearable Web Device API privileges

    @@ -694,7 +694,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + @@ -715,7 +715,7 @@ tr.partner-level, tr.platform-level { background-color: #cff } - + @@ -853,7 +853,7 @@ tr.partner-level, tr.platform-level { background-color: #cff }
    public Sensor 2.2.1The application can read the user's health information gathered by device sensors, such as pedometer or heart rate monitor.The application can read the user's health information gathered by device sensors, such as pedometer or heart rate monitor.
    http://tizen.org/privilege/imepublic Location 2.2.1The application can read the user's location information.The application can read the user's location information.
    http://tizen.org/privilege/mediacontroller.client
    -

    Table: Wearable Web W3C/HTML5 API privileges

    +

    Table: Wearable Web W3C/HTML5 API privileges

    diff --git a/org.tizen.training/html/web/details/sign_certificate_w.htm b/org.tizen.training/html/web/details/sign_certificate_w.htm index 38c5415..a293027 100644 --- a/org.tizen.training/html/web/details/sign_certificate_w.htm +++ b/org.tizen.training/html/web/details/sign_certificate_w.htm @@ -5,13 +5,13 @@ - + - Application Signing and Certificates + Application Signing and Certificates @@ -26,10 +26,10 @@
  • Signature Type
  • Certificate and API Privileges
  • Signing Flow and Getting Certificates
    • -
  • Signature Specification
    • +
  • Signature Specification
    • - +

    Application Signing and Certificates

    @@ -40,13 +40,13 @@

    Through application signing, Tizen achieves the following goals:

    • Ensuring application integrity: Users can download an application that has not been tampered with after development.
      • -
    • Identifying the application developer: The applications with the same signing key are regarded as developed by the same developer. A set of applications with same developer's signing key can share secured resources as the developer intended.
      • +
    • Identifying the application developer: The applications with the same signing key are regarded as developed by the same developer. A set of applications with same developer's signing key can share secured resources as the developer intended.
    • Proof of store validation: An application store performs some validation checks before distributing an application. As the proof of store validation, the application store signs the application.
    • Enforcing proper usage of privileged APIs: An application distributor, such as an application store, can restrict the API set used by the application by signing a key with a proper privilege.
    - +

    Signature Type

    - +

    All Tizen applications must have at least 2 signatures:

    • Author signature: @@ -54,7 +54,7 @@
    • You sign the author signature with your own author signing key in the Tizen Studio.
    • Applications with the same author signing key are regarded as developed by the same developer.
    • Application upgrade is allowed only when the author signature of the old version and the new version are signed with a same author signing key.
      • -
    • A set of applications with a same author's signing key can share secured resources as the author (developer) intended.
      • +
    • A set of applications with a same author's signing key can share secured resources as the author (developer) intended.
  • Distributor signature: @@ -110,7 +110,7 @@

    Signing Flow and Getting Certificates

    - +

    You can sign your application with your own author signing key and a testing distributor signing key in the Tizen Studio. With those, you can install and test the application on your test device and an emulator.

    When the application is submitted to a store after development, the store removes the testing distributor signature and adds the store distributor signature for the application release. Normal applications are signed with the public level distributor signing key in the store. Some applications granted from a device vendor are allowed to be signed with the partner level distributor signing key. Signing with the platform level distributor key is permitted only for the internal application of a device vendor or Tizen.

    @@ -122,7 +122,7 @@

    The testing distributor certificate and its signing key with the public level are preloaded in the Tizen Studio. The author certificate and its signing key can also be created in the Tizen Studio. For more information, see Working with the Certificate Profile.

    A device vendor can disallow unauthorized applications to be installed on its devices to protect its devices from viruses and malwares. Samsung also disallows unauthorized applications to be installed on its Tizen devices. In such cases, you must get an author certificate and a distributor certificate from the device vendor. For more information, see Issuing a Tizen Certificate and Running Applications in Commercial Devices.

    -

    Signature Specification

    +

    Signature Specification

    The application signing scheme of Tizen follows the specification of the XML Digital signature for widget specified by W3C.

    diff --git a/org.tizen.training/html/web/details/tizen_apis_w.htm b/org.tizen.training/html/web/details/tizen_apis_w.htm index 1531c59..416ab5a 100644 --- a/org.tizen.training/html/web/details/tizen_apis_w.htm +++ b/org.tizen.training/html/web/details/tizen_apis_w.htm @@ -5,536 +5,536 @@ - + - Tizen APIs + Tizen APIs
    -
    +

    • Mobile Web Wearable Web TV Web

    - +

    Tizen APIs

    Using the Tizen Web API modules, you can develop rich Web applications and build great application experiences with well-known Web programming languages: HTML, CSS, and JavaScript. Just like every major browser in the market, the Tizen Web API modules support the latest HTML5 capabilities, such as animation, offline, audio, and video. By utilizing the standard HTML5 capabilities, your Web applications are ready to run across various devices and platforms with minimal customization. In addition to the JavaScript-based Tizen Device API, you can also enable advanced device access from your Web applications, such as Bluetooth and NFC.

    -

    The Tizen platform supports hybrid applications (1 Web application and 1 or more native applications). A hybrid application package is very useful to Web applications that need background processing or monitoring. With a hybrid application package, you can register the included applications in the Tizen Store and install, upgrade, and uninstall them using a single hybrid package. For more information on developing hybrid Web applications with Tizen devices, see Packaging Hybrid Applications.

    - +

    The Tizen platform supports hybrid applications (1 Web application and 1 or more native applications). A hybrid application package is very useful to Web applications that need background processing or monitoring. With a hybrid application package, you can register the included applications in the Tizen Store and install, upgrade, and uninstall them using a single hybrid package. For more information on developing hybrid Web applications with Tizen devices, see Packaging Hybrid Applications.

    +

    Tizen provides a wide range of Web API modules that allow you to take full advantage of various Tizen features.

    The following table lists the features provided by the Mobile Web Device API Reference.

    -

    Table: Device API features provided for mobile applications

    -
    +

    Table: Device API features provided for mobile applications

    +
    - - - - - - - - - - - - - - - + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + + + - - - - - + + + + + - - - - - - - - - - + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - +

    Sensors

    +
  • API Reference: System
    • + + + + + + + + + + + + +
    FeaturePurposeDocumentation
    BaseThese APIs contain classes and interfaces that provide a set of basic definitions and interfaces that are used in the Tizen Device API. -

    You can manage common files and zip archive files, and use filters and sorting modes for query methods, generic success and error event handlers, a generic error interface, and a simple coordinate interface for defining location information.

    		 -
      -
    • Guides: +
    FeaturePurposeDocumentation
    BaseThese APIs contain classes and interfaces that provide a set of basic definitions and interfaces that are used in the Tizen Device API. +

    You can manage common files and zip archive files, and use filters and sorting modes for query methods, generic success and error event handlers, a generic error interface, and a simple coordinate interface for defining location information.

    		 +
    AccountThis API contains classes and interfaces that enable you to manage account features. -

    You can use existing configured on-line accounts and providers, and create new accounts of known types.

    		 -
    Application FrameworkThese APIs contain classes and interfaces that enable you to manage alarm, application, and package features. -

    You can schedule an application to be run at a specific time, retrieve information about the applications installed or running on the device, and enable package management.

    		 -
      +
    • API Reference: Base
      • +
    AccountThis API contains classes and interfaces that enable you to manage account features. +

    You can use existing configured on-line accounts and providers, and create new accounts of known types.

    		 +
    Application FrameworkThese APIs contain classes and interfaces that enable you to manage alarm, application, and package features. +

    You can schedule an application to be run at a specific time, retrieve information about the applications installed or running on the device, and enable package management.

    		 +
    ContentThese APIs contain classes and interfaces that enable you to manage content and download features. -

    You can search and manage multimedia content locally, download files from the Internet, and monitor the download progress and status.

    		 -
    ContentThese APIs contain classes and interfaces that enable you to manage content and download features. +

    You can search and manage multimedia content locally, download files from the Internet, and monitor the download progress and status.

    		 +
    MessagingThese APIs contain classes and interfaces that enable you to manage SMS, MMS, and email messages. -

    You can send and receive messages, and receive push notifications from a push server.

    		 -
    MultimediaThese APIs contain classes and interfaces that enable you to manage multimedia-related features. -

    You can change and monitor playback volume level, and listen to the FM radio.

    		 -
    MessagingThese APIs contain classes and interfaces that enable you to manage SMS, MMS, and email messages. +

    You can send and receive messages, and receive push notifications from a push server.

    		 +
    MultimediaThese APIs contain classes and interfaces that enable you to manage multimedia-related features. +

    You can change and monitor playback volume level, and listen to the FM radio.

    		 +
    NetworkThese APIs contain classes and interfaces that enable you to manage Bluetooth, NFC (Near Field Communication), and secure element features. -

    You can transfer data over a Bluetooth connection, share contacts, photos, and videos using NFC, and access secure elements, such as SIM card and secure SD card, in a device.

    		 -
    SecurityThese APIs contain classes and interfaces that enable you to manage secure keys in your application. -

    You can use security functionalities, such as storing and recalling private data.

    		 -
    SocialThese APIs contain classes and interfaces that enable you to manage bookmark, calendar, call history, contact, and data synchronization features. -

    You can manage the Tizen Web browser bookmark list, calendar events and tasks, call history, and address books and contacts on a device, and you can synchronize device data, such as contacts and calendar events, with the OMA DS server.

    		 -
    SystemThese APIs contain classes and interfaces that enable you to manage power, system information and setting, time, and Web setting features. -

    You can access the state of the device power resource, device system information, and device wallpaper settings, you can use locale-specific calendar features by retrieving date and time information, and set feedback patterns for specified actions. You can manage time features, and set Web view properties, such as setting Web view user agents and deleting Web view cookies.

    		 -
    NetworkThese APIs contain classes and interfaces that enable you to manage Bluetooth, NFC (Near Field Communication), and secure element features. +

    You can transfer data over a Bluetooth connection, share contacts, photos, and videos using NFC, and access secure elements, such as SIM card and secure SD card, in a device.

    		 +
    SecurityThese APIs contain classes and interfaces that enable you to manage secure keys in your application. +

    You can use security functionalities, such as storing and recalling private data.

    		 +
    SocialThese APIs contain classes and interfaces that enable you to manage bookmark, calendar, call history, contact, and data synchronization features. +

    You can manage the Tizen Web browser bookmark list, calendar events and tasks, call history, and address books and contacts on a device, and you can synchronize device data, such as contacts and calendar events, with the OMA DS server.

    		 +
    SystemThese APIs contain classes and interfaces that enable you to manage power, system information and setting, time, and Web setting features. +

    You can access the state of the device power resource, device system information, and device wallpaper settings, you can use locale-specific calendar features by retrieving date and time information, and set feedback patterns for specified actions. You can manage time features, and set Web view properties, such as setting Web view user agents and deleting Web view cookies.

    		 +
    CordovaThese APIs contain classes and interfaces that enable you use common functionalities in creating Tizen Web applications. -

    You can manage the device filesystem, individual files, and various events, access device and network information and the device accelerometer, create dialog boxes and system log entries, and play audio files.

    		 -
    Web UI FrameworkThese APIs contain classes and interfaces that enable you to manage the Tizen Advanced UI (TAU) features. -

    You can create and manage various kinds of UI components.

    		 -
    CordovaThese APIs contain classes and interfaces that enable you use common functionalities in creating Tizen Web applications. +

    You can manage the device filesystem, individual files, and various events, access device and network information and the device accelerometer, create dialog boxes and system log entries, and play audio files.

    		 +
    Web UI FrameworkThese APIs contain classes and interfaces that enable you to manage the Tizen Advanced UI (TAU) features. +

    You can create and manage various kinds of UI components.

    		 +
    - +

    The following table lists the features provided by the Wearable Web Device API Reference.

    -

    Table: Device API features provided for wearable applications

    - - - - - - - - - - - - - - - - + + + +
    FeaturePurposeDocumentation
    BaseThese APIs contain classes and interfaces that provide a set of basic definitions and interfaces that are used in the Tizen Device API. -

    You can manage common files and zip archive files, and use filters and sorting modes for query methods, generic success and error event handlers, a generic error interface, and a simple coordinate interface for defining location information.

    		 -
      -
    • Guides: +

      Table: Device API features provided for wearable applications

      + + + + + + + + + + + + + + + + - - - - - + + + + + +

      Text Input

      +
    • API Reference: Application Framework
      • + - - - - + + + - - - - - +

      Media and Camera

      +
    • API Reference: Content
      • + + + + + + - - - - + + + - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + - - - - - - - - - - - - +

      Sensors

      +
    • API Reference: System
      • + + + + + + + + + + + + +
      FeaturePurposeDocumentation
      BaseThese APIs contain classes and interfaces that provide a set of basic definitions and interfaces that are used in the Tizen Device API. +

      You can manage common files and zip archive files, and use filters and sorting modes for query methods, generic success and error event handlers, a generic error interface, and a simple coordinate interface for defining location information.

      		 +
      Application FrameworkThese APIs contain classes and interfaces that enable you to manage alarm, application, and package features. -

      You can schedule an application to be run at a specific time, retrieve information about the applications installed or running on the device, and enable package management.

      		 -
      Application FrameworkThese APIs contain classes and interfaces that enable you to manage alarm, application, and package features. +

      You can schedule an application to be run at a specific time, retrieve information about the applications installed or running on the device, and enable package management.

      		 +
      ContentThese APIs contain classes and interfaces that enable you to manage content and download features. -

      You can search and manage multimedia content locally, download files from the Internet, and monitor the download progress and status.

      		 -
        -
      • Guides: +
      ContentThese APIs contain classes and interfaces that enable you to manage content and download features. +

      You can search and manage multimedia content locally, download files from the Internet, and monitor the download progress and status.

      		 +
      MessagingThese APIs contain classes and interfaces that enable you to manage push messaging. -

      You can receive push notifications from a push server.

      		 -
      MessagingThese APIs contain classes and interfaces that enable you to manage push messaging. +

      You can receive push notifications from a push server.

      		 +
      MultimediaThese APIs contain classes and interfaces that enable you to manage multimedia-related features. -

      You can change and monitor playback volume level, and listen to the FM radio.

      		 -
        +
      MultimediaThese APIs contain classes and interfaces that enable you to manage multimedia-related features. +

      You can change and monitor playback volume level, and listen to the FM radio.

      		 +
      NetworkThese APIs contain classes and interfaces that enable you to manage Bluetooth, NFC (Near Field Communication), and secure element features. -

      You can transfer data over a Bluetooth connection, share contacts, photos, and videos using NFC, and access secure elements, such as SIM card and secure SD card, in a device.

      		 -
      SecurityThese APIs contain classes and interfaces that enable you to manage secure keys in your application. -

      You can use security functionalities, such as storing and recalling private data.

      		 -
      SystemThese APIs contain classes and interfaces that enable you to manage power, system information and setting, and time features. -

      You can access the state of the device power resource, device system information, and device wallpaper settings, you can use locale-specific calendar features by retrieving date and time information, and set feedback patterns for specified actions. You can also manage time features.

      		 -
      NetworkThese APIs contain classes and interfaces that enable you to manage Bluetooth, NFC (Near Field Communication), and secure element features. +

      You can transfer data over a Bluetooth connection, share contacts, photos, and videos using NFC, and access secure elements, such as SIM card and secure SD card, in a device.

      		 +
      SecurityThese APIs contain classes and interfaces that enable you to manage secure keys in your application. +

      You can use security functionalities, such as storing and recalling private data.

      		 +
      SystemThese APIs contain classes and interfaces that enable you to manage power, system information and setting, and time features. +

      You can access the state of the device power resource, device system information, and device wallpaper settings, you can use locale-specific calendar features by retrieving date and time information, and set feedback patterns for specified actions. You can also manage time features.

      		 +
      CordovaThese APIs contain classes and interfaces that enable you use common functionalities in creating Tizen Web applications. -

      You can manage the device filesystem, individual files, and various events, access device and network information and the device accelerometer, create dialog boxes and system log entries, and play audio files.

      		 -
      Web UI FrameworkThese APIs contain classes and interfaces that enable you to manage the Tizen Advanced UI (TAU) features. -

      You can create and manage various kinds of UI components.

      		 -
      CordovaThese APIs contain classes and interfaces that enable you use common functionalities in creating Tizen Web applications. +

      You can manage the device filesystem, individual files, and various events, access device and network information and the device accelerometer, create dialog boxes and system log entries, and play audio files.

      		 +
      Web UI FrameworkThese APIs contain classes and interfaces that enable you to manage the Tizen Advanced UI (TAU) features. +

      You can create and manage various kinds of UI components.

      		 +
      - +

      The following table lists the features provided by the Mobile Web W3C/HTML5 and Supplementaries API Reference.

      -

      Table: W3C/HTML5 and some supplementary API features provided for mobile applications

      - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      FeaturePurposeDocumentation
      DOM, Forms and StylesThese APIs enable you to create animations, specify the border and background styles of HTML elements, apply styles to HTML documents, specify the color and opacity of HTML elements, create flexible and multi-column layouts for Web applications, move, rotate, stretch, and scale elements, and add effects using the CSS3 properties. They also enable you to use CSS and JavaScript code effectively with HTML elements, implement Web forms for user input, define media features for specific output devices, select element nodes in the DOM tree, and store the information of the page that the user has viewed. -
      DeviceThese APIs enable you to retrieve the battery status and detect changes in it, detect rotation and acceleration motions, manage screen orientation, implement and control various types of touch events, and implement different vibration patterns on a Tizen device. -
      GraphicsThese APIs enable you to create images, shapes, and text using the HTML5 canvas element and HTML canvas 2D context, and create and modify SVG elements in your application. -
      MediaThese APIs enable you to access a local device to generate a multimedia stream, access the media capture capabilities based on their type, control multimedia playback and check supported media formats, and play audio content. -
      CommunicationThese APIs enable you to send and receive data between Web sites and through a message channel, exchange push data with the server, connect to the socket server to send and receive data, and use cross-origin resource sharing (CORS) to request and send data of various content types. -
        +

        Table: W3C/HTML5 and some supplementary API features provided for mobile applications

        + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        FeaturePurposeDocumentation
        DOM, Forms and StylesThese APIs enable you to create animations, specify the border and background styles of HTML elements, apply styles to HTML documents, specify the color and opacity of HTML elements, create flexible and multi-column layouts for Web applications, move, rotate, stretch, and scale elements, and add effects using the CSS3 properties. They also enable you to use CSS and JavaScript code effectively with HTML elements, implement Web forms for user input, define media features for specific output devices, select element nodes in the DOM tree, and store the information of the page that the user has viewed. +
        DeviceThese APIs enable you to retrieve the battery status and detect changes in it, detect rotation and acceleration motions, manage screen orientation, implement and control various types of touch events, and implement different vibration patterns on a Tizen device. +
        GraphicsThese APIs enable you to create images, shapes, and text using the HTML5 canvas element and HTML canvas 2D context, and create and modify SVG elements in your application. +
        MediaThese APIs enable you to access a local device to generate a multimedia stream, access the media capture capabilities based on their type, control multimedia playback and check supported media formats, and play audio content. +
        CommunicationThese APIs enable you to send and receive data between Web sites and through a message channel, exchange push data with the server, connect to the socket server to send and receive data, and use cross-origin resource sharing (CORS) to request and send data of various content types. +
        StorageThese APIs enable you to retrieve file content and information, slice data objects, manage sandboxed file systems, activate project resource caching and manage the cached resources, create an object store and save data in it, create databases and access them using SQL statements, and use session storage and local storage. -
        SecurityThese APIs enable you to allow or block specific HTML elements on a Web page, and make cross-origin requests to resources, allowing a client-side Web application to obtain data retrieved from another origin. -
        UIThese APIs enable you to copy content and paste it in an editable area, create and manage draggable elements, and implement drag events. -
        Performance and OptimizationThese APIs enable you to retrieve the visibility status of a Web document and detect changes in it, control animation frame rate, and create and manage HTML5 Web Workers to run an independent JavaScript thread on the background. -
        LocationThese APIs enable you to retrieve and update position information. -
        SupplementaryThese APIs enable you to manage some supplementary features, such as displaying an element on full screen, accessing binary data in JavaScript, and using the WebGL graphics library to create 3D visual elements. -
        - - +
      • API Reference: Communication
        • +
      StorageThese APIs enable you to retrieve file content and information, slice data objects, manage sandboxed file systems, activate project resource caching and manage the cached resources, create an object store and save data in it, create databases and access them using SQL statements, and use session storage and local storage. +
      SecurityThese APIs enable you to allow or block specific HTML elements on a Web page, and make cross-origin requests to resources, allowing a client-side Web application to obtain data retrieved from another origin. +
      UIThese APIs enable you to copy content and paste it in an editable area, create and manage draggable elements, and implement drag events. +
      Performance and OptimizationThese APIs enable you to retrieve the visibility status of a Web document and detect changes in it, control animation frame rate, and create and manage HTML5 Web Workers to run an independent JavaScript thread on the background. +
      LocationThese APIs enable you to retrieve and update position information. +
      SupplementaryThese APIs enable you to manage some supplementary features, such as displaying an element on full screen, accessing binary data in JavaScript, and using the WebGL graphics library to create 3D visual elements. +
      + +

      The following table lists the features provided by the Wearable Web W3C/HTML5 and Supplementaries API Reference.

      -

      Table: W3C/HTML5 and some supplementary API features provided for wearable applications

      - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + +
      FeaturePurposeDocumentation
      DOM, Forms and StylesThese APIs enable you to create animations, specify the border and background styles of HTML elements, apply styles to HTML documents, specify the color and opacity of HTML elements, create flexible layouts for Web applications, move, rotate, stretch, and scale elements, and add effects using the CSS3 properties. They also enable you to use CSS and JavaScript code effectively with HTML elements, implement Web forms for user input, define media features for specific output devices, select element nodes in the DOM tree, and store the information of the page that the user has viewed. -
      DeviceThese APIs enable you to retrieve the battery status and detect changes in it, detect rotation and acceleration motions, implement and control various types of touch events, and implement different vibration patterns on a Tizen wearable device. -
        +

        Table: W3C/HTML5 and some supplementary API features provided for wearable applications

        + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - - - - - - - - - - - - - -
        FeaturePurposeDocumentation
        DOM, Forms and StylesThese APIs enable you to create animations, specify the border and background styles of HTML elements, apply styles to HTML documents, specify the color and opacity of HTML elements, create flexible layouts for Web applications, move, rotate, stretch, and scale elements, and add effects using the CSS3 properties. They also enable you to use CSS and JavaScript code effectively with HTML elements, implement Web forms for user input, define media features for specific output devices, select element nodes in the DOM tree, and store the information of the page that the user has viewed. +
        DeviceThese APIs enable you to retrieve the battery status and detect changes in it, detect rotation and acceleration motions, implement and control various types of touch events, and implement different vibration patterns on a Tizen wearable device. +
        GraphicsThese APIs enable you to create images, shapes, and text using the HTML5 canvas element and HTML canvas 2D context. -
        MediaThese APIs enable you to access a local device to generate a multimedia stream, control multimedia playback and check supported media formats, and play audio content. -
        GraphicsThese APIs enable you to create images, shapes, and text using the HTML5 canvas element and HTML canvas 2D context. +
        MediaThese APIs enable you to access a local device to generate a multimedia stream, control multimedia playback and check supported media formats, and play audio content. +
        CommunicationThese APIs enable you to send and receive data between Web sites and through a message channel, and connect to the socket server to send and receive data. -
          +
        • API Reference: Media
          • +
        CommunicationThese APIs enable you to send and receive data between Web sites and through a message channel, and connect to the socket server to send and receive data. +
        StorageThese APIs enable you to retrieve file content and information, create an object store and save data in it, and use session storage and local storage. -
        StorageThese APIs enable you to retrieve file content and information, create an object store and save data in it, and use session storage and local storage. +
        SecurityThese APIs enable you to allow or block specific HTML elements on a Web page. -
        SecurityThese APIs enable you to allow or block specific HTML elements on a Web page. +
        Performance and OptimizationThese APIs enable you to retrieve the visibility status of a Web document and detect changes in it, control animation frame rate, and create and manage HTML5 Web Workers to run an independent JavaScript thread on the background. -
        LocationThese APIs enable you to retrieve and update position information. -
        SupplementaryThese APIs enable you to manage some supplementary features, such as managing the device camera, accessing binary data in JavaScript, and using the WebGL graphics library to create 3D visual elements. -
        - +
      • API Reference: Security
        • +
      Performance and OptimizationThese APIs enable you to retrieve the visibility status of a Web document and detect changes in it, control animation frame rate, and create and manage HTML5 Web Workers to run an independent JavaScript thread on the background. +
      LocationThese APIs enable you to retrieve and update position information. +
      SupplementaryThese APIs enable you to manage some supplementary features, such as managing the device camera, accessing binary data in JavaScript, and using the WebGL graphics library to create 3D visual elements. +
      + diff --git a/org.tizen.training/html/web/details/web_runtime_w.htm b/org.tizen.training/html/web/details/web_runtime_w.htm index 97f1203..ee20083 100644 --- a/org.tizen.training/html/web/details/web_runtime_w.htm +++ b/org.tizen.training/html/web/details/web_runtime_w.htm @@ -5,14 +5,14 @@ - + - Web Runtime - + Web Runtime + @@ -21,7 +21,7 @@

      Mobile Web Wearable Web TV Web

      - +

      Content

      - +

      Web Runtime

      -

      The Web Runtime (WRT) engine allows Web applications to run outside the browser. You can install Web applications and use them as standalone applications.

      -

      The Web Runtime features include the following:

      - - -

      Managing Web Applications

      -

      The Web Runtime supports the following Web application types:

      -
        -

      • Packaged Web applications

        • -

      • Hosted Web applications

        • -
      -

      All Web applications must be packaged according to Widget Packaging and XML Configuration guidelines. However, unlike packaged Web applications, the hosted Web applications have an externally hosted document as their starting page. For more information, see Extending Configuration Elements (in mobile and wearable applications).

      -

      You can manage Web applications by:

      -
        -
      • Installing Web applications

        To install a Web application, see the guidelines for processing a Web application package. After the installation is completed, the WRT sends a notification of the result.

        The Web Runtime also registers the Web application on the device's idle screen. It uses an icon and Web application name derived according to Web application packaging rules.

        +

        The Web Runtime (WRT) engine allows Web applications to run outside the browser. You can install Web applications and use them as standalone applications.

        +

        The Web Runtime features include the following:

        + + +

        Managing Web Applications

        +

        The Web Runtime supports the following Web application types:

        +
          +

        • Packaged Web applications

          • +

        • Hosted Web applications

          • +
        +

        All Web applications must be packaged according to Widget Packaging and XML Configuration guidelines. However, unlike packaged Web applications, the hosted Web applications have an externally hosted document as their starting page. For more information, see Extending Configuration Elements (in mobile and wearable applications).

        +

        You can manage Web applications by:

        +
          +
        • Installing Web applications

          To install a Web application, see the guidelines for processing a Web application package. After the installation is completed, the WRT sends a notification of the result.

          The Web Runtime also registers the Web application on the device's idle screen. It uses an icon and Web application name derived according to Web application packaging rules.

          If a Web application installation fails due to power failure, the Web Runtime reinstalls it during next booting. The Web Runtime aborts the installation in the following situations:

            @@ -60,14 +60,14 @@
          • Web application privilege level is Public, and 1 or more Partner or Platform level API privileges are declared in the configuration file.
          - +
          Note A Web application can be installed from the Tizen Store or can be side-loaded (for example, through a browser or Bluetooth). The <feature> element is ignored in the Tizen Web application installation process.
          -
          • -
        • Updating Web applications +
          • +
        • Updating Web applications

          The WRT supports updating Web applications when there is a new version available.

          The following rules apply during the Web application updating process:

          @@ -77,38 +77,38 @@
        • If the Web application that is being updated has no author signature, it is not updated if the new version has an author signature.
        • The updating process is similar to the installation process.
        • Web application data, such as Tizen settings, cookies, and local storage are preserved across updates. You must ensure that the old data in your application is still usable after the update.
          • -
        • -
      • Uninstalling Web applications

        The WRT supports the uninstallation of Web applications. During the uninstallation process, all Web application data, such as preferences, local storage data, cookies, and the local storage folder, are removed.

        • +
      • +
    • Uninstalling Web applications

      The WRT supports the uninstallation of Web applications. During the uninstallation process, all Web application data, such as preferences, local storage data, cookies, and the local storage folder, are removed.

    • Managing Web application life-cycle

      The WRT supports W3C DOM load and unload, and the Page Visibility events for all pages.

      When a Web application is sent to the background or hidden, the JavaScript execution and rendering, including CSS animations, is suspended, unless the application is specifically configured to be a background service.

      When a Web application returns to the foreground, the JavaScript execution and rendering is resumed.

      The Web Runtime supports the following URI schemes: sms://, mmsto://, and mailto://.

      For each supported URI scheme, the Web Runtime launches a registered platform scheme handler with appropriate parameters.

      The content localization is supported according to the Widget Packaging and Configuration.

      -
      • -
    - -

    Web Runtime API Support

    -

    The main functionality of the Web Runtime is to provide the following Tizen Web APIs to Web applications:

    - + + + +

    Web Runtime API Support

    +

    The main functionality of the Web Runtime is to provide the following Tizen Web APIs to Web applications:

    +

    It also supports multiple browsing context creation within a single Web application using, for example, the window.open() method, or hyperlink navigation.

    Tizen Web APIs can be accessed in the top-level browsing context, such as main document window, and nested browsing contexts, such as iframes.

    - +
    Note Tizen Device API can only be used with a locally packaged page. Tizen Device APIs are not available in cross-origin pages.
    - +

    To access the host page of your Web application, add the domain for access in the config.xml file. For more information, see Content Security Policy.

    -

    The Web Runtime also supports the following features:

    -
      -

    • Widget Interface

      • -

    • maximized and fullscreen view modes of the 'view-mode' Media Feature.

      • +

      The Web Runtime also supports the following features:

      + -

      Web Application Security and Privacy

      - +

      Web Application Security and Privacy

      +

      The Web application security consists of the following elements:

      - +

      Web Application Signature

      -

      The Web Runtime follows the XML digital widget signature process:

      -
        -
      • Web application can be signed by the author and distributors.
        • +

        The Web Runtime follows the XML digital widget signature process:

        +
          +
        • Web application can be signed by the author and distributors.
        • The first valid Tizen distributor signature, signature1.xml, determines the privilege level of the Web application, which is Public, Partner, or Platform.
        • Web application is installed as a trusted application when it is signed with valid signatures and its privilege level is Public, Partner, or Platform.
        • Web application is installed as an untrusted application if it is:
          • Not signed by an author or distributor signature.
          • Signed with a valid signature, but its privilege level is not Public, Partner, or Platform.
            • -
          • -
        • If the signature of a Web application is invalid, it cannot be installed.
          • -
        - +
      +
    • If the signature of a Web application is invalid, it cannot be installed.
      • +
    +

    Web Application Protection

    -

    For Web applications that explicitly turn on encryption (in mobile and wearable applications) using the <tizen:setting /> element in the configuration file, the Web Runtime provides the following protection features:

    -
      -
    • HTML, JavaScript, and CSS files of the Web application stored by the device are encrypted.
      • -
    • When the Web application is launched, the WRT decrypts all of its resources in a manner which is transparent to the Web application itself.
      • -
    - +

    For Web applications that explicitly turn on encryption (in mobile and wearable applications) using the <tizen:setting /> element in the configuration file, the Web Runtime provides the following protection features:

    +
      +
    • HTML, JavaScript, and CSS files of the Web application stored by the device are encrypted.
      • +
    • When the Web application is launched, the WRT decrypts all of its resources in a manner which is transparent to the Web application itself.
      • +
    +

    Private Storage Support

    Each Web application has its own private storage space that is not accessible to any other application.

    - +

    HTML5 API Security Policy

    The Web applications can use HTML5 APIs, some of which need user permission to execute the API call. For such APIs, the Web Runtime supports specific privileges.

    - +

    The following table summarizes distributor signature type to API privilege level behavior mapping.

    Table: HTML5 API privileges and behavior

    @@ -187,12 +187,12 @@ - +
    Video Recording (in wearable applications only)http://tizen.org/privilege/camerahttp://tizen.org/privilege/camera
    - +

    Tizen Device API Security Policy

    Web Runtime also provides access to sensitive Device API features after consulting the platform-defined security policy. A Web application or an individual user cannot elevate the permissions set by the platform-defined security policy. The mapping between each Tizen Device API and the corresponding privilege is defined in the API definitions in the Tizen Device API Reference.

    The following table summarizes distributor signature type to API privilege level behavior mapping:

    @@ -238,26 +238,26 @@

    In the CSP-based security mode, the Web Runtime provides content security as per Content Security Policy 1.0. CSP policies can be delivered from the following sources:

      -
    • Default policy (enforced by WRT, if required): default-src *; script-src 'self'; style-src 'self'; object-src 'none';
      • +
    • Default policy (enforced by WRT, if required): default-src *; script-src 'self'; style-src 'self'; object-src 'none';
    • config.xml: <tizen:content-security-policy> or <tizen:content-security-policy-report-only>

      If the CSP is defined in the config.xml file, the configuration-based CSP policy is enforced and the default CSP is ignored.

      If the CSP policy is not defined in the config.xml file, the default CSP policy is enforced.

    • HTTP header: Content-Security-Policy or Content-Security-Policy-Report-Only

      If a CSP is present in the HTTP header, the most restrictive policy in the configuration-based CSP and HTTP-based CSP is applied.

    -

    Otherwise, the Web application is set to the WARP-based security mode. In this mode, the Web application network and content security is enforced by the legacy <access> tag according to Widget Access Request Policy.

    - +

    Otherwise, the Web application is set to the WARP-based security mode. In this mode, the Web application network and content security is enforced by the legacy <access> tag according to Widget Access Request Policy.

    +
    Note The default CSP enforcement is subject to change in the future.
    - +
    Note If a Web application declares the <tizen:allow-navigation> element in its configuration document, the main resource navigation (through the window.open() method or a hyperlink) to an external URL is allowed or restricted accordingly.
    - + diff --git a/org.tizen.training/html/web/getting_started_w.htm b/org.tizen.training/html/web/getting_started_w.htm index 5b8d0ad..3b1f0d3 100644 --- a/org.tizen.training/html/web/getting_started_w.htm +++ b/org.tizen.training/html/web/getting_started_w.htm @@ -5,25 +5,25 @@ - + - Getting Started with Web Applications + Getting Started with Web Applications
    -
    +

    Mobile Web Wearable Web

    - +

    Getting Started with Web Applications

    diff --git a/org.tizen.training/html/web/mobile/first_app_mw.htm b/org.tizen.training/html/web/mobile/first_app_mw.htm index 0e0e72c..88db5c1 100644 --- a/org.tizen.training/html/web/mobile/first_app_mw.htm +++ b/org.tizen.training/html/web/mobile/first_app_mw.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Mobile Web Application + Creating Your First Tizen Mobile Web Application @@ -265,13 +265,13 @@

    If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

    -

    Selecting the emulator to use

    +

    Selecting the emulator to use

  • Confirm that the application launches on the emulator.

    Application running in the emulator

    - +
    Note If the emulator display has switched off, you cannot see the application launch. To see the application on the emulator screen: @@ -321,7 +321,7 @@
  • Run the application:
    1. In the Connection Explorer view, select the device.
      2. -
    2. In Project Explorer view, right-click the project and select Run As > Tizen Web Application. +
    3. In Project Explorer view, right-click the project and select Run As > Tizen Web Application.

      Running the application on a target device

      @@ -331,7 +331,7 @@

      If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

      -

      Selecting the device to use

      +

      Selecting the device to use

    4. Confirm that the application launches in the target device.
      5. @@ -346,9 +346,9 @@

      Run Configurations window

    • - - -

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    + + +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    @@ -361,19 +361,19 @@

    The W3C specifications provide HTML and CSS features for creating a user interface. With HTML, you can define the structure of the application screens, while CSS allows you to define the look and feel of the screens.

    -

    HTML

    +

    HTML

    HTML DOM is a structured model to control Web elements. It is an official W3C standard to express the document regardless of platforms or languages, and the foundation of the HTML5 APIs.

    The <html> element is the top-level element of the HTML DOM tree that wraps the entire document, and it has the <head> and <body> elements as child nodes:

     <!DOCTYPE html>
 <html>
-   <head>
-      <!--Content-->
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <!--Content-->
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -387,19 +387,19 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="utf-8" />
-      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
-      <meta name="description" content="Tizen Mobile Web Basic Template"/>
-
-      <title>Tizen Mobile Web Basic Application</title>
-
-      <link rel="stylesheet" type="text/css" href="css/style.css"/>
-      <script src="js/main.js"></script>
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <meta charset="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+      <meta name="description" content="Tizen Mobile Web Basic Template"/>
+
+      <title>Tizen Mobile Web Basic Application</title>
+
+      <link rel="stylesheet" type="text/css" href="css/style.css"/>
+      <script src="js/main.js"></script>
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -407,17 +407,17 @@ 
     <body>
-   <div id="main" class="page">
-      <div class="contents">
-         <span id="content-text">Basic</span>
-      </div>
-   </div>
+   <div id="main" class="page">
+      <div class="contents">
+         <span id="content-text">Basic</span>
+      </div>
+   </div>
 </body>

    The HTML code displays the Basic text on the screen.

    -

    Figure: Screen with Basic text

    +

    Figure: Screen with Basic text

    Screen with Basic text

    CSS

    @@ -437,19 +437,19 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="utf-8" />
-      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
-      <meta name="description" content="Tizen Mobile Web Basic Template"/>
-
-      <title>Tizen Mobile Web Basic Application</title> 
-
-      <link rel="stylesheet" type="text/css" href="css/style.css"/>
-      <script src="js/main.js"></script>
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <meta charset="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+      <meta name="description" content="Tizen Mobile Web Basic Template"/>
+
+      <title>Tizen Mobile Web Basic Application</title>
+
+      <link rel="stylesheet" type="text/css" href="css/style.css"/>
+      <script src="js/main.js"></script>
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -461,41 +461,41 @@ html, body { -   width: 100%; -   height: 100%; -   margin: 0 auto; -   padding: 0; -   background-color: #222222; -   color: #ffffff; + width: 100%; + height: 100%; + margin: 0 auto; + padding: 0; + background-color: #222222; + color: #ffffff; } .page { -   width: 100%; -   height: 100%; -   display: table; + width: 100%; + height: 100%; + display: table; } .contents { -   display: table-cell; -   vertical-align: middle; -   text-align: center; -   -webkit-tap-highlight-color: transparent; + display: table-cell; + vertical-align: middle; + text-align: center; + -webkit-tap-highlight-color: transparent; } #content-text { -   font-weight: bold; -   font-size: 5em; + font-weight: bold; + font-size: 5em; }
  • index.html: 
     <body>
-   <div id="main" class="page">
-      <div class="contents">
-         <span id="content-text">Basic</span>
-      </div>
-   </div>
+   <div id="main" class="page">
+      <div class="contents">
+         <span id="content-text">Basic</span>
+      </div>
+   </div>
 </body>
    • @@ -505,13 +505,13 @@ body 
     #content-text
 {
-   font-weight: bold;
-   font-size: 5em;
-   color: #ff0000;
+   font-weight: bold;
+   font-size: 5em;
+   color: #ff0000;
 }
    -

    Figure: Screen with a new text color

    +

    Figure: Screen with a new text color

    Screen with a new text color

    TAU (Tizen Advanced UI)

    @@ -539,13 +539,13 @@ body 
     <!DOCTYPE html>
 <html>
-   <head>
-      <link rel="stylesheet" href="lib/tau/mobile/theme/default/tau.css"/>
-   </head>
-   <body>
-      <!--HTML BODY CONTENT-->
-      <script type="text/javascript" src="lib/tau/mobile/js/tau.js"></script>
-   </body>
+   <head>
+      <link rel="stylesheet" href="lib/tau/mobile/theme/default/tau.css"/>
+   </head>
+   <body>
+      <!--HTML BODY CONTENT-->
+      <script type="text/javascript" src="lib/tau/mobile/js/tau.js"></script>
+   </body>
 </html>
    @@ -559,22 +559,22 @@ body -

    You can add an additional <script src="<CUSTOM_LIBRARY>"> or <link rel="stylesheet" src="<CUSTOM_CSS>"> element to include your own scripts and style sheets. However, place them after the default <script> elements, as you can use any TAU APIs provided by the default libraries.

    +

    You can add an additional <script src="<CUSTOM_LIBRARY>"> or <link rel="stylesheet" src="<CUSTOM_CSS>"> element to include your own scripts and style sheets. However, place them after the default <script> elements, as you can use any TAU APIs provided by the default libraries.

    To load your JavaScript file, include the file in the <script> element in the HTML <body> element. Since the TAU files are already loaded, you can use any APIs from these libraries as well.

    The following example shows a basic TAU template. Overwrite the index.html file content with the following code:

     <!DOCTYPE html>
 <html>
-   <head>
-      <meta name="viewport" content="width=device-width, user-scalable=no"/>
-      <link rel="stylesheet" href="lib/tau/mobile/theme/default/tau.css"/>
-      <link rel="stylesheet" href="css/style.css"/>
-      <title>Hello TAU</title>
-   </head>
-   <body>
-      <!--HTML BODY CONTENT-->
-      <script type="text/javascript" src="lib/tau/mobile/js/tau.js"></script>
-   </body>
+   <head>
+      <meta name="viewport" content="width=device-width, user-scalable=no"/>
+      <link rel="stylesheet" href="lib/tau/mobile/theme/default/tau.css"/>
+      <link rel="stylesheet" href="css/style.css"/>
+      <title>Hello TAU</title>
+   </head>
+   <body>
+      <!--HTML BODY CONTENT-->
+      <script type="text/javascript" src="lib/tau/mobile/js/tau.js"></script>
+   </body>
 </html>
    @@ -602,27 +602,27 @@ body

  • To create a page in the <body> element, use the ui-page class with the <div> element:

     <body>
-   <div class="ui-page" id="main">
-   </div>
-   <!--Script import-->
-   <script> ... </script>
+   <div class="ui-page" id="main">
+   </div>
+   <!--Script import-->
+   <script> ... </script>
 </body>

  • To layout the page, add a content area with the ui-content class, a header with the ui-header class, and a footer with the ui-footer class:

     <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header" data-position="fixed">
-         <h1>Hello World</h1>
-      </div>
-      <div class="ui-content">
-         <p>This is content area</p>
-      </div>
-      <div class="ui-footer">
-         <p>This is footer area</p>
-      </div>
-   </div>
+   <div class="ui-page" id="main">
+      <div class="ui-header" data-position="fixed">
+         <h1>Hello World</h1>
+      </div>
+      <div class="ui-content">
+         <p>This is content area</p>
+      </div>
+      <div class="ui-footer">
+         <p>This is footer area</p>
+      </div>
+   </div>
 </body>
    @@ -633,18 +633,18 @@ body

    You can add your own style in the content and footer area with a defined id attribute:

     <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header" data-position="fixed">
-         <h1>Hello World</h1>
-      </div>
-
-      <div class="ui-content" id="contentArea">
-         <p>This is content area</p>
-      </div>
-      <div class="ui-footer" id="footerArea">
-         <p>This is footer area</p>
-      </div>
-   </div>
+   <div class="ui-page" id="main">
+      <div class="ui-header" data-position="fixed">
+         <h1>Hello World</h1>
+      </div>
+
+      <div class="ui-content" id="contentArea">
+         <p>This is content area</p>
+      </div>
+      <div class="ui-footer" id="footerArea">
+         <p>This is footer area</p>
+      </div>
+   </div>
 </body>
    @@ -653,11 +653,11 @@ body 
     #contentArea
 {
-   background-color: white;
+   background-color: white;
 }
 #footerArea
 {
-   background-color: blue;
+   background-color: blue;
 }

    With your new styles, the screen looks like this.

    @@ -674,42 +674,42 @@ body

    Create a simple and basic static list. Overwrite the index.html file content with the following code:

     <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header" data-position="fixed">
-         <h1>Hello TAU</h1>
-      </div>
-      <div class="ui-content">
-         <ul class="ui-listview">
-            <li class="ui-li-static">list item1</li>
-            <li class="ui-li-static">list item2</li>
-            <li class="ui-li-static">list item3</li>
-            <li class="ui-li-static">list item4</li>
-         </ul>
-      </div>
-   </div>
+   <div class="ui-page" id="main">
+      <div class="ui-header" data-position="fixed">
+         <h1>Hello TAU</h1>
+      </div>
+      <div class="ui-content">
+         <ul class="ui-listview">
+            <li class="ui-li-static">list item1</li>
+            <li class="ui-li-static">list item2</li>
+            <li class="ui-li-static">list item3</li>
+            <li class="ui-li-static">list item4</li>
+         </ul>
+      </div>
+   </div>
 </body>

    The screen now shows a basic list.

    TAU list

  • -

    For a more advanced option, you can also create an anchor listview (whose items can be clicked to navigate to other pages or show a popup). Overwrite the <ul class="ui-listview"> element content with the following code:

    +

    For a more advanced option, you can also create an anchor listview (whose items can be clicked to navigate to other pages or show a popup). Overwrite the <ul class="ui-listview"> element content with the following code:

     <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header" data-position="fixed">
-         <h1>Hello TAU</h1>
-      </div>
-      <div class="ui-content">
-         <ul class="ui-listview">
-            <li class="ui-li-anchor"><a href="#">Anchor List 1</a></li>
-            <li class="ui-li-anchor"><a href="#">Anchor List 2</a></li>
-            <li class="ui-li-anchor"><a href="#">Anchor List 3</a></li>
-            <li class="ui-li-anchor"><a href="#">Anchor List 4</a></li>
-         </ul>
-      </div>
-   </div>
+   <div class="ui-page" id="main">
+      <div class="ui-header" data-position="fixed">
+         <h1>Hello TAU</h1>
+      </div>
+      <div class="ui-content">
+         <ul class="ui-listview">
+            <li class="ui-li-anchor"><a href="#">Anchor List 1</a></li>
+            <li class="ui-li-anchor"><a href="#">Anchor List 2</a></li>
+            <li class="ui-li-anchor"><a href="#">Anchor List 3</a></li>
+            <li class="ui-li-anchor"><a href="#">Anchor List 4</a></li>
+         </ul>
+      </div>
+   </div>
 </body>
    @@ -720,25 +720,25 @@ body
  • Add a button in the footer.

    When implementing Tizen mobile Web applications, you can use the ui-footer class as a footer area. Organize the footer area with 1 or 2 buttons.

    -

    Defining a button is very simple. Add the <div class="ui-footer">...</div> element after the <div class="ui-content">...</div> element:

    +

    Defining a button is very simple. Add the <div class="ui-footer">...</div> element after the <div class="ui-content">...</div> element:

     <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header" data-position="fixed">
-         <h1>Hello TAU</h1>
-      </div>
-      <div class="ui-content">
-         <ul class="ui-listview">
-            <li class="ui-li-anchor"><a href="#">Anchor List 1</a></li>
-            <li class="ui-li-anchor"><a href="#">Anchor List 2</a></li>
-            <li class="ui-li-anchor"><a href="#">Anchor List 3</a></li>
-            <li class="ui-li-anchor"><a href="#">Anchor List 4</a></li>
-         </ul>
-      </div>
-      <div class="ui-footer">
-         <button>OK</button>
-      </div>
-   </div>
+   <div class="ui-page" id="main">
+      <div class="ui-header" data-position="fixed">
+         <h1>Hello TAU</h1>
+      </div>
+      <div class="ui-content">
+         <ul class="ui-listview">
+            <li class="ui-li-anchor"><a href="#">Anchor List 1</a></li>
+            <li class="ui-li-anchor"><a href="#">Anchor List 2</a></li>
+            <li class="ui-li-anchor"><a href="#">Anchor List 3</a></li>
+            <li class="ui-li-anchor"><a href="#">Anchor List 4</a></li>
+         </ul>
+      </div>
+      <div class="ui-footer">
+         <button>OK</button>
+      </div>
+   </div>
 </body>

    When you run the application, the following screen is displayed.

    @@ -752,20 +752,20 @@ body 
     <!DOCTYPE html>
 <html>
-   <head>
-      <link rel="stylesheet" href="lib/tau/mobile/theme/default/tau.css">
-   </head>
-   <body>
-      <div class="ui-page" id="second">
-         <div class="ui-header" data-position="fixed">
-            <h1>Second Page</h1>
-         </div>
-         <div class="ui-content" id="secondPage">
-            <p>Hello Tizen!</p>
-         </div>
-      </div>
-      <script type="text/javascript" src="lib/tau/mobile/js/tau.js" data-build-remove="false"></script>
-   </body>
+   <head>
+      <link rel="stylesheet" href="lib/tau/mobile/theme/default/tau.css">
+   </head>
+   <body>
+      <div class="ui-page" id="second">
+         <div class="ui-header" data-position="fixed">
+            <h1>Second Page</h1>
+         </div>
+         <div class="ui-content" id="secondPage">
+            <p>Hello Tizen!</p>
+         </div>
+      </div>
+      <script type="text/javascript" src="lib/tau/mobile/js/tau.js" data-build-remove="false"></script>
+   </body>
 </html>
    • @@ -775,7 +775,7 @@ body 
     #secondPage
 {
-   background-color: white;
+   background-color: white;
 }
    @@ -783,11 +783,11 @@ body

    Create navigation between the index.html and second.html pages.

    Go back to the index.html file and add a file path in the listview <li><a href> element:

    -<ul class="ui-listview">
-   <li class="ui-li-anchor"><a href="second.html">Go to Second Page</a></li>
-   <li class="ui-li-anchor"><a href="#">Anchor List 2</a></li>
-   <li class="ui-li-anchor"><a href="#">Anchor List 3</a></li>
-   <li class="ui-li-anchor"><a href="#">Anchor List 4</a></li>
+<ul class="ui-listview">
+   <li class="ui-li-anchor"><a href="second.html">Go to Second Page</a></li>
+   <li class="ui-li-anchor"><a href="#">Anchor List 2</a></li>
+   <li class="ui-li-anchor"><a href="#">Anchor List 3</a></li>
+   <li class="ui-li-anchor"><a href="#">Anchor List 4</a></li>
 </ul>
  • @@ -799,28 +799,28 @@ body
  • Go back with the back key. -

    You can navigate from page to page with the <a href="PAGE_FILE_NAME"> elements, but you cannot go back. In this step, you learn to add some code in a JavaScript file to enable the user to return to the first page.

    +

    You can navigate from page to page with the <a href="PAGE_FILE_NAME"> elements, but you cannot go back. In this step, you learn to add some code in a JavaScript file to enable the user to return to the first page.

    Create a new app.js JavaScript file:

    1. -

      In the index.html file, add the <script src="app.js"></script> line before closing the </body> element:

      +

      In the index.html file, add the <script src="app.js"></script> line before closing the </body> element:

       <body>
-   <div class="ui-page" id="main">
-      <div class="ui-header" data-position="fixed">
-         <h1>Hello TAU</h1>
-      </div>
-      <div class="ui-content">
-         ...
-      </div>
-      <div class="ui-footer">
-         <button>OK</button>
-      </div>
-   </div>
-   <script type="text/javascript" src="lib/tau/mobile/js/tau.js"></script>
-   <script src="app.js"></script>
-</body>	
+   <div class="ui-page" id="main">
+      <div class="ui-header" data-position="fixed">
+         <h1>Hello TAU</h1>
+      </div>
+      <div class="ui-content">
+         ...
+      </div>
+      <div class="ui-footer">
+         <button>OK</button>
+      </div>
+   </div>
+   <script type="text/javascript" src="lib/tau/mobile/js/tau.js"></script>
+   <script src="app.js"></script>
+</body>
    2. In the Project Explorer view, right-click the project and select New > JavaScript Source File. @@ -830,21 +830,21 @@ body

      In the app.js file, all kinds of logic can be added to the application. In this case, add several lines for handling navigation:

      -(function() 
+(function()
 {
-   window.addEventListener('tizenhwkey', function(ev) 
-   {
-      if (ev.keyName === "back") 
-      {
-         var page = document.getElementsByClassName('ui-page-active')[0],
-             pageid = page ? page.id : "";
-
-         if (pageid !== "main") 
-         {
-            window.history.back();
-         }
-      }
-   });
+   window.addEventListener('tizenhwkey', function(ev)
+   {
+      if (ev.keyName === "back")
+      {
+         var page = document.getElementsByClassName('ui-page-active')[0],
+             pageid = page ? page.id : "";
+
+         if (pageid !== "main")
+         {
+            window.history.back();
+         }
+      }
+   });
 }());
    • @@ -854,31 +854,31 @@ body

    You have to consider the fact that when the user clicks the back key, the application can only exit if it is showing the main page. If the second page is showing, the application must return to the main page.

    The following example shows how to handle the back key input with page navigation and application exit. This code is included in the TAU Basic project template main.js file by default.

    -(function() 
+(function()
 {
-   window.addEventListener('tizenhwkey', function(ev) 
-   {
-      if (ev.keyName === "back") 
-      {
-         var page = document.getElementsByClassName('ui-page-active')[0],
-             pageid = page ? page.id : "";
-
-         if (pageid === "main") 
-         {
-            try 
-            {
-               tizen.application.getCurrentApplication().exit();
-            } 
-            catch (ignore) 
-            {
-            }
-         } 
-         else 
-         {
-            window.history.back();
-         }
-      }
-   });
+   window.addEventListener('tizenhwkey', function(ev)
+   {
+      if (ev.keyName === "back")
+      {
+         var page = document.getElementsByClassName('ui-page-active')[0],
+             pageid = page ? page.id : "";
+
+         if (pageid === "main")
+         {
+            try
+            {
+               tizen.application.getCurrentApplication().exit();
+            }
+            catch (ignore)
+            {
+            }
+         }
+         else
+         {
+            window.history.back();
+         }
+      }
+   });
 }());
    diff --git a/org.tizen.training/html/web/process/app_dev_process_w.htm b/org.tizen.training/html/web/process/app_dev_process_w.htm index 6162b26..447557e 100644 --- a/org.tizen.training/html/web/process/app_dev_process_w.htm +++ b/org.tizen.training/html/web/process/app_dev_process_w.htm @@ -5,13 +5,13 @@ - + - Web Application Development Process + Web Application Development Process @@ -20,7 +20,7 @@

    Mobile Web Wearable Web TV Web

    - +

    Content

    -
    +
    @@ -56,23 +56,23 @@
  • Develop multi-projects (multiple applications within the same package).
  • Certify and publish the application.
  • Upgrade the application.
    • - - + +

    Planning and Designing the Application

    -

    The first step in creating a Tizen Web application is planning and designing it using the design tools of your choice.

    -

    For information on planning and designing your applications, see Tizen Web Guides and Tizen Web API References.

    -

    Once you have finished the application plan and design, you are ready to create the application project.

    +

    The first step in creating a Tizen Web application is planning and designing it using the design tools of your choice.

    +

    For information on planning and designing your applications, see Tizen Web Guides and Tizen Web API References.

    +

    Once you have finished the application plan and design, you are ready to create the application project.

    Creating the Application Project

    -

    After you have planned and designed your application, you are ready to create the application project in the Tizen Studio.

    - +

    After you have planned and designed your application, you are ready to create the application project in the Tizen Studio.

    +

    The Tizen Studio provides various project templates that make it easier for you to start coding your application. When you create a new project, you can select a specific template or sample. Based on the selection, the Tizen Web Project Wizard automatically creates basic functionalities that the application has to implement to be able to run. The default project files and folders are also created.

    Setting Project Properties

    -

    After creating the application project, you can configure the properties of the project and the Web application to achieve the required functionality and features for your application.

    +

    After creating the application project, you can configure the properties of the project and the Web application to achieve the required functionality and features for your application.

    Designing the Application UI

    @@ -81,7 +81,7 @@

    Coding the Application

    Code your application in the Tizen Studio using the APIs defined in the Web API References.

    -

    Once you have finished coding your application, you are ready to build your application.

    +

    Once you have finished coding your application, you are ready to build your application.

    Building the Application

    @@ -94,35 +94,35 @@
  • Compile for:
    • Coffeescript
    • Less
    • - +
    Note - About the output files: -
      -
    • Compiled coffeescript output file name is <file name>.js. This file is used when the project is packed to the WGT package file, but the script tag's reference path must be changed manually.
      • -
    • Compiled less output file name is <file name>.css. This file is used when the project is packed to the WGT package file, but the script tag's reference path must be changed manually.
      • + About the output files: +
        +
      • Compiled coffeescript output file name is <file name>.js. This file is used when the project is packed to the WGT package file, but the script tag's reference path must be changed manually.
        • +
      • Compiled less output file name is <file name>.css. This file is used when the project is packed to the WGT package file, but the script tag's reference path must be changed manually.
    - +

    If the project has errors, they are shown in the Problems and Project Explorer views after the build.

    -

    You can build a Web application automatically or manually:

    -
      -
    • Automatic build:

      In the Tizen Studio menu, select Project > Build Automatically.

      If you select this option, whenever the source or a resource is changed and saved, the Tizen Studio automatically recognizes any saved changes and rebuilds the project source.

      • -
    • Manual build:

      In the Tizen Studio menu, select Project > Build Project.

      You can build your project at your convenience. If you want to use the manual build, ensure that the Project > Build Automatically option is not selected.

      • -
    +

    You can build a Web application automatically or manually:

    +
      +
    • Automatic build:

      In the Tizen Studio menu, select Project > Build Automatically.

      If you select this option, whenever the source or a resource is changed and saved, the Tizen Studio automatically recognizes any saved changes and rebuilds the project source.

      • +
    • Manual build:

      In the Tizen Studio menu, select Project > Build Project.

      You can build your project at your convenience. If you want to use the manual build, ensure that the Project > Build Automatically option is not selected.

      • +
    Note - In the manual build mode: -
      -
    • Ensure that you have the latest build output before you run or debug a project.
      • -
    • To remove a project build output, select Project > Clean in the Tizen Studio menu.
      • + In the manual build mode: +
        +
      • Ensure that you have the latest build output before you run or debug a project.
        • +
      • To remove a project build output, select Project > Clean in the Tizen Studio menu.
    - -

    To customize the application, set the build properties:

    + +

    To customize the application, set the build properties:

    • JS validation

      Set the options in the Tizen Studio menu: Window > Preferences > Tizen Studio > Web > Editor > JavaScript Editor.

    • CSS validation @@ -140,12 +140,12 @@

      The optimization process is only executed when you execute the packaging process.

    • Execute the application to the emulator or target device.
      • -

      You can run your application in one of the following environments:

      -
        -
      • Emulator

        The device emulator, provided with the Tizen Studio, imitates the target environment running Tizen Web applications. Using this replicated environment, you can test your application before deploying it to the real target device.

        • +

        You can run your application in one of the following environments:

        +
          +
        • Emulator

          The device emulator, provided with the Tizen Studio, imitates the target environment running Tizen Web applications. Using this replicated environment, you can test your application before deploying it to the real target device.

        • Target device

          Running your application on a target device allows you to debug and test your application in a real-time environment.

          • -
        • Simulator

          The Tizen Web simulator allows you to run application that use the Tizen Web APIs.

          • -
        +
      • Simulator

        The Tizen Web simulator allows you to run application that use the Tizen Web APIs.

        • +

      You can run the application smartly:

      • You can use the Rapid Development Support (RDS) mode to run or test faster.
        • @@ -172,36 +172,36 @@
        • Set excluding optimization resources

          You can minify your JavaScript, CSS, HTML, and PNG resources and put in an exclude file pattern that you do not want to optimize.

          • -
        • Set hybrid application's main service application
        +
      • Set hybrid application's main service application
      + +

      By default, the Web application package is created once. You can view the package content at any point of the application development process by double-clicking the project .wgt file in the Project Explorer view. All the files present in the application project are displayed in a list.

      -

      By default, the Web application package is created once. You can view the package content at any point of the application development process by double-clicking the project .wgt file in the Project Explorer view. All the files present in the application project are displayed in a list.

      +

      Any changes made to the files in the package content list, such as deleting files or dragging and dropping files, are not reflected in the actual project files.

      +

      Figure: Viewing the Web application package

      +

      Viewing the Web application package

      + + +

      Additionally, you can localize the Web application to support different languages and environments.

      -

      Any changes made to the files in the package content list, such as deleting files or dragging and dropping files, are not reflected in the actual project files.

      -

      Figure: Viewing the Web application package

      -

      Viewing the Web application package

      - - -

      Additionally, you can localize the Web application to support different languages and environments.

      -

      Developing Multiple Projects as a Combined Package

      Tizen supports multi-project applications that combine different types of application templates in hybrid and companion applications.

      -

      Packaging Hybrid Applications

      - +

      Packaging Hybrid Applications

      +

      A hybrid application package combines a Web application and 1 or more native service applications.

      -

      To create and run a hybrid application:

      -
        -
      1. Create a project for a Web UI application and native service application.
        2. +

        To create and run a hybrid application:

        +
          +
        1. Create a project for a Web UI application and native service application.
        2. To establish a project reference between a UI and service application:
          • In the Web UI application project context menu, select Properties > Tizen Studio > Package > Multi.
          • Select the check box for the service application, and click OK.
          In the Project Explorer view, a with <Web UI application> message appears next to the service application project name for each application you have added to the package. -
          3. +
        3. Build and run the Web UI application. The service application is built and executed automatically at the same time, and you can find a WGT file (hybrid application package) under the Web UI application project in the Project Explorer view. - +

          To modify the build configuration of the service application, see Building the Application.

        @@ -210,50 +210,50 @@ Note Tizen has limited a multi-project application combination policy for device usability. If you do not follow the policy, the submission of your application to the Tizen Store can be rejected.
    - +

    The following table shows the possible combinations for a hybrid multi-project. M means that multiple applications can be packaged as sub applications.

    Table: Combinations

    - - + + - - - - + + + + - - - - - + + + + + - - - - - + + + + +
    Main projectSub projectMain projectSub project
    UISERVICEWATCHWIDGETUISERVICEWATCHWIDGET
    WEB UINoMNoMWEB UINoMNoM
    WEB SERVICENoNoNoNoWEB SERVICENoNoNoNo

    With a hybrid application package, you can register the included applications in the Tizen Store and install, upgrade, and uninstall them using the single hybrid package. When a hybrid application package is installed, the Web application is installed by the Web installer, followed by the native installer installing native service applications.

    A hybrid application package is very useful to Web applications that need background processing or monitoring. A native service application does not have a UI and can be run in the background.

    - +

    The Web application and native service applications within a hybrid application package share the same package ID and data folder. Sharing application data between them is easy. Many useful inter-application APIs, such as Message Port (in mobile, wearable, and TV applications) and AppControl (in mobile, wearable, and TV applications), can be used in a hybrid application package.

    -

    For more information on hybrid applications and their package structure, see Hybrid Web App sample (in mobile and wearable applications), Hybrid Service sample, and Hybrid Application Package.

    +

    For more information on hybrid applications and their package structure, see Hybrid Web App sample (in mobile and wearable applications), Hybrid Service sample, and Hybrid Application Package.

    + -

    Certifying and Publishing the Application

    -

    After you have packaged your application, you are ready to certify and publish your application.

    -

    To certify and publish your application:

    +

    After you have packaged your application, you are ready to certify and publish your application.

    +

    To certify and publish your application:

    • Upload your mobile Web application to the Tizen Store or your wearable Web application to the Samsung Galaxy Apps Store for registration.

      After the application is uploaded, the application is signed as a certified application installer package and the <Application_name>.wgt archive format, which contains the distributor signature, is added by the Tizen Store or Samsung Galaxy Apps Store.

      @@ -262,15 +262,15 @@

      The Tizen Store or Samsung Galaxy Apps Store checks whether your application functions properly before publishing it.

    - +

    For detailed instructions on how to register your application and submit it for validation and publication in the Tizen Store, see Tizen Store Overview and other subtopics within the Distribution section of the Tizen Developers site.

    - -

    You can also upgrade your application after certification. If you want to withdraw your application from distribution and operation, you need to request for application retirement from the Tizen Store or Samsung Galaxy Apps Store.

    - + +

    You can also upgrade your application after certification. If you want to withdraw your application from distribution and operation, you need to request for application retirement from the Tizen Store or Samsung Galaxy Apps Store.

    +

    Upgrading the Application

    -

    You can upgrade your application even after you have certified and made it available for sale at the Tizen Store or Samsung Galaxy Apps Store.

    -

    To upgrade your application:

    +

    You can upgrade your application even after you have certified and made it available for sale at the Tizen Store or Samsung Galaxy Apps Store.

    +

    To upgrade your application:

    1. Update your application version, and if needed the privileges, in the config.xml configuration file in the Tizen Studio.
    2. Update the application code as needed.
      3. @@ -280,12 +280,12 @@

    When a previously installed application is upgraded on a device, you can decide which data files from the old version are retained and which are deleted. The common Tizen upgrade policy is to overwrite all the application package files, while keeping the user-created files and directories unchanged.

    - -

    Once your application has reached the end of its life-cycle, you can remove it from the Tizen Store or Samsung Galaxy Apps Store.

    -

    The following figure illustrates the process of developing a Tizen Web application.

    -

    Figure: Web application development process

    -

    Web application development process

    +

    Once your application has reached the end of its life-cycle, you can remove it from the Tizen Store or Samsung Galaxy Apps Store.

    + +

    The following figure illustrates the process of developing a Tizen Web application.

    +

    Figure: Web application development process

    +

    Web application development process

    @@ -297,7 +297,7 @@ - + - + + \ No newline at end of file diff --git a/org.tizen.training/html/web/process/coding_app_w.htm b/org.tizen.training/html/web/process/coding_app_w.htm index aa78e3b..ce09dd9 100644 --- a/org.tizen.training/html/web/process/coding_app_w.htm +++ b/org.tizen.training/html/web/process/coding_app_w.htm @@ -5,13 +5,13 @@ - + - Coding Applications + Coding Applications @@ -20,7 +20,7 @@

    Mobile Web Wearable Web TV Web

    - +

    Content

      @@ -29,45 +29,45 @@
    -
    +
    -

    Coding Applications

    -

    When coding your application, you must consider the following issues:

    -
      -

    1. Initialize the application resources.

      Typically, at least take care of creating the UI and restoring the latest application state.

      2. -
    2. Write code for application-specific features and functionalities, and handle events.

      Define how the application behaves during the application's state transitions, such as switching between foreground and background. You must also define event handlers corresponding to system events, if necessary.

      3. -

    3. Destroy allocated resources and save the current application state.

      4. -
    - -

    Using Hover Help

    -

    The Tizen Studio supports hover help for Web API and W3C Widget APIs. The hover help provides input from the API Reference.

    -

    Figure: Hover help

    -

    Hover help

    -

    Adding External Source Code or Library

    -

    External source files are located in the project directory, and its /js and /css sub-directories. You can add a new folder or source file (such as CSS, HTML, JSON, XML, and JavaScript) to your existing project.

    -

    You can add files in the following ways (as an example, the instructions illustrate the adding of a CSS file):

    -
      -
    • Adding a new file: -
        -
      1. In the Project Explorer view, right-click an existing project and select New > CSS File.
        2. -
      2. In the New CSS File view, select the location of the new CSS file and enter the file name.

        Optionally, you can select a template as initial content in the CSS file.

        3. -
      3. Click Finish.
        4. -
      • -
    • Adding an existing file: -
        -
      1. In the Project Explorer view, right-click the /css sub-directory and select Import > General > File System.
        2. -
      2. In the Import view, click Browse and select the import location.
        3. -
      3. Click Finish.
        4. -
      • -
    +

    Coding Applications

    +

    When coding your application, you must consider the following issues:

    +
      +

    1. Initialize the application resources.

      Typically, at least take care of creating the UI and restoring the latest application state.

      2. +
    2. Write code for application-specific features and functionalities, and handle events.

      Define how the application behaves during the application's state transitions, such as switching between foreground and background. You must also define event handlers corresponding to system events, if necessary.

      3. +

    3. Destroy allocated resources and save the current application state.

      4. +
    + +

    Using Hover Help

    +

    The Tizen Studio supports hover help for Web API and W3C Widget APIs. The hover help provides input from the API Reference.

    +

    Figure: Hover help

    +

    Hover help

    +

    Adding External Source Code or Library

    +

    External source files are located in the project directory, and its /js and /css sub-directories. You can add a new folder or source file (such as CSS, HTML, JSON, XML, and JavaScript) to your existing project.

    +

    You can add files in the following ways (as an example, the instructions illustrate the adding of a CSS file):

    +
      +
    • Adding a new file: +
        +
      1. In the Project Explorer view, right-click an existing project and select New > CSS File.
        2. +
      2. In the New CSS File view, select the location of the new CSS file and enter the file name.

        Optionally, you can select a template as initial content in the CSS file.

        3. +
      3. Click Finish.
        4. +
      • +
    • Adding an existing file: +
        +
      1. In the Project Explorer view, right-click the /css sub-directory and select Import > General > File System.
        2. +
      2. In the Import view, click Browse and select the import location.
        3. +
      3. Click Finish.
        4. +
      • +
    Note You can also drag and drop external source files or libraries. If you drop a file to the Project Explorer view, the File Operation dialog appears, and allows you to either copy the file or create a link to it.
    - - + +
    @@ -77,7 +77,7 @@ - + - + + \ No newline at end of file diff --git a/org.tizen.training/html/web/process/creating_app_project_w.htm b/org.tizen.training/html/web/process/creating_app_project_w.htm index c7bf9e8..557478e 100644 --- a/org.tizen.training/html/web/process/creating_app_project_w.htm +++ b/org.tizen.training/html/web/process/creating_app_project_w.htm @@ -5,34 +5,34 @@ - + - Creating the Application Project + Creating the Application Project
    -
    +

    Mobile Web Wearable Web TV Web

    -

    Creating the Application Project

    -

    You can create a Web application project by selecting from a variety of templates and samples. The following instructions are specific for creating the project with a template.

    -

    To create a Web application project:

    -
      -
    1. In the Tizen Studio, select File > New > Tizen Project. +

      Creating the Application Project

      +

      You can create a Web application project by selecting from a variety of templates and samples. The following instructions are specific for creating the project with a template.

      +

      To create a Web application project:

      +
        +
      1. In the Tizen Studio, select File > New > Tizen Project.

        Creating a new project

        -

        The Project Wizard opens.

        2. +

        The Project Wizard opens.

      2. In the Project Wizard, define the project details.

        The Project Wizard is used to create the basic application skeleton with the required folder structure and mandatory files. You can easily create different applications by selecting an applicable template or sample for the Project Wizard to use.

        -
          +

          1. Select the Template project type and click Next.

            Selecting the project type

            2. @@ -47,7 +47,7 @@

          2. Define the project properties and click Finish.

            You can fill the project name. You can also select the location and working sets by clicking More properties.

            - +
            Note The Tizen API names cannot be used as project names. The project name must be more than 2 characters and is restricted to the following regular expression: [a-zA-Z][a-zA-Z0-9-]{2,49}. @@ -56,10 +56,10 @@

            The Project Wizard sets up the project, creates the application files using the default content from the template, and closes. For more information about the Project Wizard and the available templates, see Creating Tizen Projects with Tizen Project Wizard.

        -

        The new application project is shown in the Project Explorer view of the Tizen Studio, with default content in the config.xml file as well as in several project folders.

        - -

        Importing a Project

        -

        If you have an existing Tizen application project, you can import it into the Tizen Studio:

        +

        The new application project is shown in the Project Explorer view of the Tizen Studio, with default content in the config.xml file as well as in several project folders.

        + +

        Importing a Project

        +

        If you have an existing Tizen application project, you can import it into the Tizen Studio:

        1. In the Tizen Studio menu, go to File > Import > Tizen > Tizen Project, and click Next.
        2. Select the location of the root directory or archive file of the Tizen project and click Next.
          3. @@ -67,7 +67,7 @@
        3. Click Finish.

        The project appears in the Project Explorer view.

        - +
    @@ -78,7 +78,7 @@

    Except as noted, this content - excluding the Code Examples - is licensed under Creative Commons Attribution 3.0 and all of the Code Examples contained herein are licensed under BSD-3-Clause.
    For details, see the Content License.

    - + - + + diff --git a/org.tizen.training/html/web/process/run_debug_app_w.htm b/org.tizen.training/html/web/process/run_debug_app_w.htm index 1b99e0f..7041caa 100644 --- a/org.tizen.training/html/web/process/run_debug_app_w.htm +++ b/org.tizen.training/html/web/process/run_debug_app_w.htm @@ -5,13 +5,13 @@ - + - Running and Debugging Applications + Running and Debugging Applications @@ -20,7 +20,7 @@

    Mobile Web Wearable Web TV Web

    - +

    Content

    - +
    @@ -41,169 +41,169 @@ -

    Running Web Applications on the Emulator

    -

    You can debug Tizen Web applications on the emulator using the Project Explorer view or the Tizen Studio menu.

    - -

    To launch the emulator, do one of the following:

    -
      -
    • Use the Emulator Manager: -
        -
      1. Start the Emulator Manager using the Desktop (in Ubuntu) or Start menu (in Windows®), or using the command line.
        2. -
      2. In the Emulator Manager window, select the emulator instance from the list.

        If you are using the Emulator Manager for the first time, you must create an emulator instance: click Create, select the platform (system image) and template (device definition), and click Finish.

        3. -
      3. Click Launch.
        4. -
      • -
    • Use the command line.
      • -
    -

    To run the application on the emulator, do one of the following:

    -
      -
    • In the Project Explorer view, right-click the project and select Run As > Tizen Web Application.
      • -
    • In the Tizen Studio menu, go to Run > Run As > Tizen Web Application.
      • -
    • On the Tizen Studio toolbar, click Run.
      • -
    +

    Running Web Applications on the Emulator

    +

    You can debug Tizen Web applications on the emulator using the Project Explorer view or the Tizen Studio menu.

    + +

    To launch the emulator, do one of the following:

    +
      +
    • Use the Emulator Manager: +
        +
      1. Start the Emulator Manager using the Desktop (in Ubuntu) or Start menu (in Windows®), or using the command line.
        2. +
      2. In the Emulator Manager window, select the emulator instance from the list.

        If you are using the Emulator Manager for the first time, you must create an emulator instance: click Create, select the platform (system image) and template (device definition), and click Finish.

        3. +
      3. Click Launch.
        4. +
      • +
    • Use the command line.
      • +
    +

    To run the application on the emulator, do one of the following:

    +
      +
    • In the Project Explorer view, right-click the project and select Run As > Tizen Web Application.
      • +
    • In the Tizen Studio menu, go to Run > Run As > Tizen Web Application.
      • +
    • On the Tizen Studio toolbar, click Run.
      • +

    To stop the emulator, right-click the emulator and click Close.

    - - + +
    Note Running an emulator instance requires a minimum free disk space of 20 MB. The emulator image can occupy up to 10 GB of disk space.
    - -

    Running Web Applications on a Target Device

    -

    You can run Tizen Web applications on a target device using the Project Explorer view or the Tizen Studio menu.

    -

    To run your application on the target device:

    -
      -
    1. Connect the target device to your computer.
      2. -
    2. Open the Run Configurations window by doing one of the following: -
        -
      • In the Project Explorer view, right-click the project and select Run As > Run Configurations.
        • -
      • In the Tizen Studio menu, go to Run > Run Configurations.
        • -
      3. -
    3. In the Run Configurations window, click New Launch Configuration.

      If you have not made any changes to the application source files since the last time the application was run, Rapid Development Support (RDS) is used to skip the package upload and make running the application faster. RDS is enabled as default. To disable it, go to Window > Preferences > Tizen Studio > Rapid Development Support.

      4. -
    4. Set the timeout using the Timeout value slider.

      The timeout value represents the waiting time for the application launch operation. If you are using a lower configuration computer, set a higher timeout value to avoid application launch failure errors.

      5. -
    5. Start the run by clicking Run.
      6. -
    -

    If no changes are required in the run configuration, you can also run the application on the target device by doing one of the following:

    -
      -
    • In the Project Explorer view, right-click the project and select Run As > Tizen Web Application.
      • -
    • In the Tizen Studio menu, go to Run > Run As > Tizen Web Application.
      • -
    • On the Tizen Studio toolbar, click Run.
      • -
    + +

    Running Web Applications on a Target Device

    +

    You can run Tizen Web applications on a target device using the Project Explorer view or the Tizen Studio menu.

    +

    To run your application on the target device:

    +
      +
    1. Connect the target device to your computer.
      2. +
    2. Open the Run Configurations window by doing one of the following: +
        +
      • In the Project Explorer view, right-click the project and select Run As > Run Configurations.
        • +
      • In the Tizen Studio menu, go to Run > Run Configurations.
        • +
      3. +
    3. In the Run Configurations window, click New Launch Configuration.

      If you have not made any changes to the application source files since the last time the application was run, Rapid Development Support (RDS) is used to skip the package upload and make running the application faster. RDS is enabled as default. To disable it, go to Window > Preferences > Tizen Studio > Rapid Development Support.

      4. +
    4. Set the timeout using the Timeout value slider.

      The timeout value represents the waiting time for the application launch operation. If you are using a lower configuration computer, set a higher timeout value to avoid application launch failure errors.

      5. +
    5. Start the run by clicking Run.
      6. +
    +

    If no changes are required in the run configuration, you can also run the application on the target device by doing one of the following:

    +
      +
    • In the Project Explorer view, right-click the project and select Run As > Tizen Web Application.
      • +
    • In the Tizen Studio menu, go to Run > Run As > Tizen Web Application.
      • +
    • On the Tizen Studio toolbar, click Run.
      • +

    If the Web application successfully launches on the target device, the JavaScript Log Console View is automatically launched in the Tizen Studio. The JavaScript Log Console view displays Web application JavaScript logs.

    - -

    Running Mobile Web Applications on the Simulator

    -

    You can run Tizen Web applications on the Web Simulator using the Project Explorer view or the Tizen Studio menu.

    + +

    Running Mobile Web Applications on the Simulator

    +

    You can run Tizen Web applications on the Web Simulator using the Project Explorer view or the Tizen Studio menu.

    Note The Tizen Web Simulator runs only on the Google Chrome™ browser. To use the Web Simulator, download and install Google Chrome. You can manually specify the installation location of the browser in the simulator preferences.
    - -

    If you are running your Web application on the Web Simulator for the first time, create a running configuration by selecting Run > Run Configurations > Tizen Web Simulator Application in the Tizen Studio menu. The running configuration contains the application launch settings.

    -

    To run your application on the Simulator, do one of the following:

    -
      -
    • In the Project Explorer view, right-click the project and select Run As > Tizen Web Simulator Application.
      • -
    • In the Tizen Studio menu, go to Run > Run As > Tizen Web Simulator Application.
      • -
    • On the Tizen Studio toolbar, click Run.
      • -
    -

    When the application is launched, the Web Simulator loads the file specified in the Content field of the config.xml file. The mostly commonly specified file is index.html.

    - -

    The simulator renders your application on the browser using the WebKit engine. All the Google Chrome™ browser development features are available (by pressing the F12 keyboard key) in the simulator, as is the Web Inspector tool. You can leverage the advantages of the Web Simulator tool by setting the device screen size and orientation, and by sending events and messages, such as geolocation data and sensor input events, to your application for debugging it.

    - -

    Debugging Web Applications

    -

    Debugging a Web application enables you to understand its flow of control. You can debug a Web application by running it on the target device and debugging its JavaScript code. JavaScript code debugging uses the Web Inspector tool.

    -

    To debug your application on the target device:

    -
      -
    1. Connect the target device to your computer.
      2. -
    2. Open the Debug Configurations window by doing one of the following: -
        -
      • In the Project Explorer view, right-click the project and select Debug As > Debug Configurations.
        • -
      • In the Tizen Studio menu, go to Run > Debug Configurations.
        • -
      3. -
    3. In the Debug Configurations window, click New Launch Configuration.

      If you have not made any changes to the application source files since the last time the application was run, Rapid Development Support (RDS) is used to skip the package upload and make running the application faster. RDS is enabled as default. To disable it, go to Window > Preferences > Tizen Studio > Rapid Development Support.

      4. -
    4. Set the timeout using the Timeout value slider.

      The timeout value represents the waiting time for the application launch operation. If you are using a lower configuration system, set a higher timeout value to avoid application launch failure errors.

      5. + +

      If you are running your Web application on the Web Simulator for the first time, create a running configuration by selecting Run > Run Configurations > Tizen Web Simulator Application in the Tizen Studio menu. The running configuration contains the application launch settings.

      +

      To run your application on the Simulator, do one of the following:

      +
        +
      • In the Project Explorer view, right-click the project and select Run As > Tizen Web Simulator Application.
        • +
      • In the Tizen Studio menu, go to Run > Run As > Tizen Web Simulator Application.
        • +
      • On the Tizen Studio toolbar, click Run.
        • +
      +

      When the application is launched, the Web Simulator loads the file specified in the Content field of the config.xml file. The mostly commonly specified file is index.html.

      + +

      The simulator renders your application on the browser using the WebKit engine. All the Google Chrome™ browser development features are available (by pressing the F12 keyboard key) in the simulator, as is the Web Inspector tool. You can leverage the advantages of the Web Simulator tool by setting the device screen size and orientation, and by sending events and messages, such as geolocation data and sensor input events, to your application for debugging it.

      + +

      Debugging Web Applications

      +

      Debugging a Web application enables you to understand its flow of control. You can debug a Web application by running it on the target device and debugging its JavaScript code. JavaScript code debugging uses the Web Inspector tool.

      +

      To debug your application on the target device:

      +
        +
      1. Connect the target device to your computer.
        2. +
      2. Open the Debug Configurations window by doing one of the following: +
          +
        • In the Project Explorer view, right-click the project and select Debug As > Debug Configurations.
          • +
        • In the Tizen Studio menu, go to Run > Debug Configurations.
          • +
        3. +
      3. In the Debug Configurations window, click New Launch Configuration.

        If you have not made any changes to the application source files since the last time the application was run, Rapid Development Support (RDS) is used to skip the package upload and make running the application faster. RDS is enabled as default. To disable it, go to Window > Preferences > Tizen Studio > Rapid Development Support.

        4. +
      4. Set the timeout using the Timeout value slider.

        The timeout value represents the waiting time for the application launch operation. If you are using a lower configuration system, set a higher timeout value to avoid application launch failure errors.

      5. Start the debugging by clicking Debug. -

        If no changes are required in the debug configuration, you can also debug the application on the target device by doing one of the following:

        -
          -
        • In the Project Explorer view, right-click the project and select Debug As > Tizen Web Application.
          • -
        • In the Tizen Studio menu, go to Run > Debug As > Tizen Web Application.
          • -
        • On the Tizen Studio toolbar, click Debug.
          • -
        -

        The Web Inspector tool is displayed in a new Chrome browser window. You can perform the following debugging tasks using the Web Inspector:

        -
          -
        • Inspect styles
          • -
        • Inspect the DOM
          • -
        • Inspect resources
          • -
        • Debug JavaScript code
          • -
        - +

        If no changes are required in the debug configuration, you can also debug the application on the target device by doing one of the following:

        +
          +
        • In the Project Explorer view, right-click the project and select Debug As > Tizen Web Application.
          • +
        • In the Tizen Studio menu, go to Run > Debug As > Tizen Web Application.
          • +
        • On the Tizen Studio toolbar, click Debug.
          • +
        +

        The Web Inspector tool is displayed in a new Chrome browser window. You can perform the following debugging tasks using the Web Inspector:

        +
          +
        • Inspect styles
          • +
        • Inspect the DOM
          • +
        • Inspect resources
          • +
        • Debug JavaScript code
          • +
        +
        Note - The Web Inspector always opens in a new window. Life-cycle synchronization between the application to be debugged and the Web Inspector browser is not supported. + The Web Inspector always opens in a new window. Life-cycle synchronization between the application to be debugged and the Web Inspector browser is not supported.

        Installing Google Chrome on the device is mandatory for the Web Inspector to work. When Google Chrome is installed on the device, the Tizen Studio automatically detects it. To select the browser path, go to Window > Preferences > Tizen Studio > Web > Chrome.

        - +
      6. To debug the JavaScript code, click Sources in the Web Inspector menu. -

        You must enable debugging before debugging JavaScript code.

        7. -
      7. You can also set a break point in the code by right-clicking in the marker bar area on the left side of the editor, and selecting Toggle Breakpoint. -

        Once the break points are set, you can watch variables, expressions, and the current call stack. You can also control the debugging by using the following control buttons.

        -

        Table: Control buttons for debugging between break points

        - - - - - - - - - - - - - - - - - - - - - - - - - - - +

        You must enable debugging before debugging JavaScript code.

        +
      8. You can also set a break point in the code by right-clicking in the marker bar area on the left side of the editor, and selecting Toggle Breakpoint. +

        Once the break points are set, you can watch variables, expressions, and the current call stack. You can also control the debugging by using the following control buttons.

        +

        Table: Control buttons for debugging between break points

        +
        9. ButtonDescription
        ResumeResumes the current execution.
        Step overSteps over the highlighted statement.

        Executes the current line, and if the line contains a method, executes the method without entering it.

        Step inSteps into the highlighted statement.

        Executes the current line, and if the line contains a method, steps into the method.

        Step outSteps out of the current method.
        Deactivate all break pointsDeactivates all break points.
        + + + + + + + + + + + + + + + + + + + + + + + + + +
        ButtonDescription
        ResumeResumes the current execution.
        Step overSteps over the highlighted statement.

        Executes the current line, and if the line contains a method, executes the method without entering it.

        Step inSteps into the highlighted statement.

        Executes the current line, and if the line contains a method, steps into the method.

        Step outSteps out of the current method.
        Deactivate all break pointsDeactivates all break points.
        9. -
      +

    If the Web application successfully launches on the target device, the JavaScript Log Console View is automatically launched in the Tizen Studio. The JavaScript Log Console view displays Web application JavaScript logs.

    - -

    Rapid Development Support

    -

    Rapid Development Support (RDS) lets you develop a Tizen application rapidly by saving deployment time.

    -

    When using RDS, the application is first launched normally. After the first launch, the packaging process is skipped and only modified, added, and deleted files are installed in the target. If an error occurs while launching, the normal mode is executed.

    -

    To launch the application in the normal mode:

    -
      -
    1. Package the application.
      2. -
    2. Transfer the packaged file to the target.
      3. -
    3. Install the packaged file in the target. If the application is already installed, uninstall it before the installation.
      4. -
    -

    To launch the application in the RDS mode:

    -
      -
    1. Search for the delta files (changed, added, and deleted files).
      2. -
    2. Transfer the delta files to the target.
      3. -
    3. If the config.xml file has been modified, execute directory installation.
      4. -
    -

    The RDS option is enabled as default. To disable it, in the Tizen Studio, go to Window > Preferences > Tizen Studio > Rapid Development Support.

    - - + +

    Rapid Development Support

    +

    Rapid Development Support (RDS) lets you develop a Tizen application rapidly by saving deployment time.

    +

    When using RDS, the application is first launched normally. After the first launch, the packaging process is skipped and only modified, added, and deleted files are installed in the target. If an error occurs while launching, the normal mode is executed.

    +

    To launch the application in the normal mode:

    +
      +
    1. Package the application.
      2. +
    2. Transfer the packaged file to the target.
      3. +
    3. Install the packaged file in the target. If the application is already installed, uninstall it before the installation.
      4. +
    +

    To launch the application in the RDS mode:

    +
      +
    1. Search for the delta files (changed, added, and deleted files).
      2. +
    2. Transfer the delta files to the target.
      3. +
    3. If the config.xml file has been modified, execute directory installation.
      4. +
    +

    The RDS option is enabled as default. To disable it, in the Tizen Studio, go to Window > Preferences > Tizen Studio > Rapid Development Support.

    + +
    Note RDS is not supported in multi-app projects.

    If you want to remove an application from your device, you must manually delete the installed application as the launch process does not have an uninstall process.

    - - + +
    @@ -213,7 +213,7 @@ - + - + + \ No newline at end of file diff --git a/org.tizen.training/html/web/process/setting_properties_w.htm b/org.tizen.training/html/web/process/setting_properties_w.htm index df3d23a..f668008 100644 --- a/org.tizen.training/html/web/process/setting_properties_w.htm +++ b/org.tizen.training/html/web/process/setting_properties_w.htm @@ -5,13 +5,13 @@ - + - Setting Project Properties + Setting Project Properties @@ -20,7 +20,7 @@

    Mobile Web Wearable Web TV Web

    - +

    Content

    - +
    -

    Setting Project Properties

    -

    Before you implement the actual application functionality, define all the necessary properties for your application project:

    +

    Setting Project Properties

    +

    Before you implement the actual application functionality, define all the necessary properties for your application project:

      -
    • To set the application project properties for build and JSON properties, right-click the project in the Tizen Studio Project Explorer view and select Properties. After setting or changing a property, click OK.
      • +
    • To set the application project properties for build and JSON properties, right-click the project in the Tizen Studio Project Explorer view and select Properties. After setting or changing a property, click OK.
    • To define the Web application configuration, edit the config.xml file. - +
      Note Only modify the Web application configuration by using the configuration editor in the Tizen Studio. If you create or edit the config.xml file using any other text editor, your application may not work as expected.
      -
    - -

    After you have finished setting the project properties, you are ready to design the UI.

    - -

    Setting Build Properties

    + + +

    After you have finished setting the project properties, you are ready to design the UI.

    + +

    Setting Build Properties

    You can set build properties for your project. To select the build properties:

    1. In the Properties window, select Tizen Studio > Package > Web.
    2. Check Optimize web resources, and add any files for excluding optimization in the Optimization panel.
    - -

    Setting the JSON Property

    + +

    Setting the JSON Property

    You can set a JSON property for your project. To select the JSON property:

    1. In the Properties window, select Tizen Studio > Web > JSON Properties.
    2. Check Enable JSON validation in project.
    - -

    Setting the Web Application Configuration

    - + +

    Setting the Web Application Configuration

    +

    The Web application configuration consists of application information, such as version, features, and privileges, which are available for the application. To configure the application information in the Web application configuration editor, double-click the application config.xml file in the Project Explorer view.

    Figure: Setting the application configuration

    Setting the application configuration

    You can edit the application properties using the form tabs of the Web application configuration editor.

    - +

    Defining and Editing General Information in the Overview Tab

    -

    You can define and edit general information of the application in the Overview tab of the Web application configuration editor.

    +

    You can define and edit general information of the application in the Overview tab of the Web application configuration editor.

    You can perform the following tasks using the Overview tab:

    - +
    • View the application identifier. -

      The Tizen Studio creates automatically an application ID, which uniquely identifies the application within the package.

      • +

      The Tizen Studio creates automatically an application ID, which uniquely identifies the application within the package.

    • Set the content.

      The content represents the start-up file of the Web application.

      • -
    • Set the application name. +
    • Set the application name.

      The application name is displayed in an application menu or in other contexts.

    • Set the version. -

      The format of the current application version is "x.y.z".

      • -
    • Add an application icon. -

      You can add a launcher icon to your application by defining it in the Icon panel.

      +

      The format of the current application version is "x.y.z".

      • +
    • Add an application icon. +

      You can add a launcher icon to your application by defining it in the Icon panel.

      The following table describes the available icon format and size.

      Table: Icon format and size

      - +
      - - - + + + - - + + - - + +
      FormatSize [Xhigh (HD)]
      FormatSize [Xhigh (HD)]
      32-bit PNG with alpha
      32-bit PNG with alpha 117 x 117 pixels
    • Define the application author, license, and description in the Managing the Application section: @@ -125,232 +125,232 @@

      You can declare any device software or hardware features that your application requires to run properly. The declaration can be used for application filtering in the Tizen Store.

      -

      To enable filtering for your Web application:

      +

      To enable filtering for your Web application:

        -
      1. In the Features tab, click +.
        2. -
      2. Select the needed features from the predefined list of features available for filtering.
        3. -
      3. Click Finish.
        4. +
      4. In the Features tab, click +.
        5. +
      5. Select the needed features from the predefined list of features available for filtering.
        6. +
      6. Click Finish.
      7. Upload and publish the application package on the Tizen Store. -

        If a Tizen-powered device requests applications, the store displays a list containing only applications compatible with the user's device.

        +

        If a Tizen-powered device requests applications, the store displays a list containing only applications compatible with the user's device.

        8. -
      - -

      After saving the feature information with the Web application configuration editor, you can see the added code in the Source tab:

      + + +

      After saving the feature information with the Web application configuration editor, you can see the added code in the Source tab:

      -<feature name="http://tizen.org/feature/network.nfc"/>
-
      +<feature name="http://tizen.org/feature/network.nfc"/> +

      Specifying Privileges in the Privileges Tab

      -

      You can use features and services provided by privileged APIs, which handle platform and user-sensitive data. You can specify an API, or API groups, accessed and used by the Web application in the Privileges tab of the Web application configuration editor. The tab serves as a standardized tool to request the binding of an IRI-identifiable runtime component for a Web application to use at runtime.

      - -

      To add a privilege:

      -
        -
      1. In the Privileges tab, click +.
        2. -
      2. In the Add privilege window, select an option: -
          -
        • Internal: Select the needed privileges from the predefined list of API privileges.
          • -
        • Privilege name: Manually enter the URL containing a privilege definition.
          • -
        • File: Click Browse and select a privilege file (with the .xml or .widlprocxml extension).
          • -
        3. -
      3. Click Finish.
        4. -
      -

      After saving the privilege information with the Web application configuration editor, you can see the added code in the Source tab:

      - 
      <tizen:privilege name="http://tizen.org/privilege/application.launch"/>
      +

      You can use features and services provided by privileged APIs, which handle platform and user-sensitive data. You can specify an API, or API groups, accessed and used by the Web application in the Privileges tab of the Web application configuration editor. The tab serves as a standardized tool to request the binding of an IRI-identifiable runtime component for a Web application to use at runtime.

      + +

      To add a privilege:

      +
        +
      1. In the Privileges tab, click +.
        2. +
      2. In the Add privilege window, select an option: +
          +
        • Internal: Select the needed privileges from the predefined list of API privileges.
          • +
        • Privilege name: Manually enter the URL containing a privilege definition.
          • +
        • File: Click Browse and select a privilege file (with the .xml or .widlprocxml extension).
          • +
        3. +
      3. Click Finish.
        4. +
      +

      After saving the privilege information with the Web application configuration editor, you can see the added code in the Source tab:

      + 
      <tizen:privilege name="http://tizen.org/privilege/application.launch"/>

      Defining External Access Policies in the Policy Tab

      -

      According to the W3C Access Requests Policy (WARP), you cannot access external network resources by default. If you require access to an external network resource, you must request network resource permissions for the Web application using the Policy tab of the Web application configuration editor.

      +

      According to the W3C Access Requests Policy (WARP), you cannot access external network resources by default. If you require access to an external network resource, you must request network resource permissions for the Web application using the Policy tab of the Web application configuration editor.

      + - -

      The following table lists the policy properties you can edit in the Policy tab.

      -

      Table: Policy information

      - - - - - - - - +

      The following table lists the policy properties you can edit in the Policy tab.

      +

      Table: Policy information

      +
      PropertyDescription
      content-security-policy
      + + + + + + + - - - - - - - - + + + + + + + + - - - + + + + - - - -
      PropertyDescription
      content-security-policy Used to define an additional content security policy for a packaged or hosted application. The policy string is defined according to http://www.w3.org/TR/CSP/ (v1.0). -
      content-security-policy-report-onlyUsed to define an additional content security policy for a packaged or hosted application (for monitoring purposes only). -
      allow-navigationUsed to define a list of URL domains allowed for the Web application. +
      content-security-policy-report-onlyUsed to define an additional content security policy for a packaged or hosted application (for monitoring purposes only). +
      allow-navigationUsed to define a list of URL domains allowed for the Web application.

      This attribute is optional.

      -
      Access
      Access Used to define network resource permissions. -

      To request network resource permissions, click + and enter the resource URLs in the Network URL column. You can allow the Web application to access the URL sub-domains by setting the Allow subdomain column value as true.

      -
      - +

      To request network resource permissions, click + and enter the resource URLs in the Network URL column. You can allow the Web application to access the URL sub-domains by setting the Allow subdomain column value as true.

      +
    +

    After setting the policy information with the Web application configuration editor, you can see the added code in the Source tab:

    -<access origin="http://www.tizen.org" subdomains="true"/>
+<access origin="http://www.tizen.org" subdomains="true"/>
 <tizen:allow-navigation>tizen.org *.tizen.org<tizen:allow-navigation/>
-<tizen:content-security-policy>script-src 'self'</tizen:content-security-policy>
-<tizen:content-security-policy-report-only>script-src 'self';</tizen:content-security-policy-report-only>
    +<tizen:content-security-policy>script-src 'self'</tizen:content-security-policy> +<tizen:content-security-policy-report-only>script-src 'self';</tizen:content-security-policy-report-only>

    Adding Localized Application Details in the Localization Tab

    -

    You can provide localized versions of the application name, description, and license in the Localization tab of the Web application configuration editor.

    - -

    To add a localized name, description, or license:

    +

    You can provide localized versions of the application name, description, and license in the Localization tab of the Web application configuration editor.

    + +

    To add a localized name, description, or license:

    • In the Name panel, click +. Select the language, define the application name for that language, and click OK.

      The following example shows the setting in the config.xml file:

      -<name xml:lang="en-gb">Lee</name>
+<name xml:lang="en-gb">Lee</name>
    • In the Description panel, click +. Select the language, define the application description for that language, and click OK.

      The following example shows the setting in the config.xml file:

      -<description xml:lang="en-gb">Widget</description>
+<description xml:lang="en-gb">Widget</description>
    • In the License panel, click +. Select a language, define the license and license URI for that language, and click OK. -

      The following example shows the setting in the config.xml file code:

      +

      The following example shows the setting in the config.xml file code:

      -<license xml:lang="en-gb" href=" http://www.apache.org/licenses/LICENSE-2.0.html">
-   Apache License, Version 2.0
+<license xml:lang="en-gb" href=" http://www.apache.org/licenses/LICENSE-2.0.html">
+   Apache License, Version 2.0
 </license>
    -

    You can localize a Web application to adapt to various languages and cultural environments by creating different Web application versions for different languages. For more information see Localizing Web Applications.

    +

    You can localize a Web application to adapt to various languages and cultural environments by creating different Web application versions for different languages. For more information see Localizing Web Applications.

    Declaring Name-value Pairs in the Preferences Tab

    -

    You can declare name-value pairs which can be set and retrieved using the Widget Interface API (in mobile or wearable applications) in the Preferences tab of the Web application configuration editor. These name-value pairs, or preferences, are used by the Web application during execution.

    +

    You can declare name-value pairs which can be set and retrieved using the Widget Interface API (in mobile or wearable applications) in the Preferences tab of the Web application configuration editor. These name-value pairs, or preferences, are used by the Web application during execution.

    -

    To add preferences, click +. A new row appears in the table. Enter values in the Name and Value columns. You can set a preference as read-only by setting the Read-only column value as true.

    -

    After saving the preference information with the Web application configuration editor, you can see the added code in the Source tab:

    +

    To add preferences, click +. A new row appears in the table. Enter values in the Name and Value columns. You can set a preference as read-only by setting the Read-only column value as true.

    +

    After saving the preference information with the Web application configuration editor, you can see the added code in the Source tab:

    -<preference name="key" value="value" readonly="false"/>    
+<preference name="key" value="value" readonly="false"/>

    Configuring the Tizen Schema Extension in the Tizen Tab

    -

    The Tizen tab of the Web application configuration editor shows the Tizen schema extension. Some of the attributes specified on this tab are mandatory and must be defined, whereas others are optional.

    - -

    The following table describes the schema extension properties that you can edit.

    -

    Table: Tizen-specific information

    - - - - - - - - - +

    The Tizen tab of the Web application configuration editor shows the Tizen schema extension. Some of the attributes specified on this tab are mandatory and must be defined, whereas others are optional.

    + +

    The following table describes the schema extension properties that you can edit.

    +

    Table: Tizen-specific information

    +
    PropertyDescription
    ApplicationID
    + + + + + + + + +

    This attribute is mandatory.

    - - + + - - - +

    This attribute is mandatory and must be a float value, such as 1.0 or 2.0.

    + + + +

    This attribute is optional. The default value is single.

    - - + + - - +

    This attribute is optional and used in wearable applications only. The default value is disable.

    + + - + - - - - +

    If the start page is on an external server, this attribute points to it.

    + + + + - - - +

    This attribute is optional. The default value is portrait.

    + + + - - - +

    This attribute is optional. The default value is enable.

    + + + - - - +

    This attribute is optional. The default value is disable.

    + + + - - - +

    This attribute is optional. The default mode is disable.

    + + + - - - +

    This attribute is optional. The default mode is auto.

    + + + - - - +

    This attribute is optional. The default mode is enable.

    + + + - - - + <tizen:src name="edit.html"/> + <tizen:operation name="http://tizen.org/appcontrol/operation/edit"/> + <tizen:uri name="file"/> + <tizen:mime name="image/jpeg"/> +</tizen:app-control> + + + - - - - + + + + - - - +

    This attribute is mandatory.

    + + + +

    This attribute is mandatory.

    - - + + +

    This attribute is mandatory.

    - - + + +

    This attribute is mandatory.

    - - + + +

    This attribute is optional.

    - + - - + + +<tizen:metadata key="key1"/> +<tizen:metadata key="key2" value="value"/> + + - + - + - + + - + +

    To edit the setting values, select the row in the Web Widget section table, click the Edit icon (shaped like a pen), and define the values. For more information on the values, see Tizen Web Widget.

    + - -
    PropertyDescription
    ApplicationID Tizen application ID, which is randomly created from the Tizen package ID and project name. -

    This attribute is mandatory.
    Required Version
    Required Version Indicates the minimum API version that the Web application supports. -

    This attribute is mandatory and must be a float value, such as 1.0 or 2.0.

    Launch Mode
    Launch Mode Indicates whether the application is launched as a main (single) or sub application, or whether a caller application defines the launch mode when the application is launched by an application control request. -

    This attribute is optional. The default value is single.
    Ambient Support
    Ambient Support Indicates whether the Web application supports the ambient mode. -

    This attribute is optional and used in wearable applications only. The default value is disable.

    ContentSrcSrc In Widget Packaging and XML Configuration, the Web application start page is a document within the Web application package. The Tizen WRT allows the start page to be hosted on an external server. -

    If the start page is on an external server, this attribute points to it.

    SettingScreen Orientation
    SettingScreen Orientation Sets the application screen orientation to landscape or portrait mode, or auto-rotation. -

    This attribute is optional. The default value is portrait.

    Context Menu
    Context Menu Sets the Web application support for context menus. -

    This attribute is optional. The default value is enable.

    Background Support
    Background Support Defines whether the execution of the Web application continues when the application is sent to the background. -

    This attribute is optional. The default value is disable.

    Encryption
    Encryption Sets the encryption of application resources (JS, CSS, and HTML files). -

    This attribute is optional. The default mode is disable.

    Install Location
    Install Location Sets the installation location, for example, the SD card. -

    This attribute is optional. The default mode is auto.

    HW Key Event
    HW Key Event Sets the support for the hardware key. -

    This attribute is optional. The default mode is enable.

    Application Control
    Application Control Describes the application control functionalities provided by the application. To define an application control used to access the functionality of your application, click + in the Application Control panel and define the details.

    The operation, uri, and mime fields describe the functionalities that other applications can request and the src field describes the application page that handles the request.

    The following example shows the setting in the config.xml file code:

     <tizen:app-control>
-   <tizen:src name="edit.html"/>
-   <tizen:operation name="http://tizen.org/appcontrol/operation/edit"/>
-   <tizen:uri name="file"/>
-   <tizen:mime name="image/jpeg"/>
-</tizen:app-control>
    Account
    Account To register an account provider, click + in the Account section and define the account provider information.
    Display nameTo register an account provider, click + in the Account section and define the account provider information.
    Display name Used to define the localized display name of the account provider.

    To add a localized name, click Add in the Display name panel, select the language, define the display name for that language, and click OK.

    -

    This attribute is mandatory.

    Multiple account
    Multiple account Indicates whether multiple accounts are supported. -

    This attribute is mandatory.
    Icon
    Icon Used to define the path of the icon representing the account provider. The icon image is used by account settings and must be placed in a shared directory. The size is 72 x 72. -

    This attribute is mandatory.
    Small icon
    Small icon Used to define the path of the small icon representing the account provider. The icon image is used by account settings and must be placed in a shared directory. The size is 45 x 45. -

    This attribute is mandatory.
    Capabilities
    Capabilities The capabilities of the account provider defined in the IRI format:

    http://<vendor information>/accounts/capability/<name>

    The following predefined capabilities can be used:

    @@ -361,43 +361,43 @@

    Used when the account is related to calendar.

    To add a capability, click an empty row in the Capabilities panel table and select a capability you need.

    -

    This attribute is optional.
    Background Category Defines the background category type (since Tizen 2.4).

    To add background category types to allow running on the background, click + in the Background Category section, select the category type, and click OK.

    Meta Data Defines key-value pairs that can be accessed (read-only) through the Application API (in mobile and wearable applications).

    To add a key-value pair, click + in the Meta Data section, define a key (unique string) and value (string), and click OK. This attribute is optional.

    The following example shows the setting in the config.xml file code:

    -<tizen:metadata key="key1"/>
-<tizen:metadata key="key2" value="value"/>
-
    -
    CategoryDefines the categories to which a service application belongs. -

    To add a category, click + in the Category section, select the category, and click OK. This attribute is optional and used in wearable applications only.

    -     		Defines the categories to which a service application belongs. +

    To add a category, click + in the Category section, select the category, and click OK. This attribute is optional and used in wearable applications only.

    +
    Service Defines service application-specific settings.

    To define the setting values, click + in the Service section, and define the values. For more information on the values, see Tizen Service.

    -
    Web Widget Defines widget application-specific settings. -

    To edit the setting values, select the row in the Web Widget section table, click the Edit icon (shaped like a pen), and define the values. For more information on the values, see Tizen Web Widget.

    -
    + +

    Editing the config.xml File in the Source Tab

    @@ -408,7 +408,7 @@ The config.xml must conform not only to the XML file format but also to the W3C specification requirements. If you edit application information manually in the config.xml file source code, you can introduce errors preventing the application from running normally.
    - +
    @@ -427,7 +427,7 @@ var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async 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); })(); - - + + \ No newline at end of file diff --git a/org.tizen.training/html/web/wearable/first_app_ww.htm b/org.tizen.training/html/web/wearable/first_app_ww.htm index b65d72c..5663566 100644 --- a/org.tizen.training/html/web/wearable/first_app_ww.htm +++ b/org.tizen.training/html/web/wearable/first_app_ww.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Wearable Web Application + Creating Your First Tizen Wearable Web Application @@ -224,7 +224,7 @@

    You can run the Web application on the emulator or a real target device.

    - +
    Note Since the Web Simulator does not support a circular UI, this topic does not cover the instructions for running the application on the Web Simulator. @@ -263,7 +263,7 @@

    If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

    -

    Selecting the emulator to use

    +

    Selecting the emulator to use

  • Confirm that the application launches on the emulator. @@ -333,7 +333,7 @@
  • Run the application:
    1. In the Connection Explorer view, select the device.
      2. -
    2. In Project Explorer view, right-click the project and select Run As > Tizen Web Application. +
    3. In Project Explorer view, right-click the project and select Run As > Tizen Web Application.

      Running the application on a target device

      @@ -343,12 +343,12 @@

      If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

      -

      Selecting the device to use

      +

      Selecting the device to use

    4. Confirm that the application launches in the target device.
    - +
    Note The application is launched using the default debug run configuration. To create and use another configuration: @@ -358,7 +358,7 @@

    Run Configurations window

    • - +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    @@ -371,19 +371,19 @@

    The W3C specifications provide HTML and CSS features for creating a user interface. With HTML, you can define the structure of the application screens, while CSS allows you to define the look and feel of the screens.

    -

    HTML

    +

    HTML

    HTML DOM is a structured model to control Web elements. It is an official W3C standard to express the document regardless of platforms or languages, and the foundation of the HTML5 APIs.

    The <html> element is the top-level element of the HTML DOM tree that wraps the entire document, and it has the <head> and <body> elements as child nodes:

     <!DOCTYPE html>
 <html>
-   <head>
-      <!--Content-->
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <!--Content-->
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -397,19 +397,19 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="utf-8" />
-      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
-      <meta name="description" content="Tizen Wearable Web Basic Template"/>
-
-      <title>Tizen Wearable Web Basic Application</title>
-
-      <link rel="stylesheet" type="text/css" href="css/style.css"/>
-      <script src="js/main.js"></script>
-   </head>
-   <body>
-      <!--Content-->
-   </body>
+   <head>
+      <meta charset="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+      <meta name="description" content="Tizen Wearable Web Basic Template"/>
+
+      <title>Tizen Wearable Web Basic Application</title>
+
+      <link rel="stylesheet" type="text/css" href="css/style.css"/>
+      <script src="js/main.js"></script>
+   </head>
+   <body>
+      <!--Content-->
+   </body>
 </html>
    @@ -417,17 +417,17 @@ 
     <body>
-   <div id="main" class="page">
-      <div class="contents">
-         <span id="content-text">Basic</span>
-      </div>
-   </div>
+   <div id="main" class="page">
+      <div class="contents">
+         <span id="content-text">Basic</span>
+      </div>
+   </div>
 </body>

    The HTML code displays the Basic text on the screen.

    -

    Figure: Screen with Basic text

    +

    Figure: Screen with Basic text

    Screen with Basic text

    CSS

    @@ -446,23 +446,23 @@ 
     <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="utf-8" />
-      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
-      <meta name="description" content="Tizen Wearable Web Basic Template"/>
-
-      <title>Tizen Wearable Web Basic Application</title>
-
-      <link rel="stylesheet" type="text/css" href="css/style.css"/>
-      <script src="js/main.js"></script>
-   </head>
-   <body>
-      <div id="main" class="page">
-         <div class="contents" style='margin:auto;'>
-            <span id="content-text">Basic</span>
-         </div>
-      </div>
-   </body>
+   <head>
+      <meta charset="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+      <meta name="description" content="Tizen Wearable Web Basic Template"/>
+
+      <title>Tizen Wearable Web Basic Application</title>
+
+      <link rel="stylesheet" type="text/css" href="css/style.css"/>
+      <script src="js/main.js"></script>
+   </head>
+   <body>
+      <div id="main" class="page">
+         <div class="contents" style='margin:auto;'>
+            <span id="content-text">Basic</span>
+         </div>
+      </div>
+   </body>
 </html>
    @@ -474,41 +474,41 @@ html, body { -   width: 100%; -   height: 100%; -   margin: 0 auto; -   padding: 0; -   background-color: #222222; -   color: #ffffff; + width: 100%; + height: 100%; + margin: 0 auto; + padding: 0; + background-color: #222222; + color: #ffffff; } .page { -   width: 100%; -   height: 100%; -   display: table; + width: 100%; + height: 100%; + display: table; } .contents { -   display: table-cell; -   vertical-align: middle; -   text-align: center; -   -webkit-tap-highlight-color: transparent; + display: table-cell; + vertical-align: middle; + text-align: center; + -webkit-tap-highlight-color: transparent; } #content-text { -   font-weight: bold; -   font-size: 5em; + font-weight: bold; + font-size: 5em; }
  • index.html: 
     <body>
-   <div id="main" class="page">
-      <div class="contents">
-         <span id="content-text">Basic</span>
-      </div>
-   </div>
+   <div id="main" class="page">
+      <div class="contents">
+         <span id="content-text">Basic</span>
+      </div>
+   </div>
 </body>
    • @@ -518,12 +518,12 @@ body 
     #content-text
 {
-   font-weight: bold;
-   font-size: 5em;
-   color: #ff0000;
+   font-weight: bold;
+   font-size: 5em;
+   color: #ff0000;
 }
    -

    Figure: Screen with a new text color

    +

    Figure: Screen with a new text color

    Screen with a new text color

    TAU (Tizen Advanced UI)

    @@ -563,16 +563,16 @@ body 
     <!DOCTYPE html>
 <html>
-   <head>
-      <link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css"/>
-      <!--For a circular device, import tau.circle.min.css-->
-      <link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css">
-   </head>
-   <body>
-      <!--HTML BODY CONTENT-->
-      <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
-      <script type="text/javascript" src="js/circle-helper.js"></script>
-   </body>
+   <head>
+      <link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css"/>
+      <!--For a circular device, import tau.circle.min.css-->
+      <link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css">
+   </head>
+   <body>
+      <!--HTML BODY CONTENT-->
+      <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
+      <script type="text/javascript" src="js/circle-helper.js"></script>
+   </body>
 </html>
    @@ -592,26 +592,26 @@ body -

    You can add an additional <script src="<CUSTOM_LIBRARY>"> or <link rel="stylesheet" src="<CUSTOM_CSS>"> element to include your own scripts and style sheets. However, place them after the default <script> elements, as you can use any TAU APIs provided by the default libraries.

    +

    You can add an additional <script src="<CUSTOM_LIBRARY>"> or <link rel="stylesheet" src="<CUSTOM_CSS>"> element to include your own scripts and style sheets. However, place them after the default <script> elements, as you can use any TAU APIs provided by the default libraries.

    To load your JavaScript file, include the file in the <script> element in the HTML <body> element. Since the TAU files are already loaded, you can use any APIs from these libraries as well.

    The following example shows a basic TAU template. Overwrite the index.html file content with the following code:

     <!DOCTYPE html>
 <html>
-   <head>
-      <meta name="viewport" content="width=device-width, user-scalable=no"/>
-      <title>Hello TAU</title>
-      <link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css"/>
-      <link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css">
-      <!--Load theme file for your application-->
-      <link rel="stylesheet" href="css/style.css"/>
-   </head>
-   <body>
-      <!--HTML BODY CONTENT-->
-      <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
-      <script type="text/javascript" src="js/circle-helper.js"></script>
-      <script src="js/app.js"></script>
-   </body>
+   <head>
+      <meta name="viewport" content="width=device-width, user-scalable=no"/>
+      <title>Hello TAU</title>
+      <link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css"/>
+      <link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css">
+      <!--Load theme file for your application-->
+      <link rel="stylesheet" href="css/style.css"/>
+   </head>
+   <body>
+      <!--HTML BODY CONTENT-->
+      <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
+      <script type="text/javascript" src="js/circle-helper.js"></script>
+      <script src="js/app.js"></script>
+   </body>
 </html>
    @@ -623,22 +623,22 @@ body

    To create a page in the <body> element, use the ui-page class with the <div> element:

     <body>
-   <div class="ui-page" id="main">
-   </div>
-   <!--Script import-->
-   <script> ... </script>
+   <div class="ui-page" id="main">
+   </div>
+   <!--Script import-->
+   <script> ... </script>
 </body>

  • To layout the page, add a content area with the ui-content class and a header with the ui-header class:

    -<div class="ui-page" id="main">
-   <header class="ui-header">
-      <h2 class="ui-title">Hello World</h2>
-   </header>
-   <div class="ui-content">
-      <p>This is content area</p>
-   </div>
+<div class="ui-page" id="main">
+   <header class="ui-header">
+      <h2 class="ui-title">Hello World</h2>
+   </header>
+   <div class="ui-content">
+      <p>This is content area</p>
+   </div>
 </div>
    @@ -649,13 +649,13 @@ body

  • You can add your own style in the content and footer area with a defined id attribute:

    -<div class="ui-page" id="main">
-   <header class="ui-header">
-      <h2 class="ui-title">Hello World</h2>
-   </header>
-   <div class="ui-content" id="contentArea">
-      <p>This is content area</p>
-   </div>
+<div class="ui-page" id="main">
+   <header class="ui-header">
+      <h2 class="ui-title">Hello World</h2>
+   </header>
+   <div class="ui-content" id="contentArea">
+      <p>This is content area</p>
+   </div>
 </div>
    @@ -663,7 +663,7 @@ body 
     #contentArea
 {
-   color: #8be3d1;
+   color: #8be3d1;
 }

    With your new style, the screen looks like this.

    @@ -677,16 +677,16 @@ body
    • -

      Create a simple and basic static list. Overwrite the <ul class="ui-content"> element content with the following code:

      +

      Create a simple and basic static list. Overwrite the <ul class="ui-content"> element content with the following code:

      -<div class="ui-content">
-   <ul class="ui-listview">
-      <li><a href="#">List Item1</a></li>
-      <li><a href="#">List Item2</a></li>
-      <li><a href="#">List Item3</a></li>
-      <li><a href="#">List Item4</a></li>
-      <li><a href="#">List Item5</a></li>
-   </ul>
+<div class="ui-content">
+   <ul class="ui-listview">
+      <li><a href="#">List Item1</a></li>
+      <li><a href="#">List Item2</a></li>
+      <li><a href="#">List Item3</a></li>
+      <li><a href="#">List Item4</a></li>
+      <li><a href="#">List Item5</a></li>
+   </ul>
 </div>

      The screen now shows a basic list.

      @@ -698,31 +698,31 @@ body

      The following example shows how to create a SnapListview using the tau.helper class:

      -(function(tau) 
+(function(tau)
 {
-   var page,
-       list,
-       listHelper;
-
-   /* Check for a circular device */
-   if (tau.support.shape.circle) 
-   {
-      document.addEventListener("pagebeforeshow", function(e) 
-      {
-         page = e.target;
-         list = page.querySelector(".ui-listview");
-         if (list) 
-         {
-            /* Create SnapListView and binding rotary event using tau.helper */
-            listHelper = tau.helper.SnapListStyle.create(list);            
-         }
-      });
-
-      document.addEventListener("pagebeforehide", function(e) 
-      {
-         listHelper.destroy();
-      });
-   }
+   var page,
+       list,
+       listHelper;
+
+   /* Check for a circular device */
+   if (tau.support.shape.circle)
+   {
+      document.addEventListener("pagebeforeshow", function(e)
+      {
+         page = e.target;
+         list = page.querySelector(".ui-listview");
+         if (list)
+         {
+            /* Create SnapListView and binding rotary event using tau.helper */
+            listHelper = tau.helper.SnapListStyle.create(list);
+         }
+      });
+
+      document.addEventListener("pagebeforehide", function(e)
+      {
+         listHelper.destroy();
+      });
+   }
 }(tau));
      @@ -737,23 +737,23 @@ body 
       <!DOCTYPE html>
 <html>
-   <head>
-      <meta name="viewport" content="width=device-width, user-scalable=no"/>
-      <title>Hello TAU</title>
-      <link rel="stylesheet"  href="lib/tau/wearable/theme/default/tau.min.css">
-      <link rel="stylesheet" media="all" href="lib/tau/wearable/theme/default/tau.circle.min.css">
-   </head>
-   <body>
-      <div class="ui-page" id="second">
-         <header class="ui-header">
-            <h2 class="ui-title">Second Page</h2>
-         </header>
-         <div id="secondContent" class="ui-content">
-            Hello Tizen!
-         </div>
-      </div>
-      <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
-   </body>
+   <head>
+      <meta name="viewport" content="width=device-width, user-scalable=no"/>
+      <title>Hello TAU</title>
+      <link rel="stylesheet"  href="lib/tau/wearable/theme/default/tau.min.css">
+      <link rel="stylesheet" media="all" href="lib/tau/wearable/theme/default/tau.circle.min.css">
+   </head>
+   <body>
+      <div class="ui-page" id="second">
+         <header class="ui-header">
+            <h2 class="ui-title">Second Page</h2>
+         </header>
+         <div id="secondContent" class="ui-content">
+            Hello Tizen!
+         </div>
+      </div>
+      <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
+   </body>
 </html>
      • @@ -763,12 +763,12 @@ body

      Go back to the index.html file and add a file path in the listview <li><a href> element:

      -<ul class="ui-listview">
-   <li><a href="second.html">Go to Second Page</a></li>
-   <li><a href="#">List Item2</a></li>
-   <li><a href="#">List Item3</a></li>
-   <li><a href="#">List Item4</a></li>
-   <li><a href="#">List Item5</a></li>
+<ul class="ui-listview">
+   <li><a href="second.html">Go to Second Page</a></li>
+   <li><a href="#">List Item2</a></li>
+   <li><a href="#">List Item3</a></li>
+   <li><a href="#">List Item4</a></li>
+   <li><a href="#">List Item5</a></li>
 </ul>
    • @@ -781,29 +781,29 @@ body
    • Go back with the back key. -

      You can navigate from page to page with the <a href="PAGE_FILE_NAME"> elements, but you cannot go back. In this step, you learn to add some code in a JavaScript file to enable the user to return to the first page.

      +

      You can navigate from page to page with the <a href="PAGE_FILE_NAME"> elements, but you cannot go back. In this step, you learn to add some code in a JavaScript file to enable the user to return to the first page.

      1. Add a new JavaScript file to the index.html file:

         <body>
-   <div class="ui-page" id="main">
-      <header class="ui-header">
-         <h2 class="ui-title">Hello TAU</h2>
-      </header>
-      <div class="ui-content">
-         <ul class="ui-listview">
-            <li><a href="second.html">Go to Second</a></li>
-            <li><a href="#">List Item2</a></li>
-            <li><a href="#">List Item3</a></li>
-            <li><a href="#">List Item4</a></li>
-            <li><a href="#">List Item5</a></li>
-         </ul>
-      </div>
-   </div>
-   <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
-   <script type="text/javascript" src="js/circle-helper.js"></script>
-   <script src="app.js"></script>
+   <div class="ui-page" id="main">
+      <header class="ui-header">
+         <h2 class="ui-title">Hello TAU</h2>
+      </header>
+      <div class="ui-content">
+         <ul class="ui-listview">
+            <li><a href="second.html">Go to Second</a></li>
+            <li><a href="#">List Item2</a></li>
+            <li><a href="#">List Item3</a></li>
+            <li><a href="#">List Item4</a></li>
+            <li><a href="#">List Item5</a></li>
+         </ul>
+      </div>
+   </div>
+   <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
+   <script type="text/javascript" src="js/circle-helper.js"></script>
+   <script src="app.js"></script>
 </body>
      2. @@ -811,21 +811,21 @@ body

        Overwrite the app.js file content with the following code:

        -(function() 
+(function()
 {
-   window.addEventListener('tizenhwkey', function(ev) 
-   {
-      if (ev.keyName === "back") 
-      {
-         var page = document.getElementsByClassName('ui-page-active')[0],
-             pageid = page ? page.id : "";
-
-         if (pageid !== "main") 
-         {
-            window.history.back();
-         }
-      }
-   });
+   window.addEventListener('tizenhwkey', function(ev)
+   {
+      if (ev.keyName === "back")
+      {
+         var page = document.getElementsByClassName('ui-page-active')[0],
+             pageid = page ? page.id : "";
+
+         if (pageid !== "main")
+         {
+            window.history.back();
+         }
+      }
+   });
 }());
      • @@ -835,31 +835,31 @@ body

      You have to consider the fact that when the user clicks the back key, the application can only exit if it is showing the main page. If the second page is showing, the application must return to the main page.

      The following example shows how to handle the back key input with page navigation and application exit. This code is included in the TAU Basic project template main.js file by default.

      -(function() 
+(function()
 {
-   window.addEventListener('tizenhwkey', function(ev) 
-   {
-      if (ev.keyName === "back") 
-      {
-         var page = document.getElementsByClassName('ui-page-active')[0],
-             pageid = page ? page.id : "";
-
-         if (pageid === "main") 
-         {
-            try 
-            {
-               tizen.application.getCurrentApplication().exit();
-            } 
-            catch (ignore) 
-            {
-            }
-         } 
-         else 
-         {
-            window.history.back();
-         }
-      }
-   });
+   window.addEventListener('tizenhwkey', function(ev)
+   {
+      if (ev.keyName === "back")
+      {
+         var page = document.getElementsByClassName('ui-page-active')[0],
+             pageid = page ? page.id : "";
+
+         if (pageid === "main")
+         {
+            try
+            {
+               tizen.application.getCurrentApplication().exit();
+            }
+            catch (ignore)
+            {
+            }
+         }
+         else
+         {
+            window.history.back();
+         }
+      }
+   });
 }());
      diff --git a/org.tizen.training/html/web/wearable_watch/first_app_watch_ww.htm b/org.tizen.training/html/web/wearable_watch/first_app_watch_ww.htm index 7d8dbcf..82643cb 100644 --- a/org.tizen.training/html/web/wearable_watch/first_app_watch_ww.htm +++ b/org.tizen.training/html/web/wearable_watch/first_app_watch_ww.htm @@ -5,13 +5,13 @@ - + - Creating Your First Tizen Wearable Web Watch Application + Creating Your First Tizen Wearable Web Watch Application @@ -219,7 +219,7 @@

      Running Your Application

      You can run the Web watch application on the emulator or a real target device.

      - +
      Note Since the Web Simulator does not support a circular UI, this topic does not cover the instructions for running the application on the Web Simulator. @@ -258,15 +258,15 @@

      If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

      -

      Selecting the emulator to use

      +

      Selecting the emulator to use

      In the Console view, you can see that the application is successfully installed. However, it does not run on the emulator screen until you change the watch face in the emulator Settings menu.

      -

      Successful installation

      +

      Successful installation

    • Change the watch face.

      When a watch application is successfully installed on the emulator, the watch UI is visible in the emulator Clock menu.

      To change the watch face and make the watch application visible:

      -

      Changing the watch face

      +

      Changing the watch face

      1. If the emulator display has been switched off, activate it by pressing the Power key (in the bottom right corner of the emulator).
        2. @@ -333,7 +333,7 @@ cd tizen-sdk/tools
      2. Run the application:
        1. In the Connection Explorer view, select the device.
          2. -
        2. In Project Explorer view, right-click the project and select Run As > Tizen Web Application. +
        3. In Project Explorer view, right-click the project and select Run As > Tizen Web Application.

          Running the application

          @@ -343,7 +343,7 @@ cd tizen-sdk/tools

          If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

          -

          Selecting the device to use

          +

          Selecting the device to use

        4. Confirm that the application launches in the target device. @@ -351,7 +351,7 @@ cd tizen-sdk/tools
        - +
        Note The application is launched using the default debug run configuration. To create and use another configuration: @@ -377,12 +377,12 @@ cd tizen-sdk/tools

        To initialize the watch application:

        1. -

          To set the application configuration, use the config.xml file:

          +

          To set the application configuration, use the config.xml file:

            -
          • By default, the BasicWatch sample has the application category defined as <tizen:category name="http://tizen.org/category/wearable_clock" />. -

            To run your application on Samsung Gear 2, Samsung Gear 2 Neo, and Samsung Gear S devices, use <tizen:category name="com.samsung.wmanager.WATCH_CLOCK" /> instead.

            +
          • By default, the BasicWatch sample has the application category defined as <tizen:category name="http://tizen.org/category/wearable_clock" />. +

            To run your application on Samsung Gear 2, Samsung Gear 2 Neo, and Samsung Gear S devices, use <tizen:category name="com.samsung.wmanager.WATCH_CLOCK" /> instead.

          • To enable a custom UI for the ambient mode, the ambient_support attribute must be set to enable.

            @@ -390,16 +390,16 @@ cd tizen-sdk/tools 
          -<widget xmlns:tizen="http://tizen.org/ns/widgets" xmlns="http://www.w3.org/ns/widgets"  
-        id="http://yourdomain/BasicWatch" version="1.0.0" viewmodes="maximized">
-   <tizen:application id="rko5hPHRgI.BasicWatch" package="rko5hPHRgI" required_version="2.3.1" 
-                      ambient_support="enable"/>
-   <tizen:category name="http://tizen.org/category/wearable_clock"/>
+<widget xmlns:tizen="http://tizen.org/ns/widgets" xmlns="http://www.w3.org/ns/widgets"
+        id="http://yourdomain/BasicWatch" version="1.0.0" viewmodes="maximized">
+   <tizen:application id="rko5hPHRgI.BasicWatch" package="rko5hPHRgI" required_version="2.3.1"
+                      ambient_support="enable"/>
+   <tizen:category name="http://tizen.org/category/wearable_clock"/>
 
-   <!--Get timetick events, occuring once a minute to enable the UI to be updated-->
-   <tizen:privilege name="http://tizen.org/privilege/alarm"/>
+   <!--Get timetick events, occuring once a minute to enable the UI to be updated-->
+   <tizen:privilege name="http://tizen.org/privilege/alarm"/>
 
-   <tizen:setting background-support="disable" encryption="disable" hwkey-event="enable"/>
+   <tizen:setting background-support="disable" encryption="disable" hwkey-event="enable"/>
 </widget>
          2. @@ -408,53 +408,53 @@ cd tizen-sdk/tools

          Modify the window.requestAnimationFrame() method to make the application compatible with the main browsers:

           window.requestAnimationFrame = window.requestAnimationFrame ||
-   window.webkitRequestAnimationFrame ||
-   window.mozRequestAnimationFrame ||
-   window.oRequestAnimationFrame ||
-   window.msRequestAnimationFrame ||
-   function(callback) 
-   {
-      'use strict';
-      window.setTimeout(callback, 1000 / 60);
-   };
          + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame || + function(callback) + { + 'use strict'; + window.setTimeout(callback, 1000 / 60); + };
        2. Initialize the canvas context and define the canvas area: 
          -window.onload = function onLoad() 
+window.onload = function onLoad()
 {
-   'use strict';
+   'use strict';
 
-   canvas = document.querySelector('canvas');
-   ctx = canvas.getContext('2d');
-   clockRadius = document.body.clientWidth / 2;
+   canvas = document.querySelector('canvas');
+   ctx = canvas.getContext('2d');
+   clockRadius = document.body.clientWidth / 2;
 
-   canvas.width = document.body.clientWidth;
-   canvas.height = canvas.width;
          + canvas.width = document.body.clientWidth; + canvas.height = canvas.width;
        3. Define an event listener to detect back key events and time tick: 
          -   /* Add eventListener for tizenhwkey */
-   window.addEventListener('tizenhwkey', function(e) 
-   {
-      if (e.keyName === 'back') 
-      {
-         try
-         { 
-            tizen.application.getCurrentApplication().exit();
-         } 
-         catch (err) 
-         {
-            console.error('Error: ', err.message);
-         }
-      }
-   });
-
-   /* Add eventListener for timetick */
-   window.addEventListener('timetick', function() 
-   {
-      console.log("timetick is called");
-      ambientWatch();
-   });
+   /* Add eventListener for tizenhwkey */
+   window.addEventListener('tizenhwkey', function(e)
+   {
+      if (e.keyName === 'back')
+      {
+         try
+         {
+            tizen.application.getCurrentApplication().exit();
+         }
+         catch (err)
+         {
+            console.error('Error: ', err.message);
+         }
+      }
+   });
+
+   /* Add eventListener for timetick */
+   window.addEventListener('timetick', function()
+   {
+      console.log("timetick is called");
+      ambientWatch();
+   });
 }
          4. @@ -468,23 +468,23 @@ window.onload = function onLoad()

        4. To define the application layout, use the index.html file.

          -

          By default, the BasicWatch sample application layout contains only the main screen that displays the clock on a canvas element.

          +

          By default, the BasicWatch sample application layout contains only the main screen that displays the clock on a canvas element.

           <head>
-   <meta charset="utf-8" />
-   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
-   <meta name="description" content="Basic Watch based on HTML canvas element" />
-   <title>BasicWatch</title>
-   <link rel="stylesheet" type="text/css" href="css/style.css" />
+   <meta charset="utf-8" />
+   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
+   <meta name="description" content="Basic Watch based on HTML canvas element" />
+   <title>BasicWatch</title>
+   <link rel="stylesheet" type="text/css" href="css/style.css" />
 </head>
 <body>
-   <div id="box">
-      <canvas class="canvas"></canvas>
-   </div>
-   <script src="js/main.js"></script>
+   <div id="box">
+      <canvas class="canvas"></canvas>
+   </div>
+   <script src="js/main.js"></script>
 </body>
-
          +

        5. To draw the watch face on the canvas, use the main.js file:

          @@ -492,162 +492,162 @@ window.onload = function onLoad()

        6. Create the clock in the middle of the canvas, and define the watch face style:

          -function renderDots() 
+function renderDots()
 {
-   'use strict';
+   'use strict';
 
-   var dx = 0,
-       dy = 0,
-       i = 1,
-       angle = null;
+   var dx = 0,
+       dy = 0,
+       i = 1,
+       angle = null;
 
-   ctx.save();
-   ctx.translate(canvas.width / 2, canvas.height / 2);
-   ctx.beginPath();
-   ctx.fillStyle = '#999999';
          + ctx.save(); + ctx.translate(canvas.width / 2, canvas.height / 2); + ctx.beginPath(); + ctx.fillStyle = '#999999';
        7. Create 4 dots on the sides of the watch face and use the fill() method to style the dots: 
          -   for (i = 1; i <= 4; i++) 
-   {
-      angle = (i - 3) * (Math.PI * 2) / 4;
-      dx = clockRadius * 0.9 * Math.cos(angle);
-      dy = clockRadius * 0.9 * Math.sin(angle);
+   for (i = 1; i <= 4; i++)
+   {
+      angle = (i - 3) * (Math.PI * 2) / 4;
+      dx = clockRadius * 0.9 * Math.cos(angle);
+      dy = clockRadius * 0.9 * Math.sin(angle);
 
-      ctx.arc(dx, dy, 3, 0, 2 * Math.PI, false);
-      ctx.fill();
-   }
-   ctx.closePath();
          + ctx.arc(dx, dy, 3, 0, 2 * Math.PI, false); + ctx.fill(); + } + ctx.closePath();
        8. Create the center point: 
          -   ctx.beginPath();
+   ctx.beginPath();
 
-   ctx.fillStyle = '#ff9000';
-   ctx.strokeStyle = '#fff';
-   ctx.lineWidth = 4;
+   ctx.fillStyle = '#ff9000';
+   ctx.strokeStyle = '#fff';
+   ctx.lineWidth = 4;
 
-   ctx.arc(0, 0, 7, 0, 2 * Math.PI, false);
-   ctx.fill();
-   ctx.stroke();
-   ctx.closePath();
+   ctx.arc(0, 0, 7, 0, 2 * Math.PI, false);
+   ctx.fill();
+   ctx.stroke();
+   ctx.closePath();
 }

      3. To display the actual time on the watch face, create the clock needles and set their position using the main.js file.

        Render the clock needles:

        -
          +
          1. The needles can be created using the renderNeedle() method.

            To create the needle as a triangle or a polygon, assign the coordinate of the beginning point with the moveTo() method. To assign the rest of the points of the triangle or polygon, use the lineTo() method, which defines the position of the next connecting vertex. You can also adjust the size of each clock needle with the lineTo() method.

            -function renderNeedle(angle, radius) 
+function renderNeedle(angle, radius)
 {
-   'use strict';
-   ctx.save();
-   ctx.rotate(angle);
-   ctx.beginPath();
-   ctx.lineWidth = 4;
-   ctx.strokeStyle = '#fff';
-   ctx.moveTo(6, 0);
-   ctx.lineTo(radius, 0);
-   ctx.closePath();
-   ctx.stroke();
-   ctx.closePath();
-   ctx.restore();
+   'use strict';
+   ctx.save();
+   ctx.rotate(angle);
+   ctx.beginPath();
+   ctx.lineWidth = 4;
+   ctx.strokeStyle = '#fff';
+   ctx.moveTo(6, 0);
+   ctx.lineTo(radius, 0);
+   ctx.closePath();
+   ctx.stroke();
+   ctx.closePath();
+   ctx.restore();
 }
          2. Create the hour needle using the renderHourNeedle() method: 
            -function renderHourNeedle(hour) 
+function renderHourNeedle(hour)
 {
-   'use strict';
+   'use strict';
 
-   var angle = null,
-       radius = null;
+   var angle = null,
+       radius = null;
 
-   angle = (hour - 3) * (Math.PI * 2) / 12;
-   radius = clockRadius * 0.55;
-   renderNeedle(angle, radius);
+   angle = (hour - 3) * (Math.PI * 2) / 12;
+   radius = clockRadius * 0.55;
+   renderNeedle(angle, radius);
 }
          3. Create the minute needle using the renderMinuteNeedle() method: 
             function renderMinuteNeedle(minute)
 {
-   'use strict';
+   'use strict';
 
-   var angle = null,
-       radius = null;
+   var angle = null,
+       radius = null;
 
-   angle = (minute - 15) * (Math.PI * 2) / 60;
-   radius = clockRadius * 0.75;
-   renderNeedle(angle, radius);
+   angle = (minute - 15) * (Math.PI * 2) / 60;
+   radius = clockRadius * 0.75;
+   renderNeedle(angle, radius);
 }
        1. Indicate the current time in the main.js file:
            -
          1. Determine the current time using the new Date() method. +
          2. Determine the current time using the new Date() method.

            To point the needles accurately, define variables for the current hour and minute.

            -function getDate() 
+function getDate()
 {
-   'use strict';
-
-   var date;
-   try 
-   {
-      date = tizen.time.getCurrentDateTime();
-   } 
-   catch (err) 
-   {
-      console.error('Error: ', err.message);
-      date = new Date();
-   }
-
-   return date;
+   'use strict';
+
+   var date;
+   try
+   {
+      date = tizen.time.getCurrentDateTime();
+   }
+   catch (err)
+   {
+      console.error('Error: ', err.message);
+      date = new Date();
+   }
+
+   return date;
 }
 
-function watch() 
+function watch()
 {
-   'use strict';
+   'use strict';
 
-   if (isAmbientMode === true) 
-   {
-      return;
-   }
+   if (isAmbientMode === true)
+   {
+      return;
+   }
 
-   var date = getDate(),
-       hours = date.getHours(),
-       minutes = date.getMinutes(),
-       seconds = date.getSeconds(),
-       hour = hours + minutes / 60,
-       minute = minutes + seconds / 60,
-       nextMove = 1000 - date.getMilliseconds();
            + var date = getDate(), + hours = date.getHours(), + minutes = date.getMinutes(), + seconds = date.getSeconds(), + hour = hours + minutes / 60, + minute = minutes + seconds / 60, + nextMove = 1000 - date.getMilliseconds();
          3. Every time a new time is indicated, erase the previous time (the previously positioned needles) using the clearRect() method: 
            -   ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
            + ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
          4. Point the clock needles to display the current time: 
            -   renderDots();
-   renderHourNeedle(hour);
-   renderMinuteNeedle(minute);
-
-   ctx.restore();
-   setTimeout(function() 
-   {
-      window.requestAnimationFrame(watch);
-   }, nextMove);
+   renderDots();
+   renderHourNeedle(hour);
+   renderMinuteNeedle(minute);
+
+   ctx.restore();
+   setTimeout(function()
+   {
+      window.requestAnimationFrame(watch);
+   }, nextMove);
 }
          2. -
        +

      Using the Ambient Mode

      @@ -658,37 +658,37 @@ function watch()
      Note To use the ambient mode, the user must enable it in the device settings. In addition, in the Gear S2 device, the ambient mode activates only when you are wearing the watch on the wrist. - +

      Since Tizen 2.3.2, some devices introduce a high color mode for the ambient mode. In the high color mode, you can use more colors (usually, 24-bit color) for drawing the ambient mode UI. To check whether the device supports the high color mode, use the following code:

       bool support;
 int ret;
 
-ret = system_info_get_platform_bool("http://tizen.org/feature/screen.always_on.high_color", &support);
+ret = system_info_get_platform_bool("http://tizen.org/feature/screen.always_on.high_color", &support);
      - +

      To use the ambient mode:

      1. Define an event listener for the ambient mode: 
         /* Add eventListener for ambientmodechanged */
-window.addEventListener('ambientmodechanged', function(e) 
+window.addEventListener('ambientmodechanged', function(e)
 {
-   console.log("ambientmodechanged: " + e.detail.ambientMode);
-   if (e.detail.ambientMode === true) 
-   {
-      /* Render ambient mode */
-      isAmbientMode = true;
-      ambientWatch();
-   } 
-   else 
-   {
-      /* Render normal mode */
-      isAmbientMode = false;
-      window.requestAnimationFrame(watch);
-   }
+   console.log("ambientmodechanged: " + e.detail.ambientMode);
+   if (e.detail.ambientMode === true)
+   {
+      /* Render ambient mode */
+      isAmbientMode = true;
+      ambientWatch();
+   }
+   else
+   {
+      /* Render normal mode */
+      isAmbientMode = false;
+      window.requestAnimationFrame(watch);
+   }
 });
 
 /* Normal mode */
@@ -700,48 +700,48 @@ window.requestAnimationFrame(watch);
 
 
      2. Create the ambient mode dots:
 
        -function renderAmbientDots() 
+function renderAmbientDots()
 {
-   'use strict';
+   'use strict';
+
+   ctx.save();
 
-   ctx.save();
+   ctx.translate(canvas.width / 2, canvas.height / 2);
 
-   ctx.translate(canvas.width / 2, canvas.height / 2);
-	
-   ctx.beginPath();
+   ctx.beginPath();
 
-   ctx.fillStyle = '#000000';
-   ctx.strokeStyle = '#fff';
-   ctx.lineWidth = 4;
+   ctx.fillStyle = '#000000';
+   ctx.strokeStyle = '#fff';
+   ctx.lineWidth = 4;
 
-   ctx.arc(0, 0, 7, 0, 2 * Math.PI, false);
-   ctx.fill();
-   ctx.stroke();
-   ctx.closePath();
+   ctx.arc(0, 0, 7, 0, 2 * Math.PI, false);
+   ctx.fill();
+   ctx.stroke();
+   ctx.closePath();
 }
 
        
 
        3. 
 
      3. Indicate time in the ambient mode:
 
        -function ambientWatch() 
+function ambientWatch()
 {
-   'use strict';
-   /* Get the current time */
-   var date = getDate(),
-       hours = date.getHours(),
-       minutes = date.getMinutes(),
-       seconds = date.getSeconds(),
-       hour = hours + minutes / 60,
-       minute = minutes + seconds / 60;
-
-   /* Erase the previous time */
-   ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
-
-   renderAmbientDots();
-   renderHourNeedle(hour);
-   renderMinuteNeedle(minute);
-
-   ctx.restore();
+   'use strict';
+   /* Get the current time */
+   var date = getDate(),
+       hours = date.getHours(),
+       minutes = date.getMinutes(),
+       seconds = date.getSeconds(),
+       hour = hours + minutes / 60,
+       minute = minutes + seconds / 60;
+
+   /* Erase the previous time */
+   ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+
+   renderAmbientDots();
+   renderHourNeedle(hour);
+   renderMinuteNeedle(minute);
+
+   ctx.restore();
 }
 
        
 
        4. 
diff --git a/org.tizen.training/html/web/wearable_widget/first_app_widget_ww.htm b/org.tizen.training/html/web/wearable_widget/first_app_widget_ww.htm
index 3b557fd..1e5e7e6 100644
--- a/org.tizen.training/html/web/wearable_widget/first_app_widget_ww.htm
+++ b/org.tizen.training/html/web/wearable_widget/first_app_widget_ww.htm
@@ -5,13 +5,13 @@
 	
 	
 	
-		
+	
 	
 	
 	
 	
 
-	Creating Your First Tizen Wearable Web Widget Application  
+	Creating Your First Tizen Wearable Web Widget Application
 
 
 
@@ -39,7 +39,7 @@
      • - +

      Creating Your First Tizen Wearable Web Widget Application

      Welcome to Tizen wearable Web widget application development!

      @@ -47,10 +47,10 @@

      A wearable Web application is basically a Web site stored on a wearable device. You can create it using Web-native languages, such as HTML5, CSS, and JavaScript.

      A widget application is one of the Tizen application types. It can be shown by specific UI applications (such as the home screen and lock screen) that can contain widget applications.

      - -

      Figure: Widget application in a wearable device

      -

      Widget application in a wearable device

      - + +

      Figure: Widget application in a wearable device

      +

      Widget application in a wearable device

      +

      Study the following instructions to help familiarize yourself with the Tizen Web application development process as well as using the Tizen Studio and installing the created application on the emulator or target device. With the instructions, you can create and run a basic wearable Web widget application (a Web widget), which displays some text on the screen with no user interaction:

      @@ -163,15 +163,15 @@

      You can enable or disable these validators in the application preferences: go to Window > Preferences > Tizen Studio > WebWidget, and check the applicable check boxes.

      Figure: Validation preferences

      -

      Validation preferences

      +

      Validation preferences

      + +

      The validation is performed automatically when the project or package is built, or when the application is run.

      -

      The validation is performed automatically when the project or package is built, or when the application is run.

      -

      When the validation is complete, its results are shown in the Problems view. If the view is not displayed, select it from Window > Show view > Problems (keyboard shortcut: Shift + Alt + Q + X).

      Figure: Validation results

      -

      Validation results

      - +

      Validation results

      +

      Managing the Application Configuration

      To view and modify the application configuration:

      @@ -259,8 +259,8 @@ Note Since the Web Simulator does not support a circular UI, this topic does not cover the instructions for running the application on the Web Simulator.
      - - + +

      Running on the Emulator

      To run the application on the emulator:

      @@ -294,12 +294,12 @@
    • Click the run icon in the toolbar.

    If you have created multiple emulator instances, select the instance you want from the combo box in the toolbar before selecting to run the application. If you select an offline emulator, it is automatically launched when you select to run the application.

    -

    Selecting the emulator to use

    +

    Selecting the emulator to use

  • Confirm that the application launches on the emulator.

    Application running in the emulator

    - +
    Note If the emulator display has switched off, you cannot see the application launch. To switch the display on, click the Power key (in the right bottom corner of the emulator). @@ -312,16 +312,16 @@
  • Swipe the home screen to the right and select +.
  • Scroll down until you see your widget application, and select it.
    • -

    Adding to home screen

    +

    Adding to home screen

    You can see the added widget on the home screen. To access the widget from the home screen, swipe right.

    -

    Home screen widget

    +

    Home screen widget

    While the application is running, the Log view in the Tizen Studio shows the log, debug, and exception messages from the methods defined in the log macros. To see the view, in the Tizen Studio menu, go to Window > Show View > Log.

    - +

    For more information on using the emulator features, see Using Emulator Control Keys, Menu, and Panel and Using Extended Emulator Features.

    Running on a Target Device

    @@ -374,7 +374,7 @@ cd tizen-sdk/tools
  • Run the application:
    1. In the Connection Explorer view, select the device.
      2. -
    2. In Project Explorer view, right-click the project and select Run As > Tizen Web Application. +
    3. In Project Explorer view, right-click the project and select Run As > Tizen Web Application.

      Running the application

      @@ -384,7 +384,7 @@ cd tizen-sdk/tools

      If you have both a connected device and existing emulator instances, select the device from the combo box in the toolbar before selecting to run the application.

      -

      Selecting the device to use

      +

      Selecting the device to use

    4. Confirm that the application launches in the target device. @@ -400,7 +400,7 @@ cd tizen-sdk/tools
    5. In the Run Configurations window, click the New Launch Configuration icon (New Launch Configuration icon), define the configuration details, and launch the application by clicking Run.

      Run Configurations window

    -
    • +

    If you want to run your application without a local device, see Managing and Connecting Devices for Testing.

    @@ -421,20 +421,20 @@ cd tizen-sdk/tools

    The file include various information for the widget application. The following code shows an example of the widget content in the file. The <tizen:app-widget> element indicates the widget settings. If the widget requires privileges, add them to the config.xml file as well.

    -<?xml version="1.0" encoding="UTF-8"?>
-<widget xmlns:tizen="http://tizen.org/ns/widgets" xmlns="http://www.w3.org/ns/widgets" 
-        id="http://yourdomain/HelloWebWidget" version="1.0.0">
-   <tizen:app-widget id="0lVPHbX9t6.HelloWebWidget.HelloWebWidget" primary="true">
-      <tizen:widget-label>Hello Web Widget!</tizen:widget-label>
-      <tizen:widget-content src="index.html">
-         <tizen:widget-size preview="preview.png">2x2</tizen:widget-size>
-      </tizen:widget-content>
-   </tizen:app-widget>
-   <tizen:application id="0lVPHbX9t6.HelloWebWidget" package="0lVPHbX9t6" required_version="2.3.2"/>
-   <content src="index.html"/>
-   <feature name="http://tizen.org/feature/screen.size.normal"/>
-   <name>HelloWebWidget</name>
-   <tizen:profile name="wearable"/>
+<?xml version="1.0" encoding="UTF-8"?>
+<widget xmlns:tizen="http://tizen.org/ns/widgets" xmlns="http://www.w3.org/ns/widgets"
+        id="http://yourdomain/HelloWebWidget" version="1.0.0">
+   <tizen:app-widget id="0lVPHbX9t6.HelloWebWidget.HelloWebWidget" primary="true">
+      <tizen:widget-label>Hello Web Widget!</tizen:widget-label>
+      <tizen:widget-content src="index.html">
+         <tizen:widget-size preview="preview.png">2x2</tizen:widget-size>
+      </tizen:widget-content>
+   </tizen:app-widget>
+   <tizen:application id="0lVPHbX9t6.HelloWebWidget" package="0lVPHbX9t6" required_version="2.3.2"/>
+   <content src="index.html"/>
+   <feature name="http://tizen.org/feature/screen.size.normal"/>
+   <name>HelloWebWidget</name>
+   <tizen:profile name="wearable"/>
 </widget>
    @@ -456,41 +456,41 @@ cd tizen-sdk/tools

    The widget application consists of the following folder architecture:

     widget
-   css
-      style.css    
-   images
-   js
-      main.js
-   config.xml
-   preview.png
-   index.html
+   css
+      style.css
+   images
+   js
+      main.js
+   config.xml
+   preview.png
+   index.html
    -

    You can customize the index.html, style.css, and main.js files. For example, if a JS-based animation effect is needed, add the requestAnimationFrame() method or some other animation library to the JS file. Similarly, to change the UI elements' visual looks or add CSS-based effects (including animation), modify the CSS file.

    +

    You can customize the index.html, style.css, and main.js files. For example, if a JS-based animation effect is needed, add the requestAnimationFrame() method or some other animation library to the JS file. Similarly, to change the UI elements' visual looks or add CSS-based effects (including animation), modify the CSS file.

    To create the widget application:

    1. Start and initialize the widget application with the index.html file. -

      The starting point is defined in the config.xml file's content src field, which is set to index.html.

      +

      The starting point is defined in the config.xml file's content src field, which is set to index.html.

    2. The index.html file includes the element structure of the widget application using HTML elements. In addition, it imports the JavaScript and CSS files. 
       <!DOCTYPE html>
 <html>
-   <head>
-      <meta charset="UTF-8">
-      <link rel="stylesheet" type="text/css" href="css/style.css">
-      <script src="js/main.js"></script>
-   </head>
-   <body>
-      <div id="page">
-         <div id="container">
-            <span id="content-text">Hello, Web Widget!</span>
-         </div>
-      </div>
-   </body>
-</html> 
+   <head>
+      <meta charset="UTF-8">
+      <link rel="stylesheet" type="text/css" href="css/style.css">
+      <script src="js/main.js"></script>
+   </head>
+   <body>
+      <div id="page">
+         <div id="container">
+            <span id="content-text">Hello, Web Widget!</span>
+         </div>
+      </div>
+   </body>
+</html>
    3. The style.css file indicates the style properties of various HTML elements. @@ -498,35 +498,35 @@ widget 
       html, body
 {
-   width: 100%;
-   height: 100%;
-   margin: 0;
-   padding: 0;
+   width: 100%;
+   height: 100%;
+   margin: 0;
+   padding: 0;
 }
 #page
 {
-   background-color: #000;
-   color: #fff;
-   height: 100%;
-   position: relative;
-   width: 100%;
+   background-color: #000;
+   color: #fff;
+   height: 100%;
+   position: relative;
+   width: 100%;
 }
 #container
 {
-   left: 50%;
-   position: absolute;
-   top: 50%;
-   transform: translate(-50%, -50%);
+   left: 50%;
+   position: absolute;
+   top: 50%;
+   transform: translate(-50%, -50%);
 }
 #content-text
 {
-   font-weight: bold;
-   font-size: 40px;
+   font-weight: bold;
+   font-size: 40px;
 }
    4. The main.js file contains the JS-based functions for the widget. -

      There are many JS-based functions, such as asynchronous functions, JS library, and effects. You can add various features to the widget application using JS.

      +

      There are many JS-based functions, such as asynchronous functions, JS library, and effects. You can add various features to the widget application using JS.