From: Editor Lionbridge Date: Wed, 31 May 2017 12:29:43 +0000 (+0300) Subject: Fix guides due to W3C/HTML5 API updates X-Git-Tag: GitHub/PR#40/tizen-studio~159^2 X-Git-Url: http://review.tizen.org/git/?a=commitdiff_plain;h=28c469117de33879ca457299c3e47cf864ae8744;p=sdk%2Fonline-doc.git Fix guides due to W3C/HTML5 API updates This is a manual cherry-pick from the #126963 change in the tizen_3.0 branch. PS2: Added 1 missed line Change-Id: I62f3250e0736c7909479d370f1f0e4f709a6bb1f --- diff --git a/org.tizen.guides/html/index.htm b/org.tizen.guides/html/index.htm index 6e0b33b..7f226ab 100644 --- a/org.tizen.guides/html/index.htm +++ b/org.tizen.guides/html/index.htm @@ -734,7 +734,7 @@

Media @@ -775,7 +775,7 @@

@@ -852,7 +852,7 @@

CSS Basic User Interface Module (Level 3)

CSS Fonts Module (Level 3)

WOFF File Format (1.0)

WOFF File Format (1.0 and 2.0)

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 28911a5..3d05e3e 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 @@ -42,7 +42,7 @@

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 +

XMLHttpRequest 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

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 7e4043d..375efda 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 @@ -43,15 +43,15 @@

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.

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. If the value is not defined, the repeat period is the default value of the browser.

The main features of the Server-Sent Events API include:

Creating an EventSource instance +
Creating an EventSource instance
The EventSource interface is the core object of server-sent event implementation. Creating a new EventSource instance triggers repeated server request automatically, and allows you to use the receiving data event. When creating the EventSource instance, you must use the URL of the server page sending the event stream as a parameter.
Receiving server push data -
After triggering the server requests, you can receive push data from the server by implementing the message event.
-
The received event stream data is parsed as a MessageEvent object, to make the target data easily accessible.
+
After triggering the server requests, you can receive push data from the server by implementing the message event.
+
The received event stream data is parsed as a MessageEvent object, to make the target data easily accessible.

@@ -60,7 +60,7 @@

To take advantage of the server push feature, you must learn to connect to the server to request push data:

Create an EventSource interface instance: +

Create an EventSource interface instance:

 <script>
    var serverPage = "http://165.213.198.151:8080/server_sent_events_server.php";
@@ -72,7 +72,7 @@
 	For the server push to work, the serverPage parameter must contain the actual push server URL.

Implement the event handler for the open event: +
Implement the event handler for the open event:
```
    var log = document.getElementById("log")
 
@@ -83,7 +83,7 @@
    };
 </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.
+
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.

@@ -101,8 +101,8 @@

To take advantage of the server push feature, you must learn to handle the push data events:

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.
+
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');
@@ -116,7 +116,7 @@
 
```

Create an EventSource interface instance and implement the event handler for the message event:

 <script>
    var serverPage = "http://localhost/server_sent_events_server.php";
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 fba02be..cc132d3 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
@@ -50,13 +50,13 @@
 Cross-document messaging
 You can send and receive data between more than 2 Web pages. Because the Same Origin Policy is not applied for cross-document messaging, communication between other domains is also possible.
 Channel messaging
-You can send and receive messages through the port of the MessageChannel interface.
+You can send and receive messages through the port of the MessageChannel interface (in mobile and wearable applications).

With the Web Messaging API, messages are sent and received asynchronously using the MessageEvent object, within 1 domain or between different domains.

With the Web Messaging API, messages are sent and received asynchronously using the MessageEvent object (in mobile and wearable applications), within 1 domain or between different domains.

Using Cross-document Messaging

Send the message from the sending page using the postMessage() method of the receiving page window object. To receive the page, the receiving page window object must be registered to receive messages.

Send the message from the sending page using the postMessage() method of the receiving page window object (in mobile and wearable applications). To receive the page, the receiving page window object must be registered to receive messages.

The postMessage() method supports the following parameters:

message: Message to be sent.

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:

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. +

To send a message from document A to document B, create in document A a MessageChannel interface instance (in mobile and wearable applications), which has 2 message port attributes (in mobile and wearable applications): 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>
@@ -137,7 +137,7 @@
 
 
 	Note
-	The postMessage() method can have 3 parameters: message, origin, and ports.
+	The postMessage() method can have 3 parameters: message, origin (in mobile and wearable applications), and ports.
 According to the W3C specifications, the arguments are ordered as message, origin, and ports. However, in Tizen, the order used is actually message, ports, and origin. This approach is used in all browsers that currently support the MessageChannel interface.

XMLHttpRequest (Level 1 and 2)

XMLHttpRequest

Content

XMLHttpRequest Level 2
XMLHttpRequest Level 1
Sending a Cross-origin Request
Uploading Files with Ajax
Handling Request Events

Related Info

XMLHttpRequest (Level 1 and 2)

XMLHttpRequest

You can send requests to and receive them from a Web server using JavaScript.

You can send HTTP (or HTTPS) requests to and receive responses from a Web server using JavaScript. The API is based on the HTML5 specification and the Ajax mechanism widely used in the Web environment, and it has been enhanced from the older XMLHttpRequest API.

This feature is supported in mobile and wearable applications only.

XMLHttpRequest Level 2 in Mobile Applications

- -

The main features of the XMLHttpRequest Level 2 API include:

Supporting cross-origin request sharing (CORS) -
In the older XMLHttpRequest API, only same-origin resource sharing was possible. However, the XMLHttpRequest Level 2 API supports CORS.
-
To send a cross-origin request, you must create an XMLHttpRequest interface instance and use its open() method. Set the request URL method parameter as the cross-origin URL.
- -
- Note - For the cross-origin request to work, the authority for the external domain access must be set in the server belonging to the cross-origin URL. -
-
Supporting various response types -
The older XMLHttpRequest API only supported the text/html format for sending requests. The XMLHttpRequest Level 2 API supports various response types, such as arraybuffer, blob, document, json, and text. -
-
Supporting form data -
The newly supported FormData interface makes it possible to upload data from an entire form. For more information, see Uploading Files with Ajax.
-
Receiving a more fragmented response state on the request progress status -
The XMLHttpRequst Level 2 API provides more event handlers for tracking the request status and response. In addition, the onprogress event handler allows you to check the send status of a large capacity file download.
-

- -

XMLHttpRequest Level 1 in Wearable Applications

The main features of the XMLHttpRequest Level 1 API include:

The main features of the XMLHttpRequest API include:

Supporting cross-origin request sharing (CORS) -
In the older XMLHttpRequest API, only same-origin resource sharing was possible. However, the XMLHttpRequest Level 1 API supports CORS.
+
In the older XMLHttpRequest API, only same-origin resource sharing was possible. However, the latest XMLHttpRequest API supports CORS.

To send a cross-origin request, you must create an XMLHttpRequest interface instance and use its open() method. Set the request URL method parameter as the cross-origin URL.

@@ -92,14 +61,14 @@
Supporting various response types -
The older XMLHttpRequest API only supported the text/html format for sending requests. The XMLHttpRequest Level 1 API supports various response types, such as arraybuffer, blob, document, json, and text. +
The older XMLHttpRequest API only supported the text/html format for sending requests. The latest XMLHttpRequest API supports various response types, such as arraybuffer, blob, document, json, and text.
Supporting form data
The newly supported FormData interface makes it possible to upload data from an entire form. For more information, see Uploading Files with Ajax.
Receiving a more fragmented response state on the request progress status -
The XMLHttpRequst Level 1 API provides more event handlers for tracking the request status and response. In addition, the onprogress event handler allows you to check the send status of a large capacity file download.
+
The XMLHttpRequst API provides more event handlers for tracking the request status and response. In addition, the onprogress event handler allows you to check the send status of a large capacity file download.

@@ -108,7 +77,7 @@

To use the XML HTTP request features in your application, you must learn to send a cross-origin request:

Create an XMLHttpRequest interface instance:
+

Create an XMLHttpRequest interface instance:

 <script>
    var client = new XMLHttpRequest();
@@ -145,7 +114,7 @@
 <input type="button" value="upload" onclick="upload()"/>

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. +
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>
@@ -192,7 +161,7 @@
 <div id="divText"></div>
 
```
Create an XMLHttpRequest interface instance and define event handlers for it:
+
Create an XMLHttpRequest interface instance and define event handlers for it:
```
 <script>
    var html = "";
@@ -214,7 +183,7 @@
    client.send();
 
```
Define the actions of each event handler:
+

Define the actions of each event handler:

    /* When the request begins */
    function onloadstarthandler(e)
@@ -293,7 +262,7 @@
 <div id="divText"></div>

Create an XMLHttpRequest interface instance and define the handlers for the onprogress and onabort events to track the download progress and cancellation events:
+

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();
@@ -323,7 +292,7 @@
     function onprogresshandler(e)
    {
-      document.getElementById("divText").innerHTML = "DownLoading... (" + parseInt(e.loaded / e.totalSize * 100) + "%)";
+      document.getElementById("divText").innerHTML = "DownLoading... (" + parseInt(e.loaded / e.total * 100) + "%)";
    }
 
    function onaborthandler(e)
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 7e19c18..49ba162 100644
--- a/org.tizen.guides/html/web/w3c/device/battery_w.htm
+++ b/org.tizen.guides/html/web/w3c/device/battery_w.htm
@@ -51,7 +51,7 @@
   The main features of the Battery Status API include:
   
    Retrieving the battery status
-   You can use the attributes of the BatteryManager interface to check the battery status information, such as battery charging status and battery level.
+   You can use the attributes of the BatteryManager interface (in mobile and wearable applications) to check the battery status information, such as battery charging status, remaining charging time (until fully charged), remaining battery life (until battery is empty), and battery level.
 
    Detecting battery status changes
 You can set event listeners with the BatteryManager interface attributes to detect changes in the battery status.
@@ -87,7 +87,7 @@
 
 
 
-Use the attributes of the BatteryManager interface to display the battery charging status and battery level:
+Use the attributes of the BatteryManager interface (in mobile and wearable applications) to display the battery charging status, remaining charging time, remaining battery life, and battery level:
 
 
 @@ -141,7 +141,7 @@
 
 
 
-Set event listeners with the BatteryManager interface attributes to detect changes in the battery status:
+
Set event listeners with the BatteryManager interface (in mobile and wearable applications) attributes to detect changes in the battery status:
 
  <script>
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 d5bddfa..2e87c01 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
@@ -42,7 +42,7 @@
    Enables you to retrieve the battery status and detect changes in it.
    DeviceOrientation Event Specification in mobile and wearable applications only
    Enables you to detect rotation and acceleration motions on the device.
-   Touch Events version 1 in mobile and wearable applications only
+   
Touch Events in mobile and wearable applications only
    Enables you to implement various types of touch events, coordinate touch points, and control multi-touch.
    Vibration in mobile and wearable applications only
    Enables you to implement different vibration patterns on a Tizen device.
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 35035ea..39d2eb3 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
@@ -34,7 +34,7 @@
 		
 		Related Info
 		
-            Touch Events version 1 API for Mobile Web
+            Touch Events API for Mobile Web
 			Touch Paint Sample Description

@@ -44,7 +44,7 @@

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 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:

Initializing the Canvas

main.js Source File -

Define event listeners and handlers to manage the touchstart, touchmove, and touchend events on the canvas.

 window.onload = function()
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 b8712c8..6e47204 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
@@ -34,7 +34,7 @@

Related Info

Task: Touch Paint

This task consists of the following parts:

Touch Events version 1

Touch Events

Related Info

Touch Events version 1 API for Mobile Web
Touch Events version 1 API for Wearable Web
Touch Events API for Mobile Web
Touch Events API for Wearable Web
Hello Tizen (Mobile) Sample Description
Hello Tizen (Wearable) Sample Description
Page Navigation Sample Description

Touch Events version 1

Touch Events

As there is no mouse in a mobile device, the user actions must be handled with touch events, instead of mouse events.

@@ -59,10 +59,10 @@

Touch event types

You can define event handlers for different types of touch events:

touchstart handles an event which occurs when a finger comes in contact with the device screen.
touchmove handles an event which occurs when a finger moves while it is in contact with the screen.
touchend handles an event which occurs when a finger is removed from the screen.
touchcancel handles an event which occurs when a touch is cancelled.
touchstart handles an event which occurs when a finger comes in contact with the device screen.
touchmove handles an event which occurs when a finger moves while it is in contact with the screen.
touchend handles an event which occurs when a finger is removed from the screen.
touchcancel handles an event which occurs when a touch is cancelled.

These events are similar to the mousedown, mousemove, and mouseup mouse events.

@@ -71,7 +71,7 @@

When a touch event occurs, you can retrieve the coordinate of the event point occurrence. Because the finger, and consequently the contact area of the screen, is quite large, the retrieved coordinate is the average value of the contact area.

Since a mobile device has no sub-devices to provide event inputs, you can use gesture events, such as the page turning effect or image drawing, based on the finger movement coordinates of the touchmove event.

Multi-point touch control -

Unlike with mouse events, multiple concurrent touch events (represented by the Touch interface) can occur. To control multi-point touch events, the TouchList interface is used to save the respective event status (based on the touches, targetTouches, and changedTouches attributes). The status stored in the TouchList instance is renewed every time a new touch event occurs.

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).

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. +
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)
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)
When the user long-presses the DOM element, such as text or image, in the element, the touchstart and touchcancel events occur. +
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)

@@ -189,7 +189,7 @@
Add an event listener and handler for the touchmove event to the defined element: +
Add an event listener and handler for the touchmove event to the defined element:
```
 <script>
    var log = document.getElementById("log");
@@ -215,7 +215,7 @@
 </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.

@@ -236,7 +236,7 @@ -

Add an event listener and handler for the touchstart event to the defined element: +

Add an event listener and handler for the touchstart event to the defined element:

 <script>
    var touchable = document.getElementById("touchable");
@@ -270,7 +270,7 @@
 </script>

When a touch events is triggered, its details, such as the event coordinates, identification number, and the subject of the touch, are stored in the Touch interface instance. To access the details, the touches.item() method can be used in an array format.

A multi-point touch event refers to additional instances being pushed to the touches.item(index) array. For example, the first touch event is pushed to touches.item(0), and if a second touch event is triggered without removing the first finger from the screen, the second event is pushed to touches.item(1).

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 e0f4b39..5ff4dcf 100644 --- a/org.tizen.guides/html/web/w3c/graphics/canvas_w.htm +++ b/org.tizen.guides/html/web/w3c/graphics/canvas_w.htm @@ -73,7 +73,7 @@

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 Scalable Vector Graphics (SVG) 2 API 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.

@@ -103,7 +103,7 @@

To check the information of the image connected to the canvas, use the toDataURL([Optional], [Variadic]) method to restore the URL of the image used in the canvas. To create a blob object of the image file, use the getContext(contextId) method.

Use the CanvasRenderingContext2D interface to connect to the canvas and get the canvas context: +

Use the CanvasRenderingContext2D interface (in mobile and wearable applications) to connect to the canvas and get the canvas context:

 var canvas = document.querySelector("canvas"),
 var context = canvas.getContext('2d');
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 976207c..ffbc337 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
@@ -41,7 +41,7 @@
   
    HTML5 Canvas
    Enables you to create images, shapes, and text using the HTML5 canvas element and HTML canvas 2D context.
-   HTML5 SVG
+   
SVG
    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 190e05e..339899c 100644
--- a/org.tizen.guides/html/web/w3c/graphics/svg_w.htm
+++ b/org.tizen.guides/html/web/w3c/graphics/svg_w.htm
@@ -10,7 +10,7 @@
 	
 	
 	
-  HTML5 SVG
+  SVG
  
  
 
@@ -35,7 +35,7 @@
 		
 		Related Info
 		
-			HTML5 SVG API for Mobile Web
+			Scalable Vector Graphics (SVG) 2 API for Mobile Web
 			HTML5 SVG API for Wearable Web
 			Shape Editor Sample Description
 			
@@ -43,13 +43,13 @@

HTML5 SVG

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.

The HTML5 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 XML, and can be added as an inline element in HTML.

This feature is supported in mobile and wearable applications only.

The main HTML5 SVG API features include:

The main SVG API features include:

Creating text and images
You can create add text and images to your application as SVG elements.

Defining the Main Screen

index.html Source File -

The main screen displays a canvas element on which the watch face and needles are placed.

 <head>
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 6cc8d21..c3fe7fb 100644
--- a/org.tizen.guides/html/web/w3c/location/geolocation_w.htm
+++ b/org.tizen.guides/html/web/w3c/location/geolocation_w.htm
@@ -44,7 +44,7 @@
 
   Geolocation API Specification
 
-Geolocation defines a location information interface. Common sources of location information are GPS, location inferred from the network (such as IP address), RFID, Wi-Fi, Bluetooth MAC address, and GSM/CDMA cell IDs. The Geolocation interface is implemented by the Navigator object instances. The location information is represented by the latitude and longitude coordinates.
+Geolocation defines a location information interface. Common sources of location information are GPS, location inferred from the network (such as IP address), RFID, Wi-Fi, Bluetooth MAC address, and GSM/CDMA cell IDs. The Geolocation interface is implemented by the Navigator object instances. The location information is represented by the latitude and longitude coordinates.
 
  This feature is supported in mobile and wearable applications only.
 
@@ -71,7 +71,7 @@
    To provide users with location-based features, you must learn to create a mobile GPS application to retrieve location information:
    
     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.
+		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)
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 a9acbb0..0cd9a3d 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
@@ -81,7 +81,7 @@
 	In the current version of the Tizen Studio, the microphone format for the capture attribute is not available as the voice recorder application is not included.

The accept attribute indicates which file types are appropriate. If used with a device that has a camera, it activates the device camera. With a device without a camera, it activates the My photo folder.

The accept attribute (in mobile and wearable applications) indicates which file types are appropriate. If used with a device that has a camera, it activates the device camera. With a device without a camera, it activates the My photo folder.

Activating media features

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 fef3f50..e2fead7 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 @@ -59,20 +59,20 @@

This feature is supported in mobile and wearable applications only.

Using JavaScript, the playback can be controlled with media events. The audio and video elements used as media elements inherit all the properties and methods of the HTMLMediaElement interface.

Using JavaScript, the playback can be controlled with media events. The audio and video elements used as media elements inherit all the properties and methods of the HTMLMediaElement interface (in mobile and wearable applications).

The main features of the audio and video elements with JavaScript include:

Creating a player
You can create a simple audio and video player.
Controlling the playback -
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.
+
You can use the Play() and Pause() methods of the Media object (in mobile and wearable applications) to control playing and pausing media files. With media events, additional features can be used.
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.
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.
+
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 (in mobile and wearable applications).
Retrieving progress state
You can retrieve and display the download progress state using the Progress media event, which is triggered when information related to the progress of a media object loading media contents is updated.

Note - Carefully consider before using the autoplay feature, which plays content automatically in the mobile environment without user interaction. The user can face unintended Internet packet fees or interfering factors, such as playback being stopped unintentionally. + Carefully consider before using the autoplay feature (in mobile and wearable applications), which plays content automatically in the mobile environment without user interaction. The user can face unintended Internet packet fees or interfering factors, such as playback being stopped unintentionally.

Source Code

The Pause button is disabled until the play event occurs.

Define the button functions. Play and pause the media file using the play() and pause() methods of the HTMLMediaElement interface. +
Define the button functions. Play and pause the media file using the play() and pause() methods of the HTMLMediaElement interface (in mobile and wearable applications).
```
 <script>
@@ -511,7 +511,7 @@
 </div>
 
```
Use the canPlayType() method to check, whether the selected media files have an acceptable MIME type, and can be played:
+

Use the canPlayType() method (in mobile and wearable applications) to check, whether the selected media files have an acceptable MIME type, and can be played:

 <script>
    var video1 = document.getElementById("video1");
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 93efa2b..429a513 100644
--- a/org.tizen.guides/html/web/w3c/media/webaudio_w.htm
+++ b/org.tizen.guides/html/web/w3c/media/webaudio_w.htm
@@ -50,18 +50,18 @@
 Loading source data
 You must load source data before using the Web Audio API. You can do this using XMLHttprequest.
 
-The AudioContext interface is used to manage and play the sound. It creates a high quality sound and connects to the destination of the sound.
+The AudioContext interface is used to manage and play the sound. It creates a high quality sound and connects to the destination of the sound.
 
 Modular routing
-Modular routing means routing audio data either in a direct manner, such as speaker output, or through a connection to AudioNodes, which handle, for example, volume adjustment and filters.
+Modular routing means routing audio data either in a direct manner, such as speaker output, or through a connection to AudioNodes, which handle, for example, volume adjustment and filters.

Playing sound
Use the noteOn(time) or start(time) method to play sound with the time parameter for specifying the time interval in seconds after which the audio is played. For example, the 0 time value implies playing the audio immediately and the currentTime + 0.75 time value implies that the audio is played after 0.75 seconds.
-
You can use the noteOff(time) or stop(time) methods similarly to stop the sound. After stopping sound, recreate the AudioBufferSourceNode interface instance to play sound again.

You can use the noteOff(time) or stop(time) methods similarly to stop the sound. After stopping sound, recreate the AudioBufferSourceNode interface instance to play sound again.

Loading Data and Creating Audio Context

To provide users with sophisticated audio features, you must learn to modulate source data into decoded audio data using XMLHttpRequest, and create an instance of the AudioContext interface:

To load source audio data: @@ -90,7 +90,7 @@ }; </script> -
This data is used in the AudioBuffer.
+
This data is used in the AudioBuffer.

@@ -103,11 +103,11 @@ </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.

The majority of the Web Audio API features, such as creating audio file data, decoding it, and creating AudioNodes are managed using the methods of the AudioContext interface.

To create an audio buffer: -

Create an AudioBuffer interface using the array buffer of audio data response attributes of the XMLHttpRequest() method. Select from the following options:

Create the audio buffer using the createBuffer() method:

@@ -181,12 +181,12 @@
 
  Using Modular Routing
 
-To provide users with sophisticated audio features, you must learn to enable routing audio source data using AudioNode objects:
+To provide users with sophisticated audio features, you must learn to enable routing audio source data using AudioNode objects:
 
 
 To route to speaker output in a direct sound destination:
 
-Create a WebKit-based AudioContext instance:
+
Create a WebKit-based AudioContext instance:
  <script>
    var context;
@@ -208,7 +208,7 @@
    }
 </script>
 
-All routing occurs within an AudioContext containing a single AudioDestinationNode.
+All routing occurs within an AudioContext containing a single AudioDestinationNode.
 
 
 
@@ -255,7 +255,7 @@
 
 
 
-AudioNodes can be used to activate sound effects, and create tweaks, audio parameters, and audio graphs using the GainNode interface, or filter sounds using the BiquadFilterNode interface.
+AudioNodes can be used to activate sound effects, and create tweaks, audio parameters, and audio graphs using the GainNode interface, or filter sounds using the BiquadFilterNode interface.
 
   Source Code
 	For the complete source code related to this use case, see the following file:
@@ -267,7 +267,7 @@
 
  To provide users with sophisticated audio features, you must learn to play sound:
 
-Create a WebKit-based AudioContext instance:
+
Create a WebKit-based AudioContext instance:
  <script>
    var context;
@@ -291,7 +291,7 @@
 
 
 
-The AudioContext instance digitally modulates the audio source file into audio data. After creating the sound source, playback is implemented by processing audio data using AudioNodes either directly to the speaker, or in the middle.
+The AudioContext instance digitally modulates the audio source file into audio data. After creating the sound source, playback is implemented by processing audio data using AudioNodes either directly to the speaker, or in the middle.
 
  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/perf_opt/timing_control_w.htm b/org.tizen.guides/html/web/w3c/perf_opt/timing_control_w.htm
index 309a864..cb86ccf 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
@@ -44,7 +44,7 @@
 
  This feature is supported in mobile and wearable applications only.
 
-Making script-based animations requires updating the properties of the animated objects in each frame. In computerized animations, the frame rate is normally 30 or 60 fps (frames per second), because the human eye perceives a sequence of images as an animation when they change at least 12-15 times per second. The requestAnimationFrame() (or webkitRequestAnimationFrame()) method of the WindowAnimationTiming interface enables scheduling the animation frame update requests. The frame update rate depends on implementation. In Tizen 2.2, it is about 60 fps.
+Making script-based animations requires updating the properties of the animated objects in each frame. In computerized animations, the frame rate is normally 30 or 60 fps (frames per second), because the human eye perceives a sequence of images as an animation when they change at least 12-15 times per second. The requestAnimationFrame() (or webkitRequestAnimationFrame()) method enables scheduling the animation frame update requests. The frame update rate depends on implementation. In Tizen 2.2, it is about 60 fps.
 
 
 	Note
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 bb871fd..387ebbf 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
@@ -238,7 +238,7 @@ self.onmessage = function(e)

Multi-threading

Generally, Web applications are built and run using a single UI thread. Since only 1 task can be handled at a time, the Web application may not respond due to the execution time of a script block, resulting in lower application performance. To solve these performance-related issues, multi-thread Web workers can be used to provide distributed processing in applications. Use Web workers in applications that require complex calculations or parallel processing for better application performance.

Generally, Web applications are built and run using a single UI thread. Since only 1 task can be handled at a time, the Web application may not respond due to the execution time of a script block, resulting in lower application performance. To solve these performance-related issues, multi-thread Web workers (in mobile and wearable applications) can be used to provide distributed processing in applications. Use Web workers in applications that require complex calculations or parallel processing for better application performance.

Since the task of changing the image color using a canvas involves allocating a color value for each pixel of the image displayed on the screen, the program requires a complicated calculation to execute loops by the number of the pixels. The following examples of applying a color filter effects to an image to change the color show:

Cross-Origin Resource Sharing

Tizen supports the mechanism of cross-origin resource sharing (CORS), which can activate a client-side cross-origin request (COR).

This feature is supported in mobile and wearable applications only.

In CORS, new headers related to HTTP communication have been added to allow you to accept or reject CORs:

Origin request header +
Origin request header
Includes the domain information which has incurred the COR, and is used for the purpose of checking the source of the domain side that has received the relevant request. In addition, this header is protected in the browser side and cannot be changed from the application side.
Access-Control-Allow-Origin response header +
Access-Control-Allow-Origin response header
Allows a relevant response only when the information in the Origin request header matches. If the Access-Control-Allow-Origin header is a wildcard (*), it unconditionally allows the response regardless of the Origin request header information.
@@ -65,7 +65,7 @@
CORS supports 2 request types: simple and preflight.

Simple Request
-
The request is considered to be a simple request, if all the conditions following conditions are met:
+
The request is considered to be a simple request, if all the conditions following conditions are met:
- HTTP methods can only use GET, POST, and HEAD.
- No custom header is allowed.
Related Info
-
Including Rendered Content in the Parent Document
- -
Learning how to include rendered content seamlessly in the parent document using the iframe element enhances the security features of your application:
-
1. 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>
-</head>
-<body>
-   <h2>HTML5 iframe</h2>
-   <iframe seamless src="iframe.html"></iframe>
-   <iframe src="iframe.html"></iframe>
-</body>
-
```
2. 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>
-</body>
-
```
-
Figure: Seamless content appending (in mobile applications only)
-
-
Source Code
-
For the complete source code related to this use case, see the following files:
-
- iframe_seamless.html
- seamless.html
-

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 d2afb7e..cc8c8f2 100644 --- a/org.tizen.guides/html/web/w3c/storage/appcache_w.htm +++ b/org.tizen.guides/html/web/w3c/storage/appcache_w.htm @@ -62,7 +62,7 @@

Cache updating

To update a cached item in the client, you need to change the manifest file.

Cache management -

Application cache can control JavaScript based on events. It can check or update the current cache status.

Setting the Cache Manifest

@@ -81,7 +81,7 @@

To set the cache manifest file content:

Begin the manifest file with CACHE MANIFEST content:

 CACHE MANIFEST
 # 2013-03-18 v2.0.0
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 8d90843..0886c71 100644
--- a/org.tizen.guides/html/web/w3c/storage/file_w.htm
+++ b/org.tizen.guides/html/web/w3c/storage/file_w.htm
@@ -59,14 +59,14 @@
 Local file management
 
 Reading local file information
-You can select a local file to upload using the FileList interface, which creates and returns a File object.
+You can select a local file to upload using the FileList interface (in mobile and wearable applications), which creates and returns a File object (in mobile and wearable applications).
 The File object is used to read basic file information.
 
 
 Reading local file content
-You can use the reading methods of the FileReader interface to read file content in text, binary,  or dataURL format. If the data is loaded, the onload event occurs. This event uses the data reading methods according to file format.
+You can use the reading methods of the FileReader interface (in mobile and wearable applications) to read file content in text, binary, or dataURL format. If the data is loaded, the onload event occurs. This event uses the data reading methods according to file format.
 Slicing local files
-You can use the slice() method with a local file or the Blob interface to slice data objects. You can use the created blob to read data as a binary string using the FileReader interface.  
+You can use the slice() method with a local file or the Blob interface (in mobile and wearable applications) to slice data objects. You can use the created blob to read data as a binary string using the FileReader interface.  
 
 
 
@@ -105,7 +105,7 @@

Create a FileList instance: +

Create a FileList instance (in mobile and wearable applications):

 <script>
    var files = document.getElementById("tizenFiles").files;
@@ -161,7 +161,7 @@

Create a FileReader instance to read the content of the local image file. Use the readAsDataURL() method to read data in the dataURL format. +

Create a FileReader instance (in mobile and wearable applications) to read the content of the local image file. Use the readAsDataURL() method to read data in the dataURL format.

If the data is loaded, an onload event is fired. Create an img element to allocate the event result property value for rendering:

 <script>
@@ -215,7 +215,7 @@
 
  Slicing Blob
 
-Slicing a local file using the Blob interface is a useful file management skill:
+Slicing a local file using the Blob interface (in mobile and wearable applications) is a useful file management skill:
 
 
 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:
@@ -231,7 +231,7 @@ end byte: <input type="text" id="endByte" name="endByte" style="width: 100px;

To read the local file, create a FileReader instance: +

To read the local file, create a FileReader instance (in mobile and wearable applications):

 <script>
    var reader = new FileReader();
@@ -239,7 +239,7 @@ end byte: <input type="text" id="endByte" name="endByte" style="width: 100px;

Slice the defined byte range (from startByte to endByte) using the slice() method of the File interface: +

Slice the defined byte range (from startByte to endByte) using the slice() method of the File interface (in mobile and wearable applications):

 <script>
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 f84c92e..e8ca931 100644
--- a/org.tizen.guides/html/web/w3c/storage/indexdb_w.htm
+++ b/org.tizen.guides/html/web/w3c/storage/indexdb_w.htm
@@ -53,7 +53,7 @@
 
 Creating a database
 
-Use the IndexedDB.open() method to create a database. In a database, at least 1 object store must be present.
+Use the IndexedDB.open() method to create a database. In a database (in mobile and wearable applications), at least 1 object store (in mobile and wearable applications) must be present.
 
 
 Creating an object store
@@ -68,13 +68,12 @@ Use the IndexedDB.open() method to create a database<
 
 
 	Note
-	Tizen supports the READ_ONLY, READ_WRITE, and VERSION_CHANGE transactions with the unsigned short type.
+	Tizen supports the READ_ONLY, READ_WRITE, and VERSION_CHANGE transactions (in mobile and wearable applications) with the unsigned short type.
 
 
 Creating an index
 In the object store, you can use the createIndex() method to generate an
-index. You can search and retrieve records stored in the
-index using other properties than the key, as the key is not always unique. You can also retrieve records containing arrays as keys.
+index. You can search for and retrieve records stored in the index (in mobile and wearable applications) using other properties than the key, as the key is not always unique. You can also retrieve records containing arrays as keys.
 
 
 
@@ -84,7 +83,7 @@ index. You can search and retrieve records stored in the
 
 
 
-Use the window.webkitIndexedDB.open() method to generate a database named TizenIndexedDB in order to create an object store for storage:
+Use the window.webkitIndexedDB.open() method to generate a database named TizenIndexedDB in order to create an object store for storage:
 
  <script>
@@ -107,7 +106,7 @@ index. You can search and retrieve records stored in the
 
 
 	Note
-	The name of the database can be any string type, including an empty string. To change the version of the database, use the VERSION_CHANGE transaction.
+	The name of the database can be any string type, including an empty string. To change the version of the database, use the VERSION_CHANGE transaction.
 
 
 
@@ -130,15 +129,14 @@ index. You can search and retrieve records stored in the
 An object store can derive keys from the following sources:
 
 
-Key generatorGenerates an increasing number every time a key is needed.
+
Key generator (in mobile and wearable applications) Generates an increasing number every time a key is needed.
 
-
-Keypath Key is derived through a key path. 
+
Key path (in mobile and wearable applications) Key is derived through a key path. 
 
-Value Key is specified when a value is stored in the object store.
+Value (in mobile and wearable applications) Key is specified when a value is stored in the object store.
 
 
-Creating and deleting an object store is a useful data management skill:
+Creating and deleting an object store is a useful data management skill:
 
 
 To generate an object store for data storage, use the createObjectStore() method:
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 c46eb16..9be9efc 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
@@ -47,10 +47,10 @@
 
 The Web Storage API provides 2 storage types:
 
-Local storage
+
Local storage (in mobile and wearable applications)
 Stores data to be used in multiple windows, beyond the current session, with no expiration date. The stored data is not deleted when the browser window is closed, and can be shared between browser windows.
 
-Session storage
+
Session storage (in mobile and wearable applications)
 Valid for only a single session.
 

 The data stored in a temporary storage can be shared in all browser windows within the same domain, but once the browser window is closed, data is deleted.
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 956d609..a16d16d 100644
--- a/org.tizen.guides/html/web/w3c/supplement/typedarray_w.htm
+++ b/org.tizen.guides/html/web/w3c/supplement/typedarray_w.htm
@@ -63,7 +63,7 @@
 

 WebGL™
 Canvas
-XMLHttpRequest Level 2
+XMLHttpRequest
 
 
 
@@ -371,7 +371,7 @@
 
   
 
-For the XMLHttpRequest Level 1 API or XMLHttpRequest Level 2 API, set the response type of the XMLHttpRequest object as arraybuffer to receive a typed array response. This way by delivering data directly in multimedia, you can parse the binary file through the network:
+
For the XMLHttpRequest API (in mobile and wearable applications), set the response type of the XMLHttpRequest object as arraybuffer to receive a typed array response. This way by delivering data directly in multimedia, you can parse the binary file through the network:
  this.setSound = function()
 {
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 4375e7c..7bcef9b 100644
--- a/org.tizen.guides/html/web/w3c/ui/flexible_w.htm
+++ b/org.tizen.guides/html/web/w3c/ui/flexible_w.htm
@@ -50,8 +50,8 @@
 Tizen supports the CSS Flexible Box Layout Module API that enables you to create an easily manageable flexible layout, which fluidly adjusts the layout according to viewport size changes. When you create and use a flexible box layout, the alignment method or object (flex item) size within a specific area (flex container) can be adjusted.
 The main components of the flexible box layout include:
 
-Flex container, which refers to flex or inline-flex DOM elements assigned by the display.You can use the flex container to assign a flex area and the flex items included in it. The flex container properties are used to assign the indication area and alignment method.
-Flex item, which refers to the child nodes of the flex container.
+
Flex container (in mobile and wearable applications), which refers to flex or inline-flex DOM elements assigned by the display.You can use the flex container to assign a flex area and the flex items included in it. The flex container properties are used to assign the indication area and alignment method.
+Flex item (in mobile and wearable applications), which refers to the child nodes of the flex container.
 The flex item changes its size fluidly according to the area of the flex container. You can define flex item properties to assign the sizes of the respective items and the alignment method.
 
 Figure: Flexible box layout
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 9d56306..037a91a 100644
--- a/org.tizen.guides/html/web/w3c/ui/font_w.htm
+++ b/org.tizen.guides/html/web/w3c/ui/font_w.htm
@@ -190,7 +190,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.
+	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/html5forms_w.htm b/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm
index b330253..a52f165 100644
--- a/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm
+++ b/org.tizen.guides/html/web/w3c/ui/html5forms_w.htm
@@ -193,7 +193,7 @@
      Example
     
      
-     datalist
+     datalist (in mobile and wearable applications)
      Defines a set of option elements that represent predefined options for other controls. The element is used together with the input element to predefine its value.
 In Tizen, the value selected in the datalist element can be edited.
 
@@ -208,7 +208,7 @@
      
     
      
-     keygen
+     keygen (in mobile and wearable applications)
      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.
 
 @@ -219,7 +219,7 @@
     
 
      
-     meter
+     meter (in mobile and wearable applications)
      Represents a scalar measurement within a known range (the distribution of the assigned range), or a fractional value.
 
 @@ -231,7 +231,7 @@
     
 
      
-     output
+     output (in mobile and wearable applications)
      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.
       
 @@ -245,7 +245,7 @@
      
     
      
-     progress
+     progress (in mobile and wearable applications)
      Represents the progress of a task.
      
      
@@ -270,7 +270,7 @@
      Example
     
      
-     color
+     color (in mobile and wearable applications)
      Select an HSL color from the color picker. The value format is HEX (#0099ff).
     
         
@@ -291,67 +291,67 @@
     
     
      
-     date
+     date (in mobile and wearable applications)
      Enter a date with no time zone (yyyy-mm-dd).
     
 
     
 
      
-     datetime
+     datetime
      Enter a date and time with the (UTC) time zone (yyyy-mm-ddTtt:mmZ).
 
 
     
      
-     datetime-local
+     datetime-local
      Enter a date and time with no time zone (yyyy-mm-ddTtt:mm).
     
     
 
      
-     email
+     email (in mobile and wearable applications)
      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)).
     
     
      
-     month
+     month
      Enter a year and month with no time zone (yyyy-mm).
     
     
      
-     number
+     number (in mobile and wearable applications)
      Enter numbers with the number keyboard.
     
     
      
-     range 
+     range (in mobile and wearable applications)
      Select a value from the slider.
     
     
      
-     search
+     search (in mobile and wearable applications)
      No specific functionality is defined for this element in the HTML5 specifications.
     
     
          
-     tel
+     tel (in mobile and wearable applications)
      Enter a phone number with the number keyboard.
     
     
     
-     time
+     time (in mobile and wearable applications)
      Enter a time with no time zone (tt:mm:ss).
     
     
          
-     url
+     url (in mobile and wearable applications)
      Enter a URL with the URL keyboard.
     
     
     
-     week
+     week
      Enter a year and week with no time zone (yyyy-week).
     
     
@@ -371,7 +371,7 @@
      Example
     
      
-     autocomplete
+     autocomplete (in mobile and wearable applications)
      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".
     
@@ -385,29 +385,29 @@
     
     
      
-     min and max
+     min and max (in mobile and wearable applications)
      Allowed range of values for the element.
      
     
      
-     pattern
+     pattern (in mobile and wearable applications)
      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.
     
     
      
-     placeholder
+     placeholder (in mobile and wearable applications)
      Short hint intended to aid the user with the data entry.
      The attribute can be used in the majority of form elements for various purposes, such as hint text or advertisement.
     
     
  
-     required
+     required (in mobile and wearable applications)
      Boolean attribute which, when specified, defines that the element is mandatory.
     
     
      
-     step
+     step (in mobile and wearable applications)
      Granularity expected of the value, limiting the allowed values.
     
     
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 7154181..c7d8044 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
@@ -171,7 +171,7 @@
   Image Resolution Optimization
 
   In Web applications, optimization of applications for various platforms (regarding devices, OS, and resolution) is efficient.
-  Media Queries and Flexible Box Layout can be used to create flexible layouts, and to build the deployable package easily.
+  Media Queries and Flexible Box Layout can be used to create flexible layouts, and to build the deployable package easily.
 
   Images can be used in Web applications in the following ways:
   IMG tag linking images directly to HTML
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 7ab9165..c27dfad 100644
--- a/org.tizen.guides/html/web/w3c/ui/selector_w.htm
+++ b/org.tizen.guides/html/web/w3c/ui/selector_w.htm
@@ -54,7 +54,7 @@
 The main features of the Selectors API Level 1 and Level 2 include:
 
 Selecting a single element
-Use CSS Selectors to select a single element.
+Use CSS selectors to select a single element.
 Selecting multiple elements simultaneously
 Select multiple elements using the querySelectorAll() method.
 
@@ -63,7 +63,7 @@
 Selecting a Single Node
 To enhance the user experience of your application, you must learn to use selectors to handle page elements, and to select a single node:
   
-  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.
+  
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];
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 1068c75..f62c1c0 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
@@ -43,7 +43,7 @@
 
   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 (in mobile and wearable applications) 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 (in mobile and wearable applications) 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.
 
@@ -53,7 +53,7 @@
 You can use the pushState() method of the history interface to add an entry to the session history. With the replaceState() method, you can update the session history details.
 
 Detecting session history status changes
-The popstate event is fired when the user navigates to a page stored in the session history. The popstate event
+
The popstate event (in mobile and wearable applications) is fired when the user navigates to a page stored in the session history. The popstate event
 references the information stored with the pushState() or replaceState() methods, and enables you to change the status of the page based on the stored session history (such as moving focus to a certain DOM element).
 
 
@@ -63,7 +63,7 @@ references the information stored with the pushState() or rep
 Learning how to manage the session history enhances the user browsing experience in your application:
 
 
-To add an entry to the session history, use the pushState() method of the history interface:
+
To add an entry to the session history, use the pushState() method of the history interface (in mobile and wearable applications):
  <script>
    history.pushState({index: currentIndex}, document.title);
@@ -99,7 +99,7 @@ references the information stored with the pushState() or rep
 <a href="http://tizen.org/">Tizen.org</a>
 

 

-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:
+
When the user clicks the buttons, the current index value (representing page numbers) is changed and stored in the state object (in mobile and wearable applications) of the history interface:
  var currentIndex = 0;
 var prev = document.querySelector('.paging > a:nth-child(1)');
@@ -155,14 +155,14 @@ function setState(currentIndex)
 
 Learning how to track session history changes enhances the user browsing experience in your application: 
 
-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).
+A page with data stored in the session history fires a popstate event (in mobile and wearable applications) 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);
 
 
-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.
+
Define the event handler for the event. You can use the data stored in the state object (in mobile and wearable applications) to retrieve the correct location on the page to be loaded.
  var output = document.querySelector('output');
 
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 3acd94a..b36cef6 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
@@ -220,7 +220,7 @@
 
 
 	Note
-	For a complete list of CSS Text Module Level 3 text properties (in mobile or wearable applications) and their possible values, see the Property index.
+	For a complete list of CSS Text Module Level 3 text properties (in mobile or wearable applications) and their possible values, see the Property index.
 
 
 
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 c2d62d8..4987c33 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
@@ -115,7 +115,7 @@
 	CSS Fonts Module (Level 3) in mobile and wearable applications only
 	Enables you to change the text fonts.
 
-	WOFF File Format (1.0) in mobile and wearable applications only
+	
WOFF File Format (1.0 and 2.0) in mobile and wearable applications only
 	Enables you to encode and decode font data easily.
 
 
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 27220a6..10e9cc5 100644
--- a/org.tizen.guides/html/web/w3c/ui/woff_w.htm
+++ b/org.tizen.guides/html/web/w3c/ui/woff_w.htm
@@ -10,7 +10,7 @@
 	
 	
 	
-  WOFF File Format (1.0)
+  WOFF File Format (1.0 and 2.0)
 
 
  
@@ -32,24 +32,24 @@
 		
 		Related Info
 		
-			WOFF File Format 1.0 API for Mobile Web
+			WOFF File Format 2.0 API for Mobile Web
 			WOFF File Format 1.0 API for Wearable Web
 			
 	
 
 
 
-WOFF File Format (1.0)
+WOFF File Format (1.0 and 2.0)
 
 You can decode and restore font data easily.
 
  This feature is supported in mobile and wearable applications only.
 
-The new text features in WOFF File Format 1.0 include:
+The new text features in WOFF File Format 2.0 (in mobile applications) and 1.0 (in wearable applications) include:
 
 
-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. 
+Decoding and restoring font data
+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
@@ -57,7 +57,7 @@
 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:
 
 
-Download and use fonts installed on the Web server by creating @font-face rules. Within the rules, you can define the following properties:
+
Download and use fonts installed on the Web server by creating @font-face rules. Within the rules, you can define the following properties:
 
 font-family
 Defines a name for the font. This property is mandatory.
diff --git a/org.tizen.guides/index.xml b/org.tizen.guides/index.xml
index e6bfa1e..1f4884b 100644
--- a/org.tizen.guides/index.xml
+++ b/org.tizen.guides/index.xml
@@ -517,7 +517,7 @@
 			
 				
 			
-			
+			
 				
 				
 			
@@ -529,7 +529,7 @@
 			
 				
 			
-			
+			
 		
 		
 			
@@ -544,7 +544,7 @@
 		
 			
 			
-			
+			
 			
 		
 		
@@ -603,7 +603,7 @@
 			
 			
 			
-			
+			
 		
 	
 
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 4588f92..7f10c6e 100644
--- a/org.tizen.studio/html/web_tools/config_editor_w.htm
+++ b/org.tizen.studio/html/web_tools/config_editor_w.htm
@@ -317,7 +317,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.
+  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 Widget 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.
 
 
@@ -495,7 +495,7 @@
 
 
 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.
+ 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
@@ -872,7 +872,7 @@
  

 
 
 
 
 Extending Configuration Elements in Wearable 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.
+ 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
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 f12c596..1932c5c 100644
--- a/org.tizen.studio/html/web_tools/web_simulator_w.htm
+++ b/org.tizen.studio/html/web_tools/web_simulator_w.htm
@@ -229,7 +229,7 @@
     
      WebSocket API
      Web messaging
-     XMLHttpRequest Level 2
+     XMLHttpRequest
      Cross-origin resource sharing (CORS)
      Server-sent events
     
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 58098c9..fdacea6 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
@@ -47,7 +47,7 @@
 
 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).
+  The Tizen Web application must follow the guidelines of W3C Widget Packaging and XML Configuration and Tizen extended configuration (in mobile and wearable applications).
   For more information on the configuration elements, see Configuration Element Hierarchy.
 
    Web Application Package
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 40030be..5c8fbc2 100644
--- a/org.tizen.training/html/web/details/app_filtering_w.htm
+++ b/org.tizen.training/html/web/details/app_filtering_w.htm
@@ -697,7 +697,7 @@
     
 
 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.
+     Specify this key, if the application requires Internet access for using the WebSocket API, XMLHttpRequest, or Cross-Origin Resource Sharing API.
 	 2.3.1
     
 
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 e00e4ff..d4f1cc7 100644
--- a/org.tizen.training/html/web/details/sec_privileges_w.htm
+++ b/org.tizen.training/html/web/details/sec_privileges_w.htm
@@ -481,7 +481,7 @@ tr.partner-level, tr.platform-level { background-color: #cff }
 	public
 	
 	2.3
-	The application can access the Internet using the WebSocket, XMLHttpRequest Level 2, Server-Sent Events, HTML5 Application caches, and Cross-Origin Resource Sharing APIs.
+	The application can access the Internet using the WebSocket, XMLHttpRequest, Server-Sent Events, HTML5 Application caches, and Cross-Origin Resource Sharing APIs.
 
 
 	http://tizen.org/privilege/mediacapture
@@ -868,7 +868,7 @@ tr.partner-level, tr.platform-level { background-color: #cff }
 	public
 	
 	2.2.1
-	The application can access the Internet using the WebSocket, XMLHttpRequest Level 1, and Cross-Origin Resource Sharing APIs.
+	The application can access the Internet using the WebSocket, XMLHttpRequest, and Cross-Origin Resource Sharing APIs.
 
 
 	http://tizen.org/privilege/mediacapture
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 a293027..89095ea 100644
--- a/org.tizen.training/html/web/details/sign_certificate_w.htm
+++ b/org.tizen.training/html/web/details/sign_certificate_w.htm
@@ -124,7 +124,7 @@
 
 	Signature Specification
 
-The application signing scheme of Tizen follows the specification of the XML Digital signature for widget specified by W3C.
+The application signing scheme of Tizen follows the specification of the XML Digital Signatures for Widgets specified by W3C.
 
 The following figure shows the signature file structure.
 
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 ee20083..99c97e2 100644
--- a/org.tizen.training/html/web/details/web_runtime_w.htm
+++ b/org.tizen.training/html/web/details/web_runtime_w.htm
@@ -49,10 +49,10 @@
    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).
+  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.
+   
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:
 
@@ -80,7 +80,7 @@
 
    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.
+   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 XML Configuration.
 
   
 
@@ -120,7 +120,7 @@
   
 
   Web Application Signature
-  The Web Runtime follows the XML digital widget signature process:
+  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.
@@ -236,7 +236,7 @@
     The Web applications can mitigate various kinds of content injection vulnerabilities, such as cross-site scripting (XSS). The content security policy (CSP) is a declarative policy that lets the author or server administrator of a Web application inform the client from where the application expects to load resources. To mitigate XSS, for example, a Web application can declare from where it expects to load scripts, allowing the client to detect and block malicious scripts injected into the application by an attacker.
   Web application configuration can include 1 or more <tizen:content-security-policy>, <tizen:content-security-policy-report-only>, or <tizen:allow-navigation> element. If these are included, the Web application is set to the CSP-based security mode.
 
-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:
+In the CSP-based security mode, the Web Runtime provides content security as per Content Security Policy Level 2 (in mobile applications) and Content Security Policy 1.0 (in wearable applications). 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';
 	config.xml: <tizen:content-security-policy> or <tizen:content-security-policy-report-only>
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 f668008..bc5093e 100644
--- a/org.tizen.training/html/web/process/setting_properties_w.htm
+++ b/org.tizen.training/html/web/process/setting_properties_w.htm
@@ -175,7 +175,7 @@
     
     
      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).
+     Used to define an additional content security policy for a packaged or hosted application. The policy string is defined according to Content Security Policy Level 2 (in mobile applications) and Content Security Policy 1.0 (in wearable applications).
 
     
     
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 82643cb..18916d3 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
@@ -468,7 +468,7 @@ window.onload = function onLoad()
 

 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>

Using Cross-document Messaging

XMLHttpRequest (Level 1 and 2)

XMLHttpRequest

XMLHttpRequest Level 2 in Mobile Applications

XMLHttpRequest Level 1 in Wearable Applications

Task: Touch Paint

Initializing the Canvas

Task: Touch Paint

Touch Events version 1

Touch Events

HTML5 SVG

SVG

Defining the Main Screen

Geolocation API Specification

Source Code

Loading Data and Creating Audio Context

Using Modular Routing

Source Code

Source Code

Multi-threading

Cross-Origin Resource Sharing

Simple Request

Preflight Request

Using Simple Requests

Using Preflight Requests

Accessing Sandboxed Cookies

Submitting a Sandboxed Form

Including Rendered Content in the Parent Document

Source Code

Setting the Cache Manifest

Slicing Blob

Image Resolution Optimization

Selecting a Single Node

HTML5 Session History

WOFF File Format (1.0)

WOFF File Format (1.0 and 2.0)

Using the WOFF File Format

Configuration Elements

Extending Configuration Elements in Mobile Applications

Extending Configuration Elements in Wearable Applications

Web Package Configuration

Web Application Package

Signature Specification

Web Application Signature