[MediaController] Added base files for tutorial and guide.
authorTomasz Marciniak <t.marciniak@samsung.com>
Tue, 5 May 2015 07:33:24 +0000 (09:33 +0200)
committerTomasz Marciniak <t.marciniak@samsung.com>
Wed, 6 May 2015 07:46:08 +0000 (09:46 +0200)
Change-Id: I9c3d3de517e23b9a495377abb9c72c520c31d248
Signed-off-by: Tomasz Marciniak <t.marciniak@samsung.com>
org.tizen.guides/html/index.htm
org.tizen.guides/html/web/tizen/multimedia/media_controller_w.htm [new file with mode: 0644]
org.tizen.guides/index.xml
org.tizen.tutorials/html/index.htm
org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm [new file with mode: 0644]
org.tizen.tutorials/index.xml

index baaa6af..a361cc0 100644 (file)
@@ -52,6 +52,7 @@
                                </li>
                                <li><a href="web/tizen/multimedia/multimedia_guide_w.htm">Multimedia</a>
                                        <ul>                                            
+                                               <li><a href="web/tizen/multimedia/media_controller_w.htm">Media Controller</a></li>
                                                <li><a href="web/tizen/multimedia/media_key_w.htm">Media Key</a></li>                                           
                                                <li><a href="web/tizen/multimedia/sound_w.htm">Sound</a></li>
                                        </ul>
diff --git a/org.tizen.guides/html/web/tizen/multimedia/media_controller_w.htm b/org.tizen.guides/html/web/tizen/multimedia/media_controller_w.htm
new file mode 100644 (file)
index 0000000..e0f1bfe
--- /dev/null
@@ -0,0 +1,79 @@
+<!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>Media Controller</title>
+ </head>
+ <body onload="prettyPrint()" style="overflow: auto;">
+
+ <div id="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">Related Info</p>
+        <ul class="toc">
+            <li><a href="../../../../../org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm">Media Controller Tutorial</a></li>
+            <li><a href="../../../../../org.tizen.web.apireference/html/device_api/mobile/tizen/mediacontroller.html">Media Controller API for Mobile Web</a></li>
+            <li><a href="../../../../../org.tizen.web.apireference/html/device_api/wearable/tizen/mediacontroller.html">Media Controller API for Wearable Web</a></li>
+        </ul>
+    </div></div>
+</div>
+
+<div id="container"><div id="contents"><div class="content">
+  <h1>Media Controller</h1>
+
+   <p>The MediaController API provides functions for communication between the media controller server and the media controller client.</p>
+
+     <table class="note">
+   <tbody>
+    <tr>
+     <th class="note">Note</th>
+    </tr>
+    <tr>
+     <td class="note">The Media Controller API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices.
+     <p>All mandatory APIs are supported on the Tizen Emulators.</p></td>
+    </tr>
+   </tbody>
+  </table>
+
+   <p>The main features of the Media Controller API include:</p>
+   <ul>
+    <li>Example feature 1<p>You can <a href="../../../../../org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm#example1">link to example 1</a> with the <span style="font-family: Courier New,Courier,monospace">exampleMethod1()</span> method.</p>   </li>
+    <li>Example feature 2<p>You can <a href="../../../../../org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm#example2">link to example 2</a> with the <span style="font-family: Courier New,Courier,monospace">exampleMethod2()</span> method.</p>   </li>
+    <li>Example feature 3<p>You can <a href="../../../../../org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm#example3">link to example 3</a> with the <span style="font-family: Courier New,Courier,monospace">exampleMethod3()</span> method.</p>   </li>
+    <li>Example feature 4<p>You can <a href="../../../../../org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm#example4">link to example 4</a> with the <span style="font-family: Courier New,Courier,monospace">exampleMethod4()</span> method.</p>   </li>
+   </ul>
+
+<script type="text/javascript" src="../../../scripts/jquery.zclip.min.js"></script>
+<script type="text/javascript" src="../../../scripts/showhide.js"></script>
+</div></div></div>
+
+<a class="top sms" href="#"><img src="../../../images/btn_top.gif" alt="Go to top" /></a>
+
+<div id="footer">
+<p class="footer">Except as noted, this content - excluding the Code Examples - is licensed under <a href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution 3.0</a> and all of the Code Examples contained herein are licensed under <a href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br/>For details, see the <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</p>
+</div>
+
+<script type="text/javascript">
+var _gaq = _gaq || [];
+_gaq.push(['_setAccount', 'UA-25976949-1']);
+_gaq.push(['_trackPageview']);
+(function() {
+var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+})();
+</script>
+
+</body>
+</html>
index d7db438..551a08a 100644 (file)
@@ -24,6 +24,7 @@
                        <topic href="html/web/tizen/input_output/archive_w.htm" label="Archive"></topic>
                </topic>
                <topic href="html/web/tizen/multimedia/multimedia_guide_w.htm" label="Multimedia">                              
+                       <topic href="html/web/tizen/multimedia/media_controller_w.htm" label="Media Controller"></topic>
                        <topic href="html/web/tizen/multimedia/media_key_w.htm" label="Media Key"></topic>
                        <topic href="html/web/tizen/multimedia/sound_w.htm" label="Sound"></topic>                                      
                </topic>        
index 14f3594..6e38098 100644 (file)
@@ -63,6 +63,7 @@
                </li>           
                <li><a href="web/tizen/multimedia/multimedia_tutorials_w.htm">Multimedia</a>
                        <ul>
+                               <li><a href="web/tizen/multimedia/media_controller_tutorial_w.htm">Media Controller</a></li>
                                <li><a href="web/tizen/multimedia/media_key_tutorial_w.htm">Media Key</a></li>
                                <li><a href="web/tizen/multimedia/sound_tutorial_w.htm">Sound</a></li>
                        </ul>
diff --git a/org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm b/org.tizen.tutorials/html/web/tizen/multimedia/media_controller_tutorial_w.htm
new file mode 100644 (file)
index 0000000..f269e21
--- /dev/null
@@ -0,0 +1,258 @@
+<!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>Media Controller: Communication between the media controller server and client.</title>
+</head>
+
+<body onload="prettyPrint()" style="overflow: auto;">
+
+<div id="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 href="#example1">Example 1</a></li>
+            <li><a href="#example2">Example 2</a></li>
+            <li><a href="#example3">Example 3</a></li>
+            <li><a href="#example4">Example 4</a></li>
+        </ul>
+        <p class="toc-title">Related Info</p>
+        <ul class="toc">
+            <li><a href="../../../../../org.tizen.guides/html/web/tizen/multimedia/media_controller_w.htm">Media Controller Guide</a></li>
+            <li><a href="../../../../../org.tizen.web.apireference/html/device_api/mobile/tizen/mediacontroller.html">Media Controller API for Mobile Web</a></li>
+            <li><a href="../../../../../org.tizen.web.apireference/html/device_api/wearable/tizen/mediacontroller.html">Media Controller API for Wearable Web</a></li>
+        </ul>
+    </div></div>
+</div>
+
+<div id="container"><div id="contents"><div class="content">
+<h1>Media Controller: Communication between the media controller server and client.</h1>
+
+
+<p>This tutorial demonstrates how you can receive information from the media controller server and how to control media controller server state from the client by sending commands.</p>
+
+<table class="note">
+<tbody>
+    <tr>
+     <th class="note">Note</th>
+    </tr>
+    <tr>
+     <td class="note">The Media Controller API is mandatory for both Tizen mobile and wearable profiles, which means that it is supported in all mobile and wearable devices.
+     <p>All mandatory APIs are supported on the Tizen Emulators.</p></td>
+    </tr>
+   </tbody>
+  </table>
+
+<h2>Warm-up</h2>
+<p>Become familiar with the Media Controller API basics by learning about:</p>
+<ul>
+ <li><a href="#example1">Example 1</a> <p>Short description.</p> </li>
+ <li><a href="#example2">Example 2</a> <p>Short description.</p> </li>
+ <li><a href="#example3">Example 3</a> <p>Short description.</p> </li>
+ <li><a href="#example4">Example 4</a> <p>Short description.</p> </li>
+</ul>
+
+                <h2 id="example1" name="example1">Example 1 title</h2>
+
+<p>Feature description.</p>
+<ol>
+<li>Step description e.g: create the media controller server using the <span style="font-family: Courier New,Courier,monospace">createServer()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcServer = tizen.mediaController.createServer();
+</pre>
+
+</li>
+<li>Step description e.g: Get the client object using the <span style="font-family: Courier New,Courier,monospace">getClient()</span> method.
+
+<pre class="prettyprint">
+code snippets e.g
+
+try {
+&nbsp;&nbsp;&nbsp;var mcClient = tizen.mediaController.getClient();
+} catch (err) {
+&nbsp;&nbsp;&nbsp;console.log (err.name +': ' + err.message);
+}</pre>
+
+</li>
+<li>Step description e.g: Change playback state of media controller server using the <span style="font-family: Courier New,Courier,monospace">sendPlaybackState()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcClient = tizen.mediaController.getClient();
+var mcServerInfo = mcClient.getLatestServerInfo();
+
+mcServerInfo.sendPlaybackState(&quot;STOP&quot;, function() {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Playback has stopped&quot;);
+}, function(e) {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Unable to change playback state: &quot; + e.message);
+});</pre>
+
+</li>
+</ol>
+
+                <h2 id="example2" name="example2">Example 2 title</h2>
+
+<p>Feature description.</p>
+<ol>
+<li>Step description e.g: create the media controller server using the <span style="font-family: Courier New,Courier,monospace">createServer()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcServer = tizen.mediaController.createServer();
+</pre>
+
+</li>
+<li>Step description e.g: Get the client object using the <span style="font-family: Courier New,Courier,monospace">getClient()</span> method.
+
+<pre class="prettyprint">
+code snippets e.g
+
+try {
+&nbsp;&nbsp;&nbsp;var mcClient = tizen.mediaController.getClient();
+} catch (err) {
+&nbsp;&nbsp;&nbsp;console.log (err.name +': ' + err.message);
+}</pre>
+
+</li>
+<li>Step description e.g: Change playback state of media controller server using the <span style="font-family: Courier New,Courier,monospace">sendPlaybackState()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcClient = tizen.mediaController.getClient();
+var mcServerInfo = mcClient.getLatestServerInfo();
+
+mcServerInfo.sendPlaybackState(&quot;STOP&quot;, function() {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Playback has stopped&quot;);
+}, function(e) {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Unable to change playback state: &quot; + e.message);
+});</pre>
+
+</li>
+</ol>
+
+<h2 id="example3" name="example3">Example 3 title</h2>
+
+<p>Feature description.</p>
+<ol>
+<li>Step description e.g: create the media controller server using the <span style="font-family: Courier New,Courier,monospace">createServer()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcServer = tizen.mediaController.createServer();
+</pre>
+
+</li>
+<li>Step description e.g: Get the client object using the <span style="font-family: Courier New,Courier,monospace">getClient()</span> method.
+
+<pre class="prettyprint">
+code snippets e.g
+
+try {
+&nbsp;&nbsp;&nbsp;var mcClient = tizen.mediaController.getClient();
+} catch (err) {
+&nbsp;&nbsp;&nbsp;console.log (err.name +': ' + err.message);
+}</pre>
+
+</li>
+<li>Step description e.g: Change playback state of media controller server using the <span style="font-family: Courier New,Courier,monospace">sendPlaybackState()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcClient = tizen.mediaController.getClient();
+var mcServerInfo = mcClient.getLatestServerInfo();
+
+mcServerInfo.sendPlaybackState(&quot;STOP&quot;, function() {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Playback has stopped&quot;);
+}, function(e) {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Unable to change playback state: &quot; + e.message);
+});</pre>
+
+</li>
+</ol>
+
+<h2 id="example4" name="example4">Example 4 title</h2>
+
+<p>Feature description.</p>
+<ol>
+<li>Step description e.g: create the media controller server using the <span style="font-family: Courier New,Courier,monospace">createServer()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcServer = tizen.mediaController.createServer();
+</pre>
+
+</li>
+<li>Step description e.g: Get the client object using the <span style="font-family: Courier New,Courier,monospace">getClient()</span> method.
+
+<pre class="prettyprint">
+code snippets e.g
+
+try {
+&nbsp;&nbsp;&nbsp;var mcClient = tizen.mediaController.getClient();
+} catch (err) {
+&nbsp;&nbsp;&nbsp;console.log (err.name +': ' + err.message);
+}</pre>
+
+</li>
+<li>Step description e.g: Change playback state of media controller server using the <span style="font-family: Courier New,Courier,monospace">sendPlaybackState()</span> method:
+
+<pre class="prettyprint">
+code snippets e.g
+
+var mcClient = tizen.mediaController.getClient();
+var mcServerInfo = mcClient.getLatestServerInfo();
+
+mcServerInfo.sendPlaybackState(&quot;STOP&quot;, function() {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Playback has stopped&quot;);
+}, function(e) {
+&nbsp;&nbsp;&nbsp;console.log(&quot;Unable to change playback state: &quot; + e.message);
+});</pre>
+
+</li>
+</ol>
+
+<script type="text/javascript" src="../../../scripts/jquery.zclip.min.js"></script>
+<script type="text/javascript" src="../../../scripts/showhide.js"></script>
+
+</div></div></div>
+
+<a class="top sms" href="#"><img src="../../../images/btn_top.gif" alt="Go to top" /></a>
+
+<div id="footer">
+<p class="footer">Except as noted, this content - excluding the Code Examples - is licensed under <a href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution 3.0</a> and all of the Code Examples contained herein are licensed under <a href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br/>For details, see the <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</p>
+</div>
+
+<script type="text/javascript">
+var _gaq = _gaq || [];
+_gaq.push(['_setAccount', 'UA-25976949-1']);
+_gaq.push(['_trackPageview']);
+(function() {
+var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+})();
+</script>
+
+</body>
+</html>
index 4cf2000..d4b70f7 100644 (file)
@@ -29,6 +29,7 @@
                        <topic href="html/web/tizen/input_output/archive_tutorial_w.htm" label="Archive"></topic>
                </topic>                
                <topic href="html/web/tizen/multimedia/multimedia_tutorials_w.htm" label="Multimedia">                  
+                       <topic href="html/web/tizen/multimedia/media_controller_tutorial_w.htm" label="Media Controller"></topic>
                        <topic href="html/web/tizen/multimedia/media_key_tutorial_w.htm" label="Media Key"></topic>
                        <topic href="html/web/tizen/multimedia/sound_tutorial_w.htm" label="Sound"></topic>                     
                </topic>