<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8" >
<script src="/usr/share/tizen-web-ui-fw/latest/js/jquery.min.js"></script>
<script src="configure.js"></script>
- <script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
- <script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.min.js"
+ <script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.js"></script>
+ <script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"
data-framework-theme="tizen-black"
data-framework-viewport-width="device-width">
<script src="webappInit.js"></script>
<script src="webappOrientation.js"></script>
- <title>TIZEN UI</title>
+ <title>Tizen ui</title>
<!-- for compatibility test -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<body>
<div data-role="page" id="main" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TIZEN WEB UI</h1>
+ <h1>Tizen web ui</h1>
</div>
<div data-role="content">
<ul data-role="listview">
- <li data-role="list-divider">WIDGETS</li>
+ <li data-role="list-divider">Widgets</li>
<li><a href="widgets/list/lists-autodividers.html">Autodividers</a></li>
<li><a href="widgets/button/button.html">Button</a></li>
<li><a href="widgets/checkbox/checkbox.html">Checkbox</a></li>
<li><a href="widgets/progressbar.html">Progress bar</a></li>
<li><a href="widgets/searchbar/searchbar.html">Search filter bar</a></li>
<li><a href="widgets/slider/slider.html">Slider</a></li>
- <li><a href="widgets/list/list-swipe.html">Swipe</a></li>
<li><a href="widgets/tabbar/tabbar.html">Tabbar</a></li>
+ <li><a href="widgets/list/list-swipe.html">Swipe</a></li>
<li><a href="widgets/tokentextarea/tokentextarea.html" >Token text area</a></li>
<li><a href="widgets/list/virtuallist.html">Virtual list</a></li>
<li><a href="widgets/grid/virtualgrid.html">Virtual grid</a></li>
- <li data-role="list-divider">PROGRAMMING TIPS</li>
+ <li data-role="list-divider">Programming tips</li>
<li><a href="widgets/pagelayout/backbutton-control.html">Back button control</a></li>
<li><a href="widgets/scroll_jump.html">Scroll Jump</a></li>
<li><a href="tips/generate-elements-dynamically/generate-elements-dynamically.html">Generate Elements by JS</a></li>
<li><a href="widgets/radio/radio.html">Radio</a></li>
<li><a href="widgets/naviframe/naviframe.html">Naviframe</a></li>
<!-- START_PROPRIETARY -->
- <li data-role="list-divider">EXPERIMENTAL</li>
+ <li data-role="list-divider">Experimental</li>
<li><a href="widgets/gallery3d/gallery3d.html">Gallery 3D</a></li>
<li><a href="widgets/splitview.html">Split view</a></li>
<!-- END_PROPRIETARY -->
Name: TizenWinset
-Version: 0.2.37
+Version: 0.2.39
Release: 0
Summary: Tizen Web UI Framework Sample App
Group: Development/Other
+License: MIT
+
+%description
+Tizen Web UI Framework sample application
%changelog
+* Sun Jun 21 2013 Hyunjung Kim <hjnim.kim@samsung.com> 0.2.39
+ - Sync : Tizen Web UI Framework 0.2.39
+
* Sun Jun 16 2013 Hyunjung Kim <hjnim.kim@samsung.com> 0.2.37
- Sync : Tizen Web UI Framework 0.2.37
<div data-role="page" id="ButtonDemo" data-add-back-btn="true" >
<div data-role="header" data-position="fixed">
- <h1>BUTTONS</h1>
+ <h1>Buttons</h1>
</div>
<div data-role="content">
<ul data-role = "listview">
- <li data-role="list-divider">BASIC BUTTONS</li>
+ <li data-role="list-divider">Basic buttons</li>
<li class="ui-li-1line-btn1">List item 1<div data-role="button" data-inline="true">Text Button TesT</div></li>
<li class="ui-li-1line-btn1">List item 2<div data-role="button" data-inline="true" data-icon="arrow-r">Call Icon</div></li>
<li class="ui-li-1line-btn1">List item 3<div data-role="button" data-inline="true" data-icon="arrow-r">Longer Call Icon</div></li>
<li class="ui-li-1line-btn1">List item 4<div data-role="button" data-inline="true" data-icon="call" data-iconpos="right">Icon Text</div></li>
<li class="ui-li-1line-btn1">List item 3<div data-role="button" data-inline="true" data-style="circle">data-style, circle</div></li>
- <li data-role="list-divider">ONLY ICON BUTTONS FOR TIZEN</li>
+ <li data-role="list-divider">Only icon buttons for tizen</li>
<li class="ui-li-1line-btn1">data-icon = "call" <div data-role="button" data-inline="true" data-icon="call"></div></li>
<li class="ui-li-1line-btn1">data-icon = "rename" <div data-role="button" data-inline="true" data-icon="rename"></div></li>
- <li data-role="list-divider">ONLY ICON BUTTONS FOR JQM STYLE</li>
+ <li data-role="list-divider">Only icon buttons for JQM style</li>
<li class="ui-li-1line-btn1">data-icon = "arrow-l" <div data-role="button" data-inline="true" data-icon="arrow-l"></div></li>
<li class="ui-li-1line-btn1">data-icon = "arrow-r" <div data-role="button" data-inline="true" data-icon="arrow-r"></div></li>
<li class="ui-li-1line-btn1">data-icon = "arrow-u" <div data-role="button" data-inline="true" data-icon="arrow-u"></div></li>
<li class="ui-li-1line-btn1">data-icon = "info" <div data-role="button" data-inline="true" data-icon="info"></div></li>
<li class="ui-li-1line-btn1">data-icon = "home" <div data-role="button" data-inline="true" data-icon="home"></div></li>
<li class="ui-li-1line-btn1">data-icon = "search" <div data-role="button" data-inline="true" data-icon="search"></div></li>
- <li data-role="list-divider">BUTTONS WITH DATA-STYLE </li>
+ <li data-role="list-divider">Buttons with data-style</li>
<li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="plus" data-style="circle" class="ui-li-1line-btn2"></div></li>
<li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="minus" data-style="circle"></div></li>
<li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="forward" data-style="circle"></div></li>
<li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="star" data-style="box"></div></li>
<li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="scrolltop" data-style="box"></div></li>
<li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="scrollleft" data-style="box"></div></li>
- <li data-role="list-divider">ROUND BUTTON TEST</li>
+ <li data-role="list-divider">Round button test</li>
<li class="ui-li-has-multiline">
Data Corners
<span class="ui-li-text-sub">false,circle</span>
<span class="ui-li-text-sub">false,box</span>
<div data-role="button" data-inline="true" data-icon="call" data-corners="false" data-style="box" data-iconpos="right">Text</div>
</li>
- <li data-role="list-divider">CUSTOM BUTTONS</li>
+ <li data-role="list-divider">Custom buttons</li>
<li><a href="buttonNolist.html">Buttons Pages(not in list) </a></li>
</ul>
</div>
<body>
<div data-role="page" id="checkbox-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>CHECKBOX</h1>
+ <h1>Checkbox</h1>
</div>
<div data-role="content">
<div class="content-primary">
data-framework-viewport-width="device-width">
</script>
<script src="../main.js"></script>
- <title>CONTEXTUAL POPUP</title>
+ <title>Contextual popup</title>
<!-- for compatibility test -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<body>
<div data-role="page" id="ctxpopup-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>CONTEXT POPUP</h1>
+ <h1>Context popup</h1>
</div>
<div class="content" data-role="content">
<div>
<body>
<div data-role="page" id="datetimepicker-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>DATE/TIME PICKER</h1>
+ <h1>Date/Time picker</h1>
</div>
<div data-role="content">
<ul data-role="listview">
}
</style>
<div data-role="header" >
- <h1>ENTRY</h1>
+ <h1>Entry</h1>
</div><!-- /header -->
<div data-role="content">
<div data-role="page" id="fastscroll-demo" data-add-back-btn="true" data-fit-page-to-window="true">
<div data-role="header" data-position="fixed">
- <h1>FASTSCROLL</h1>
+ <h1>Fastscroll</h1>
</div><!-- header -->
<div class="content" data-role="content" data-scroll="y">
<body>
<div data-role="page" id="gallery-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>GALLERY</h1>
+ <h1>Gallery</h1>
</div>
<div data-role="content" data-scroll="none">
<div data-role="gallery" id="gallery" data-vertical-align="middle">
<div id="virtualgrid_list_page" data-role="page" class="virtualgrid_grid_demo" data-add-back-btn="true">
<div id="normal" data-role="header" data-position="fixed">
- <h1>VIRTUAL GRID - LIST</h1>
+ <h1>Virtual grid - list</h1>
</div>
<div data-role="content" data-scroll="none">
<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
<div id="virtualgrid_grid_page" data-role="page" class="virtualgrid_grid_demo" data-add-back-btn="true">
<div id="normal" data-role="header" data-position="fixed">
- <h1>VIRTUAL GRID</h1>
+ <h1>Virtual grid</h1>
</div>
<div data-role="content" data-scroll="none">
<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
<div id="virtualgrid_rotation_page" data-role="page" class="virtualgrid_grid_demo" data-add-back-btn="true">
<div id="normal" data-role="header" data-position="fixed">
- <h1>VIRTUAL GRID - ROTATION</h1>
+ <h1>Virtual grid - rotation</h1>
</div>
<div data-role="content" data-scroll="none">
<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
<div id="virtualgrid_grid_page" data-role="page" class="virtualgrid_grid_demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>VIRTUAL GRID - SIZE</h1>
+ <h1>Virtual grid - size</h1>
</div>
<div data-role="content" data-scroll="none">
<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
<div id="virtualgrid_x_page" data-role="page" class="virtualgrid_grid_demo" data-add-back-btn="true">
<div id="normal" data-role="header" data-position="fixed">
- <h1>VIRTUAL GRID - X</h1>
+ <h1>Virtual grid - x</h1>
</div>
<div data-role="content" data-scroll="none">
<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
<div id="virtualgrid_grid_page" data-role="page" class="virtualgrid_grid_demo" data-add-back-btn="true">
<div id="normal" data-role="header" data-position="fixed">
- <h1>VIRTUAL GRID</h1>
+ <h1>Virtual grid</h1>
</div>
<div data-role="content">
<ul data-role="listview">
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>HANDLER</h1>
+ <h1>Handler</h1>
</div><!-- /header -->
<div data-role="content" data-scroll="y" data-handler="true">
<ul data-role="listview">
<div data-role="page" id="genlist-bubble" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>BUBBLE LIST (MESSAGE BUBBLE)</h1>
+ <h1>Bubble list (Message bubble)</h1>
</div>
<div data-role="content">
<ul data-role="listview" data-style="bubble">
<div data-role="page" id="genlist-expandable" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>COLLAPSIBLE LIST (JQM)</h1>
+ <h1>Collapsible list (JQM)</h1>
</div>
<div data-role="content">
<form>
data-framework-viewport-width="device-width">
</script>
<script src="../../main.js"></script>
- <title>Tizen UI - Slider</title>
+ <title>Tizen UI - Dialog list</title>
<!-- for compatibility test -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<body>
<div data-role="page" id="genlist-dialog-edit" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>DIALOGUE LIST - EDIT MODE</h1>
+ <h1>Dialogue list - Edit mode</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<ul data-role="listview">
- <li data-role="list-divider" data-style="dialogue">CONTACT SAMPLE</li>
+ <li data-role="list-divider" data-style="dialogue">Contact sample</li>
<li class="ui-li-dialogue ui-li-dialogue-edit">
<div class="ui-edit-title">Name </div>
<input placeholder="Input your name" />
<input placeholder="Input your city" />
</li>
- <li data-role="list-divider" data-style="dialogue">CONTACT SAMPLE ( BUTTON )</li>
+ <li data-role="list-divider" data-style="dialogue">Contact sample ( button )</li>
<li class="ui-li-dialogue ui-li-dialogue-edit">
<div class="ui-edit-title">Name </div>
<input placeholder="Input your name" />
<div data-role="button" data-style="edit">Delete</div>
</li>
- <li data-role="list-divider" data-style="dialogue">CONTACT SAMPLE ( DISABLED )</li>
+ <li data-role="list-divider" data-style="dialogue">Contact sample ( disable )</li>
<li class="ui-li-dialogue ui-li-dialogue-edit">
<div class="ui-edit-title">Name </div>
<input value="Tizen" disabled />
<div data-role="page" id="genlist-dialog" data-add-back-btn="true" data-fit-page-to-window="true">
<div data-role="header" data-position="fixed">
- <h1>DIALOG LISTS</h1>
+ <h1>Dialog lists</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<form>
<ul data-role="listview">
- <li data-role="list-divider" data-style="dialogue">DIALOGUE</li>
+ <li data-role="list-divider" data-style="dialogue">Dialogue</li>
<li class="ui-li-dialogue">
1line
</li>
</select>
</li>
- <li data-role="list-divider" data-style="dialogue">DIALOGUE (WITH LINK)</li>
+ <li data-role="list-divider" data-style="dialogue">Dialogue (With link)</li>
<li class="ui-li-dialogue ui-li-text-ellipsis">
<a>1line (with link)</a>
</li>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>CHECK DIVIDER </h1>
+ <h1>Check divider</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<ul data-role="listview">
- <li data-role="list-divider" data-style="check"><form><input type="checkbox" name="c2line-check1" /></form>TEST</li>
+ <li data-role="list-divider" data-style="check"><form><input type="checkbox" name="c2line-check1" /></form>Test</li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
- <li data-role="list-divider" data-style="check"><form><input type="checkbox" name="c2line-check1" /></form>TEST DIVIDER</li>
+ <li data-role="list-divider" data-style="check"><form><input type="checkbox" name="c2line-check1" /></form>Test divider</li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
- <li data-role="list-divider" data-style="check"><form><input type="checkbox" name="c2line-check1" /></form>DIVIDER</li>
+ <li data-role="list-divider" data-style="check"><form><input type="checkbox" name="c2line-check1" /></form>Divider</li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<li><a href="#" ><form><input type="checkbox" name="c2line-check1" /></form>Normal lists</a></li>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>GROUPPED DIVIDER </h1>
+ <h1>Groupped divider</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<ul data-role="listview">
- <li data-role="list-divider" data-style="dialogue">ITEM STYLES</li>
+ <li data-role="list-divider" data-style="dialogue">Item styles</li>
<li class="ui-li-dialogue"><a href="#" >Normal lists</a></li>
<li class="ui-li-dialogue"><a href="#" >Normal lists</a></li>
<li class="ui-li-dialogue"><a href="#" >Normal lists</a></li>
- <li data-role="list-divider" data-style="dialogue">ITEM STYLES</li>
+ <li data-role="list-divider" data-style="dialogue">Item styles</li>
<li class="ui-li-dialogue"><a href="#" >Normal lists</a></li>
<li class="ui-li-dialogue"><a href="#" >Normal lists</a></li>
<li class="ui-li-dialogue"><a href="#" >Normal lists</a></li>
- <li data-role="list-divider" data-style="dialogue">ITEM STYLES</li>
+ <li data-role="list-divider" data-style="dialogue">Item styles</li>
<li class="ui-li-dialogue"><a href="#"> Normal lists</a></li>
<li class="ui-li-dialogue"><a href="#"> Normal lists</a></li>
<li class="ui-li-dialogue"><a href="#"> Normal lists</a></li>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>NORMAL DIVIDER </h1>
+ <h1>Normal divider</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<ul data-role="listview">
- <li data-role="list-divider">ITEM STYLES</li>
+ <li data-role="list-divider">Item styles</li>
<li><a href="#">Normal lists</a></li>
<li><a href="#">Normal lists</a></li>
<li><a href="#">Normal lists</a></li>
- <li data-role="list-divider">ITEM STYLES</li>
+ <li data-role="list-divider">Item styles</li>
<li><a href="#">Normal lists</a></li>
<li><a href="#">Normal lists</a></li>
<li><a href="#">Normal lists</a></li>
- <li data-role="list-divider">ITEM STYLES</li>
+ <li data-role="list-divider">Item styles</li>
<li><a href="#">Normal lists</a></li>
<li><a href="#">Normal lists</a></li>
<li><a href="#">Normal lists</a></li>
</script>
<div data-role="header" data-position="fixed">
- <h1>EXTENDABLE LIST</h1>
+ <h1>Extendable list</h1>
</div>
<div data-role="content">
<ul id = "extendable_list_main" data-role="extendablelist" data-extenditems="50" data-template="tmp-1line"></ul>
<div data-role="page" id="genlist-normal" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>NORMAL ANCHOR LISTS</h1>
+ <h1>Normal anchor lists</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<form>
<div data-role="page" id="genlist-normal" data-add-back-btn="true" data-fit-page-to-window="true">
<div data-role="header" data-position="fixed">
- <h1>NORMAL LISTS</h1>
+ <h1>Normal lists</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<form>
<div data-role="page" id="genlist-radio" data-add-back-btn="footer">
<div data-role="header" data-position="fixed">
- <h1>RADIO BUTTON LISTS</h1>
+ <h1>Radio button lists</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<form>
</script>
<div data-role="header" data-position="fixed">
- <h1>SWIPE LIST</h1>
+ <h1>Swipe list</h1>
</div>
<div class="content" data-role="content">
<ul data-role="listview">
}
</script>
<div data-role="header" data-position="fixed">
- <h1>LIST VI</h1>
+ <h1>List vi</h1>
</div>
<div class="content" data-role="content" data-scroll="y">
<div data-role="button" onclick="add()" data-inline="true">Add</div>
<div data-role="page" id="list" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>LIST</h1>
+ <h1>List</h1>
</div>
<div data-role="content">
<ul data-role="listview">
- <li data-role="list-divider">ITEM STYLES</li>
+ <li data-role="list-divider">Item styles</li>
<li><a href="list-normal_anchor.html">Normal lists add anchor</a></li>
<li><a href="list-normal_no_anchor.html">Normal lists no anchor</a></li>
- <li data-role="list-divider">DIVIDER STYLE</li>
+ <li data-role="list-divider">Divider styles</li>
<li><a href="list-divider_normal.html">Normal divider</a></li>
<li><a href="list-divider_groupped.html">Groupped divider</a></li>
<li><a href="list-divider_check.html">Check divider</a></li>
- <li data-role="list-divider">ETC...</li>
+ <li data-role="list-divider">Etc...</li>
<li><a href="list-bubble.html">bubble</a></li>
<li><a href="list-collapsible.html">collapsible list (jqm1.2)</a></li>
<li><a href="list-radio.html">Radio Button list</a></li>
<li><a href="list-swipe.html">Swipe list</a></li>
<li><a href="list-extendable.html">Extendable list</a></li>
<li><a href="list-vi.html">List vi</a></li>
- <li data-role="list-divider">VIRTUAL LIST</li>
+ <li data-role="list-divider">Virtual list</li>
<li><a href="virtuallist-normal.html">Virtual List Normal Style 1line</a></li>
<li><a href="virtuallist-normal_3_1_4.html">Virtual List Normal Style 1line-btn1</a></li>
<li><a href="virtuallist-normal_3_1_14.html">Virtual List Normal Style 1line-bigicon5</a></li>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>AUTODIVIDERS</h1>
+ <h1>Autodividers</h1>
</div><!-- /header -->
<div data-role="content">
<div data-role="page" id="virtuallist-normal_1line" class="virtuallist_demo_page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>VIRTUAL LIST - NORMAL STYLE 1LINE</h1>
+ <h1>Virtual list - Normal style 1line</h1>
</div>
<style type="text/css">
#virtuallist-normal_1line_ul li .ui-li-text-main {
<div data-role="page" id="virtuallist-normal_1line-bigicon5" class="virtuallist_demo_page"
data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>VIRTUAL LIST - NORMAL STYLE 1LINE-BIGICON5</h1>
+ <h1>Virtual list - Normal style 1lind-bigicons</h1>
</div>
<style type="text/css">
#virtuallist-normal_1line-bigicon5_ul li .ui-li-text-main {
<div data-role="page" id="virtuallist-normal_1line-btn1" class="virtuallist_demo_page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>VIRTUAL LIST - NORMAL STYLE 1LINE-BTN1</h1>
+ <h1>Virtual list - Normal style 1line-btn1</h1>
</div>
<style type="text/css">
#virtuallist-normal_1line-btn1_ul li .ui-li-text-main {
<div data-role="page" id="virtuallist-normal_2line-star1" class="virtuallist_demo_page"
data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>VIRTUAL LIST - NORMAL STYLE 2LINE-STAR1</h1>
+ <h1>Virtual list - Normal style 2line - star1</h1>
</div>
<style type="text/css">
#virtuallist-normal_2line-star1_ul > li .ui-li-text-main {
-<!DOCTYPE html>
-<html>
- <head></head>
- <body>
- <div data-role="page" id="list" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>VIRTUAL LIST</h1>
- </div>
- <div data-role="content">
- <ul data-role="listview">
- <li data-role="list-divider">Virtual List</li>
- <li><a href="virtuallist-normal.html">Virtual List Normal Style 1line</a></li>
- <li><a href="virtuallist-normal_3_1_4.html">Virtual List Normal Style 1line-btn1</a></li>
- <li><a href="virtuallist-normal_3_1_14.html">Virtual List Normal Style 1line-bigicon5</a></li>
- <li><a href="virtuallist-normal_3_2_7.html">Virtual List Normal Style 2line-star1</a></li>
- </ul>
- </div>
- <div data-role="footer">
- </div>
- </div>
- </div>
- </body>
-</html>
+<!DOCTYPE html>\r
+<html>\r
+ <head></head>\r
+ <body>\r
+ <div data-role="page" id="list" data-add-back-btn="true">\r
+ <div data-role="header" data-position="fixed">\r
+ <h1>Virtual list</h1>\r
+ </div>\r
+ <div data-role="content">\r
+ <ul data-role="listview">\r
+ <li data-role="list-divider">Virtual list</li>\r
+ <li><a href="virtuallist-normal.html">Virtual List Normal Style 1line</a></li>\r
+ <li><a href="virtuallist-normal_3_1_4.html">Virtual List Normal Style 1line-btn1</a></li>\r
+ <li><a href="virtuallist-normal_3_1_14.html">Virtual List Normal Style 1line-bigicon5</a></li>\r
+ <li><a href="virtuallist-normal_3_2_7.html">Virtual List Normal Style 2line-star1</a></li>\r
+ </ul>\r
+ </div>\r
+ <div data-role="footer">\r
+ </div>\r
+ </div>\r
+ </div>\r
+ </body>\r
+</html>\r
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>MULTIMEDIA VIEW</h1>
+ <h1>Multimedia view</h1>
</div>
<div data-role="content">
<ul data-role="listview">
- <li><a href="multimediaview_video.html">VIDEO</a></li>
- <li><a href="multimediaview_audio.html">AUDIO</a></li>
+ <li><a href="multimediaview_video.html">Video</a></li>
+ <li><a href="multimediaview_audio.html">Audio</a></li>
</ul>
</div>
<div data-role="footer">
<div data-role="content">
<div class="content-primary">
<ul data-role="listview">
- <li data-role="list-divider">Simple Naviframe Header Style</li>
+ <li data-role="list-divider">Simple naviframe header style</li>
<li><a href="naviframe_title_text.html">Title text</a></li>
- <li><a href="naviframe_title_text_2_btn.html">Title text Button 2</a></li>
- <li><a href="naviframe_title_text_1_btn.html">Title text Button 1</a></li>
- <li><a href="naviframe_title_text_src.html">Image Title text</a></li>
- <li><a href="naviframe_title_text_multiline.html">Title text Multiline</a></li>
- <li><a href="naviframe_title_text_multiline_src.html">Image Title text Multiline</a></li>
- <li><a href="naviframe_title_text_multiline_src_2_btn.html">Image Title text Multiline Button 02</a></li>
- <li data-role="list-divider">Simple Naviframe Footer Style</li>
+ <li><a href="naviframe_title_text_2_btn.html">Title text button 2</a></li>
+ <li><a href="naviframe_title_text_1_btn.html">Title text button 1</a></li>
+ <li><a href="naviframe_title_text_src.html">Image title text</a></li>
+ <li><a href="naviframe_title_text_multiline.html">Title text multiline</a></li>
+ <li><a href="naviframe_title_text_multiline_src.html">Image title text multiline</a></li>
+ <li><a href="naviframe_title_text_multiline_src_2_btn.html">Image title text multiline button 02</a></li>
+ <li data-role="list-divider">Simple naviframe footer style</li>
<li><a href="naviframe_footer_more.html">Footer more</a></li>
<li><a href="naviframe_footer_more_button.html">Footer with button</a></li>
</ul>
<div data-role="content">
<div class="content-primary">
<ul data-role="listview">
- <li data-role="list-divider">SIMPLE NAVIFRAME HEADER STYLE</li>
+ <li data-role="list-divider">Simple naviframe header style</li>
<li><a href="naviframe_title_text.html">Title text</a></li>
<li><a href="naviframe_title_text_2_btn.html">Title text Button 2</a></li>
<li><a href="naviframe_title_text_1_btn.html">Title text Button 1</a></li>
<li><a href="naviframe_title_text_multiline.html">Title text Multiline</a></li>
<li><a href="naviframe_title_text_multiline_src.html">Image Title text Multiline</a></li>
<li><a href="naviframe_title_text_multiline_src_2_btn.html">Image Title text Multiline Button 02</a></li>
- <li data-role="list-divider">SIMPLE NAVIFRAME FOOTER STYLE</li>
+ <li data-role="list-divider">Simple naviframe footer style</li>
<li><a href="naviframe_footer_more.html">Footer more</a></li>
<li><a href="naviframe_footer_more_button.html">Footer with button</a></li>
</ul>
<p>Footer more sample</p>
</div>
<div data-role="footer">
- <div data-role="button" data-inline="true" data-style="round">BUTTON1</div>
- <div data-role="button" data-inline="true" data-style="round">BUTTON2</div>
+ <div data-role="button" data-inline="true">BUTTON1</div>
+ <div data-role="button" data-inline="true">BUTTON2</div>
<a href="#pop_js" data-role="button" data-icon="naviframe-more" data-transition="slidedownfade" data-rel="popup"></a>
<div data-role="page" id="backButtonDemomain" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>BACK BUTTON CONTROL</h1>
- <span class="ui-title-text-sub">FOOTER AND BACKBUTTON DEMOPAGE</span>
+ <h1>Back button control</h1>
+ <span class="ui-title-text-sub">Footer and backbutton demopage</span>
</div>
<div data-role="content">
<ul data-role="listview" data-icon="1line-textonly">
<div data-role="page" data-add-back-btn="header">
<div data-role="header" data-position="fixed">
- <h1>BACK BUTTON DEMO</h1>
- <span class="ui-title-text-sub">BACK BUTTON TO HEADER</span>
+ <h1>Back button demo</h1>
+ <span class="ui-title-text-sub">Back button to header</span>
</div>
<div data-role="content">
<div data-role="page" data-add-Back-Btn="true">
<div data-role="header" data-position="fixed">
- <h1>BACK BUTTON DEMO</h1>
- <span class="ui-title-text-sub">NORMAL FOOTER WITH BACK BUTTON</span>
+ <h1>Back button demo</h1>
+ <span class="ui-title-text-sub">Normal footer with back button</span>
</div>
<div data-role="content">
<div data-role="page" id="pageGenBackToFooter">
<div data-role="header" data-position="fixed" >
- <h1>BACK BUTTON DEMO</h1>
- <span class="ui-title-text-sub">BACK BUTTON TO FOOTER</span>
+ <h1>Back button demo</h1>
+ <span class="ui-title-text-sub">Back button to footer</span>
</div>
<div data-role="content">
<div data-role="page" id="pageGenBackToHeader">
<div data-role="header" data-position="fixed" >
- <h1>BACK BUTTON DEMO</h1>
- <span class="ui-title-text-sub">BACK BUTTON TO HEADER</span>
+ <h1>Back button demo</h1>
+ <span class="ui-title-text-sub">Back button to header</span>
</div>
<div data-role="content">
<div data-role="page">
<div data-role="header" data-position="fixed" >
- <h1>NO BACK BUTTON</h1>
+ <h1>No back button</h1>
</div>
<div data-role="content">
<div data-role="page">
<div data-role="header" data-position="fixed" >
- <h1>NO FOOTER PAGE</h1>
+ <h1>No footer page</h1>
</div>
<div data-role="content">
<div data-role="page" id="popupwindow-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>POPUP</h1>
+ <h1>Popup</h1>
</div>
<div class="content" data-role="content">
<ul data-role="listview" data-icon="1line-textonly">
- <li data-role="list-divider">NORMAL SAMPLES</li>
+ <li data-role="list-divider">Normal samples</li>
<li><a href="#center_info" data-inline="true" data-rel="popup" data-position-to="window">Center info popup</a></li>
<li><a href="#center_title" data-inline="true" data-rel="popup" data-position-to="window">Center title popup</a></li>
<li><a href="#center_basic_1btn" data-inline="true" data-rel="popup" data-position-to="window">Center basic 1 button popup</a></li>
data-framework-viewport-width="device-width">
</script>
<script src="../main.js"></script>
- <title>Tizen UI - Checkbox</title>
+ <title>Tizen UI - Progress</title>
<!-- for compatibility test -->
<meta name="apple-mobile-web-app-capable" content="yes" />
});
</script>
<div data-role="header" data-position="fixed">
- <h1>PROGRESS</h1>
+ <h1>Progress</h1>
</div>
<div data-role="content">
<div style="width:100px;height:100px">
data-framework-viewport-width="device-width">
</script>
<script src="../main.js"></script>
- <title>Tizen UI - Checkbox</title>
+ <title>Tizen UI - Progressbar</title>
<!-- for compatibility test -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<body>
<div data-role="page" id="progressbar-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>PROGRESS BAR</h1>
+ <h1>Progress bar</h1>
</div>
<div data-role="content">
<ul data-role="listview">
- <li data-role="list-divider">PROGRESS BAR</li>
+ <li data-role="list-divider">Progress bar</li>
<li>When you click progress bar, it starts updating values...</li>
<li id="progressbarTest" ><div data-role="progressbar" id="progressbar"></div></li>
- <li data-role="list-divider">PROGESS PENDING</li>
+ <li data-role="list-divider">Progress pending</li>
<li id="pendingTest" ><div data-role="progress" data-style="pending" id="pending"></div></li>
- <li data-role="list-divider">PROGRESS ~ING</li>
+ <li data-role="list-divider">Progress ~ing</li>
<li id="progressingTest" >
<div data-role="progress" data-style="circle" id="progressing" style="right:10px"></div>
Loading..
<div id="radio-demo" data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>RADIO</h1>
+ <h1>Radio</h1>
</div>
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SCROLL JUMP</h1>
+ <h1>Scroll jump</h1>
</div>
<div data-role="content" data-scroll-jump="true">
<ul data-role="listview">
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SCROLLVIEW</h1>
+ <h1>Scrollview</h1>
</div>
<div data-role="content">
- <p>Horizontal Scroll #1: inline block</p>
+ <p>Horizontal scroll #1: inline block</p>
<div style="white-space:nowrap;" data-scroll="x">
<div class="ui-scrollview-view" style="display:inline-block">
<img src="./test/01.jpg" height="70px">
<img src="./test/11.jpg" height="70px">
</div>
</div>
- <p>Horizontal Scroll #2: set the width of view</p>
+ <p>Horizontal scroll #2: set the width of view</p>
<div data-scroll="x" style="width:250px; white-space:nowrap;">
<div class="ui-scrollview-view" style="width:1200px;">
<img src="./test/01.jpg" height="70px">
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SCROLLVIEW</h1>
+ <h1>Scrollview</h1>
</div>
<div data-role="content" data-scroll="none">
<p>XY Scroll</p>
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SCROLLVIEW</h1>
+ <h1>Scrollview</h1>
</div>
<div data-role="content">
- <p>Vertical Scroll</p>
+ <p>Vertical scroll</p>
<div style="height:300px;border-style:dotted;border-width:1px" data-scroll="y" align="center">
<img src="./test/01.jpg" width="95%">
<img src="./test/02.jpg" width="95%">
<body>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position ="fixed" >
- <h1> LIST SEARCH FILTER BAR</h1>
+ <h1> List search filter bar</h1>
</div><!-- /header -->
<div data-role="content">
<body>
<div data-role="page" data-add-back-btn="true" id="searchbar-demo-page-button">
<div data-role="header" data-position ="fixed" >
- <h1>SEARCHBAR</h1>
+ <h1>Searchbar</h1>
<input type="search" data-icon="call" name="search" id="searchbar-demo-page-button-search" value="" />
</div><!-- /header -->
<div data-role="content" id="searchbar-content">
<body>
<div data-role="page" data-add-back-btn="true" id="searchbar-demo-page-cancel">
<div data-role="header" data-position ="fixed" >
- <h1>SEARCHBAR</h1>
+ <h1>Searchbar</h1>
<input type="search" data-cancel-btn=true name="search" id="searchbar-demo-page-cancel-search" value="" />
</div><!-- /header -->
<body>
<div data-role="page" data-add-back-btn="true" id="searchbar-demo-page-normal">
<div data-role="header" data-position ="fixed" >
- <h1>SEARCHBAR</h1>
+ <h1>Searchbar</h1>
<input type="search" name="search" id="searchbar-demo-page-normal-search" value="" />
</div><!-- /header -->
<div data-role="content" id="searchbar-content">
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SEGMENT CONTROL</h1>
+ <h1>Segment control</h1>
</div><!-- /header -->
<div data-role="content">
<body>
<div data-role="page" id="slider-demo" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SLIDER</h1>
+ <h1>Slider</h1>
</div>
<div data-role="content">
<ul data-role="listview">
- <li data-role="list-divider">NORMAL SLIDER</li>
+ <li data-role="list-divider">Normal slider</li>
<li><input id="mySlider1" name="mySlider1" data-popup='false' type="range" value="5" min="0" max="10" /></li>
- <li data-role="list-divider">POPUP SLIDER</li>
+ <li data-role="list-divider">Popup slider</li>
<li><input id="mySlider2" name="mySlider2" type="range" value="50" min="0" max="100" /></li>
- <li data-role="list-divider">ICON SLIDER</li>
+ <li data-role="list-divider">Icon slider</li>
<li><input id="mySlider3" name="mySlider3" data-popup='false' type="range" value="5" min="0" max="10" data-icon='bright'/></li>
<li><input id="mySlider4" name="mySlider4" data-popup='false' type="range" value="5" min="0" max="10" data-icon='volume'/></li>
- <li data-role="list-divider">TEXT SLIDER</li>
+ <li data-role="list-divider">Text slider</li>
<li><input id="mySlider5" name="mySlider5" data-popup='false' type="range" value="50" min="0" max="99" data-icon='text' data-text-left='0' data-text-right='99'/></li>
<li><input id="mySlider6" name="mySlider6" data-popup='false' type="range" value="5" min="0" max="10" data-icon='text' data-text-left='Min' data-text-right='Max'/></li>
<li data-role="list-divider">data-highlight="false"</li>
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true" class="noti-demo">
<div data-role="notification" id="notification" data-type="popup" data-interval="3000">
- <p>Notification Demo</p>
+ <p>Notification demo</p>
</div>
<div data-role="header" data-position="fixed">
- <h1>NOTIFICATION</h1>
+ <h1>Notification</h1>
</div>
<div data-role="content">
- <div data-role="button" id="noti-demo">Show Smallpopup</div>
+ <div data-role="button" id="noti-demo">Show small popup</div>
</div><!-- /content -->
<div data-role="footer">
</div>
<p>Notification Demo</p>
</div>
<div data-role="header" data-position="fixed">
- <h1>NOTIFICATION</h1>
+ <h1>Notification</h1>
</div>
<div data-role="content">
- <div data-role="button" id="noti-demo">Show Smallpopup</div>
+ <div data-role="button" id="noti-demo">Show small popup</div>
</div><!-- /content -->
<div data-role="footer">
</div>
<!DOCTYPE html>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>SPLITVIEW</h1>
+ <h1>Splitview</h1>
</div>
<div data-role="content">
<div data-role="splitview" data-divider-vertical="true" data-fixed="false" data-ratio="0.5, 0.5">
<div data-role="page" id="switch-demo" data-add-back-btn="true">
<div data-role="header">
- <h1>TOGGLE SWITCH</h1>
+ <h1>Toggle switch</h1>
</div>
<div class="content" data-role="content">
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR</h1>
+ <h1>Tabbar</h1>
</div>
<div data-role="content">
<div class="content-primary">
<ul data-role="listview">
- <li data-role="list-divider">HEADER</li>
+ <li data-role="list-divider">Header</li>
<li><a href="tabbar_text.html">Tab(text) only</a></li>
<li><a href="tabbar_icon_text.html">Tab(icon + text) only</a></li>
<li><a href="tabbar_icon.html">Tab(icon) only</a></li>
<li><a href="tabbar_title_icon.html">Title Tab(icon) only</a></li>
<li><a href="tabbar_scrolling.html">Scrolling interation</a></li>
- <li data-role="list-divider">FOOTER</li>
+ <li data-role="list-divider">Footer</li>
<li><a href="tabbar_footer_icon.html">Footer + Tab(icon)</a></li>
<li><a href="tabbar_footer.html">Footer + Tab(text)</a></li>
<li><a href="tabbar_footer_more.html">Footer + more + Tab(text)</a></li>
<body>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR TEXT WITH TITLE</h1>
+ <h1>Tabbar text with title</h1>
</div>
<div data-role="content">
<div data-role="footer">
<div data-role="tabbar">
<ul>
- <li><a href="#"class="ui-btn-active">MENU</a></li>
- <li><a href="#">SAVE</a></li>
- <li><a href="#">SHARE</a></li>
+ <li><a href="#"class="ui-btn-active">Menu</a></li>
+ <li><a href="#">Save</a></li>
+ <li><a href="#">Share</a></li>
</ul>
</div>
</div>
<body>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR ICON WITH TITLE</h1>
+ <h1>Tabbar icon with title</h1>
</div>
<div data-role="content">
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR TEXT WITH TITLE</h1>
+ <h1>Tabbar text with title</h1>
</div>
<div data-role="content">
</div>
<div data-role="tabbar">
<ul>
- <li><a href="#"class="ui-btn-active">MENU</a></li>
- <li><a href="#">SAVE</a></li>
- <li><a href="#">SHARE</a></li>
+ <li><a href="#"class="ui-btn-active">Menu</a></li>
+ <li><a href="#">Save</a></li>
+ <li><a href="#">Share</a></li>
</ul>
</div>
</div>
<body>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR TEXT WITH TITLE</h1>
+ <h1>Tabbar text with title</h1>
</div>
<div data-role="content">
<div data-role="footer">
<div data-role="controlgroup" data-type="horizontal">
- <a href="#" data-role="button">YES</a>
- <a href="#" data-role="button">NO</a>
- <a href="#" data-role="button">MAYBE</a>
+ <a href="#" data-role="button">Yes</a>
+ <a href="#" data-role="button">No</a>
+ <a href="#" data-role="button">Maybe</a>
</div>
</div>
</div>
<body>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR TEXT WITH TITLE</h1>
+ <h1>Tabbar text with title</h1>
</div>
<div data-role="content">
</ul>
</div>
<div data-role="controlgroup" data-type="horizontal">
- <a href="#" data-role="button">BACK</a>
- <a href="#" data-role="button">NEXT</a>
+ <a href="#" data-role="button">Back</a>
+ <a href="#" data-role="button">Next</a>
</div>
</div>
</div>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR SCROLL</h1>
+ <h1>Tabbar scroll</h1>
<div style="white-space:nowrap;" data-scroll="x">
<div class="ui-scrollview-view" style="display:inline-block">
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR ICON WITH TITLE</h1>
+ <h1>Tabbar icon with title</h1>
<div data-role="tabbar">
<ul>
<li><a href="#" data-icon="naviframe-delete" class="ui-btn-active"></a></li>
<div data-role="page" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
- <h1>TABBAR TEXT WITH TITLE</h1>
+ <h1>Tabbar text with title</h1>
<div data-role="tabbar">
<ul>
<li><a href="#"class="ui-btn-active">Menu</a></li>
<p>Jobs</p>
</div>
<div data-role="header" data-position="fixed">
- <h1>NOTIFICATION</h1>
+ <h1>Notification</h1>
</div>
<div data-role="content">
<div data-role="button" id="noti-demo">Show TickerNoti</div><br>
<body>
<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>
+ <h1>Token text area</h1>
</div>
<div data-role="content">
<div data-role="tokentextarea" data-link="addressbook.html"></div>