Tokentextarea: Fix Tizen-winsets demo.

Separate AddressBook page from tokentextarea.html

Change-Id: I7d9e090417f070caff09d9cceab19412ff60194f

diff --git a/demos/tizen-winsets/widgets/tokentextarea/addressbook.html b/demos/tizen-winsets/widgets/tokentextarea/addressbook.html
new file mode 100644 (file)
index 0000000..3c7c978
--- /dev/null
+++ b/demos/tizen-winsets/widgets/tokentextarea/addressbook.html
@@ -0,0 +1,47 @@
+<div data-role="page" id="addressbook" data-add-back-btn="true" data-dom-cache="true">
+       <div data-role="header" data-position="fixed">
+               <h1>ADDRESS BOOK</h1>
+       </div>
+       <div data-role="content" id="contentList">
+               <ul data-role="listview">
+                       <li data-role="list-divider">A</li>
+                       <li><a>Adam Kinkaid</a></li>
+                       <li><a>Alex Wickerham</a></li>
+                       <li><a>Avery Johnson</a></li>
+                       <li data-role="list-divider">B</li>
+                       <li><a>Bob Cabot</a></li>
+                       <li data-role="list-divider">C</li>
+                       <li><a>Caleb Booth</a></li>
+                       <li><a>Christopher Adams</a></li>
+                       <li><a>Culver James</a></li>
+                       <li data-role="list-divider">D</li>
+                       <li><a>David Walsh</a></li>
+                       <li><a>Drake Alfred</a></li>
+                       <li data-role="list-divider">E</li>
+                       <li><a>Elizabeth Bacon</a></li>
+                       <li><a>Emery Parker</a></li>
+                       <li><a>Enid Voldon</a></li>
+                       <li data-role="list-divider">F</li>
+                       <li><a>Francis Wall</a></li>
+                       <li data-role="list-divider">G</li>
+                       <li><a>Graham Smith</a></li>
+                       <li><a>Greta Peete</a></li>
+                       <li data-role="list-divider">H</li>
+                       <li><a>Harvey Walls</a></li>
+                       <li data-role="list-divider">M</li>
+                       <li><a>Mike Farnsworth</a></li>
+                       <li><a>Murray Vanderbuilt</a></li>
+                       <li data-role="list-divider">N</li>
+                       <li><a>Nathan Williams</a></li>
+                       <li data-role="list-divider">P</li>
+                       <li><a>Paul Baker</a></li>
+                       <li><a>Pete Mason</a></li>
+                       <li data-role="list-divider">R</li>
+                       <li><a>Rod Tarker</a></li>
+                       <li data-role="list-divider">S</li>
+                       <li><a>Sawyer Wakefield</a></li>
+               </ul>
+       </div> <!--/content -->
+       <div data-role="footer">
+       </div>
+</div> <!--/page -->

diff --git a/demos/tizen-winsets/widgets/tokentextarea/tokentextarea-demo.js b/demos/tizen-winsets/widgets/tokentextarea/tokentextarea-demo.js
index d4f070f..4f5e994 100644 (file)
--- a/demos/tizen-winsets/widgets/tokentextarea/tokentextarea-demo.js
+++ b/demos/tizen-winsets/widgets/tokentextarea/tokentextarea-demo.js
@@ -1,5 +1,5 @@
 ( function ( $, window ) {
-       $(document).one("pagecreate", "#tokentextarea", function () {
+       $( document ).one( "pagecreate", "#tokentextarea", function () {
                $( "#MBTaddItemTest" ).on( "click", function () {
                        $( ":jqmData(role='tokentextarea')" ).tokentextarea( "add", "additem" );
                });
@@ -49,18 +49,26 @@
                $( "#MBTdestroyTest" ).on( "click", function () {
                        $( ":jqmData(role='tokentextarea')" ).tokentextarea( "destroy" );
                });
+       });
 
-               $( "#contentList a" ).on( "click", function () {
-                       var arg = $( this ).text();
-                       $( ":jqmData(role='tokentextarea')" ).tokentextarea( "add", arg );
+       $( document ).one( "pagecreate", "#addressbook", function () {
+               var self = this;
+               self.itemSelected = false;
+
+               $( "#addressbook" ).on( "mousedown", function () {
+                       self.itemSelected = false;
                });
 
-               $( "#cancelBtn" ).on( "click", function () {
-                       $.mobile.changePage( "#tokentextarea", {
-                               transition: "reverse slide",
-                               reverse: false,
-                               changeHash: false
-                       } );
+               $( "#addressbook" ).on( "mouseup", function () {
+                       self.itemSelected = true;
+               });
+
+               $( "#contentList a" ).on( "click", function () {
+                       if ( self.itemSelected ) {
+                               var arg = $( this ).text();
+                               $( ":jqmData(role='tokentextarea')" ).tokentextarea( "add", arg );
+                               history.back();
+                       }
                });
        });
 } ( jQuery, window ) );

diff --git a/demos/tizen-winsets/widgets/tokentextarea/tokentextarea.html b/demos/tizen-winsets/widgets/tokentextarea/tokentextarea.html
index 866de46..39cc1b9 100644 (file)
--- a/demos/tizen-winsets/widgets/tokentextarea/tokentextarea.html
+++ b/demos/tizen-winsets/widgets/tokentextarea/tokentextarea.html
@@ -10,7 +10,6 @@
                                data-framework-viewport-width="device-width">
                </script>
                <script src="../../main.js"></script>
-               <script src="tokentextarea-demo.js"></script>
                <title>Tizen UI - Tokentextarea</title>
 
                <!-- for compatibility test -->
@@ -19,12 +18,12 @@
                <link rel="apple-touch-icon" href="../../icon-tizen.png" />
        </head>
        <body>
-               <div data-role="page" id="tokentextarea" data-add-back-btn="true">
+               <div data-role="page" id="tokentextarea" data-add-back-btn="true" data-dom-cache="true">
                        <div data-role="header" data-position="fixed">
                                <h1>TOKEN TEXT AREA</h1>
                        </div>
                        <div data-role="content">
-                               <div data-role="tokentextarea" data-link="#addressbook"></div>
+                               <div data-role="tokentextarea" data-link="addressbook.html"></div>
                                <br>
                                <ul data-role="listview">
                                        <li><a id='MBTaddItemTest'>Append Item</a></li>
@@ -41,56 +40,7 @@
                        </div>
                        <div data-role="footer">
                        </div>
+                       <script src="tokentextarea-demo.js"></script>
                </div>
-               <div data-role="page" id="addressbook">
-                       <div data-role="header" data-position="fixed">
-                               <h1>ADDRESS BOOK</h1>
-                       </div>
-                       <div data-role="content" id="contentList">
-                               <ul data-role="listview">
-                                       <li data-role="list-divider">A</li>
-                                       <li><a href="#tokentextarea">Adam Kinkaid</a></li>
-                                       <li><a href="#tokentextarea">Alex Wickerham</a></li>
-                                       <li><a href="#tokentextarea">Avery Johnson</a></li>
-                                       <li data-role="list-divider">B</li>
-                                       <li><a href="#tokentextarea">Bob Cabot</a></li>
-                                       <li data-role="list-divider">C</li>
-                                       <li><a href="#tokentextarea">Caleb Booth</a></li>
-                                       <li><a href="#tokentextarea">Christopher Adams</a></li>
-                                       <li><a href="#tokentextarea">Culver James</a></li>
-                                       <li data-role="list-divider">D</li>
-                                       <li><a href="#tokentextarea">David Walsh</a></li>
-                                       <li><a href="#tokentextarea">Drake Alfred</a></li>
-                                       <li data-role="list-divider">E</li>
-                                       <li><a href="#tokentextarea">Elizabeth Bacon</a></li>
-                                       <li><a href="#tokentextarea">Emery Parker</a></li>
-                                       <li><a href="#tokentextarea">Enid Voldon</a></li>
-                                       <li data-role="list-divider">F</li>
-                                       <li><a href="#tokentextarea">Francis Wall</a></li>
-                                       <li data-role="list-divider">G</li>
-                                       <li><a href="#tokentextarea">Graham Smith</a></li>
-                                       <li><a href="#tokentextarea">Greta Peete</a></li>
-                                       <li data-role="list-divider">H</li>
-                                       <li><a href="#tokentextarea">Harvey Walls</a></li>
-                                       <li data-role="list-divider">M</li>
-                                       <li><a href="#tokentextarea">Mike Farnsworth</a></li>
-                                       <li><a href="#tokentextarea">Murray Vanderbuilt</a></li>
-                                       <li data-role="list-divider">N</li>
-                                       <li><a href="#tokentextarea">Nathan Williams</a></li>
-                                       <li data-role="list-divider">P</li>
-                                       <li><a href="#tokentextarea">Paul Baker</a></li>
-                                       <li><a href="#tokentextarea">Pete Mason</a></li>
-                                       <li data-role="list-divider">R</li>
-                                       <li><a href="#tokentextarea">Rod Tarker</a></li>
-                                       <li data-role="list-divider">S</li>
-                                       <li><a href="#tokentextarea">Sawyer Wakefield</a></li>
-                               </ul>
-                       </div> <!--/content -->
-                       <div data-role="footer">
-                               <div align="right">
-                                       <a href="#tokentextarea" data-role="button" style="margin-right : 1em;">Cancel</a>
-                               </div>
-                       </div>
-               </div> <!--/page -->
        </body>
 </html>