[DevTools] Add REST Viewer help document
authorhyunsik.noh <hyunsik.noh@samsung.com>
Tue, 12 May 2015 08:59:15 +0000 (17:59 +0900)
committerhyunsik.noh <hyunsik.noh@samsung.com>
Thu, 14 May 2015 05:55:19 +0000 (14:55 +0900)
Change-Id: I2af80bc6af3a96f1eda97d023886ca4d32970db0
Signed-off-by: hyunsik.noh <hyunsik.noh@samsung.com>
19 files changed:
org.tizen.devtools/html/images/rest_viewer_authentication.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_dialog.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_drag_drop.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_export_wadl.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_import_wadl.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_main.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_method.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_new.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_preferences.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_resource.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_resources.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_result.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_run.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_select_profile.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_select_user_variable.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_service.png [new file with mode: 0644]
org.tizen.devtools/html/images/rest_viewer_user_variables.png [new file with mode: 0644]
org.tizen.devtools/html/index.htm
org.tizen.devtools/html/web_tools/rest_viewer_w.htm [new file with mode: 0644]

diff --git a/org.tizen.devtools/html/images/rest_viewer_authentication.png b/org.tizen.devtools/html/images/rest_viewer_authentication.png
new file mode 100644 (file)
index 0000000..c6d9a09
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_authentication.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_dialog.png b/org.tizen.devtools/html/images/rest_viewer_dialog.png
new file mode 100644 (file)
index 0000000..3bcf632
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_dialog.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_drag_drop.png b/org.tizen.devtools/html/images/rest_viewer_drag_drop.png
new file mode 100644 (file)
index 0000000..4f880e7
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_drag_drop.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_export_wadl.png b/org.tizen.devtools/html/images/rest_viewer_export_wadl.png
new file mode 100644 (file)
index 0000000..bbff4e1
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_export_wadl.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_import_wadl.png b/org.tizen.devtools/html/images/rest_viewer_import_wadl.png
new file mode 100644 (file)
index 0000000..e8b2fc9
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_import_wadl.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_main.png b/org.tizen.devtools/html/images/rest_viewer_main.png
new file mode 100644 (file)
index 0000000..aa06d71
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_main.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_method.png b/org.tizen.devtools/html/images/rest_viewer_method.png
new file mode 100644 (file)
index 0000000..889b0af
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_method.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_new.png b/org.tizen.devtools/html/images/rest_viewer_new.png
new file mode 100644 (file)
index 0000000..b382732
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_new.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_preferences.png b/org.tizen.devtools/html/images/rest_viewer_preferences.png
new file mode 100644 (file)
index 0000000..6fbca7b
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_preferences.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_resource.png b/org.tizen.devtools/html/images/rest_viewer_resource.png
new file mode 100644 (file)
index 0000000..78ab7a3
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_resource.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_resources.png b/org.tizen.devtools/html/images/rest_viewer_resources.png
new file mode 100644 (file)
index 0000000..a31d72f
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_resources.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_result.png b/org.tizen.devtools/html/images/rest_viewer_result.png
new file mode 100644 (file)
index 0000000..9e87049
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_result.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_run.png b/org.tizen.devtools/html/images/rest_viewer_run.png
new file mode 100644 (file)
index 0000000..a90d63a
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_run.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_select_profile.png b/org.tizen.devtools/html/images/rest_viewer_select_profile.png
new file mode 100644 (file)
index 0000000..04c44f6
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_select_profile.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_select_user_variable.png b/org.tizen.devtools/html/images/rest_viewer_select_user_variable.png
new file mode 100644 (file)
index 0000000..3991849
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_select_user_variable.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_service.png b/org.tizen.devtools/html/images/rest_viewer_service.png
new file mode 100644 (file)
index 0000000..d2fdf3a
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_service.png differ
diff --git a/org.tizen.devtools/html/images/rest_viewer_user_variables.png b/org.tizen.devtools/html/images/rest_viewer_user_variables.png
new file mode 100644 (file)
index 0000000..90b6ad3
Binary files /dev/null and b/org.tizen.devtools/html/images/rest_viewer_user_variables.png differ
index a8e50aa..274631b 100644 (file)
@@ -44,6 +44,7 @@
                <ul>
                <li><a href="web_tools/config_editor_w.htm">Configuration Editor</a></li>
                <li><a href="web_tools/privilege_checker_w.htm">Privilege Checker</a></li>
+               <li><a href="web_tools/rest_viewer_w.htm">REST Viewer</a></li>
                        <li><a href="web_tools/content_assist_w.htm">Content Assist</a></li>    
                <li><a href="web_tools/html_editor_w.htm">HTML Editor</a></li>
                <li><a href="web_tools/html_preview_w.htm">HTML Preview</a></li>
diff --git a/org.tizen.devtools/html/web_tools/rest_viewer_w.htm b/org.tizen.devtools/html/web_tools/rest_viewer_w.htm
new file mode 100644 (file)
index 0000000..be08c2d
--- /dev/null
@@ -0,0 +1,345 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+<meta http-equiv="X-UA-Compatible" content="IE=9" />
+<link rel="stylesheet" type="text/css" href="../css/styles.css" />
+<link rel="stylesheet" type="text/css" href="../css/snippet.css" />
+<script type="text/javascript" src="../scripts/snippet.js"></script>
+<script type="text/javascript" src="../scripts/jquery.util.js"
+    charset="utf-8"></script>
+<script type="text/javascript" src="../scripts/common.js"
+    charset="utf-8"></script>
+<script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>
+<script type="text/javascript" src="../scripts/search.js"
+    charset="utf-8"></script>
+
+<title>REST Viewer</title>
+</head>
+<body onload="prettyPrint()" style="overflow: auto;">
+    <div id="toc-navigation">
+        <div id="profile">
+            <p>
+                <img alt="Mobile Web" src="../images/mw_icon.png" /> <img
+                    alt="Wearable Web" src="../images/ww_icon.png" />
+            </p>
+        </div>
+        <div id="toc_border">
+            <div id="toc">
+                <p class="toc-title">Content</p>
+                <ul class="toc">
+                    <li><a class="opensection" href="#visualize">Visualize the
+                            WADL document</a></li>
+                    <li><a class="opensection" href="#management">Management
+                            for WADL component</a></li>
+                    <li><a class="opensection" href="#authentication">Authentication</a></li>
+                    <li><a class="opensection" href="#test">Test and get the
+                            result</a></li>
+                    <li><a class="opensection" href="#auto">Auto-generating
+                            code</a></li>
+                </ul>
+            </div>
+        </div>
+    </div>
+    <div id="container">
+        <div id="contents">
+            <div class="content">
+
+                <h1>REST Viewer</h1>
+
+                <p>The REST Viewer in the Tizen SDK IDE provides the following
+                    functions for Web application development with using REST APIs:</p>
+                <ul class="ul">
+                    <li>Visualize the WADL document
+                        <ul class="ul">
+                            <li>Show WADL components with structure</li>
+                        </ul>
+                    </li>
+                    <li>Management for WADL component
+                        <ul class="ul">
+                            <li>Create, delete, modify WADL components</li>
+                        </ul>
+                    </li>
+                    <li>Authentication
+                        <ul class="ul">
+                            <li>Setting for API Key and OAuth 2.0</li>
+                        </ul>
+                    </li>
+                    <li>Test and get the result
+                        <ul class="ul">
+                            <li>Ease to test and check the result</li>
+                        </ul>
+                    </li>
+                    <li>Auto-generating code
+                        <ul class="ul">
+                            <li>Support code snippet for sending asynchronous request</li>
+                        </ul>
+                    </li>
+                </ul>
+                <br></br>
+                <h2 id="visualize" name="visualize">Visualize the WADL document</h2>
+                <p>
+                    The things what shown on REST Viewer are the <a
+                        href="http://www.w3.org/Submission/wadl/">WADL(Web Application
+                        Description Language)</a> documents.
+                </p>
+                <p>
+                    This viewer loads them from specific location (Enable to set the
+                    location at Preferences > Tizen SDK > REST Viewer or [<img
+                        alt="Preferences icon" src="../images/rest_viewer_preferences.png" />] on toolbar)
+                    and classifies them as 4 typed WADL components (Application,
+                    Service, Path, API). It is possible to not only import/export WADL
+                    components but also handle them.
+                </p>
+                <p class="figure">Figure: REST Viewer</p>
+                <p style="text-align: center;">
+                    <img alt="REST Viewer" src="../images/rest_viewer_main.png" />
+                </p>
+                <br></br>
+                <h2 id="management" name="management">Management for WADL
+                    component</h2>
+                <p>There are 4 typed WADL components from WADL component:</p>
+                <ul class="ul">
+                    <li>[<img alt="Service icon" src="../images/rest_viewer_service.png" />]
+                        Service (Application): The application element forms the root of a
+                        WADL description.
+                    </li>
+                    <li>[<img alt="Resources icon" src="../images/rest_viewer_resources.png" />]
+                        Base URI (Resources): The resources element acts as a container
+                        for the resources provided by the application.
+                    </li>
+                    <li>[<img alt="Resource icon" src="../images/rest_viewer_resource.png" />]
+                        Path (Resource): A resource element describes a set of resources,
+                        each identified by URI that follows a common pattern.
+                    </li>
+                    <li>[<img alt="Method icon" src="../images/rest_viewer_method.png" />]
+                        API (Method): This element describes the input to and output form
+                        an HTTP protocol method that may be applied to a resource.
+                    </li>
+                </ul>
+
+                <p>This REST Viewer provides way to make new WADL components. It
+                    also possible to import or export WADL file(s) - You can handle
+                    only the selected WADL component if you open the dialog to modify
+                    it. It means that it is impossible to modify its parent or children
+                    component(s).</p>
+
+                <table class="note">
+                    <tbody>
+                        <tr>
+                            <th class="note">Note</th>
+                        </tr>
+                        <tr>
+                            <td class="note">Constraint: Some attributes are required to
+                                make structure for tree viewer even if they are optional on WADL
+                                schema.</td>
+                        </tr>
+                    </tbody>
+                </table>
+                <ul class="ul">
+                    <li>[<img alt="New icon" src="../images/rest_viewer_new.png" />]New:
+                        Open dialog to add new WADL component(s).
+                        <br></br>
+                        <p class="figure">Figure: The dialog for WADL component</p>
+                        <p style="text-align: center;">
+                            <img alt="The dialog for WADL component"
+                                src="../images/rest_viewer_dialog.png" />
+                        </p>
+                    </li>
+                    <br></br>
+                    <li>The WADL document has ordered structure.(Service > Base
+                        URI > Path [> Path] > API)</li>
+                    <li>Application (Service)
+                        <ul class="ul">
+                            <li>Title (required): A short plain text description of the
+                                element being documented.</li>
+                        </ul>
+                    </li>
+                    <li>Base URI (Resources)
+                        <ul class="ul">
+                            <li>Base URI (required): This attribute that provides the
+                                base URI for each child resource identifier.</li>
+                            <li>Alias(optional)</li>
+                        </ul>
+                    </li>
+                    <li>Path (Resource)
+                        <ul class="ul">
+                            <li>Parent Path: It needs if resource has nested path
+                                structure.</li>
+                            <li>Path (required): This provides a relative URI template
+                                for the identifier of the resource.</li>
+                            <li>Content Type (default): Defines the media type for the
+                                query component of the resource URI.</li>
+                        </ul>
+                    </li>
+                    <li>API
+                        <ul class="ul">
+                            <li>Id (required): The identifier for the method.</li>
+                            <li>Method (default): Indicates the HTTP method used.</li>
+                            <li>Description(optional)</li>
+                        </ul>
+                    </li>
+                    <li>Common Parameter: Describes the input to the method as a
+                        collection of parameters.
+                        <ul class="ul">
+                            <li>Name: Parameter name</li>
+                            <li>Value</li>
+                            <li>Style: Indicates the parameter style.
+                                <ul class="ul">
+                                    <li>Header: Specifies a HTTP header for use in the
+                                        request.</li>
+                                    <li>Query: Specifies a URI query parameter for method.</li>
+                                    <li>File</li>
+                                </ul>
+                            </li>
+                            <li>Type: The type of the parameter as an XML qualified
+                                name.</li>
+                            <li>Required: Whether the parameter is required to be
+                                present or not.</li>
+                        </ul>
+                    </li>
+                </ul>
+                <br></br>
+                <p>And it is also possible to import (export) from (to) WADL.</p>
+                <ul class="ul">
+                    <li>[<img alt="Import Wadl icon" src="../images/rest_viewer_import_wadl.png" />]Import
+                        WADL: The REST Viewer imports WADL file and shows WADL models.
+                        <ul class="ul">
+                            <li>From local WADL file or url.</li>
+                        </ul>
+                    </li>
+                    <li>[<img alt="Export Wadl icon" src="../images/rest_viewer_export_wadl.png" />]Export
+                        WADL: This exports selected WADL model(s) on viewer as a .wadl
+                        file.
+                    </li>
+                </ul>
+                <br></br>
+                <h2 id="authentication" name="authentication">Authentication</h2>
+
+                <p>REST Viewer helps when you test the application with
+                    authentication. (Enable to set the location at Preferences > Tizen
+                    SDK > REST Viewer > Authentication)</p>
+                <ul class="ul">
+                    <li>API Key
+                        <ul class="ul">
+                            <li>API key authentication with header or parameter.</li>
+                        </ul>
+                    </li>
+                    <li>OAuth 2.0
+                        <ul class="ul">
+                            <li>OAuth 2.0 authentication information for RESTful API.</li>
+                        </ul>
+                    </li>
+                </ul>
+                <p class="figure">Figure: Authentication</p>
+                <p style="text-align: center;">
+                    <img alt="Authentication" src="../images/rest_viewer_authentication.png" />
+                </p>
+                <br></br>
+                <h2 id="test" name="test">Test and get the result</h2>
+
+                <p>You can test selected API on REST Viewer and get the result
+                    of it. There are three entry points to do it.</p>
+                <ul class="ul">
+                    <li>[<img alt="Run icon" src="../images/rest_viewer_run.png" />]Run:
+                        This button on the toolbar. And it also shows running history.
+                    </li>
+                    <li>Run from context menu on selection</li>
+                    <li>Save and Run(on Figure: The dialog for WADL component)</li>
+                </ul>
+
+                <p>And if User Variables are set, you can use them with placeholder
+                    to run/test it.</p>
+                <p class="figure">Figure: User Variables</p>
+                <p style="text-align: center;">
+                    <img alt="User Variables" src="../images/rest_viewer_user_variables.png" />
+                </p>
+                <br></br>
+                <p>You can create a new profile with other variables. And you
+                    can choose active profile in REST Viewer’s user variable toolbar
+                    menu as below. If you test any APIs in REST Viewer, selected
+                    profile will be used.</p>
+                <p class="figure">Figure: Profile Selection</p>
+                <p style="text-align: center;">
+                    <img alt="Profile Selection"
+                        src="../images/rest_viewer_select_profile.png" />
+                </p>
+                <br></br>
+                <p class="figure">Figure: User Variable Selection</p>
+                <p style="text-align: center;">
+                    <img alt="User Variable Selection"
+                        src="../images/rest_viewer_select_user_variable.png" />
+                </p>
+                <br></br>
+                <p>Then you can check the response result on Console View. And
+                    it is possible to save response structure.</p>
+                <p class="figure">Figure: The response result on Console View</p>
+                <p style="text-align: center;">
+                    <img alt="The response result on Console View"
+                        src="../images/rest_viewer_result.png" />
+                </p>
+                <br></br>
+                <h2 id="auto" name="auto">Auto-generating code</h2>
+                <p>The REST Viewer helps to send asynchronous request with REST
+                    APIs. There are two ways to generate code to do it.</p>
+                <ul class="ul">
+                    <li>Content assist
+                        <ul class="ul">
+                            <li>You can activate content assist with prefix “rest.”.</li>
+                        </ul>
+                    </li>
+                    <li>Drag and drop
+                        <ul class="ul">
+                            <li>1. Select API model on REST Viewer, then drag it and
+                                drop on Web SDK HTML Editor.</li>
+                            <li>2. Select functions at bottom of dialog then you get the
+                                code.</li>
+                        </ul>
+                    </li>
+                </ul>
+                <p class="figure">Figure: Function Selection for REST API</p>
+                <p style="text-align: center;">
+                    <img alt="Function Selection for REST API"
+                        src="../images/rest_viewer_drag_drop.png" />
+                </p>
+                <script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>
+                <script type="text/javascript" src="../scripts/showhide.js"></script>
+
+            </div>
+        </div>
+    </div>
+
+    <a class="top sms" href="#"><img src="../images/btn_top.gif"
+        alt="Go to top" /></a>
+
+    <div id="footer">
+        <p class="footer">
+            Except as noted, this content - excluding the Code Examples - is
+            licensed under <a
+                href="http://creativecommons.org/licenses/by/3.0/legalcode"
+                target="_blank">Creative Commons Attribution 3.0</a> and all of the
+            Code Examples contained herein are licensed under <a
+                href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br />For
+            details, see the <a href="https://www.tizen.org/content-license"
+                target="_blank">Content License</a>.
+        </p>
+    </div>
+
+    <script type="text/javascript">
+        var _gaq = _gaq || [];
+        _gaq.push([ '_setAccount', 'UA-25976949-1' ]);
+        _gaq.push([ '_trackPageview' ]);
+        (function() {
+            var ga = document.createElement('script');
+            ga.type = 'text/javascript';
+            ga.async = true;
+            ga.src = ('https:' == document.location.protocol ? 'https://ssl'
+                    : 'http://www')
+                    + '.google-analytics.com/ga.js';
+            var s = document.getElementsByTagName('script')[0];
+            s.parentNode.insertBefore(ga, s);
+        })();
+    </script>
+
+</body>
+</html>