## Project setting
DEBUG ?= yes
PROJECT_NAME = tizen-web-ui-fw
-VERSION = 0.1
+VERSION = 0.2
VERSION_COMPAT =
PKG_VERSION = $(shell cat packaging/web-ui-fw.spec | grep Version: | sed -e "s@Version:\s*@@" )
THEME_NAME = default
endif
-all: libs_prepare third_party widgets libs_cleanup loader themes version_compat compress
+all: libs_prepare third_party widgets libs_cleanup loader themes version version_compat compress
libs_prepare:
# Prepare libs/ build...
loader: widgets globalize
cat 'src/loader/loader.js' >> ${FW_JS}
- echo '(function($$){$$.tizen.frameworkData.pkgVersion="$(PKG_VERSION)";}(jQuery));' >> ${FW_JS}
globalize: widgets
themes:
make -C src/themes || exit $?
+version: loader themes
+ echo '(function($$){$$.tizen.frameworkData.pkgVersion="$(PKG_VERSION)";}(jQuery));' >> ${FW_JS}
+ echo "$(PKG_VERSION)" > ${FRAMEWORK_ROOT}/../VERSION
compress: widgets loader themes
# Javacript code compressing
<li data-role="list-divider">Controls</li>
<li><a href="widgets/button/button.html">Button</a></li>
<li><a href="widgets/checkbox/checkbox.html">Check</a></li>
- <li><a href="widgets/switch/switch.html">Switch</a></li>
+ <li><a href="widgets/switch/toggleswitch.html">ToggleSwitch</a></li>
<li><a href="widgets/radio/radio.html">Radio</a></li>
<li><a href="widgets/searchbar/searchbar.html">Searchbar</a></li>
<li><a href="widgets/entry.html">Entry</a></li>
<li><a href="widgets/gallery.html">Gallery</a></li>
<li><a href="widgets/segmentctrl.html">Segment Control</a></li>
<li><a href="widgets/buttonGrouping.html">Group Control(new segment)</a></li>
- <li><a href="widgets/day-selector.html" >Day Selector</a></li>
<li><a href="widgets/selectioninfo.html">SelectionInfo</a></li>
- <li><a href="widgets/pagecontrol/pagecontrol.html">PageControl</a></li>
<li><a href="#tokentextarea">Token Text Area</a></li>
<li data-role="list-divider">PageLayout</li>
<li><a href="widgets/small-popup.html">Small Popup</a></li>
<li><a href="widgets/small-popup-interval.html">Small Popup Interval</a></li>
- <li data-role="list-divider">No Contents</li>
- <li><a href="#no-contents-0">No Contents - Text</a></li>
- <li><a href="#no-contents-1">No Contents - Picture</a></li>
- <li><a href="#no-contents-2">No Contents - Multimedia</a></li>
- <li><a href="#no-contents-3">No Contents - Unnamed</a></li>
-
<li data-role="list-divider">Grid view</li>
<li><a href="widgets/grid/virtualgrid.html">Virtual Grid</a></li>
<li><a href="widgets/grid/virtualgrid-rotation.html">Virtual Grid - Rotation</a></li>
<li><a href="widgets/grid/virtualgrid-list.html">Virtual Grid - List</a></li>
<li><a href="widgets/grid/virtualgrid-x.html">Virtual Grid - X</a></li>
+ <li><a href="widgets/grid/virtualgrid-size.html">Virtual Grid - Size</a></li>
<li data-role="list-divider">Multimedia view</li>
<li><a href="widgets/multimediaview/multimediaview.html">Multimedia view</a></li>
<li><a href="tips/custom-globalize-culture/custom-globalize-culture.html">Using custom Globalize culture files</a></li>
<li><a href="tips/two-line-text/two-line-text.html">2 line text</a></li>
<li><a href="tips/list-sample/list-sample.html">Example for using listview</a></li>
- <li><a href="tips/list-sample/expandable.html">Example for using expandable list</a></li>
<li><a href="tips/page-transition/transition.html">Page transitions</a></li>
</div>
</div> <!--/page -->
- <!-- nocontents -->
- <div data-role="page" id="no-contents-0" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents0" data-type="text">
- <p>Text Type</p>
- <p>Text</p>
- </div>
- </div> <!-- /content -->
- </div> <!-- /page -->
-
- <div data-role="page" id="no-contents-1" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents1" data-type="picture">
- <p>Picture Type</p>
- <p>Text</p>
- </div>
- </div> <!-- /content -->
- </div> <!-- /page -->
-
- <div data-role="page" id="no-contents-2" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents2" data-type="multimedia">
- <p>Multimedia Type</p>
- <p>Text</p>
- </div>
- </div> <!-- /content -->
- </div> <!-- /page -->
-
- <div data-role="page" id="no-contents-3" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents3">
- <p>Unnamed Type</p>
- </div>
- </div> <!-- /content -->
- </div> <!-- /page -->
-
-
<script src="widgets/checkbox/checkbox.js"></script>
- <script src="widgets/switch/switch.js"></script>
<script src="widgets/radio/radio.js"></script>
<script src="widgets/progressbar.js"></script>
<script src="widgets/ctxpopup.js"></script>
<script src="tips/generate-elements-dynamically.js"></script>
<script src="tips/two-line-text/two-line-text.js"></script>
<script src="tips/list-sample/list-sample.js"></script>
- <script src="tips/list-sample/expandable.js"></script>
- <script src="widgets/pagecontrol/pagecontrol-demo.js"></script>
<script src="widgets/tokentextarea-demo.js"></script>
<script src="widgets/pagelayout/barcontrol.js"></script>
<script src="widgets/pagelayout/backbutton-control.js"></script>
+ <script src="widgets/list/list-edit.js"></script>
<!-- test file for content div control, not completed yet -->
<script src="widgets/pagelayout/ctrl-test.js"></script>
+
</body>
</html>
console.log('option header was expanded');
});
- //day-selector codes...
- $("#day-selector-check-all").live('vclick', function () {
- $("#dayselector1").dayselector('selectAll');
- });
-
- $("#day-selector-get-days").live('vclick', function () {
- var valuesStr = $("#dayselector1").dayselector('value').join(', ');
- $(".selectedDay").text( valuesStr );
- });
-
/* Gen list : Dummy DB load */
$(".virtuallist_demo_page").live("pagecreate", function () {
/* ?_=ts code for no cache mechanism */
+++ /dev/null
-<div data-role="page">
- <div data-role="header" data-position="fixed">
- <h1>Single-Page Application </h1>
- </div><!-- /header -->
-
- <div data-role="content">
- <ul data-role="listview" id="mylist">
- </ul>
- </div><!-- /content -->
-
- <div data-role="footer" data-position="fixed">
- </div><!-- /footer -->
-</div><!-- /page -->
+++ /dev/null
-$( document ).bind( "pagebeforeshow", function () {
- var id = 0,
- add_ex = function () {
- var li = '<li class="ui-li-1line ui-li-dialogue" data-expandable="true" id="exp1" data-initial-expansion="true">exp1 parent</li>' +
- '<li class="ui-li-1line ui-li-dialogue" data-expanded-by="exp1">exp1-sub 1</li>' +
- '<li class="ui-li-1line ui-li-dialogue" data-expanded-by="exp1">exp1-sub 2</li>';
-
- $("#mylist").append( li ).trigger("create");
- },
- add_item = function () {
- var li = '<li class="ui-li-1line ui-li-dialogue" data-expanded-by="exp1">exp1-sub 3</li>';
-
- $("#mylist").append( li ).trigger("create");
- };
-
- add_ex();
- $("#mylist").listview("refresh");
-
- add_item();
- $("#mylist").listview("refresh");
- $("#exp1").expandablelist("refresh");
-});
<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 - data-style will be deprecated. please check!!!</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="send" 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="call" data-style="circle"></div></li>
- <li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="favorite" data-style="nobg"></div></li>
+ <li class="ui-li-1line-btn2">List item<div data-role="button" data-inline="true" data-icon="star" data-style="nobg"></div></li>
<li data-role="list-divider">custom buttons</li>
<li><a href="buttonNolist.html">Buttons Pages(not in list) </a></li>
</ul>
<!-- target button -->
<a href="#pop_buttons" id="btn_buttons" data-role="button" data-inline="true" data-rel="popup">Buttons</a>
<!-- context popup -->
-<div id="pop_buttons" class="button" data-role="popup" >
- <div>
- <table>
- <tr>
- <td>
- <a href="#" data-role="button">Meenie</a>
- </td>
- <td>
- <a href="#" data-role="button">Mynie</a>
- </td>
- <td>
- <a href="#" data-role="button">Mo</a>
- </td>
- </tr>
- <tr>
- <td>
- <a href="#" data-role="button">Catch-a</a>
- </td>
- <td>
- <a href="#" data-role="button">Tiger</a>
- </td>
- <td>
- <a href="#" data-role="button">By-the</a>
- </td>
- </tr>
- </table>
- </div>
+<div id="pop_buttons" data-role="popup" >
+ <ul data-role="listview">
+ <li><a href="#">Meenie</a></li>
+ <li><a href="#">Mynie</a></li>
+ <li><a href="#">Mo</a></li>
+ </ul>
</div>
-
<br>
<br>
- <a href="#pop_text_only" id="btn_text_only" data-role="button" data-transition="flip" data-inline="true" data-rel="popup">Animation</a>
+
+<a href="#pop_text_only" id="btn_text_only" data-role="button" data-transition="flip" data-inline="true" data-rel="popup">Animation</a>
<div id="pop_text_only" data-role="popup" >
<ul data-role="listview">
</li>
</ul>
</div>
+<br>
+<br>
+<a onclick="popupTest()" id="btn_text_only" data-role="button" data-transition="flip" data-inline="true" data-rel="popup">MethodOpen</a>
+<br>
+<br>
+<a href="#closeTest" id="close_btn_buttons" data-role="button" data-inline="true" data-rel="popup">CloseTest</a>
+<div id="closeTest" data-role="popup" >
+ <ul data-role="listview">
+ <li><a data-rel="back" href="#">Close</a></li>
+ <li><a data-rel="back" onclick="closeTest()" href="#">Close/javascript</a></li>
+ </ul>
+ </div>
+<br>
+<br>
+</div>
+</div> <!-- /content -->
- </div>
- </div> <!-- /content -->
-
-</div> <!-- /page -->
+<div data-role="footer">
+ <a href="#slideView_pop" data-role="button" data-transition="slideup" data-icon="naviframe-more" data-rel="popup"></a>
+ <div id="slideView_pop" data-role="popup" data-show-arrow="true">
+ <ul data-role="listview" style="width:400px">
+ <li ><a id="manageFeedsViewBtn">4Manage feeds</a></li>
+ <li><a href="#settingView" id="viewbyBtn">Settings</a></li>
+ </ul>
+ </div>
+</div>
+</div> <!-- /page -->
\ No newline at end of file
$("#pop_js").live("vclick", function ( e ) {
if ( $(e.target).is(".ui-btn-ctxpopup-close") ) {
- $(this).popupwindow("close");
+ $(this).popup("close");
}
if ( $(e.target).is("#ctxpopup_update") ) {
$("#btn_js").text("Peekaboo!");
$("#btn_js").buttonMarkup("refresh");
}
});
+
+var closeTest = function()
+{
+ alert('test');
+}
+var popupTest = function()
+{
+ $("#pop_text_only").popup("open");
+ return false;
+};
\ No newline at end of file
+++ /dev/null
-<div data-role="page" id="day-selector-demo" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>Day selector</h1>
- </div>
-
-<div data-role="content">
- <h2>With a legend (also API demo)</h2>
- <fieldset id="dayselector1" data-role="dayselector" data-type="horizontal">
- <legend>Choose some days</legend>
- </fieldset>
-
- <div><a id="day-selector-check-all" data-role="button" data-inline="true">Check all</a></div>
- <div><a id="day-selector-get-days" data-role="button" data-inline="true">Get Days</a></div>
- <p>The day(s) you selected are:
- <span class="selectedDay">
- <em>(select a day first)</em>
- </span>
- </p>
- <hr/>
-
- <h2>With a legend, with custom swatch</h2>
- <fieldset id="dayselector1" data-role="dayselector" data-theme="a">
- <legend>Choose some days</legend>
- </fieldset>
- <hr/>
-
- <h2>Without a legend</h2>
- <fieldset data-role="dayselector">
- </fieldset>
- <hr/>
-
- <h2>Without a legend, vertical layout</h2>
-
- <p>Note that the checkboxes are visible as icons
- (this is the default behaviour for vertical checkbox
- controlgroups in jQuery Mobile).</p>
-
- <fieldset data-role="dayselector" data-type="vertical">
- </fieldset>
-
- <hr/>
-
- <h2>With a legend, vertical layout</h2>
-
- <fieldset data-role="dayselector" data-type="vertical">
- <legend>Choose some days</legend>
- </fieldset>
-
- </div>
-</div> <!-- /page -->
-
-
-
<div id="virtualgrid_grid_page" data-role="page" class="virtualgrid_test_demo_page">\r
<div data-role="header" data-position="fixed">\r
- <h1>Virtual Grid - Auto</h1>\r
+ <h1>Virtual Grid - Size</h1>\r
</div>\r
<div data-role="content" data-scroll="none">\r
<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">\r
</div>\r
</div>\r
</script>\r
- <div id="virtualgrid-demo" data-role="virtualgrid" data-direction="y" data-rotation="false" data-template="tizen-demo-namecard">\r
+ <div id="virtualgrid-demo" data-role="virtualgrid" data-direction="y" data-rotation="false" data-template="tizen-demo-namecard" style="width:400px; height:400px;">\r
</div>\r
</div>\r
<script>\r
</div>\r
</div>\r
</script>\r
- <div id="virtualgrid-demo" data-itemcount="auto" data-role="virtualgrid" data-template="tizen-demo-namecard">\r
+ <div id="virtualgrid-demo" data-direction="x" data-role="virtualgrid" data-template="tizen-demo-namecard">\r
</div>\r
</div>\r
<script>\r
--- /dev/null
+<div data-role="page" id="genlist-dialog-edit">
+ <div data-role="header" data-position="fixed">
+ <h1>Dialogue lists - 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 class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">Name </div>
+ <input placeholder="Input your name" />
+ </li>
+ <li class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">Tel.</div>
+ <input placeholder="Input your tel number" type="number" />
+ </li>
+ <li class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">Address </div>
+ <input placeholder="Input your address" />
+ </li>
+ <li class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">City </div>
+ <input placeholder="Input your city" />
+ </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 class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">Tel.</div>
+ <input placeholder="Input your tel number" type="number" />
+ <div data-role="button" data-style="edit">Delete</div>
+ </li>
+ <li class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">Address </div>
+ <input placeholder="Input your address" />
+ <div data-role="button" data-style="edit">Delete</div>
+ </li>
+ <li class="ui-li-dialogue ui-li-dialogue-edit">
+ <div class="ui-edit-title">City </div>
+ <input placeholder="Input your city" />
+ <div data-role="button" data-style="edit">Delete</div>
+ </li>
+ </ul>
+ </div>
+</div>
+
</li>
<li class="ui-li-dialogue">
1line-toggle
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-dialogue">
1line-bigicon1
<li class="ui-li-dialogue">
1line-bigicon6
<img src="thumbnail.jpg" class="ui-li-bigicon">
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-has-checkbox ui-li-dialogue">
<form><input type="checkbox" data-style="check" name="c1line-check1" /></form>
<li class="ui-li-2line-toggle-setting ui-li-dialogue">
<span class="ui-li-text-main">2line-toggle-setting</span>
<span class="ui-li-text-sub">Subtext</span>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-2line-btn-setting ui-li-dialogue">
--- /dev/null
+var ContactName = "";
+
+$("#genlist-dialog-edit .ui-li-dialogue-edit .ui-btn").live("vclick", function ( e ) {
+ $(e.target).parents(".ui-btn").siblings("input").val("");
+});
+
+$(document).bind("pagebeforechange", function ( event , data ) {
+ if ( $(event.target).children().is("#genlist-dialog-edit") ) {
+ ContactName = $("#genlist-dialog-edit input").eq(4).val();
+ }
+});
+
+$(document).bind("pagebeforeshow", function ( event , data ) {
+ if ( $(event.target).attr("id") == "genlist-dialog-edit" ) {
+ $("#genlist-dialog-edit input").eq(4).val(ContactName);
+ }
+});
\ No newline at end of file
+++ /dev/null
-<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>
- </div>
- <div class="content" data-role="content" data-scroll="y">
- <ul data-role="listview">
- <li>
- 1line-sub
- <span class="ui-li-text-sub">subtext</span>
- </li>
-
- <li>
- <input name="tesst" id="test" placeholder="Edit field" value="" />
- </li>
-
- <li>
- 1line-btn1
- <div data-role="button" data-inline="true">Text Button</div>
- </li>
- </ul>
- </div>
-</div>
+++ /dev/null
-<div data-role="page" id="genlist-expandable" data-add-back-btn="true">
- <div data-role="header" data-position="fixed">
- <h1>expandable list</h1>
- </div>
- <div data-role="content">
- <ul data-role="listview">
- <li class="ui-li-dialogue" data-expandable="true" id="exp1" data-initial-expansion="true">1line</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 1</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 2</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 3</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 4</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 5</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 6</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1">exp1-sub 7</li>
- <li class="ui-li-dialogue" data-expanded-by="exp1" data-expandable="true" id="exp2">exp1-sub 2 (exp2)</li>
- <li class="ui-li-dialogue" data-expanded-by="exp2">exp2-sub 1</li>
- <li class="ui-li-dialogue" data-expanded-by="exp2">exp2-sub 2</li>
- <li class="ui-li-dialogue" data-expanded-by="exp2">exp2-sub 3</li>
- <li class="ui-li-dialogue" data-expandable="true" id="exp3">
- <span class="ui-li-text-main">2line</span>
- <span class="ui-li-text-sub">Subtext</span>
- </li>
- <li class="ui-li-dialogue" data-expandable="true" id="exp4">
- <span class="ui-li-text-main">2line-sub-main</span>
- <span class="ui-li-text-sub">Subtext</span>
- </li>
- <li class="ui-li-has-radio ui-li-dialogue" data-expandable="true" id="exp5">
- <span class="ui-li-text-main">2line-radio1</span>
- <span class="ui-li-text-sub">Subtext</span>
- <form><input type="radio" /></form>
- </li>
- <li class="ui-li-dialogue" data-expandable="true" id="exp6">
- <span class="ui-li-color-bar" style="background-color:rgba(72, 136, 42, 1);"></span>
- <span class="ui-li-text-main">2line-colorbar3</span>
- <span class="ui-li-text-sub">Subtext</span>
-<!-- <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div> -->
- <img src="thumbnail.jpg" class="ui-li-bigicon">
- </li>
- </ul>
- </div>
- <div data-role="footer">
- </div>
-</div>
<li>
<a href="#">
1line-toggle
- <div data-role="toggleswitch" data-icon="true"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</a>
</li>
<a href="#">
<img src="thumbnail.jpg" class="ui-li-bigicon">
1line-bigicon6
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</a>
</li>
<a href="#">
2line-toggle-setting
<span class="ui-li-text-sub">Subtext</span>
- <div data-role="toggleswitch" data-icon="true"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</a>
</li>
<li>
<a href="#">
<h3>1line-toggle</h3>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</a>
</li>
<a href="#">
<img src="thumbnail.jpg" class="ui-li-bigicon">
<h3>1line-bigicon6</h3>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</a>
</li>
<a href="#">
<h3>2line-toggle-setting</h3>
<span class="ui-li-text-sub">Subtext</span>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</a>
</li>
<li>
1line-toggle
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li>
<li>
<img src="thumbnail.jpg" class="ui-li-bigicon">
1line-bigicon6
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-has-checkbox">
<li class="ui-li-has-multiline">
2line-toggle-setting
<span class="ui-li-text-sub">Subtext</span>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-has-multiline">
<li>
<h3>1line-toggle</h3>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li>
<li>
<img src="thumbnail.jpg" class="ui-li-bigicon">
<h3>1line-bigicon6</h3>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-has-checkbox">
<li class="ui-li-has-multiline">
<h3>2line-toggle-setting</h3>
<span class="ui-li-text-sub">Subtext</span>
- <div data-role="toggleswitch"/></div>
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
</li>
<li class="ui-li-has-multiline">
<div data-role="content">
<ul data-role="listview">
<li data-role="list-divider">Item styles</li>
-<!-- <li><a href="list-normal.html">Normal lists</a></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><a href="list-normal_anchor_h3.html">Normal lists add anchor h3</a></li>
<li><a href="list-divider_check.html">Check divider</a></li>
<li data-role="list-divider">Etc...</li>
- <li><a href="list-edit_field.html">Edit field</a></li>
<li><a href="list-bubble.html">bubble</a></li>
- <li><a href="list-expandable.html">expandable list</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-dialogue.html">Dialogue list</a></li>
+ <li><a href="list-dialogue-edit.html">Dialogue list ( Edit mode )</a></li>
<li><a href="list-email.html">Email list</a></li>
<li><a href="list-swipe.html">Swipe list</a></li>
<li><a href="list-extendable.html">Extendable list</a></li>
+++ /dev/null
-/**
- * Pagecontrol sample code
- * by Youmin Ha <youmin.ha@samsung.com>
- */
-
-(function($) {
-
-// Example: Set value change callback
-$('#pagecontrol').live('pageshow', function() {
- var i = 1;
- for(i=1; i<=10; i++) {
- $('#p'+i).bind("change", function(event, value) {
- var log = 'Changed value to ' + value;
- $("#txt").html(log);
- });
- }
-});
-
-
-// Example: Set value by random
-$('#pagecontrol_btn_randomset').live('vclick',
- function() {
- var i;
- for(i=1; i<=10; i++) {
- $('#p'+i).trigger('change',
- Math.floor(Math.random() * i + 1));
- }
-});
-
-})($);
-
+++ /dev/null
-<div data-role="page" id="pagecontrol" data-add-back-btn="true" data-fit-page-to-window="true">
- <div data-role="header">
- <h1>Pagecontrol (page indicator)</h1>
- </div>
- <div class="content" data-role="content">
- <div id="p10" data-role="pagecontrol" data-max="10" data-value="10"></div>
- <div id="p9" data-role="pagecontrol" data-max="9" data-value="9"></div>
- <div id="p8" data-role="pagecontrol" data-max="8" data-value="8"></div>
- <div id="p7" data-role="pagecontrol" data-max="7" data-value="7"></div>
- <div id="p6" data-role="pagecontrol" data-max="6" data-value="6"></div>
- <div id="p5" data-role="pagecontrol" data-max="5" data-value="5"></div>
- <div id="p4" data-role="pagecontrol" data-max="4" data-value="4"></div>
- <div id="p3" data-role="pagecontrol" data-max="3" data-value="3"></div>
- <div id="p2" data-role="pagecontrol" data-max="2" data-value="2"></div>
- <div id="p1" data-role="pagecontrol" data-max="1"></div>
-
- <div id="txt">here</div>
- <a href="#" id="pagecontrol_btn_randomset" data-role="button" data-inline="true">Set each values randomly</a>
- </div>
-</div>
</div>
<div data-role="content">
<ul data-role="listview" data-icon="1line-textonly">
- <li><a href="backbutton/backbutton-normal.html">1. Generate Normal footer</a></li>
- <li><a href="backbutton/backbutton-normal2.html">2. Defined Normal footer</a></li>
- <li><a href="backbutton/backbutton-normal3.html">3. Define backButton in page</a></li>
- <li><a href="backbutton/no-footer.html">4. No footer in page</a></li>
- <li><a href="backbutton/no-back-button.html">5. No back button in page</a></li>
- <li><a href="backbutton/back-button-to-header.html">6. Back button to Header</a></li>
- <li><a href="backbutton/dynamically-attatch-backbutton-to-footer.html">7. Dynamically attatch backbutton to footer</a></li>
- <li><a href="backbutton/dynamically-attatch-backbutton-to-header.html">8. Dynamically attatch backbutton to header</a></li>
+ <li><a href="backbutton/no-footer.html">1. No footer in page</a></li>
+ <li><a href="backbutton/no-back-button.html">2. No back button in page</a></li>
+ <li><a href="backbutton/backbutton-normal.html">3. Back button in page</a></li>
+ <li><a href="backbutton/back-button-to-header.html">4. Back button to Header</a></li>
+ <li><a href="backbutton/dynamically-attatch-backbutton-to-footer.html">5. Dynamically attatch backbutton to footer</a></li>
+ <li><a href="backbutton/dynamically-attatch-backbutton-to-header.html">6. Dynamically attatch backbutton to header</a></li>
</div>
</div>
<script src="backbutton-control.js"></script>
$( document ).bind("pagecreate", function () {
-
$("#genBackToFooter").bind("vmousedown", function (e) {
- $(".ui-page-active").find(".ui-footer").barlayout("addBackBtn");
- });
+ $(".ui-page-active").page( "addBackBtn", "footer" );
+ });
$("#genBackToFooter2").bind("vmousedown", function (e) {
- $(".ui-page-active").find(".ui-header").barlayout("addBackBtn");
- });
+ $(".ui-page-active").page( "addBackBtn", "header" );
+ });
$("#backButtonDemo5").bind("vmousedown", function (e) {
- $(".ui-page-active").find(".ui-footer").hide();
- });
+ $(".ui-page-active").find(".ui-footer").hide();
+ });
});
</div>
<div data-role="content">
- <p> Case 6 : <br><br>
+ <p> Case 4 : <br><br>
Web Developer defines that back button will be attached to header<br>
This page declared "data-add-back-btn=header" to page <br>
1. check and draw back button to header</p>
</head>
<body>
-<div data-role="page">
- <div data-role="header" data-position="fixed" >
- <h1>Normal footer generate</h1>
+<div data-role="page" data-add-Back-Btn="true">
+ <div data-role="header" data-position="fixed">
+ <h1>Normal footer with back button</h1>
</div>
<div data-role="content">
- <p> Case 1 : <br><br>
- Web Developer doesn't define footer in page <br>
- This page do not have <div> footer in html file <br>
- Framework automatically generate footer in case no footer definition in page</p><br>
+ <p> Case 3 : <br><br>
+ Web Developer declare back btn option and make footer <br>
+ back button displayed right bottom side of footer</p><br>
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page"> <br>
+ <div data-role="page" data-add-Back-Btn="true"> <br>
    <div data-role="header" data-position="fixed"> <br>
        <h1>back button sample</h1> <br>
    </div> <br>
    <div data-role="content"> <br>
    </div> <br>
+     <div data-role="footer" data-position="fixed"> <br>
+     </div> <br>
</div> </p>
</div><br>
</div>
+ <div data-role="footer" data-position="fixed">
+ </div>
</div>
</body>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- </head>
-<body>
-
-<div data-role="page">
- <div data-role="header" data-position="fixed" >
- <h1>Defined normal footer</h1>
- </div>
-
- <div data-role="content">
- <p> Case 2 : <br><br>
- Web Developer defines footer in page <br>
- This page has <div> footer in html file <br>
- Framework gets tizen theme of footer and styling footer</p><br>
- <div>
- <p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page"> <br>
-     <div data-role="header" data-position="fixed"> <br>
-         <h1>back button sample</h1> <br>
-     </div> <br>
-     <div data-role="content"> <br>
-     </div> <br>
-     <div data-role="footer"> <br>
-     </div> <br>
- </div> </p>
- </div><br>
- </div>
-
- <div data-role="footer">
- </div>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- </head>
-<body>
-
-<div data-role="page" data-add-back-btn="footer">
- <div data-role="header" data-position="fixed" >
- <h1>Defined back button in page</h1>
- </div>
-
- <div data-role="content">
- <p> Case 3 : <br><br>
- Web Developer defines back button in page <br>
- This page does not have <div> footer in html file <br>
- but declared back button in page <br>
- Framework generates footer then attach back button to footer</p><br>
- <div>
- <p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page" data-add-back-btn="footer"> <br>
-     <div data-role="header" data-position="fixed"> <br>
-         <h1>back button sample</h1> <br>
-     </div> <br>
-     <div data-role="content"> <br>
-     </div> <br>
- </div> </p>
- </div><br>
- </div>
-
-</div>
-</body>
-</html>
</head>
<body>
-<div data-role="page" data-add-back-btn="none">
+<div data-role="page">
<div data-role="header" data-position="fixed" >
<h1>Back button to Header</h1>
</div>
<div data-role="content">
- <p> Case 7 : <br><br>
+ <p> Case 5 : <br><br>
Web Developer declared only footer in page<br>
but need to add back button dynamically <br>
- select footer and call barlayout("addBackBtn") API<br></p>
+ call page("addBackBtn", target) API<br></p>
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page" data-add-back-btn="none"> <br>
+ <div data-role="page"> <br>
    <div data-role="header" data-position="fixed"> <br>
        <h1>back button sample</h1> <br>
    </div> <br>
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
<script> <br>
- var $elFooter = $(".ui-page-active").find(".ui-footer"); <br>
- $elFooter.barlayout("addBackBtn"); <br>
+ $(".ui-page-active").page( "addBackBtn", "footer" );<br>
</script> <br>
</p>
</div><br>
</head>
<body>
-<div data-role="page" data-add-back-btn="none">
+<div data-role="page">
<div data-role="header" data-position="fixed" >
<h1>Back button to Header</h1>
</div>
<div data-role="content">
- <p> Case 7 : <br><br>
+ <p> Case 6 : <br><br>
Web Developer declared only footer in page<br>
but need to add back button dynamically in header<br>
- select header and call barlayout("addBackBtn") API<br></p>
+ call page("addBackBtn", target) API<br></p>
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page" data-add-back-btn="none"> <br>
+ <div data-role="page"> <br>
    <div data-role="header" data-position="fixed"> <br>
        <h1>back button sample</h1> <br>
    </div> <br>
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
<script> <br>
- var $elHeader = $(".ui-page-active").find(".ui-header"); <br>
- $elHeader.barlayout("addBackBtn"); <br>
+ $(".ui-page-active").page( "addBackBtn", "header" );<br>
</script> <br>
</p>
</div><br>
</head>
<body>
-<div data-role="page" data-add-back-btn="none">
+<div data-role="page">
<div data-role="header" data-position="fixed" >
<h1>No back button</h1>
</div>
<div data-role="content">
- <p> Case 5 : <br><br>
- Web Developer defines that back button will not use in this page <br>
- This page declared that this page will not use back button <br>
- declared "data-add-back-btn=none" to page <br>
- 1. draw footer to page <br>
- 2. check and do not draw back button to page</p>
+ <p> Case 2 : <br><br>
+ Web Developer defines footer in page <br>
+ no page option declared <br>
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page" data-add-back-btn="none"> <br>
+ <div data-role="page"> <br>
    <div data-role="header" data-position="fixed"> <br>
        <h1>back button sample</h1> <br>
    </div> <br>
    <div data-role="content"> <br>
    </div> <br>
+     <div data-role="footer" data-position="fixed"> <br>
+     </div> <br>
</div> </p>
</div><br>
<a href="../backbutton-control.html" data-role="button" data-inline="true">Go Back</a>
</div>
+ <div data-role="footer" data-position="fixed" >
+ </div>
</div>
</body>
</html>
</head>
<body>
-<div data-role="page" data-footer-exist="false">
+<div data-role="page">
<div data-role="header" data-position="fixed" >
- <h1>Defined normal footer</h1>
+ <h1>No footer page</h1>
</div>
<div data-role="content">
- <p> Case 4 : <br><br>
- Web Developer defines that footer will not use in this page <br>
- This page declared that this page will not use footer (footer-exist) <br>
- 1. do not go to footerDraw routine</p>
+ <p> Case 1 : <br><br>
+ Web Developer defines nothing page <br>
+ This page show only header & content in page <br>
+
<div>
<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
- <div data-role="page" data-footer-exist="false"> <br>
+ <div data-role="page"> <br>
    <div data-role="header" data-position="fixed"> <br>
-         <h1>back button sample</h1> <br>
+         <h1>no footer sample</h1> <br>
    </div> <br>
    <div data-role="content"> <br>
    </div> <br>
+++ /dev/null
-<div data-role="page" id="switch-demo">
- <div data-role="header">
- <h1>Switch</h1>
- </div>
- <div class="content" data-role="content">
- <p>Image switches:</p>
- <div id="switch-1" data-role="toggleswitch" data-checked="false"></div>
- <div id="switch-2" data-role="toggleswitch" data-checked="true"></div>
- <br>
- <p>Text switches (old UX):</p>
- <div id="switch-2" data-style="text" data-role="toggleswitch"></div>
- <br>
- <p>Coordinated switches:</p>
- <div id="switch-1-coord" data-role="toggleswitch"></div>
- <br>
- <div id="switch-2-coord" data-role="toggleswitch"></div>
- </div> <!-- /content -->
- <div data-role="footer">
- <h4>Web UI Framework - Widgets gallery</h4>
- </div>
-</div> <!-- page -->
+++ /dev/null
-$("#switch-demo").live("pageshow", function(e) {
- $("#switch-1-coord").bind("change", function(e) {
- $("#switch-2-coord").toggleswitch("option", "checked", $("#switch-1-coord").toggleswitch("option", "checked"));
- });
- $("#switch-2-coord").bind("change", function(e) {
- $("#switch-1-coord").toggleswitch("option", "checked", $("#switch-2-coord").toggleswitch("option", "checked"));
- });
-});
--- /dev/null
+<div data-role="page" id="switch-demo">
+ <div data-role="header">
+ <h1>ToggleSwitch</h1>
+ </div>
+ <div class="content" data-role="content">
+ <select name="flip-11" id="flip-11" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
+ <br><br>
+
+ <label for="flip-1">Tizen switch:</label>
+ <select name="flip-1" id="flip-1" data-role="slider">
+ <option value="off"></option>
+ <option value="on"></option>
+ </select>
+
+ <br><br>
+
+
+
+ <label for="flip-2">Flip switch:</label>
+ <select name="flip-2" id="flip-2" data-role="slider">
+ <option value="offoffoffoffoffoffoffoffoffoffoffoff">OffOffOffOffOffOffOffOffOffOffOffOffOff</option>
+ <option value="on">On</option>
+ </select>
+
+ <br><br>
+
+ <div data-role="fieldcontain">
+ <label for="flip-3">Flip switch test:</label>
+ <select name="flip-3" id="flip-3" data-role="slider">
+ <option value="nope">NopeNopeNopeNope</option>
+ <option value="yep">YepYepYepYep</option>
+ </select>
+ </div>
+
+
+ </div> <!-- /content -->
+ <div data-role="footer">
+ <h4>Web UI Framework - Widgets gallery</h4>
+ </div>
+</div> <!-- page -->
--- /dev/null
+From 9194807cb435b256bf5f4d45f585e1ed0bbab303 Mon Sep 17 00:00:00 2001
+From: jinhyuk <jinhyuk@jinhyuk-DeskTop.(none)>
+Date: Wed, 12 Dec 2012 18:34:46 +0900
+Subject: [PATCH] JQM add TIZEN back btn
+
+Change-Id: If1c5e68cff21d78abcc499b9eac7a6a3222f09be
+---
+ libs/js/jquery-mobile-1.2.0/js/widgets/page.js | 13 +++++
+ .../js/widgets/page.sections.js | 19 ++++++--
+ ...d-back-btn-option-and-remove-jqm-back-btn.patch | 51 --------------------
+ 3 files changed, 27 insertions(+), 56 deletions(-)
+ delete mode 100644 libs/patch/0014-JQM-add-back-btn-option-and-remove-jqm-back-btn.patch
+
+diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/page.js b/libs/js/jquery-mobile-1.2.0/js/widgets/page.js
+index 256fbb2..d80bd26 100644
+--- a/libs/js/jquery-mobile-1.2.0/js/widgets/page.js
++++ b/libs/js/jquery-mobile-1.2.0/js/widgets/page.js
+@@ -46,6 +46,19 @@ $.widget( "mobile.page", $.mobile.widget, {
+ }
+ },
+
++ addBackBtn : function ( target ) {
++ var $dest = $( ".ui-page-active .ui-footer" );
++
++ if ( target == "header" ) {
++ $dest = $( ".ui-page-active .ui-header" );
++ }
++ backBtn = $( "<a href='#' class='ui-btn-back' data-" + $.mobile.ns + "rel='back'></a>" )
++ .buttonMarkup( {icon: "header-back-btn", theme : "s"} );
++ if ( !$dest.find( ".ui-btn-back").length ) {
++ backBtn.prependTo( $dest );
++ }
++ },
++
+ keepNativeSelector: function() {
+ var options = this.options,
+ keepNativeDefined = options.keepNative && $.trim( options.keepNative );
+diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js b/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
+index 7c05ecb..90a298a 100644
+--- a/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
++++ b/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
+@@ -35,6 +35,7 @@ $( document ).bind( "pagecreate", function( e ) {
+ $headeranchors,
+ leftbtn,
+ rightbtn,
++ $dest = $page.find( ".ui-footer" ),
+ backBtn;
+
+ $this.addClass( "ui-" + role );
+@@ -63,15 +64,23 @@ $( document ).bind( "pagecreate", function( e ) {
+
+ // Auto-add back btn on pages beyond first view
+ if ( o.addBackBtn &&
+- role === "header" &&
+- $( ".ui-page" ).length > 1 &&
++ ( role === "footer" || role === "header" ) &&
+ $page.jqmData( "url" ) !== $.mobile.path.stripHash( location.hash ) &&
+ !leftbtn ) {
+
+- backBtn = $( "<a href='javascript:void(0);' class='ui-btn-left' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='arrow-l'>"+ o.backBtnText +"</a>" )
++ if ( o.addBackBtn == "header" ) {
++ $dest = $page.find( ".ui-header" );
++ } else {
++ $dest = $page.find( ".ui-footer" );
++ }
++
++ backBtn = $( "<a href='javascript:void(0);' class='ui-btn-back' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='header-back-btn'></a>" )
+ // If theme is provided, override default inheritance
+- .attr( "data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme )
+- .prependTo( $this );
++ .attr( "data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme );
++
++ if ( !$dest.find( ".ui-btn-back" ).length ) {
++ backBtn.prependTo( $dest );
++ }
+ }
+
+ // Page title
+diff --git a/libs/patch/0014-JQM-add-back-btn-option-and-remove-jqm-back-btn.patch b/libs/patch/0014-JQM-add-back-btn-option-and-remove-jqm-back-btn.patch
+deleted file mode 100644
+index 1ca3002..0000000
+--- a/libs/patch/0014-JQM-add-back-btn-option-and-remove-jqm-back-btn.patch
++++ /dev/null
+@@ -1,51 +0,0 @@
+-From 252820a3ea292bf652d2ecd644c0126152a20f46 Mon Sep 17 00:00:00 2001
+-From: Jun Jinhyuk <jinhyuk.jun@samsung.com>
+-Date: Wed, 28 Nov 2012 14:25:58 +0900
+-Subject: [PATCH] JQM add back btn option and remove jqm back btn
+-
+-Signed-off-by: Jun Jinhyuk <jinhyuk.jun@samsung.com>
+----
+- .../js/widgets/page.sections.js | 16 ++--------------
+- 1 files changed, 2 insertions(+), 14 deletions(-)
+-
+-diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js b/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
+-index 7c05ecb..cbf6786 100644
+---- a/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
+-+++ b/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
+-@@ -8,11 +8,12 @@ define( [ "jquery", "./page", "../jquery.mobile.core" ], function( $ ) {
+- (function( $, undefined ) {
+-
+- $.mobile.page.prototype.options.backBtnText = "Back";
+--$.mobile.page.prototype.options.addBackBtn = false;
+-+$.mobile.page.prototype.options.addBackBtn = "footer";
+- $.mobile.page.prototype.options.backBtnTheme = null;
+- $.mobile.page.prototype.options.headerTheme = "a";
+- $.mobile.page.prototype.options.footerTheme = "a";
+- $.mobile.page.prototype.options.contentTheme = null;
+-+$.mobile.page.prototype.options.footerExist = true;
+-
+- // NOTE bind used to force this binding to run before the buttonMarkup binding
+- // which expects .ui-footer top be applied in its gigantic selector
+-@@ -61,19 +62,6 @@ $( document ).bind( "pagecreate", function( e ) {
+- rightbtn = rightbtn || $headeranchors.eq( 1 ).addClass( "ui-btn-right" ).length;
+- }
+-
+-- // Auto-add back btn on pages beyond first view
+-- if ( o.addBackBtn &&
+-- role === "header" &&
+-- $( ".ui-page" ).length > 1 &&
+-- $page.jqmData( "url" ) !== $.mobile.path.stripHash( location.hash ) &&
+-- !leftbtn ) {
+--
+-- backBtn = $( "<a href='javascript:void(0);' class='ui-btn-left' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='arrow-l'>"+ o.backBtnText +"</a>" )
+-- // If theme is provided, override default inheritance
+-- .attr( "data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme )
+-- .prependTo( $this );
+-- }
+--
+- // Page title
+- $this.children( "h1, h2, h3, h4, h5, h6" )
+- .addClass( "ui-title" )
+---
+-1.7.4.1
+-
+--
+1.7.9.5
+
+++ /dev/null
-From 252820a3ea292bf652d2ecd644c0126152a20f46 Mon Sep 17 00:00:00 2001
-From: Jun Jinhyuk <jinhyuk.jun@samsung.com>
-Date: Wed, 28 Nov 2012 14:25:58 +0900
-Subject: [PATCH] JQM add back btn option and remove jqm back btn
-
-Signed-off-by: Jun Jinhyuk <jinhyuk.jun@samsung.com>
----
- .../js/widgets/page.sections.js | 16 ++--------------
- 1 files changed, 2 insertions(+), 14 deletions(-)
-
-diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js b/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
-index 7c05ecb..cbf6786 100644
---- a/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
-+++ b/libs/js/jquery-mobile-1.2.0/js/widgets/page.sections.js
-@@ -8,11 +8,12 @@ define( [ "jquery", "./page", "../jquery.mobile.core" ], function( $ ) {
- (function( $, undefined ) {
-
- $.mobile.page.prototype.options.backBtnText = "Back";
--$.mobile.page.prototype.options.addBackBtn = false;
-+$.mobile.page.prototype.options.addBackBtn = "footer";
- $.mobile.page.prototype.options.backBtnTheme = null;
- $.mobile.page.prototype.options.headerTheme = "a";
- $.mobile.page.prototype.options.footerTheme = "a";
- $.mobile.page.prototype.options.contentTheme = null;
-+$.mobile.page.prototype.options.footerExist = true;
-
- // NOTE bind used to force this binding to run before the buttonMarkup binding
- // which expects .ui-footer top be applied in its gigantic selector
-@@ -61,19 +62,6 @@ $( document ).bind( "pagecreate", function( e ) {
- rightbtn = rightbtn || $headeranchors.eq( 1 ).addClass( "ui-btn-right" ).length;
- }
-
-- // Auto-add back btn on pages beyond first view
-- if ( o.addBackBtn &&
-- role === "header" &&
-- $( ".ui-page" ).length > 1 &&
-- $page.jqmData( "url" ) !== $.mobile.path.stripHash( location.hash ) &&
-- !leftbtn ) {
--
-- backBtn = $( "<a href='javascript:void(0);' class='ui-btn-left' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='arrow-l'>"+ o.backBtnText +"</a>" )
-- // If theme is provided, override default inheritance
-- .attr( "data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme )
-- .prependTo( $this );
-- }
--
- // Page title
- $this.children( "h1, h2, h3, h4, h5, h6" )
- .addClass( "ui-title" )
---
-1.7.4.1
-
-From 3efba1ecbb1a2cd09aad29850060d1703b52d682 Mon Sep 17 00:00:00 2001
+From 0df0afd2b03ab688210b9ff71d65dff73a33419c Mon Sep 17 00:00:00 2001
From: "hjnim.kim" <hjnim.kim@samsung.com>
-Date: Thu, 6 Dec 2012 14:47:57 +0900
-Subject: [PATCH] JQM Apply tizen style context popup
+Date: Tue, 11 Dec 2012 19:14:31 +0900
+Subject: [PATCH] Apply tizen style context popup
-Change-Id: I6a592010eebbce98a02c901b9c121eec2dff87fb
---
- libs/js/jquery-mobile-1.2.0/js/widgets/popup.js | 86 +++++++++++++++++++----
- 1 files changed, 71 insertions(+), 15 deletions(-)
+ libs/js/jquery-mobile-1.2.0/js/widgets/popup.js | 95 ++++++++++++++++++++---
+ 1 files changed, 84 insertions(+), 11 deletions(-)
diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js b/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js
-index de2af2c..660bb7e 100644
+index de2af2c..6470bc4 100644
--- a/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js
+++ b/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js
-@@ -109,13 +109,13 @@ define( [ "jquery",
+@@ -58,7 +58,7 @@ define( [ "jquery",
+ // https://github.com/jquery/jquery-mobile/issues/4784
+ //
+ // NOTE this option is modified in _create!
+- history: !$.mobile.browser.ie
++ history: false
+ },
+
+ _eatEventAndClose: function( e ) {
+@@ -109,7 +109,7 @@ define( [ "jquery",
},
_resizeTimeout: function() {
// effectively rapid-open the popup while leaving the screen intact
this._trigger( "beforeposition" );
this._ui.container
- .removeClass( "ui-selectmenu-hidden" )
- .offset( this._placementCoords( this._desiredCoords( undefined, undefined, "window" ) ) );
--
-+
- this._resizeScreen();
- this._resizeData = null;
- this._orientationchangeInProgress = false;
-@@ -143,17 +143,19 @@ define( [ "jquery",
- _create: function() {
+@@ -144,7 +144,8 @@ define( [ "jquery",
var ui = {
screen: $( "<div class='ui-screen-hidden ui-popup-screen'></div>" ),
-
- placeholder: $( "<div style='display: none;'><!-- placeholder --></div>" ),
+
placeholder: $( "<div style='display: none;'><!-- placeholder --></div>" ),
- container: $( "<div class='ui-popup-container ui-selectmenu-hidden'></div>" )
-+ placeholder: $( "</div><div style='display: none;'><!-- placeholder --></div>" ),
+ container: $( "<div class='ui-popup-container ui-selectmenu-hidden'></div>" ),
+ arrow : $("<div class='ui-arrow'></div>")
},
thisPage = this.element.closest( ".ui-page" ),
myId = this.element.attr( "id" ),
-- self = this;
-+ self = this,
-+ link;
-
- // We need to adjust the history option to be false if there's no AJAX nav.
- // We can't do it in the option declarations because those are run before
- // it is determined whether there shall be AJAX nav.
-- this.options.history = this.options.history && $.mobile.ajaxEnabled && $.mobile.hashListeningEnabled;
-+ this.options.history = false && $.mobile.ajaxEnabled && $.mobile.hashListeningEnabled;
-
- if ( thisPage.length === 0 ) {
- thisPage = $( "body" );
-@@ -172,9 +174,10 @@ define( [ "jquery",
- ui.screen.attr( "id", myId + "-screen" );
- ui.container.attr( "id", myId + "-popup" );
+@@ -174,7 +175,7 @@ define( [ "jquery",
ui.placeholder.html( "<!-- placeholder for " + myId + " -->" );
-+ ui.arrow.attr( "id", myId + "-arrow" );
}
ui.container.append( this.element );
-
// Add class to popup element
this.element.addClass( "ui-popup" );
-@@ -361,8 +364,11 @@ define( [ "jquery",
+@@ -276,7 +277,7 @@ define( [ "jquery",
+ },
+
+ _setTolerance: function( value ) {
+- var tol = { t: 30, r: 15, b: 30, l: 15 };
++ var tol = { t: 10, r: 10, b: 10, l: 10 };
+
+ if ( value ) {
+ var ar = String( value ).split( "," );
+@@ -361,7 +362,11 @@ define( [ "jquery",
cx: winCoords.cx - this._tolerance.l - this._tolerance.r,
cy: winCoords.cy - this._tolerance.t - this._tolerance.b
},
- menuSize, ret;
--
+ menuSize, ret,
+ linkOffset = $(this.link).offset(),
+ positionOffsets = [],
+ correctionValue = [0,0],
+ arrayIdx;
+
// Clamp the width of the menu before grabbing its size
this._ui.container.css( "max-width", rc.cx );
- menuSize = {
-@@ -385,11 +391,50 @@ define( [ "jquery",
-
- // fix for $( document ).height() bug in core 1.7.2.
- var docEl = document.documentElement, docBody = document.body,
-- docHeight = Math.max( docEl.clientHeight, docBody.scrollHeight, docBody.offsetHeight, docEl.scrollHeight, docEl.offsetHeight );
-+ docHeight = Math.max( docEl.clientHeight, docBody.scrollHeight, docBody.offsetHeight, docEl.scrollHeight, docEl.offsetHeight ),
-+ arrowtop,
-+ arrowleft;
+@@ -388,8 +393,48 @@ define( [ "jquery",
+ docHeight = Math.max( docEl.clientHeight, docBody.scrollHeight, docBody.offsetHeight, docEl.scrollHeight, docEl.offsetHeight );
ret.y -= Math.min( ret.y, Math.max( 0, ret.y + menuSize.cy - docHeight ) );
--
-- return { left: ret.x, top: ret.y };
++ if ( this.positionTo === "window" )
++ {
++ return { left: ret.x, top: ret.y , arrowleft: 0 , arrowtop: 0};
++ }
++
+ positionOffsets = [ linkOffset.left,
+ linkOffset.top,
+ docEl.clientHeight - ( linkOffset.top + $(this.link).height() ),
+ docEl.clientWidth - ( linkOffset.left + $(this.link).width() )];
+ arrayIdx = positionOffsets.indexOf(Math.max.apply(window,positionOffsets));
++
+ switch( arrayIdx )
+ {
+ case 0:
+ .addClass("ui-arrow top");
+ break;
+ case 3:
-+ correctionValue = [ $(this.link).width() , 0];
++ correctionValue = [ ( menuSize.cx < $(this.link).width() ) ? ( $(this.link).width() / 2 ) + ( menuSize.cx / 2) : $(this.link).width() , 0];
+ arrowtop = ( linkOffset.top - ret.y ) + ( $(this.link).height() / 2 ) - parseInt( $(this._ui.arrow).css("border-width") );
+ arrowleft = - parseInt( $(this._ui.arrow).css("border-width") ) * 2;
+ $(this._ui.arrow).attr( "class", "" )
+ .addClass("ui-arrow right");
+ break;
+ }
-+ if ( this.positionTo === "window" )
-+ {
-+ correctionValue = [ 0, 0];
-+ }
+
+- return { left: ret.x, top: ret.y };
+ return { left: ret.x + correctionValue[0], top: ret.y + correctionValue[1] , arrowleft: arrowleft , arrowtop: arrowtop};
},
_createPrereqs: function( screenPrereq, containerPrereq, whenDone ) {
-@@ -532,7 +577,8 @@ define( [ "jquery",
- return true;
- }
- return false;
-- }());
-+ }()),
-+ self = this;
-
- // Make sure options is defined
- options = ( options || {} );
-@@ -569,7 +615,7 @@ define( [ "jquery",
+@@ -569,7 +614,7 @@ define( [ "jquery",
this._ui.container
.removeClass( "ui-selectmenu-hidden" )
.offset( coords );
if ( this.options.overlayTheme && androidBlacklist ) {
/* TODO:
The native browser on Android 4.0.X ("Ice Cream Sandwich") suffers from an issue where the popup overlay appears to be z-indexed
-@@ -587,6 +633,14 @@ define( [ "jquery",
+@@ -587,6 +632,7 @@ define( [ "jquery",
// TODO sort out why this._page isn't working
this.element.closest( ".ui-page" ).addClass( "ui-popup-open" );
}
-+ //
-+ if ( self.positionTo !== "window")
-+ {
-+ $(self.element.get(0)).addClass("ui-ctxpopup");
-+ $(self._ui.container).removeClass("ui-popup-container").addClass("ui-ctxpopup-container");
-+ } else {
-+ $(self._ui.arrow).hide();
-+ }
++
this._animate({
additionalCondition: true,
transition: transition,
-@@ -691,7 +745,8 @@ define( [ "jquery",
+@@ -691,15 +737,42 @@ define( [ "jquery",
// what should be in _open. Seems to be "visual" vs "history" for now
open: function( options ) {
var self = this, opts = this.options, url, hashkey, activePage, currentIsDialog, hasHash, urlHistory;
-
-+ self.link = options.link,
-+ self.positionTo = options.positionTo;
++ // self.link = ( $(event.target).attr('data-role') === 'button') ? event.target : $(event.target).closest('[data-role="button"]')[0];
// make sure open is idempotent
if( $.mobile.popup.active ) {
return;
-@@ -798,6 +853,7 @@ define( [ "jquery",
- positionTo: $link.jqmData( "position-to" ),
- link: $link
- });
-+ popup._openButton = $link;
- }
-
- //remove after delay
+ }
+-
+ // set the global popup mutex
+ $.mobile.popup.active = this;
+-
++ if( !options )
++ {
++ options = [];
++ }
++ if ( !options.link )
++ {
++ self.link = $(event.target).closest('a')[0];
++ } else {
++ self.link = options.link;
++ }
++ self.positionTo = ( options != null && options.positionTo != null ) ? options.positionTo : "origin";
++ if ( $(self.link).jqmData("position-to") !== "window")
++ {
++ $(self.element).addClass("ui-ctxpopup");
++ $(self._ui.container).removeClass("ui-popup-container")
++ .addClass("ui-ctxpopup-container");
++ } else {
++ $(self._ui.arrow).hide();
++ }
++ if( !options.x
++ && self.positionTo !== "window" )
++ {
++ options.x = $(self.link).offset().left + $(self.link).outerWidth() / 2;
++ }
++ if( !options.y
++ && self.positionTo !== "window" )
++ {
++ options.y = $(self.link).offset().top + $(self.link).outerHeight() / 2;
++ }
+ // if history alteration is disabled close on navigate events
+ // and leave the url as is
+ if( !( opts.history ) ) {
--
1.7.5.4
--- /dev/null
+From d91978cf6366c05780ed223264f65869387bc4a4 Mon Sep 17 00:00:00 2001
+From: Jun Jinhyuk <jinhyuk.jun@samsung.com>
+Date: Fri, 7 Dec 2012 10:33:32 +0900
+Subject: [PATCH] JQM add tizen toggle switch
+
+Change-Id: Iebd5611d298e67295edfe5ded449e11637be5425
+---
+ .../jquery-mobile-1.2.0/js/widgets/forms/slider.js | 44 +++++++++++++++-----
+ 1 files changed, 33 insertions(+), 11 deletions(-)
+
+diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js b/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js
+index e7f5df0..2e682db 100644
+--- a/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js
++++ b/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js
+@@ -81,6 +81,10 @@ $.widget( "mobile.slider", $.mobile.widget, {
+ domHandle.className = 'ui-slider-handle';
+ domSlider.appendChild( domHandle );
+
++ if ( $( control ).find( "option" ).length && $( control ).find( "option" ).text() === "" ) {
++ $( domSlider ).addClass( "ui-toggle-switch" );
++ }
++
+ handle.buttonMarkup({ corners: true, theme: theme, shadow: true })
+ .attr({
+ "role": "slider",
+@@ -324,7 +328,12 @@ $.widget( "mobile.slider", $.mobile.widget, {
+ },
+
+ refresh: function( val, isfromControl, preventInputUpdate ) {
++ var imgToggle = false,
++ appHandle;
+
++ if ( $( this.handle ).parents().is( ".ui-toggle-switch" ) ) {
++ imgToggle = true;
++ }
+ // NOTE: we don't return here because we want to support programmatic
+ // alteration of the input value, which should still update the slider
+ if ( this.options.disabled || this.element.attr('disabled')) {
+@@ -397,20 +406,33 @@ $.widget( "mobile.slider", $.mobile.widget, {
+ title: cType === "input" ? newval : control.find( "option" ).eq( newval ).getEncodedText()
+ });
+
+- if ( this.valuebg ) {
+- this.valuebg.css( "width", percent + "%" );
++ if ( !imgToggle ) {
++ if ( this.valuebg ) {
++ this.valuebg.css( "width", percent + "%" );
++ }
+ }
+
+ // drag the label widths
+- if ( this._labels ) {
+- var handlePercent = this.handle.width() / this.slider.width() * 100,
+- aPercent = percent && handlePercent + ( 100 - handlePercent ) * percent / 100,
+- bPercent = percent === 100 ? 0 : Math.min( handlePercent + 100 - aPercent, 100 );
+-
+- this._labels.each(function() {
+- var ab = $( this ).is( ".ui-slider-label-a" );
+- $( this ).width( ( ab ? aPercent : bPercent ) + "%" );
+- });
++ if ( imgToggle ) {
++ appHandle = $( this.handle ).parents( ".ui-slider" );
++ if ( $( this.handle ).attr("aria-valuenow") === "on" ) {
++ appHandle.children( "span.ui-slider-label-a" ).show();
++ appHandle.children( "span.ui-slider-label-b" ).hide();
++ } else {
++ appHandle.children( "span.ui-slider-label-b" ).show();
++ appHandle.children( "span.ui-slider-label-a" ).hide();
++ }
++ } else {
++ if ( this._labels ) {
++ var handlePercent = this.handle.width() / this.slider.width() * 100,
++ aPercent = percent && handlePercent + ( 100 - handlePercent ) * percent / 100,
++ bPercent = percent === 100 ? 0 : Math.min( handlePercent + 100 - aPercent, 100 );
++
++ this._labels.each(function() {
++ var ab = $( this ).is( ".ui-slider-label-a" );
++ $( this ).width( ( ab ? aPercent : bPercent ) + "%" );
++ });
++ }
+ }
+
+ if ( !preventInputUpdate ) {
+--
+1.7.4.1
+
Name: web-ui-fw
-Version: 0.2.2
+Version: 0.2.3
Release: 0
Summary: Tizen Web UI Framework Library
Group: Development/Other
%manifest web-ui-fw.manifest
/usr/share/tizen-web-ui-fw/*/js
/usr/share/tizen-web-ui-fw/latest
+/usr/share/tizen-web-ui-fw/VERSION
###############################
%package -n web-ui-fw-theme-tizen-gray
###############################
%changelog
+* Fri Dec 14 2012 Minkyu Kang <mk7.kang@samsung.com> 0.2.3
+- FIX:
+ - slider: add image
+ - button: data-icon support, styles fix
+ - progressbar: modify the background
+ - scrollview: auto scrolling bug fix
+ - pagelayout: IME concept is changed
+- Spec changes:
+ - dialogue: add edit mode
+ - nocontents: removed
+ - pagecontrol: removed
+ - dayselector: removed
+ - expandablelist: removed
+
* Thu Dec 10 2012 Youmin Ha <youmin.ha@samsung.com> 0.2.2
- FIX:
- chang searchbar/slider images
- Spec changes:
- UX guide v0.4 : button, layout
-* Fri Oct 26 2012 Youmin Ha <youmin.ha@samsung.com> 0.1.58
-- FIX:
- - scrollview: Fix outer scroll amount
- - tabbar: fix tapping twice
- - popupwindow: fix left position
-
* Wed Oct 24 2012 Youmin Ha <youmin.ha@samsung.com> 0.1.57
- FIX:
- expandablelist: icon color fix
// Set framework data, only when they are given.
tokens = src.split(/[\/\\]/);
version_idx = -3;
- this.frameworkData.rootDir = elem.getAttribute( 'data-framework-root' )
+ this.frameworkData.rootDir = ( elem.getAttribute( 'data-framework-root' )
|| tokens.slice( 0, tokens.length + version_idx ).join( '/' )
- || this.frameworkData.rootDir;
+ || this.frameworkData.rootDir ).replace( /^file:(\/\/)?/, '' );
this.frameworkData.version = elem.getAttribute( 'data-framework-version' )
|| tokens[ tokens.length + version_idx ]
|| this.frameworkData.version;
.ui-btn-inline { display: inline-block; }
.ui-btn-inner { padding: .5em 18 * @unit_base; display: block; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; position: relative; zoom: 1; }
.ui-header .ui-btn-inner, .ui-footer .ui-btn-inner, .ui-bar .ui-btn-inner { padding: 0.7em 0 0.7em; } /* wongi_1024 : Button text middle align */
-.ui-header .ui-btn-inner.ui-btn-icon-only , .ui-footer .ui-btn-inner, .ui-bar .ui-btn-inner.ui-btn-icon-only { padding: .4em 8 * @unit_base .5em; } /* wongi_1024 : Button text middle align */
+.ui-header .ui-btn-inner.ui-btn-icon-only , .ui-footer .ui-btn-inner, .ui-bar .ui-btn-inner.ui-btn-icon-only
+{
+ padding: .4em 8 * @unit_base .5em;
+ .LESSborder-radius-all(1.2rem);
+} /* wongi_1024 : Button text middle align */
.ui-btn-icon-notext { width: 24 * @unit_base; height: 24 * @unit_base; }
.ui-btn-icon-notext .ui-btn-inner { padding: 2 * @unit_base 1 * @unit_base 2 * @unit_base 3 * @unit_base; }
.ui-btn-icon-notext .ui-btn-text { position: absolute; left: -999 * @unit_base; }
box-shadow: none;
}
+.ui-header .ui-btn.ui-btn-corner-all,
+.ui-footer .ui-btn.ui-btn-corner-all
+{
+ .LESSborder-radius-all(1.2rem);
+ font-weight:bold;
+}
+
.ui-scroll-jump-top-bg .ui-btn-icon-left .ui-btn-inner
{
padding-left: 0;
.ui-icon-delete {.tizen-icon-common; background-image: url(images/controls/button/00_button_expand_cancel.png); }
.ui-icon-plus {.tizen-icon-common; background-image: url(images/controls/button/00_button_plus.png); }
.ui-icon-minus {.tizen-icon-common; background-image: url(images/controls/button/00_button_expand_minus.png); }
-.ui-icon-check { }
-.ui-icon-gear { }
-.ui-icon-refresh { }
+.ui-icon-check {.tizen-icon-common; background-image: url(images/controls/button/00_button_check.png); }
+.ui-icon-gear {.tizen-icon-common; background-image: url(images/controls/button/00_button_gear.png); }
+.ui-icon-refresh {.tizen-icon-common; background-image: url(images/controls/button/00_button_refresh.png); }
.ui-icon-forward {.tizen-icon-common; background-image: url(images/controls/button/00_button_expand_send.png); }
-.ui-icon-back { }
-.ui-icon-grid { }
-.ui-icon-star {.tizen-icon-common; background-image: url(images/00_winset_icon_favorite_on.png); }
+.ui-icon-back {.tizen-icon-common; background-image: url(images/controls/button/00_button_back.png); }
+.ui-icon-grid {.tizen-icon-common; background-image: url(images/controls/button/00_button_grid.png); }
+.ui-icon-star {.tizen-icon-common; background-image: url(images/controls/button/00_button_star.png); }
.ui-icon-alert {.tizen-icon-common; background-image: url(images/controls/button/00_button_warning.png); }
.ui-icon-info {.tizen-icon-common; background-image: url(images/controls/button/00_button_info.png); }
-.ui-icon-home { }
-.ui-icon-search { }
+.ui-icon-home {.tizen-icon-common; background-image: url(images/controls/button/00_button_home.png); }
+.ui-icon-search {.tizen-icon-common; background-image: url(images/controls/button/00_button_search.png); }
.ui-icon-call {.tizen-icon-common; background-image: url(images/controls/button/00_button_call.png); }
.ui-icon-rename {.tizen-icon-common; background-image: url(images/controls/button/00_button_rename.png); }
.ui-btn-down-s .ui-icon-delete {.tizen-icon-common; background-image: url(images/controls/button/00_button_expand_cancel_press.png); }
.ui-btn-down-s .ui-icon-plus {.tizen-icon-common; background-image: url(images/controls/button/00_button_plus_press.png); }
.ui-btn-down-s .ui-icon-minus {.tizen-icon-common; background-image: url(images/controls/button/00_button_expand_minus_press.png); }
-.ui-btn-down-s .ui-icon-check { }
-.ui-btn-down-s .ui-icon-gear { }
-.ui-btn-down-s .ui-icon-refresh { }
+.ui-btn-down-s .ui-icon-check {.tizen-icon-common; background-image: url(images/controls/button/00_button_check_press.png); }
+.ui-btn-down-s .ui-icon-gear {.tizen-icon-common; background-image: url(images/controls/button/00_button_gear_press.png); }
+.ui-btn-down-s .ui-icon-refresh {.tizen-icon-common; background-image: url(images/controls/button/00_button_refresh_press.png); }
.ui-btn-down-s .ui-icon-forward {.tizen-icon-common; background-image: url(images/controls/button/00_button_expand_send_press.png); }
-.ui-btn-down-s .ui-icon-back { }
-.ui-btn-down-s .ui-icon-grid { }
-.ui-btn-down-s .ui-icon-star {.tizen-icon-common; background-image: url(images/00_winset_icon_favorite_on_press.png); }
+.ui-btn-down-s .ui-icon-back {.tizen-icon-common; background-image: url(images/controls/button/00_button_back_press.png); }
+.ui-btn-down-s .ui-icon-grid {.tizen-icon-common; background-image: url(images/controls/button/00_button_grid_press.png); }
+.ui-btn-down-s .ui-icon-star {.tizen-icon-common; background-image: url(images/controls/button/00_button_star_press.png); }
.ui-btn-down-s .ui-icon-alert {.tizen-icon-common; background-image: url(images/controls/button/00_button_warning_press.png); }
.ui-btn-down-s .ui-icon-info {.tizen-icon-common; background-image: url(images/controls/button/00_button_info_press.png); }
-.ui-btn-down-s .ui-icon-home { }
-.ui-btn-down-s .ui-icon-search { }
+.ui-btn-down-s .ui-icon-home {.tizen-icon-common; background-image: url(images/controls/button/00_button_home_press.png); }
+.ui-btn-down-s .ui-icon-search {.tizen-icon-common; background-image: url(images/controls/button/00_button_search_press.png); }
.ui-btn-down-s .ui-icon-call {.tizen-icon-common; background-image: url(images/controls/button/00_button_call_press.png); }
.ui-btn-down-s .ui-icon-rename {.tizen-icon-common; background-image: url(images/controls/button/00_button_rename_press.png); }
.LESStext-no-ellipsis();
}
- .ui-toggleswitch {
+ .ui-toggle-switch {
&:last-child {
top : 50%;
- margin-top : -20 * @unit_base;
+ margin-top : -17 * @unit_base;
display : inline-block;
position : absolute;
right : 0px;
}
}
- .ui-toggleswitch.ui-toggleswitch-image-style {
- &:last-child {
- margin-top : -17 * @unit_base;
-
- right : 0px;
- }
- }
[data-role="button"] {
&:last-child {
}
}
+// Edit list mode
+.ui-listview {
+ li.ui-li-dialogue-edit{
+ padding-left : 116 * @unit_base;
+ padding-top : 12 * @unit_base;
+ padding-bottom : 12 * @unit_base;
+
+ .ui-edit-title {
+ position : absolute;
+ left : 10 * @unit_base;
+ width : 91 * @unit_base;
+ padding-right : 8 * @unit_base;
+ display : inline-block;
+ top : 50%;
+ margin-top : -13 * @unit_base;
+
+ border-right-color : rgba(185, 184, 178, 1);
+ border-right-width : 1px;
+ border-right-style : solid;
+ }
+
+ input {
+ font-size : 22 * @unit_base;
+ background : transparent;
+ outline-color : transparent;
+ width : 100%;
+ padding-left : 0px;
+ padding-right : 0px;
+ }
+ }
+
+ > .ui-li.ui-li-dialogue-edit.ui-li-has-right-btn {
+ padding-right : 110 * @unit_base;
+ }
+}
+
// =========
// bubble li
// =========
}
}
-// Expandable list animation
-.ui-listview {
- .ui-li-expanded {
- background-color: @color_list_expandable_expanded_bg;
- }
- .ui-li-expanded .ui-li-expanded { // 3rd~ more depth
- background-color: @color_list_expandable_expanded_bg;
- }
- .ui-li-expandable-shown {
- // Down arrow
- .LESSimg-expanded-icon;
- }
- .ui-li-expandable-hidden {
- // Right arrow
- .LESSimg-expand-icon;
- }
- .ui-li-expanded {
- overflow-x: hidden;
- }
- .ui-li-expand-transition-show {
- visibility: visible;
- -webkit-transition: all 0.2s ease;
- -moz-transition: all 0.2s ease;
- -o-transition: all 0.2s ease;
- -ms-transition: all 0.2s ease;
- transition: all 0.2s ease;
- }
- .ui-li-expand-transition-hide {
- visibility: hidden;
- height: 0px !important;
- min-height: 0px !important;
- padding-top: 0px;
- padding-bottom: 0px;
- border-top: 0px !important;
- border-bottom: 0px !important;
- -webkit-transition: all 0.2s ease;
- -moz-transition: all 0.2s ease;
- -o-transition: all 0.2s ease;
- -ms-transition: all 0.2s ease;
- transition: all 0.2s ease;
- }
-}
-
-
-.LESSimg-expand-icon(@right:@list-li-padding-horizontal, @size:37*@unit_base) {
- .ui-li-expand-icon {
- background-image: url(images/00_button_expand_closed.png);
- background-size: 100%;
- position: absolute;
- top: 50%;
- width: 37 * @unit_base;
- height: 37 * @unit_base;
- margin-top: -(@size/2);
- right: 18 * @unit_base;
- }
-}
-
-.LESSimg-expanded-icon(@right:@list-li-padding-horizontal, @size:37*@unit_base) {
- .ui-li-expanded-icon {
- background-image: url(images/00_button_expand_opened.png);
- background-size: 100%;
- position: absolute;
- top: 50%;
- width: 37 * @unit_base;
- height: 37 * @unit_base;
- margin-top: -(@size/2);
- right: 18 * @unit_base;
- }
-}
-
}
[data-role="controlgroup"] {
- width : 245 * @unit_base; /* temp value */
-
margin-left : auto;
margin-right : auto;
margin-top : 6 * @unit_base; /* temp value */
margin-bottom : 6 * @unit_base; /* temp value */
+ padding-left : 58 * @unit_base;
+ padding-right : 58 * @unit_base;
+
[data-role="button"] {
background : transparent;
- width : 77 * @unit_base;
+ min-width : 77 * @unit_base;
border-style : solid;
border-color : @color_bar_divider_line;
.ui-datefield {
.ui-datefield-seperator {
display: inline-block;
- min-width: 30 * @unit_base;
+ min-width: 10 * @unit_base;
text-align: center;
}
}
.ui-datefield-tab {
- min-width: 60 * @unit_base;
+ min-width: 20 * @unit_base;
}
.ui-btn-box-s .ui-btn-inner.ui-btn-hastxt {
padding: 0.1em 0.5em;
margin-top: -0.3em;
height: 28 * @unit_base;
right: auto;
- position: relative;
+ position: relative ! important;
}
.ui-datetime-text-sub {
z-index : @z_base_header_footer + 100 !important;\r
}\r
\r
-.ui-multimediaview-video {\r
- background-color : @color_multimediaview_control_bg !important;\r
-}\r
-\r
.ui-multimediaview-control span {\r
display : inline-block;\r
}\r
\r
-.ui-multimediaview-control span.ui-play-icon {\r
- background-image : url(./images/00_button_play.png);\r
-}\r
-\r
-.ui-multimediaview-control span.ui-pause-icon {\r
- background-image : url(./images/00_button_pause.png);\r
-}\r
-\r
-.ui-multimediaview-control span.ui-volume-icon {\r
- background-image : url(./images/controls/00_slider_button_volume_02.png);\r
-}\r
-\r
-.ui-multimediaview-control span.ui-mute-icon {\r
- background-image : url(./images/controls/00_slider_button_volume_01.png);\r
-}\r
-\r
-.ui-multimediaview-control span.ui-fullscreen-on {\r
- background-image : url(./images/00_button_fullscreen_on.png);\r
-}\r
-\r
-.ui-multimediaview-control span.ui-fullscreen-off {\r
- background-image : url(./images/00_button_fullscreen_off.png);\r
-}\r
-\r
.ui-multimediaview-control {\r
position : absolute;\r
display : block;\r
background-repeat : no-repeat;\r
width : 74 * @unit_base_multimediaview;\r
height : 74 * @unit_base_multimediaview;\r
- .LESSborder-radius-all( 6 * @unit_base_multimediaview);\r
- background-color : @color_multimediaview_button_bg;\r
margin : 4 * @unit_base_multimediaview;\r
}\r
\r
.ui-multimediaview-control .ui-playpausebutton {\r
- background-color : transparent !important;\r
float : left;\r
}\r
\r
.ui-multimediaview-control .ui-timestamplabel {\r
text-align : center;\r
- color : @color_multimediaview_timestamp_text;\r
float : left;\r
}\r
\r
.ui-multimediaview-control .ui-timestamplabel p {\r
- margin-top : -6 * @unit_base_multimediaview;\r
+ margin-top : -9.8 * @unit_base_multimediaview;\r
margin-left : 4 * @unit_base_multimediaview;\r
padding : 0;\r
text-align : center;\r
\r
.ui-multimediaview-control .ui-durationlabel {\r
text-align : center;\r
- color : @color_multimediaview_duration_text;\r
float : right;\r
}\r
\r
.ui-multimediaview-control .ui-durationlabel p {\r
- margin-top : -6 * @unit_base_multimediaview;\r
+ margin-top : -9.8 * @unit_base_multimediaview;\r
margin-right : 4 * @unit_base_multimediaview;\r
padding : 0;\r
text-align : center;\r
}\r
\r
.ui-multimediaview-control .ui-seekbar {\r
- margin-top : 16 * @unit_base_multimediaview;\r
+ margin-top : 11.5 * @unit_base_multimediaview;\r
padding-left : 4 * @unit_base_multimediaview;\r
padding-right : 4 * @unit_base_multimediaview;\r
height : 16 * @unit_base_multimediaview;\r
padding : 0;\r
width : 100%;\r
height : 16 * @unit_base_multimediaview;\r
- background-color : @color_multimediaview_bar_gray;\r
border-radius : 1.5em;\r
}\r
\r
padding : 0;\r
height : 16 * @unit_base_multimediaview;\r
position : absolute;\r
- background : -webkit-gradient(linear, left top, left bottom, from(#6298D9), to(#295B98));\r
- background : -moz-linear-gradient(top, #6298D9, #295B98);\r
- background : -o-linear-gradient(top, #6298D9, #295B98);\r
- background : -ms-linear-gradient(top, #6298D9, #295B98);\r
- background-color : @color_multimediaview_bar_active;\r
border-radius : 1.5em;\r
}\r
\r
width : 160 * @unit_base_multimediaview;\r
height : 16 * @unit_base_multimediaview;\r
position : absolute;\r
- background-color : @color_multimediaview_bar_gray;\r
border-radius : 1.5em;\r
}\r
\r
padding : 0;\r
height : 16 * @unit_base_multimediaview;\r
position : absolute;\r
- background : -webkit-gradient(linear, left top, left bottom, from(#6298D9), to(#295B98));\r
- background : -moz-linear-gradient(top, #6298D9, #295B98);\r
- background : -o-linear-gradient(top, #6298D9, #295B98);\r
- background : -ms-linear-gradient(top, #6298D9, #295B98);\r
- background-color : @color_multimediaview_bar_active;\r
border-radius : 1.5em;\r
}\r
\r
width : 30 * @unit_base_multimediaview;\r
height : 30 * @unit_base_multimediaview;\r
position : absolute;\r
- background-color : @color_multimediaview_bar_handle;\r
- background : -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#E6E6E6));\r
- background : -moz-linear-gradient(top, #FFFFFF, #E6E6E6);\r
- background : -o-linear-gradient(top, #FFFFFF, #E6E6E6);\r
- background : -ms-linear-gradient(top, #FFFFFF, #E6E6E6);\r
- border : solid 1px @color_multimediaview_button_border;\r
+ border-style: solid;\r
+ border-width: 1px;\r
border-radius : 1.5em;\r
}\r
+\r
+/* S\r
+-----------------------------------------------------------------------------------------------------------*/\r
+\r
+.ui-multimediaview-s {\r
+ .ui-multimediaview-video {\r
+ background-color : @color_multimediaview_control_bg;\r
+ }\r
+\r
+ .ui-timestamplabel {\r
+ color : @color_multimediaview_timestamp_text;\r
+ }\r
+\r
+ .ui-durationlabel {\r
+ color : @color_multimediaview_duration_text;\r
+ }\r
+\r
+ span.ui-button {\r
+ background-color : @color_multimediaview_button_bg;\r
+ }\r
+\r
+ span.ui-play-icon {\r
+ background-image : url(./images/00_button_play.png);\r
+ }\r
+\r
+ span.ui-pause-icon {\r
+ background-image : url(./images/00_button_pause.png);\r
+ }\r
+\r
+ span.ui-volume-icon {\r
+ background-image : url(./images/controls/00_slider_button_volume_02.png);\r
+ }\r
+\r
+ span.ui-mute-icon {\r
+ background-image : url(./images/controls/00_slider_button_volume_01.png);\r
+ }\r
+\r
+ span.ui-fullscreen-on {\r
+ background-image : url(./images/00_button_fullscreen_on.png);\r
+ }\r
+\r
+ span.ui-fullscreen-off {\r
+ background-image : url(./images/00_button_fullscreen_off.png);\r
+ }\r
+\r
+ .ui-seekbar {\r
+ .ui-duration {\r
+ background-color : @color_multimediaview_bar_gray;\r
+ }\r
+\r
+ .ui-currenttime {\r
+ .LESSmultimediaview_bar_active_style();\r
+ }\r
+ }\r
+\r
+ .ui-volumebar {\r
+ .ui-guide {\r
+ background-color : @color_multimediaview_bar_gray;\r
+ }\r
+\r
+ .ui-value {\r
+ .LESSmultimediaview_bar_active_style();\r
+ }\r
+\r
+ .ui-handler {\r
+ .LESSmultimediaview_bar_handle_style();\r
+ border-color : @color_multimediaview_button_border;\r
+ }\r
+ }\r
+}\r
+\r
}
}
-.ui-progress-pending-bg {
- position: relative;
- top: 0;
- margin-left: @bar-margin;
- margin-right: @bar-margin;
- height: 18 * @unit_base;
-
- //FIXME
- //background-image: url(images/00_winset_list_progress_bg.png);
- background-color: @color_progress_bar0;
- .LESSborder-radius-all( 10 * @unit_base );
-}
-
-.ui-progress-container-pending {
- position: relative;
- overflow: hidden;
-
- top: 5 * @unit_base;
- height: @bar-height;
- margin-left: 5 * @unit_base;
- margin-right: 5 * @unit_base;
-
- .LESSborder-radius-all( 10 * @unit_base );
- border: 1px;
- border-style: solid;
- border-color: rgb(180, 180, 180);
- .LESSbox-shadow(1px, -1px, 1px, rgb(180, 180, 180));
-}
-
.ui-progress-pending {
position: relative;
top: 0;
padding-top: 0;
padding-bottom: 0;
- background: -webkit-linear-gradient(-45deg,
- transparent,
- transparent 10%,
- @color_progress_bar1 10%,
- @color_progress_bar1 20%,
- transparent 20%,
- transparent 30%,
- @color_progress_bar1 30%,
- @color_progress_bar1 40%,
- transparent 40%,
- transparent 50%,
- @color_progress_bar1 50%,
- @color_progress_bar1 60%,
- transparent 60%,
- transparent 70%,
- @color_progress_bar1 70%,
- @color_progress_bar1 80%,
- transparent 80%,
- transparent 90%,
- @color_progress_bar1 90%);
-
background: -webkit-gradient(linear,
left top,
right bottom,
color-stop(0%, rgba(0,0,0,0)),
color-stop(25%, rgba(0,0,0,0)),
- color-stop(25%, @color_progress_bar1),
- color-stop(50%, @color_progress_bar1),
+ color-stop(25%, @color_progress_value0),
+ color-stop(50%, @color_progress_value0),
color-stop(50%, rgba(0,0,0,0)),
color-stop(75%, rgba(0,0,0,0)),
- color-stop(75%, @color_progress_bar1));
+ color-stop(75%, @color_progress_value0));
background-color: @color_progress_bar0;
.ui-progressbar-value {
height: 100%;
- //FIXME
- //background-image: url(images/00_winset_list_progress_bar.png);
- background-color: @color_progress_bar1;
+ background-image: -webkit-gradient(
+ linear,
+ left bottom,
+ left top,
+ color-stop(0, @color_progress_value0),
+ color-stop(1, @color_progress_value1)
+ );
.LESSborder-radius-all( 10 * @unit_base );
+ .LESSbox-shadow(-1px, -1px, 1px, rgb(179, 200, 226));
}
-.ui-progress-bg {
+.ui-progressbar-bg {
position: relative;
overflow: hidden;
.LESSborder-radius-all( 10 * @unit_base );
border: 1px;
border-style: solid;
- border-color: rgb(180, 180, 180);
- .LESSbox-shadow(1px, -1px, 1px, rgb(180, 180, 180));
+ border-color: @color_progress_boarder;
+ .LESSbox-shadow(1px, -1px, 1px, @color_progress_boarder);
+ background-color: @color_progress_bar0;
}
.ui-progressbar {
margin-right: @bar-margin;
height: @bar-height;
- //FIXME
- //background-image: url(images/00_winset_list_progress_bg.png);
- background-color: @color_progress_bar0;
+ background-image: -webkit-gradient(
+ linear,
+ left bottom,
+ left top,
+ color-stop(0, @color_progress_bar1),
+ color-stop(1, @color_progress_bar0)
+ );
+ .LESSbox-shadow(1px, 1px, 0px, white);
.LESSborder-radius-all( 10 * @unit_base );
}
overflow : hidden;
}
-.ui-handler-y {
+.ui-handler-direction-y {
top : 10 * @unit_base_handler;
right : 10 * @unit_base_handler;
bottom : 10 * @unit_base_handler;
width : 48 * @unit_base_handler;
}
-.ui-handler-x {
+.ui-handler-direction-x {
right : 10 * @unit_base_handler;
bottom : 10 * @unit_base_handler;
left : 10 * @unit_base_handler;
position : absolute;
top : 0;
left : 0;
- background-color : @color_scrollview_handler_bg;
background-position : center;
background-repeat : no-repeat;
.LESSborder-radius-all(5 * @unit_base_handler);
}
-.ui-handler-y .ui-handler-thumb {
+.ui-handler-direction-y .ui-handler-thumb {
width : 48 * @unit_base_handler;
height : 214 * @unit_base_handler;
- background-image : url("images/00_scroll_bar_handler.png");
background-size : 48 * @unit_base_handler 40 * @unit_base_handler;
}
-.ui-handler-x .ui-handler-thumb {
+.ui-handler-direction-x .ui-handler-thumb {
width : 214 * @unit_base_handler;
height : 48 * @unit_base_handler;
- background-image : url("images/00_scroll_bar_handler_hor.png");
background-size : 40 * @unit_base_handler 48 * @unit_base_handler;
}
+
+/* S
+-----------------------------------------------------------------------------------------------------------*/
+
+.ui-handler-s {
+ .ui-handler-thumb {
+ background-color : @color_scrollview_handler_bg;
+ }
+
+ .ui-handler-direction-y .ui-handler-thumb {
+ background-image : url("images/00_scroll_bar_handler.png");
+ }
+
+ .ui-handler-direction-x .ui-handler-thumb {
+ background-image : url("images/00_scroll_bar_handler_hor.png");
+ }
+}
position: relative;
vertical-align: middle;
+ height: 18 * @unit_base;
margin-left: 16 * @unit_base;
margin-right: 16 * @unit_base;
+
+ background-image: -webkit-gradient(
+ linear,
+ left bottom,
+ left top,
+ color-stop(0, @color_progress_bar1),
+ color-stop(1, @color_progress_bar0)
+ );
+ .LESSbox-shadow(1px, 1px, 0px, white);
+ .LESSborder-radius-all( 10 * @unit_base );
}
.ui-slider-icon-bg {
position: absolute;
vertical-align: middle;
- top: -0.35rem;
+ top: -0.5rem;
left: -50 * @unit_base;
height: @img-height;
width: @img-width;
.ui-slider-right-bright {
position: absolute;
- top: -0.35rem;
+ top: -0.5rem;
right: -50 * @unit_base;
height: @img-height;
width: @img-width;
.ui-slider-left-text {
position: absolute;
- top: -0.35rem;
+ top: -0.5rem;
left: -52 * @unit_base;
height: 37 * @unit_base;
width: 37 * @unit_base;
.ui-slider-right-text {
position: absolute;
- top: -0.35rem;
+ top: -0.5rem;
right: -52 * @unit_base;
height: 37 * @unit_base;
width: 37 * @unit_base;
color: rgb(100, 100, 100);
}
-div.ui-slider {
- display: inline-block;
- overflow: visible;
+div.ui-slider:not(.ui-toggle-switch) {
+ position: relative;
- height: 18 * @unit_base;
- width: 100%;
+ top: 5 * @unit_base;
+ height: 7 * @unit_base;
+ margin-left: 5 * @unit_base;
+ margin-right: 5 * @unit_base;
- //FIXME
- //background-image: url(images/00_progress_bg.9.png);
- background-color: rgb(236,233,229);
+ .LESSborder-radius-all( 10 * @unit_base );
+ border: 1px;
+ border-style: solid;
+ border-color: @color_progress_boarder;
+ .LESSbox-shadow(1px, -1px, 1px, @color_progress_boarder);
+ background-color: @color_progress_bar0;
.ui-btn {
- top: -0.45rem;
+ top: -0.8rem;
margin-top: 0;
}
.ui-btn-inner {
width: @popup-width;
height: @popup-height;
- top: -56 * @unit_base;
+ top: -60 * @unit_base;
padding-top: 0.1rem;
color: @color_slider_popup_text;
text-align: center;
font-size: 1.5rem;
- background: url(images/00_slider_popup_bg.png) no-repeat;
+ background: url(images/controls/00_slider_popup_bg.png) no-repeat;
.LESSbackground-size(@popup-width, @popup-height);
}
position: relative;
top: -36 * @unit_base;
- height: 18 * @unit_base;
+ height: 7 * @unit_base;
width: 0;
- //FIXME
- //background-image: url(images/00_progress_bar.9.png);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
- color-stop(0.2, rgb(236,233,229)),
- color-stop(0.2, rgb(54,119,155)),
- color-stop(0.8, rgb(54,119,195)),
- color-stop(0.8, rgb(236,233,229))
+ color-stop(0, @color_progress_value0),
+ color-stop(1, @color_progress_value1)
);
+ .LESSborder-radius-all( 10 * @unit_base );
+ .LESSbox-shadow(-1px, -1px, 1px, rgb(179, 200, 226));
}
.ui-slider-handle-press {
@import "config.less";
-.ui-toggleswitch {
- height: 40 * @unit_base;
- width: 30 * @unit_base;
- overflow: hidden;
- .ui-toggleswitch-mover {
- position: relative;
- font-size : 13 * @unit_base;
- line-height : 20 * @unit_base;
- display: block;
- .ui-toggleswitch-off {
- border-radius: 5 * @unit_base;
- color: @color_text_sub;
- .LESStoggleswitch_off_style;
- height: 40 * @unit_base;
- .ui-toggleswitch-img{
- width: 100%;
- position: absolute;
- padding-top: 7 * @unit_base;
- .ui-toggleswitch-sign{
- position: absolute;
- width: 66 * @unit_base;
- height: 35 * @unit_base;
- /*left: 50%;*/
- margin-left:-2px;
- background: url(images/00_button_off.png) no-repeat;
- background-size: cover;
- -ms-background-size: cover;
- -webkit-background-size: cover;
- -o-background-size: cover;
- -moz-background-size: cover;
- }
- }
- }
+div.ui-slider.ui-toggle-switch {
+ width: 66 * @unit_base;
+ height: 35 * @unit_base;
+ background-color : transparent;
- .ui-toggleswitch-on {
- display: none;
- border-radius: 5 * @unit_base;
- .LESStoggleswitch_on_style;
- height: 40 * @unit_base;
- color: white;
- .ui-toggleswitch-img{
- width: 100%;
- position: absolute;
- padding-top: 6 * @unit_base;
- text-align: center;
- .ui-toggleswitch-sign{
- position: absolute;
- width: 66 * @unit_base;
- height: 35 * @unit_base;
- left: 50%;
- margin-left:-7px;
- background: url(images/00_button_on.png) no-repeat;
- background-size: cover;
- -ms-background-size: cover;
- -webkit-background-size: cover;
- -o-background-size: cover;
- -moz-background-size: cover;
- }
- }
- }
+ .ui-slider-label {
+ position: absolute;
+ width: 66 * @unit_base;
+ height: 35 * @unit_base;
+ background-size: cover;
+ -ms-background-size: cover;
+ -webkit-background-size: cover;
+ -o-background-size: cover;
+ -moz-background-size: cover;
- .ui-toggleswitch-reed {
- position: absolute;
- border-radius: 5 * @unit_base;
- width: 28 * @unit_base;
- .LESStoggleswitch_reed_style;
- top: 20 * @unit_base;
- height: 19 * @unit_base;
- left: 1px;
+ &.ui-slider-label-a {
+ background: url(images/00_button_on.png) no-repeat;
}
- .ui-toggleswitch-text {
- width: 100%;
- position: absolute;
- text-align: center;
- text-overflow: ellipsis;
+ &.ui-slider-label-b {
+ background: url(images/00_button_off.png) no-repeat;
}
}
-}
-
-.ui-toggleswitch-state-checked {
- .ui-toggleswitch-mover {
- .ui-toggleswitch-reed {
- top: 1px;
- }
- .ui-toggleswitch-text {
- top: 20 * @unit_base;
- }
- .ui-toggleswitch-img{
- top: 20 * @unit_base;
- }
- .ui-toggleswitch-on {
- display: block;
- }
-
- .ui-toggleswitch-off {
- display: none;
+ .ui-slider-inneroffset {
+ a {
+ background : none;
}
}
}
-.ui-toggleswitch.ui-toggleswitch-image-style {
- display : inline-block;
-
- width : 66 * @unit_base;
- height : 35 * @unit_base;
- .ui-toggleswitch-mover {
-
- .ui-toggleswitch-off,
- .ui-toggleswitch-on {
- background-image : none;
-
- height : 66 * @unit_base;
- width : 35 * @unit_base;
+div.ui-slider.ui-slider-switch:not(.ui-toggle-switch) {
+ position : relative;
+ width : 5.5em;
+ height : 32 * @unit_base;
- .ui-toggleswitch-img {
- padding-top : 0px;
- top : 0px;
-
- .ui-toggleswitch-sign {
- left : 0px;
- margin-left : 0px;
- }
- }
+ a.ui-slider-handle {
+ position : absolute;
+ background : rgba(255, 255, 255, 1);
+ top : -34 * @unit_base;
+ margin-top : 30 * @unit_base;
+ border-radius : 15 * @unit_base;
+ border : 2px solid gray;
+ }
+ span {
+ position : absolute;
+ overflow : hidden;
+ text-align : center;
+ height : 32 * @unit_base;
+ font-weight : bold;
+ border-radius : 10 * @unit_base;
+ &.ui-slider-label-a {
+ left : 0px;
+ color : white;
+ }
+ &.ui-slider-label-b {
+ right : 0px;
+ color : black;
}
}
}
\ No newline at end of file
/***************************************************************************
Progress
***************************************************************************/
-@color_progress_bar0: rgb(226, 223, 219);
-@color_progress_bar1: rgb(54, 119, 195);
+@color_progress_bar0: rgb(202, 200, 196);
+@color_progress_bar1: rgb(246, 243, 239);
+@color_progress_boarder: rgb(163, 160, 158);
+@color_progress_value0: rgb(54, 119, 195);
+@color_progress_value1: rgb(150, 184, 224);
/***************************************************************************
@color_multimediaview_bar_handle : rgb(249, 249, 249);
@color_multimediaview_button_border : rgb(186, 185, 180);
+.LESSmultimediaview_bar_active_style{
+ background-color : @color_multimediaview_bar_active;
+ background-image : -webkit-gradient(linear, left top, left bottom, from(rgb(98, 137, 217)), to(rgb(41, 91, 152)));
+ background-image : -moz-linear-gradient(top, rgb(98, 137, 217), rgb(41, 91, 152));
+ background-image : -o-linear-gradient(top, rgb(98, 137, 217), rgb(41, 91, 152));
+ background-image : -ms-linear-gradient(top, rgb(98, 137, 217), rgb(41, 91, 152));
+}
+
+.LESSmultimediaview_bar_handle_style{
+ background-color : @color_multimediaview_bar_handle;
+ background-image : -webkit-gradient(linear, left top, left bottom, from(rgb(255, 255, 255)), to(rgb(230, 230, 230)));
+ background-image : -moz-linear-gradient(top, rgb(255, 255, 255), rgb(230, 230, 230));
+ background-image : -o-linear-gradient(top, rgb(255, 255, 255), rgb(230, 230, 230));
+ background-image : -ms-linear-gradient(top, rgb(255, 255, 255), rgb(230, 230, 230));
+}
+
/***************************************************************************
tokentextarea
+++ /dev/null
-( function ( $, undefined ) {
-
- $.widget( "mobile.barlayout", $.mobile.widget, {
- options: {
- addBackBtn: false ,
- backBtnText: "Back",
- initSelector: ":jqmData(role='header'), :jqmData(role='footer')"
- },
- _create: function () {
- var self = this;
- /* this call api will be moved to jquery.mobile.page.section.js patch */
- /* call _generateFooter in header(just 1 time in first step) because to calculate another layout width footer/header */
- /* skip below step to attach bind/addclass only 1 time */
- self._generateFooter();
- self._addBackbutton();
- self._disableSelection();
- },
-
- /* Make dummy footer
- * because minimum fixed bar needs to attach back button
- * check footer exist on current page, then check footer-Exist option check */
- _generateFooter: function () {
- var self = this,
- $el = self.element,
- $elPage = $el.closest( ".ui-page" ),
- dummyFooter;
-
- if ( $elPage.children(":jqmData(role='footer')").length == 0 && $elPage.data().page.options.footerExist != false ) {
- dummyFooter = $( "<div data-role='footer' class='ui-footer ui-bar-s ui-footer-fixed fade ui-fixed-overlay' data-position='fixed'></div>" )
- .insertAfter( $elPage.find( ".ui-content" ) );
- }
- },
-
- _addBackbutton: function ( target, status ) {
- // need to add parameter target wherels this requert occurs header/footer
- var self = this,
- $el = self.element,
- $elHeader = $el.jqmData( "role" ) === "header" ? $el : $el.siblings( ":jqmData(role='header')" ),
- $elFooter = $el.jqmData( "role" ) === "footer" ? $el : $el.siblings( ":jqmData(role='footer')" ),
- $elPage = $el.closest( ".ui-page" ),
- backBtn,
- attachElement = $elFooter,
- o = $elPage.data( "page" ).options;
-
- /* Back button skip case :
- * 1. footer does not exist and addBackBtn is set to "footer"
- * 2. user define data-add-Back-Btn = "false"
- */
- if ( status != "external" ) {
- if ( $elPage.data().page.options.addBackBtn == "none" || ( $elPage.data().page.options.addBackBtn == "footer" && $elPage.data().page.options.footerExist == false ) ) {
- return true;
- }
- }
-
- attachElement = ( $elPage.data().page.options.addBackBtn === "header" ) ? $elHeader : $elFooter;
-
- backBtn = $( "<a href='#' class='ui-btn-back' data-" + $.mobile.ns + "rel='back'></a>" )
- .buttonMarkup( {icon: "header-back-btn", theme : "s"} );
-
- if ( status == "external" ) {
- if ( $el.is(".ui-page") ) {
- $elHeader = $el.find( ":jqmData(role='header')" );
- $elFooter = $el.find( ":jqmData(role='footer')" );
- attachElement = ( target === "header" ) ? $elHeader : $elFooter;
- } else {
- attachElement = $el;
- }
- if ( attachElement.find(".ui-btn-back").length == 0 ) {
- backBtn.prependTo( attachElement );
- }
- }
-
- if ( $elPage.jqmData( "url" ) !== $.mobile.path.stripHash( location.hash ) ) {
- if ( attachElement.find(".ui-btn-back").length == 0) {
- backBtn.prependTo( attachElement );
- }
- }
-
- /* jQM 1.1.0 does not need this code.
- navigation.js control whole back buttons. */
- /*
- backBtn.bind( "vclick", function( event ) {
- window.history.back();
- });
- */
- },
-
- _disableSelection : function () {
- var self = this,
- $el = self.element,
- $elHeader = $el.jqmData( "role" ) === "header" ? $el : $el.siblings( ":jqmData(role='header')" ),
- $elFooter = $el.jqmData( "role" ) === "footer" ? $el : $el.siblings( ":jqmData(role='footer')" );
-
- // disable selection
- $.mobile.tizen.disableSelection( $elHeader );
- $.mobile.tizen.disableSelection( $elFooter );
-
- // disable context menu
- $.mobile.tizen.disableContextMenu( $elHeader );
- $.mobile.tizen.disableContextMenu( $elFooter );
- },
-
- addBackBtn : function ( target ) {
- this._addBackbutton( target, "external" );
- },
-
-
- show: function () {
- var self = $( this.element );
- self.show();
- self.siblings( ".ui-content" ).pagelayout( "updatePageLayout" );
- },
-
- hide: function () {
- var self = $( this.element );
- self.hide();
- self.siblings( ".ui-content" ).pagelayout( "updatePageLayout" );
- },
-
- });
- $( document ).bind("pagecreate", function ( e ) {
- $.mobile.barlayout.prototype.enhanceWithin( e.target );
- });
-})( jQuery );
y = 0,
scroll_height = 0,
self = this,
- bouncing = function ( dir ) {
+ end_effect = function ( dir ) {
setTimeout( function () {
- self._bouncing_dir = dir;
- self._setBouncing( self._$view, "in" );
+ self._effect_dir = dir;
+ self._setEndEffect( "in" );
}, 100 );
setTimeout( function () {
- self._setBouncing( self._$view, "out" );
+ self._setEndEffect( "out" );
}, 350 );
},
vt = this._vTracker,
this._outerScroll( y - vt.getRemained() / 3, scroll_height );
if ( scroll_height > 0 ) {
- bouncing( 1 );
+ end_effect( 1 );
}
} else if ( vt.isMax() ) {
this._outerScroll( vt.getRemained() / 3, scroll_height );
if ( scroll_height > 0 ) {
- bouncing( 0 );
+ end_effect( 0 );
}
}
}
var translate,
transition;
- if ( this._bouncing ) {
+ if ( this._endEffect ) {
return;
}
});
},
- _setBouncing: function ( $ele, dir ) {
+ _setEndEffect: function ( dir ) {
var scroll_height = this._getViewHeight() - this._$clip.height();
if ( this._softkeyboard ) {
- if ( this._bouncing_dir ) {
+ if ( this._effect_dir ) {
this._outerScroll( -scroll_height - this._softkeyboardHeight,
scroll_height );
} else {
}
if ( dir === "in" ) {
- if ( this._bouncing ) {
+ if ( this._endEffect ) {
return;
}
- this._bouncing = true;
- this._bouncing_count = 1;
-
- this._bouncing_org_x = 1;
- this._bouncing_org_y = 1;
-
- this._bouncing_x = 0.99;
- this._bouncing_y = 0.99;
-
- this._setOverflowIndicator( this._bouncing_dir );
+ this._endEffect = true;
+ this._setOverflowIndicator( this._effect_dir );
} else if ( dir === "out" ) {
- if ( !this._bouncing ) {
+ if ( !this._endEffect ) {
return;
}
- this._bouncing = false;
- this._bouncing_count = 1;
-
- this._bouncing_org_x = this._bouncing_x;
- this._bouncing_org_y = this._bouncing_y;
-
- this._bouncing_x = 1;
- this._bouncing_y = 1;
- this._setOverflowIndicator( this._bouncing_dir );
- } else {
- return;
- }
-
- this._doBouncing( $ele, dir );
- },
-
- _doBouncing: function ( $ele, dir ) {
- var translate,
- origin,
- x_rate,
- y_rate,
- frame = 10,
- self = this;
-
- if ( $.support.cssTransform3d ) {
- translate = "translate3d(" + this._sx + "px," + this._sy + "px, 0px)";
- } else {
- translate = "translate(" + this._sx + "px," + this._sy + "px)";
- }
-
- if ( dir === "in" ) {
- x_rate = this._bouncing_org_x - ( this._bouncing_org_x -
- this._bouncing_x ) / frame * this._bouncing_count;
- y_rate = this._bouncing_org_y - ( this._bouncing_org_y -
- this._bouncing_y ) / frame * this._bouncing_count;
-
- translate += " scale(" + x_rate + "," + y_rate + ")";
- } else if ( dir === "out" ) {
- x_rate = this._bouncing_org_x + ( this._bouncing_x -
- this._bouncing_org_x ) / frame * this._bouncing_count;
- y_rate = this._bouncing_org_y + ( this._bouncing_y -
- this._bouncing_org_y ) / frame * this._bouncing_count;
-
- translate += " scale(" + x_rate + "," + y_rate + ")";
- } else {
- return;
- }
-
- if ( this._bouncing_dir ) {
- origin = "50% " + ( this._bouncing_y * 100 - 10 ) + "%";
- } else {
- origin = "50% 10%";
- }
-
- $ele.css({
- "-moz-transform": translate,
- "-webkit-transform": translate,
- "-ms-transform": translate,
- "-o-transform": translate,
- "transform": translate,
- "-webkit-transform-origin": origin,
- });
-
- this._bouncing_count++;
-
- if ( this._bouncing_count > frame ) {
- return;
+ this._endEffect = false;
+ this._setOverflowIndicator( this._effect_dir );
}
-
- setTimeout( function () {
- self._doBouncing( $ele, dir );
- }, this._timerInterval );
},
_setCalibration: function ( x, y ) {
if ( y > 0 ) {
this._sy = 0;
- if ( scroll_height > 0 ) {
- this._bouncing_dir = 0;
- this._setBouncing( this._$view, "in" );
+ if ( this._didDrag && scroll_height > 0 ) {
+ this._effect_dir = 0;
+ this._setEndEffect( "in" );
}
} else if ( y < -scroll_height ) {
this._sy = -scroll_height;
- if ( scroll_height > 0 ) {
- this._bouncing_dir = 1;
- this._setBouncing( this._$view, "in" );
+ if ( this._didDrag && scroll_height > 0 ) {
+ this._effect_dir = 1;
+ this._setEndEffect( "in" );
}
} else {
- if ( this._bouncing && this._sy !== y ) {
- this._bouncing = false;
+ if ( this._endEffect && this._sy !== y ) {
+ this._endEffect = false;
+ this._setOverflowIndicator();
}
this._sy = y;
this._disableTracking();
- if ( this._bouncing ) {
- this._setBouncing( this._$view, "out" );
+ if ( this._endEffect ) {
+ this._setEndEffect( "out" );
this._hideScrollBars();
this._hideOverflowIndicator();
}
$v.bind( this._dragEvt, this._dragCB );
+ $v.bind( "keydown", function ( e ) {
+ var elem,
+ elem_top,
+ screen_h;
+
+ if ( e.keyCode == 9 ) {
+ return false;
+ }
+
+ elem = $c.find(".ui-focus");
+
+ if ( elem === undefined ) {
+ return;
+ }
+
+ elem_top = elem.offset().top;
+ screen_h = $c.offset().top + $c.height() - elem.height();
+
+ if ( self._softkeyboard ) {
+ screen_h -= self._softkeyboardHeight;
+ }
+
+ if ( ( elem_top < 0 ) || ( elem_top > screen_h ) ) {
+ self.scrollTo( 0, self._sy - elem_top +
+ elem.height() + $c.offset().top, 0);
+ }
+
+ return;
+ });
+
+ $v.bind( "keyup", function ( e ) {
+ var input,
+ elem,
+ elem_top,
+ screen_h;
+
+ if ( e.keyCode != 9 ) {
+ return;
+ }
+
+ /* Tab Key */
+
+ input = $( this ).find(":input");
+
+ for ( i = 0; i < input.length; i++ ) {
+ if ( !$( input[i] ).hasClass("ui-focus") ) {
+ continue;
+ }
+
+ if ( i + 1 == input.length ) {
+ elem = $( input[0] );
+ } else {
+ elem = $( input[i + 1] );
+ }
+
+ elem_top = elem.offset().top;
+ screen_h = $c.offset().top + $c.height() - elem.height();
+
+ if ( self._softkeyboard ) {
+ screen_h -= self._softkeyboardHeight;
+ }
+
+ if ( ( elem_top < 0 ) || ( elem_top > screen_h ) ) {
+ self.scrollTo( 0, self._sy - elem_top +
+ elem.height() + $c.offset().top, 0);
+ }
+
+ elem.focus();
+
+ break;
+ }
+
+ return false;
+ });
+
$c.bind( "updatelayout", function ( e ) {
var sy,
vh,
return;
}
- if ( self._sy - sy <= -vh ) {
- self.scrollTo( 0, sy,
+ if ( sy > 0 ) {
+ self.scrollTo( 0, 0, 0 );
+ } else if ( self._sy - sy <= -vh ) {
+ self.scrollTo( 0, self._sy,
self.options.snapbackDuration );
} else if ( self._sy - sy <= vh + self.options.moveThreshold ) {
self.scrollTo( 0, sy,
+++ /dev/null
-/* dayselector CSS */
-.ui-dayselector {
- display: inline-block;
-}
-
-.ui-dayselector label {
- height: 56px;
- width: 64px;
-}
-
-.ui-dayselector-label-6 {
- color: blue;
-}
-
-.ui-dayselector-label-0 {
- color: red;
-}
-
-.todons-dayselector-disabled .ui-dayselector-label-6 {
- color: #121212;
-}
-
-.todons-dayselector-disabled .ui-dayselector-label-0 {
- color: #363636;
-}
+++ /dev/null
-/*
- * jQuery Mobile Widget @VERSION
- *
- * This software is licensed under the MIT licence (as defined by the OSI at
- * http://www.opensource.org/licenses/mit-license.php)
- *
- * ***************************************************************************
- * Copyright (C) 2011 by Intel Corporation Ltd.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a
- * copy of this software and associated documentation files (the "Software"),
- * to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the
- * Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in
- * all copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
- * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
- * DEALINGS IN THE SOFTWARE.
- * ***************************************************************************
- *
- * Authors: Rijubrata Bhaumik <rijubrata.bhaumik@intel.com>
- * Elliot Smith <elliot.smith@intel.com>
- */
-
-// Displays a day selector element: a control group with 7 check
-// boxes which can be toggled on and off.
-//
-// The widget can be invoked on fieldset element with
-// $(element).dayselector() or by creating a fieldset element with
-// data-role="dayselector". If you try to apply it to an element
-// of type other than fieldset, results will be unpredictable.
-//
-// The default is to display the controlgroup horizontally; you can
-// override this by setting data-type="vertical" on the fieldset,
-// or by passing a type option to the constructor. The data-type
-// attribute has precedence.
-//
-// If no ID is supplied for the dayselector, one will be generated
-// automatically.
-//
-// Methods:
-//
-// value: Return the day numbers (0=Sunday, ..., 6=Saturday) of
-// the selected checkboxes as an array.
-//
-// selectAll: Select all 7 days of the week by automatically "ticking"
-// all of the checkboxes.
-//
-// Options:
-//
-// theme : Override the data-theme of the widget; note that the
-// order of preference is: 1) set from data-theme attribute;
-// 2) set from option; 3) set from closest parent data-theme;
-// 4) default to 'c'
-//
-// type: 'horizontal' (default) or 'vertical'; specifies the type
-// of controlgroup to create around the day check boxes.
-//
-// days: array of day names, Sunday first; defaults to English day
-// names; the first letters are used as text for the checkboxes
-/**
- @class Dayselector
- The day selector widget shows a grouped button on the screen for selecting weekdays. <br/> To add a day selector widget to the application, use the following code:
-
- <fieldset id="dayselector1" data-role="dayselector" data-type="horizontal">
- <legend><!-- Day selector description --></legend>
- </fieldset>
-*/
-(function ( $, window, undefined ) {
- $.widget( "tizen.dayselector", $.mobile.widget, {
- options: {
- initSelector: 'fieldset:jqmData(role="dayselector")',
- theme: null,
- type: 'horizontal',
- days: ['Sunday',
- 'Monday',
- 'Tuesday',
- 'Wednesday',
- 'Thursday',
- 'Friday',
- 'Saturday']
- },
-
- defaultTheme: 's',
-
- _create: function () {
- var days,
- parentId,
- i,
- day,
- letter,
- id,
- labelClass,
- checkbox,
- label;
-
- this.element.addClass( 'ui-dayselector' );
-
- this.options.type = this.element.jqmData( 'type' ) || this.options.type;
-
- this.options.theme = this.element.jqmData( 'theme' ) ||
- this.options.theme ||
- this.element.closest( ':jqmData(theme)').jqmData('theme' ) ||
- this.defaultTheme;
-
- days = this.options.days;
-
- this.element.attr( 'data-' + $.mobile.ns + 'type', this.options.type );
-
- parentId = this.element.attr( 'id' ) ||
- 'dayselector' + ( new Date() ).getTime();
-
- for ( i = 0; i < days.length; i++ ) {
- day = days[i];
- letter = day.slice(0, 1);
-
- if ( window.Globalize ) {
- //TODO may some modification required to support
- // start week day difference upon cultures.
- letter = window.Globalize.culture().calendars.standard.days.namesShort[i];
- }
- id = parentId + '_' + i;
- labelClass = 'ui-dayselector-label-' + i;
-
- checkbox = $( '<input type="checkbox"/>' )
- .attr( 'id', id )
- .attr( 'value', i );
-
- label = $( '<label>' + letter + '</label>' )
- .attr( 'for', id )
- .addClass( labelClass );
-
- this.element.append( checkbox );
- this.element.append( label );
- }
-
- this.checkboxes = this.element
- .find( ':checkbox' )
- .checkboxradio( { theme: this.options.theme } );
-
- this.element.controlgroup( { excludeInvisible: false } );
- },
-
- _setOption: function ( key, value ) {
- if ( key === "disabled" ) {
- this._setDisabled( value );
- }
- },
-
- _setDisabled: function ( value ) {
- $.Widget.prototype._setOption.call(this, "disabled", value);
- this.element[value ? "addClass" : "removeClass"]("ui-disabled");
- },
-
- value: function () {
- var values = this.checkboxes.filter( ':checked' ).map( function () {
- return this.value;
- } ).get();
-
- return values;
- },
-
- selectAll: function () {
- this.checkboxes
- .attr( 'checked', 'checked' )
- .checkboxradio( 'refresh' );
- }
-
- } ); /* End of Widget */
-
- // auto self-init widgets
- $( document ).bind( "pagebeforecreate", function ( e ) {
- var elts = $( $.tizen.dayselector.prototype.options.initSelector, e.target );
- elts.not( ":jqmData(role='none'), :jqmData(role='nojs')" ).dayselector();
- } );
-
-}( jQuery, this ) );
+++ /dev/null
-/* ***************************************************************************
- * Copyright (c) 2000 - 2011 Samsung Electronics Co., Ltd.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a
- * copy of this software and associated documentation files (the "Software"),
- * to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the
- * Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in
- * all copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
- * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
- * DEALINGS IN THE SOFTWARE.
- * ***************************************************************************
- */
-/**
- * Displays vertical multi-level list.
- *
- * To apply, add the attribute data-expandable="true" and id="parentid" to a <li> element for parent list item
- * and add the arrribute data-expanded-by="parentid" to a <li> element for child list item.
- *
- * HTML Attributes:
- * data-expandable: Parent list item must have 'true' value for this attribute
- * data-expanded-by: Child list item expanded by parent list item must have 'true' value for this attribute
- * data-initial-expansion: If you want expandable list to be expanded initially, set this value as 'true'
- *
- * Example:
- * <li data-expandable="true" id="exp1" data-initial-expansion="true">Parent</li>
- * <li data-expanded-by="exp1">Child</li>
- */
-
-/**
- @class Expandablelist
- The expandable list widget shows a parent list view where the list items expand into child lists. When the list is in a collapsed state, only the parent list items are shown. If the user clicks a list item, the child list for that list item is displayed with a transition effect. If the user clicks the parent list item again, the child list collapses and is hidden.<br/><br/>Each child list is created as part of its parent expandable list item so that the child list and its parent expandable list item share the same ID. The child list ID is defined with the data-expanded-by option.
-
- <li data-expandable="true" id="exp1" data-initial-expansion="true">Parent</li>
- // Rest of the parent list items
- <li data-expanded-by="exp1">Child</li>
-*/
-/**
- @property {String} data-expanded-by
- Specifies the ID of the parent expandable list item
-*/
-/**
- @property {Boolean} data-initial-expansion
- Defines whether the child list is expanded when the parent expandable list is loaded.
-*/
-/**
- @property {Boolean} data-expandable
- Defines whether the list item can be expanded in to a child list.
-*/
-( function ( $, undefined ) {
-
- $.widget( "tizen.expandablelist", $.mobile.widget, {
- options: {
- initSelector: ":jqmData(expandable='true')"
- },
-
- _hide: function ( e ) {
- $( e ).removeClass( 'ui-li-expand-transition-show' )
- .addClass( 'ui-li-expand-transition-hide' );
- },
- _show: function ( e ) {
- $( e ).removeClass( 'ui-li-expand-transition-hide' )
- .addClass( 'ui-li-expand-transition-show' );
- },
- _hide_expand_img: function ( e ) {
- $( e ).removeClass( 'ui-li-expandable-hidden' )
- .addClass( 'ui-li-expandable-shown' );
-
- $( e ).find( ".ui-li-expand-icon" )
- .addClass( "ui-li-expanded-icon" )
- .removeClass( "ui-li-expand-icon" );
- },
- _show_expand_img: function ( e ) {
- $( e ).removeClass( 'ui-li-expandable-shown' )
- .addClass( 'ui-li-expandable-hidden' );
-
- $( e ).find( ".ui-li-expanded-icon" )
- .addClass( "ui-li-expand-icon" )
- .removeClass( "ui-li-expanded-icon" );
- },
-
- _set_expand_arrow: function ( self, e, parent_is_expanded ) {
- if ( parent_is_expanded ) {
- self._hide_expand_img( e );
- } else {
- self._show_expand_img( e );
- }
- if ( $( e[0] ).data( "expandable" ) && parent_is_expanded == false ) {
- var children = $( e ).nextAll( ":jqmData(expanded-by='" + $( e ).attr( 'id' ) + "')" );
- children.each( function ( idx, child ) {
- self._set_expand_arrow( self, child, e.is_expanded );
- } );
- }
- },
-
- _toggle: function ( self, e, parent_is_expanded ) {
- if ( ! parent_is_expanded ) {
- self._show( e );
- } else {
- self._hide( e );
- if ( $( e ).data( "expandable" ) && e.is_expanded == true ) {
- var children = $( e ).nextAll( ":jqmData(expanded-by='" + $( e ).attr( 'id' ) + "')" );
- children.each( function ( idx, child ) {
- self._toggle( self, child, e.is_expanded );
- } );
- e.is_expanded = false;
- }
- }
- },
- _is_hidden: function ( e ) {
- return ( $( e ).height( ) == 0);
- },
-
- refresh: function () {
- if ( this._handler ) {
- this.element.unbind();
- this._handler = null;
- }
- this._create();
- },
-
- _create: function ( ) {
-
- var children = $( this.element ).nextAll( ":jqmData(expanded-by='" + $( this.element ).attr( 'id' ) + "')" ),
- e = this.element,
- self = this,
- expanded = e.nextAll( ":jqmData(expanded-by='" + e[0].id + "')" ),
- initial_expansion = e.data( "initial-expansion" ),
- is_expanded = false,
- parent_id = null;
-
- if ( children.length == 0 ) {
- return;
- }
-
- if ( initial_expansion == true ) {
- parent_id = e.data( "expanded-by" );
- if ( parent_id ) {
- if ( $( "#" + parent_id ).is_expanded == true) {
- is_expanded = true;
- }
- } else {
- is_expanded = true;
- }
- }
-
- e[0].is_expanded = is_expanded;
- if ( e[0].is_expanded ) {
- self._hide_expand_img( e );
- $(e).append( "<div class='ui-li-expanded-icon'></div>" );
- } else {
- self._show_expand_img( e );
- $(e).append( "<div class='ui-li-expand-icon'></div>" );
- }
-
- if ( e[0].is_expanded ) {
- expanded.each( function ( i, e ) { self._show( e ); } );
- } else {
- expanded.each( function ( i, e ) { self._hide( e ); } );
- }
-
- expanded.addClass( "ui-li-expanded" );
-
- this._handler = e.bind( 'vclick', function ( ) {
- var _is_expanded = e[0].is_expanded;
- expanded.each( function ( i, e ) { self._toggle( self, e, _is_expanded ); } );
- e[0].is_expanded = ! e[0].is_expanded;
-
- self._set_expand_arrow( self, e, e[0].is_expanded );
- });
- }
-
-
- }); // end: $.widget()
-
-
- $( document ).bind( "pagecreate create", function ( e ) {
- $( $.tizen.expandablelist.prototype.options.initSelector, e.target )
- .not( ":jqmData(role='none'), :jqmData(role='nojs')" )
- .expandablelist( );
- });
-
-} ( jQuery ) );
var originSetOption = $.tizen.scrollview.prototype._setOption,
createHandler = function ( target ) {
var $view = target,
- prefix = "<div class=\"ui-handler ui-handler-",
+ prefix = "<div class=\"ui-handler ui-handler-direction-",
suffix = "\"><div class=\"ui-handler-track\"><div class=\"ui-handler-thumb\"></div></div></div>",
scrollview = $view.data( "scrollview" ),
- direction = scrollview.options.direction,
+ options = scrollview.options,
+ direction = options.direction,
+ parentTheme = $.mobile.getInheritedTheme( scrollview, "s" ),
+ theme = options.theme || parentTheme,
isHorizontal = ( scrollview.options.direction === "x" ),
_$view = scrollview._$view,
_$clip = scrollview._$clip,
return;
}
- $view.append( prefix + direction + suffix );
+ $view.addClass( " ui-handler-" + theme ).append( [ prefix, direction, suffix ].join( "" ) );
handler = $view.find( ".ui-handler" );
handlerThumb = $view.find( ".ui-handler-thumb" ).hide();
handlerHeight = ( isHorizontal ? handlerThumb.width() : handlerThumb.height() );
handlerMargin = ( isHorizontal ? parseInt( handler.css( "right" ), 10 ) : parseInt( handler.css( "bottom" ), 10 ) );
- scrollview.enableHandler( scrollview.options.handler );
-
$.extend( $view, {
moveData : null
});
}
},
+ _setHandlerTheme: function ( handlerTheme ) {
+ if ( !handlerTheme ) {
+ return;
+ }
+
+ var oldClass = "ui-handler-" + this.options.handlerTheme,
+ newClass = "ui-handler-" + handlerTheme;
+
+ this.element.removeClass( oldClass ).addClass( newClass );
+ this.options.handlerTheme = handlerTheme;
+ },
+
_setOption: function ( key, value ) {
- if ( key === "handler") {
+ switch ( key ) {
+ case "handler":
this.enableHandler( value );
- } else {
+ break;
+ case "handlerTheme":
+ this._setHandlerTheme( value );
+ break;
+ default:
originSetOption.call( this, key, value );
}
},
*/
( function ( $, document, window, undefined ) {
$.widget( "tizen.multimediaview", $.mobile.widget, {
- options : {
- theme : null,
- controls : true,
- fullScreen : false,
- initSelector : "video, audio"
+ options: {
+ theme: null,
+ controls: true,
+ fullScreen: false,
+ initSelector: "video, audio"
},
- _create : function () {
+
+ _create: function () {
var self = this,
view = self.element,
viewElement = view[0],
option = self.options,
+ parentTheme = $.mobile.getInheritedTheme( view, "s" ),
+ theme = option.theme || parentTheme,
role = "multimediaview",
control = null;
$.extend( this, {
- role : null,
- isControlHide : false,
- controlTimer : null,
- isVolumeHide : true,
- isVertical : true,
- backupView : null
+ role: null,
+ isControlHide: false,
+ controlTimer: null,
+ isVolumeHide: true,
+ isVertical: true,
+ backupView: null
});
self.role = role;
view.addClass( "ui-multimediaview" );
control = self._createControl();
+ control.find( ".ui-button" ).each( function ( index ) {
+ $( this ).buttonMarkup( { corners: true, theme: theme, shadow: true } );
+ });
if ( view[0].nodeName === "VIDEO" ) {
- control.addClass( "ui-multimediaview-video" );
+ control.addClass( "ui-" + role + "-video" );
}
control.hide();
- view.wrap( "<div class='ui-multimediaview-wrap'>" ).after( control );
- if ( option.controls ) {
- if ( view.attr("controls") ) {
- view.removeAttr( "controls" );
- }
+ view.wrap( [ "<div class='ui-", role, "-wrap ui-", role , "-", theme, "'>" ].join( "" ) ).after( control );
+ if ( option.controls && view.attr( "controls" ) ) {
+ view.removeAttr( "controls" );
}
self._addEvent();
-
- $( document ).bind( "pagechange.multimediaview", function ( e ) {
- var $page = $( e.target );
- if ( $page.find( view ).length > 0 && viewElement.autoplay ) {
- viewElement.play();
- }
-
- if ( option.controls ) {
- control.show();
- self._resize();
- }
- }).bind( "pagebeforechange.multimediaview", function ( e ) {
- if ( viewElement.played.length !== 0 ) {
- viewElement.pause();
- control.hide();
- }
- });
- $( window ).bind( "resize.multimediaview orientationchange.multimediaview", function ( e ) {
- if ( !option.controls ) {
- return;
- }
- var $page = $( e.target ),
- $scrollview = view.parents( ".ui-scrollview-clip" );
-
- $scrollview.each( function ( i ) {
- if ( $.data( this, "scrollview" ) ) {
- $( this ).scrollview( "scrollTo", 0, 0 );
- }
- });
-
- // for maintaining page layout
- if ( !option.fullScreen ) {
- $( ".ui-footer:visible" ).show();
- } else {
- $( ".ui-footer" ).hide();
- self._fitContentArea( $page );
- }
-
- self._resize();
- });
},
- _resize : function () {
+
+ _resize: function () {
var view = this.element,
parent = view.parent(),
control = parent.find( ".ui-multimediaview-control" ),
this._updateSeekBar();
this._updateVolumeState();
},
- _resizeControl : function ( offset, width, height ) {
+
+ _resizeControl: function ( offset, width, height ) {
var self = this,
view = self.element,
viewElement = view[0],
durationLabel.show();
}
},
- _resizeFullscreen : function ( isFullscreen ) {
+
+ _resizeFullscreen: function ( isFullscreen ) {
var self = this,
view = self.element,
parent = view.parent(),
if ( isFullscreen ) {
if ( !self.backupView ) {
self.backupView = {
- width : view[0].style.getPropertyValue( "width" ) || "",
- height : view[0].style.getPropertyValue( "height" ) || "",
- position : view.css( "position" ),
- zindex : view.css( "z-index" )
+ width: view[0].style.getPropertyValue( "width" ) || "",
+ height: view[0].style.getPropertyValue( "height" ) || "",
+ position: view.css( "position" ),
+ zindex: view.css( "z-index" )
};
}
docWidth = $( "body" )[0].clientWidth;
view.width( docWidth ).height( docHeight - 1 );
view.addClass( "ui-" + self.role + "-fullscreen" );
view.offset( {
- top : 0,
- left : 0
+ top: 0,
+ left: 0
});
} else {
if ( !self.backupView ) {
view.removeClass( "ui-" + self.role + "-fullscreen" );
view.css( {
- "width" : self.backupView.width,
- "height" : self.backupView.height,
+ "width": self.backupView.width,
+ "height": self.backupView.height,
"position": self.backupView.position,
"z-index": self.backupView.zindex
});
}
parent.show();
},
- _addEvent : function () {
+
+ _addEvent: function () {
var self = this,
view = self.element,
+ option = self.options,
viewElement = view[0],
control = view.parent().find( ".ui-multimediaview-control" ),
playpauseButton = control.find( ".ui-playpausebutton" ),
durationBar = seekBar.find( ".ui-duration" ),
currenttimeBar = seekBar.find( ".ui-currenttime" );
+ $( document ).unbind( ".multimediaview" ).bind( "pagechange.multimediaview", function ( e ) {
+ var $page = $( e.target );
+ if ( $page.find( view ).length > 0 && viewElement.autoplay ) {
+ viewElement.play();
+ }
+
+ if ( option.controls ) {
+ control.show();
+ self._resize();
+ }
+ }).bind( "pagebeforechange.multimediaview", function ( e ) {
+ if ( viewElement.played.length !== 0 ) {
+ viewElement.pause();
+ control.hide();
+ }
+ });
+
+ $( window ).unbind( ".multimediaview" ).bind( "resize.multimediaview orientationchange.multimediaview", function ( e ) {
+ if ( !option.controls ) {
+ return;
+ }
+ var $page = $( e.target ),
+ $scrollview = view.parents( ".ui-scrollview-clip" );
+
+ $scrollview.each( function ( i ) {
+ if ( $.data( this, "scrollview" ) ) {
+ $( this ).scrollview( "scrollTo", 0, 0 );
+ }
+ });
+
+ // for maintaining page layout
+ if ( !option.fullScreen ) {
+ $( ".ui-footer:visible" ).show();
+ } else {
+ $( ".ui-footer" ).hide();
+ self._fitContentArea( $page );
+ }
+
+ self._resize();
+ });
+
view.bind( "loadedmetadata.multimediaview", function ( e ) {
if ( !isNaN( viewElement.duration ) ) {
durationLabel.find( "p" ).text( self._convertTimeFormat( viewElement.duration ) );
self._resize();
}).bind( "error.multimediaview", function ( e ) {
switch ( e.target.error.code ) {
- case e.target.error.MEDIA_ERR_ABORTED :
+ case e.target.error.MEDIA_ERR_ABORTED:
window.alert( 'You aborted the video playback.' );
break;
- case e.target.error.MEDIA_ERR_NETWORK :
+ case e.target.error.MEDIA_ERR_NETWORK:
window.alert( 'A network error caused the video download to fail part-way.' );
break;
- case e.target.error.MEDIA_ERR_DECODE :
+ case e.target.error.MEDIA_ERR_DECODE:
window.alert( 'The video playback was aborted due to a corruption problem or because the video used features your browser did not support.' );
break;
- case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED :
+ case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
window.alert( 'The video could not be loaded, either because the server or network failed or because the format is not supported.' );
break;
- default :
+ default:
window.alert( 'An unknown error occurred.' );
break;
}
});
});
},
- _removeEvent : function () {
+
+ _removeEvent: function () {
var self = this,
view = self.element,
control = view.parent().find( ".ui-multimediaview-control" ),
volumeBar.unbind( ".multimediaview" );
volumeHandle.unbind( ".multimediaview" );
},
- _createControl : function () {
+
+ _createControl: function () {
var self = this,
view = self.element,
control = $( "<span></span>" ),
seekBar.append( durationBar ).append( currenttimeBar ).append( durationLabel ).append( timestampLabel );
playpauseButton.addClass( "ui-play-icon" );
- if ( view[0].muted ) {
- $( volumeButton ).addClass( "ui-mute-icon" );
- } else {
- $( volumeButton ).addClass( "ui-volume-icon" );
- }
-
+ volumeButton.addClass( view[0].muted ? "ui-mute-icon" : "ui-volume-icon" );
volumeBar.append( volumeGuide ).append( volumeValue ).append( volumeHandle );
volumeControl.append( volumeBar );
return control;
},
- _startTimer : function ( duration ) {
+
+ _startTimer: function ( duration ) {
this._endTimer();
if ( !duration ) {
control.fadeOut( "fast" );
}, duration );
},
- _endTimer : function () {
+
+ _endTimer: function () {
if ( this.controlTimer ) {
clearTimeout( this.controlTimer );
this.controlTimer = null;
}
},
- _convertTimeFormat : function ( systime ) {
+
+ _convertTimeFormat: function ( systime ) {
var ss = parseInt( systime % 60, 10 ).toString(),
mm = parseInt( ( systime / 60 ) % 60, 10 ).toString(),
hh = parseInt( systime / 3600, 10 ).toString(),
return time;
},
- _updateSeekBar : function ( currenttime ) {
+
+ _updateSeekBar: function ( currenttime ) {
var self = this,
view = self.element,
duration = view[0].duration,
currenttimeBar.offset( durationOffset ).width( timebarWidth );
timestampLabel.find( "p" ).text( self._convertTimeFormat( currenttime ) );
},
- _updateVolumeState : function () {
+
+ _updateVolumeState: function () {
var self = this,
view = self.element,
control = view.parent().find( ".ui-multimediaview-control" ),
volumeHandle.offset( handlerOffset );
volumeValue.width( parseInt( volumeGuideWidth * ( volume ), 10 ) );
},
- _setVolume : function ( value ) {
+
+ _setVolume: function ( value ) {
var viewElement = this.element[0];
if ( value < 0.0 || value > 1.0 ) {
viewElement.volume = value;
},
+
_fitContentArea: function ( page, parent ) {
if ( typeof parent == "undefined" ) {
parent = window;
height = wh - ( hh + fh ) - ( pt + pb );
$content.offset( {
- top : ( hh + pt )
+ top: ( hh + pt )
}).height( height );
},
- width : function ( value ) {
+
+ width: function ( value ) {
var self = this,
args = arguments,
view = self.element;
self._resize();
}
},
- height : function ( value ) {
+
+ height: function ( value ) {
var self = this,
view = self.element,
args = arguments;
self._resize();
}
},
- fullScreen : function ( value ) {
+
+ fullScreen: function ( value ) {
var self = this,
view = self.element,
control = view.parent().find( ".ui-multimediaview-control" ),
self._resize();
}
},
- refresh : function () {
+
+ refresh: function () {
this._resize();
}
});
+++ /dev/null
-/* ***************************************************************************
- * Copyright (c) 2000 - 2011 Samsung Electronics Co., Ltd.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a
- * copy of this software and associated documentation files (the "Software"),
- * to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the
- * Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in
- * all copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
- * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
- * DEALINGS IN THE SOFTWARE.
- * ***************************************************************************
- *
- * Author: Minkyu Kang <mk7.kang@samsung.com>
- */
-
-/*
- * nocontents widget
- *
- * HTML Attributes
- *
- * data-role: set to 'nocontents'.
- * data-type: type of nocontents. You can set text, picture, multimedia and unnamed.
- *
- * Deprecated in Tizen 2.0 beta : data-text1, data-text2
- *
- * APIs
- *
- * N/A
- *
- * Events
- *
- * N/A
- *
- * Examples
- *
- * Default
- * <div data-role="nocontents" id="nocontents">
- * <p> Unnamed Type </p>
- * <p> Text </p>
- * </div>
- *
- *
- * Text Type
- * <div data-role="nocontents" id="nocontents" data-type="text"></div>
- *
- * Picture Type
- * <div data-role="nocontents" id="nocontents" data-type="picture"></div>
- *
- * Multimedia Type
- * <div data-role="nocontents" id="nocontents" data-type="multimedia"></div>
- *
- * Unnamed Type
- * <div data-role="nocontents" id="nocontents"></div>
- * or
- * <div data-role="nocontents" id="nocontents" data-type="unnamed"></div>
- *
- */
-/**
- @class NoContents
- The no contents widget is used if a list has no items.
- To add a no contents widget to the application, use the following code:
-
- <div data-role="nocontents" data-type="Picture">
- <p>Main Text</p>
- <p>Sub Text</p>
- </div>
-
-*/
-/**
- @property {String} data-type
- Defines the no contents widget type. The type options are text, picture, multimedia, and unnamed.
- The default value is unnamed.
-*/
-(function ( $, window, undefined ) {
- $.widget( "tizen.nocontents", $.mobile.widget, {
- max_height: 0,
- icon_img: null,
- text_bg: null,
-
- _get_height: function () {
- var $page = $('.ui-page-active'),
- $content = $page.children('.ui-content'),
- $header = $page.children('.ui-header'),
- $footer = $page.children('.ui-footer'),
- $view = $content.children('.ui-scrollview-view'),
- header_h = $header.outerHeight() || 0,
- footer_h = $footer.outerHeight() || 0,
- padding_t = (parseFloat( $content.css('padding-top') ) || 0) +
- (parseFloat( $view.css('padding-top') ) || 0),
- padding_b = (parseFloat( $content.css('padding-bottom') ) || 0) +
- (parseFloat( $view.css('padding-bottom') ) || 0),
- content_h = $( window ).height() - header_h - footer_h -
- (padding_t + padding_b);
-
- $content.height( content_h );
-
- return content_h;
- },
-
- _align: function () {
- var content_height = this._get_height(),
- icon_height = this.icon_img.height(),
- text_height = 0,
- content_gap = 0,
- text_top = 0,
- icon_top = 0,
- i;
-
- if ( this.text_bg.length ) {
- text_height = $( this.text_bg[0] ).height() * this.text_bg.length;
- content_gap = $( this.text_bg[0] ).height();
- }
-
- icon_top = ( content_height - ( icon_height + content_gap + text_height ) ) / 2;
-
- if ( icon_top < content_gap ) {
- icon_top = content_gap;
- }
-
- this.icon_img.css( 'top', icon_top );
-
- text_top = icon_top + icon_height + content_gap;
-
- for ( i = 0; i < this.text_bg.length; i++ ) {
- $( this.text_bg[i] ).css( 'top', text_top );
- text_top += $( this.text_bg[i] ).height();
- }
- },
-
- _create: function () {
- var elem = this.element,
- icon_type = $( this.element ).jqmData('type');
-
- console.warn("nocontent widget will be deprecated. Please fix your application.");
-
- switch ( icon_type ) {
- case "picture":
- case "multimedia":
- case "text":
- break;
- default:
- icon_type = "unnamed";
- break;
- }
-
- $( elem ).addClass( "ui-nocontents" );
- this.icon_img = $('<div class="ui-nocontents-icon-' +
- icon_type + '">');
-
- this.text_bg = $( elem ).find("p").addClass("ui-nocontents-text");
-
- $( elem ).prepend( this.icon_img );
-
- this._align();
-
- $( window ).bind( 'resize', function () {
- $( elem ).nocontents( 'refresh' );
- });
- },
-
- refresh: function () {
- this._align();
- }
- });
-
- $( document ).bind( "pagecreate create", function ( e ) {
- $( e.target ).find(":jqmData(role='nocontents')").nocontents();
- });
-}( jQuery, this ));
+++ /dev/null
-/* ***************************************************************************
- * Copyright (c) 2000 - 2011 Samsung Electronics Co., Ltd.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a
- * copy of this software and associated documentation files (the "Software"),
- * to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the
- * Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in
- * all copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
- * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
- * DEALINGS IN THE SOFTWARE.
- * ***************************************************************************
- *
- * Author: Youmin Ha <youmin.ha@samsung.com>
- */
-
-/**
- * Pagecontrol widget shows number bullets, receives touch event for each bullet,
- * and runs your callback for each touch event.
- *
- * HTML Attributes:
- *
- * Pagecontrol widget uses <div> element as an element itself. It takes following attributes.
- *
- * data-role: This widget must have 'pagecontrol' as data-role value.
- * data-max: Maximum nimber of pagecontrol bullets. This property must not exceed 10.
- * data-value: Initially selected value of the pagecontrol widget. Must between 1 and data-max. If this attribute is not given, initial value is set to 1.
- *
- * APIs:
- *
- * setValue( value )
- * : Set current value. Actually triggers 'change' event to the widget with given value.
- * @param[in] value A value to be changed.
- *
- * getValue( )
- * : Get current value.
- * @return Current value.
- *
- * Events:
- *
- * change: Raised when a value is changed, by setting it by javascript, or by user's touch event.
- *
- * Examples:
- *
- * <div id="foo" data-role="pagecontrol" data-max="10"></div>
- * ...
- * <script language="text/javascript">
- *
- * // Bind callback to value change
- * $('foo').bind('change', function (event, value) {
- * // event: 'change'
- * // value: changed value
- * });
- *
- * // Set a value to 3
- * $('foo').trigger('change', 3);
- * </script>
- */
-
-/**
- @class PageControl
- The page control widget shows a numbered list on the screen. It can receive a touch event from each list item, and run a callback for each touch event. <br/>To add a page control widget to the application, use the following code:
-
- <div id="foo" data-role="pagecontrol" data-max="5" data-value ="3"></div>
- $("#foo").bind("change", function(ev, val)
- {
- Console.log("Value is changed to " + val);
- } );
-
- The page control can define a callback for the change event, which is fired when a list item value is changed.<br/> You can use the value method with the page control to set or get the current page control value:
-
- <div id="foo" data-role="pagecontrol"></div>
- var oldVal = $("#foo").pagecontrol("value");
- $("#foo").pagecontrol("value", 2);
-*/
-/**
- @property {Number} data-max
- Defines the number of items in the list.
- The value must be between 1 and 10, and the default value is 1.
-*/
-/**
- @property {Number} data-value
- Defines the number of the initially selected list item.
- The value must be between 1 and data-max, and the default value is 1.
-*/
-
-(function ($, undefined) {
- $.widget( "tizen.pagecontrol", $.mobile.widget, {
- options: {
- initSelector: ":jqmData(role='pagecontrol')"
- },
-
- // subroutine: find a child by value
- _getBtn: function ( value ) {
- return $( this.element ).children( ":jqmData(value='" + value + "')" );
- },
-
- // subroutine: change active button by value
- _changeActiveBtn: function ( newNum ) {
- var oldNum = $( this.element ).data( 'value' );
-
- // Check value
- if ( newNum < 1 || newNum > $( this.element ).data( "max" ) ) {
- return false;
- }
-
- this._getBtn( oldNum ).removeClass( 'page_n_selected' )
- .addClass( 'page_n_unselected' );
- this._getBtn( newNum ).removeClass( 'page_n_unselected' )
- .addClass( 'page_n_selected' );
- },
-
- _triggerChange: function ( event ) {
- // Trigger change event
- $( this ).trigger( 'change', $( this ).data( 'value' ) );
- },
-
- _create: function ( ) {
- },
-
- _init: function ( ) {
- var self = this,
- e = this.element,
- maxVal = e.data( "max" ),
- value = e.attr( "data-value" ),
- i = 0,
- btn = null,
- buf = null,
- page_margin_class = 'page_n_margin_42';
-
-
- // Set default values
- if ( ! maxVal ) {
- maxVal = 1;
- } else if ( maxVal > 10 ) {
- maxVal = 10;
- }
- e.data( "max", maxVal );
-
- if ( ! value ) {
- value = 1;
- }
- e.data( "value", value );
-
- // Set pagecontrol class
- e.addClass( 'pagecontrol' );
-
- // Set empty callback variable
- self.changeCallback = null;
-
- // Add icon classes
- for ( i = 1; i <= maxVal; i++ ) {
- btn = $( '<div class="page_n page_n_unselected ' + page_margin_class + '" data-value="' + i + '"></div>' );
- e.append( btn );
- if ( i == value ) {
- btn.removeClass( 'page_n_unselected' )
- .addClass( 'page_n_selected' );
- }
- // bind vclick event to each icon
- btn.bind( 'vclick', this._triggerChange );
- }
-
- // pagecontrol element's change event
- e.bind( 'change', function ( event, value ) {
- // 1. Change activated button
- self._changeActiveBtn( value );
-
- // 2. Store new value (DO NOT change this order!)
- e.data( 'value', value );
-
- });
- },
-
- value: function ( val ) {
- var pc = $( this.element );
-
- if ( val && typeof val == "number" ) {
- this._changeActiveBtn( val );
- pc.data( 'value', val );
- } else {
- return pc.data( "value" );
- }
- }
-
- }); // end: $.widget()
-
-
- $( document ).bind( "pagecreate create", function ( e ) {
- $( $.tizen.pagecontrol.prototype.options.initSelector, e.target )
- .not( ":jqmData(role='none'), :jqmData(role='nojs')" )
- .pagecontrol( );
- });
-
-} ( jQuery ) );
-
.addClass( "ui-btn-footer-right" );
}
});
+
+ if ( $elFooter.find( ".ui-controlgroup" ).length ) {
+ footerControlButton = $elFooter.find( ".ui-controlgroup a" );
+ footerControlButtonWidth = 100 / $elFooter.find( ".ui-controlgroup a" ).length;
+ footerControlButton.each( function ( i ) {
+ footerControlButton.eq( i ).css( "max-width", footerControlButtonWidth + "%" );
+ });
+ }
},
_bindPageEvents: function () {
}
}
});
+
+ window.addEventListener( "softkeyboardchange", function( e ) {
+ var $elFooter = $( ".ui-page-active .ui-footer" ),
+ thisPage = this;
+
+ if ( e.state == "on" ) {
+ $elFooter.hide();
+ } else if (e.state == "off") {
+ $elFooter.show();
+ }
+ self.updatePagePadding( thisPage, e.state );
+ });
},
_bindContentControlEvents: function () {
},
*/
// This will set the content element's top or bottom padding equal to the toolbar's height
- updatePagePadding: function ( tbPage ) {
+ updatePagePadding: function ( tbPage, imestatus ) {
var $el = this.element,
header = $el.siblings( ".ui-header" ).length;
// This behavior only applies to "fixed", not "fullscreen"
- if ( this.options.fullscreen ) { return; }
+ if ( this.options.fullscreen && imestatus ) { return; }
tbPage = tbPage || $el.closest( ".ui-page" );
+ if ( imestatus == "on" ) {
+ $el.height( window.innerHeight - $el.siblings( ".ui-header" ).height() -
+ parseFloat( $el.css("padding-top") ) -
+ parseFloat( $el.css("padding-bottom") ) );
+ }
$( tbPage ).css( "padding-" + ( header ? "top" : "bottom" ), $el.siblings( ".ui-header" ).outerHeight() );
},
-
/* 1. Calculate and update content height */
updatePageLayout: function ( receiveType ) {
var $elFooter,
*
* Authors: Gabriel Schulhof <gabriel.schulhof@intel.com>,
* Elliot Smith <elliot.smith@intel.com>
+ * Hyunjung Kim <hjnim.kim@samsung.com>
*/
/*
+ * % Popupwindow widget do not use anymore(will be deprecated, internal use only)
+ *
+ *
* Shows other elements inside a popup window.
*
* To apply, add the attribute data-role="popupwindow" to a <div> element inside
*/
/**
- @class Popup
+ class Popupwindow
The pop-up widget shows a list of items in a pop-up window in the middle of the screen. It automatically optimizes the pop-up window size within the screen.
To add a pop-up widget to the application, use the following code:
</div>
The pop-up can define callbacks for events as described in the jQueryMobile documentation for pop-up events. <br/>You can use methods with the pop-up as described in the jQueryMobile documentation for pop-up methods.
+
+ @deprecated 2.0 verisons
*/
/**
* ***************************************************************************
*
* Authors: Gabriel Schulhof <gabriel.schulhof@intel.com>
+ * Hyunjung Kim <hjnim.kim@samsung.com>
*/
+/*
+ * % ContextPopup widget do not use anymore(will be deprecated, internal use only)
+ */
// This widget is implemented in an extremely ugly way. It should derive from $.tizen.popupwindow, but it doesn't
// because there's a bug in jquery.ui.widget.js which was fixed in jquery-ui commit
// b9153258b0f0edbff49496ed16d2aa93bec07d95. Once a version of jquery-ui containing that commit is released
// the prototype of the subclass. The prototype of the superclass should remain unchanged.
/**
- @class ContextPopup
+ class ContextPopup
The context pop-up widget shows a list of options and automatically optimizes its size within the screen. This widget is intended for a small list of options for a larger list, use the List widget. <br/>The context pop-up widget requires a target button, which must be clicked to open the context pop-up. In the default application theme, an arrow pointer is displayed at the top-left corner of the context pop-up widget when it is opened.<br/><br/> To add a context pop-up widget to the application, use the following code:
// Target button
You can use methods with the context pop-up as described in the [jQueryMobile documentation for pop-up methods.][2]
[1]: http://jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/popup/events.html
[2]: http://jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/popup/methods.html
+
+ @deprecated 2.0 verisons
*/
(function ( $, undefined ) {
},
_create: function () {
+ console.warn("ctxpopup() was deprecated. use popup() instead.");
if ( !this.element.data( "popupwindow" ) ) {
this.element.popupwindow();
}
style = this.options.style;
}
- _html = '<div class="ui-progress-container-' + style + '">' +
- '<div class="ui-progress-' + style + '"></div>' +
- '</div>';
-
- if ( style === "pending" ) {
- _html = '<div class="ui-progress-pending-bg">' + _html + '</div>';
+ if ( style == "circle" ) {
+ _html = '<div class="ui-progress-container-circle">' +
+ '<div class="ui-progress-circle"></div>' +
+ '</div>';
+ } else if ( style === "pending" ) {
+ _html = '<div class="ui-progressbar">' +
+ '<div class="ui-progressbar-bg">' +
+ '<div class="ui-progress-pending"></div>' +
+ '</div">' +
+ '</div>';
}
this.html = $( _html );
this.valueDiv = $( "<div class='ui-progressbar-value'></div>" )
.appendTo( this.element );
- this.valueDiv.wrap("<div class='ui-progress-bg'></div>");
+ this.valueDiv.wrap("<div class='ui-progressbar-bg'></div>");
this.oldValue = this._value();
this._refreshValue();
* Hyunjung Kim <hjnim.kim@samsung.com>
*/
-// Widget which turns a list into a "swipe":
+// Widget which turns a html element into a "swipe":
// i.e. each list item has a sliding "cover" which can be swiped
// to the right (to reveal buttons underneath) or left (to
// cover the buttons again). Clicking on a button under a swipe
/**
@class Swipe
- The swipe widget shows a list view on the screen where the list items can be swiped vertically to show a menu.
- To add a swipe list widget to the application, use the following code:
+ The swipe widget shows a view on the screen where the items can be swiped vertically to show a menu.
+ To add a swipe widget to the application, use the following code:
- <ul data-role="swipe">
- <li>
+ <ul data-role="listview">
+ <li data-role="swipe">
<div data-role="swipe-cover">
<div data-role="button" data-inline="true">OK</div>
<div data-role="button" data-inline="true">Cancel</div>
</li>
</ul>
- You can use methods with the swipe as described in the jQueryMobile documentation for list view methods.
+ You can use methods with the swipe as described in the jQueryMobile documentation for view methods.
*/
/**
@property {String} data-role
- Creates a swipe list using the HTML unordered list (>ul<) element.
+ Creates a swipe using the HTML unordered view (>ul<) element.
The default value is swipe.
- Creates a swipe list item cover using an HTML $gt;div$lt; element. This cover can be swiped to show the content beneath it.
- The default value is swipelist-item-cover.
+ Creates a swipe item cover using an HTML $gt;div$lt; element. This cover can be swiped to show the content beneath it.
+ The default value is swipe-item-cover.
*/
/**
@method open
- uncover swipelist item
+ uncover swipe item
*/
/**
@method close
- cover swipelist item
+ cover swipe item
*/
/**
- @method isOpen
+ @method opened
return coveritem status( coverd or uncovred )
*/
/**
@event animationstart
- The swipe list can define a callback for the animationstart event, which is fired after a list item is swipe and the swipe animation is start:
+ The swipe can define a callback for the animationstart event, which is fired after a item is swipe and the swipe animation is start:
*/
/**
@event animationend
- The swipe list can define a callback for the animationend event, which is fired after a list item is swiped and the swipe animation is complete:
-
- <ul data-role="swipelist">
- <li>
- <div data-role="button" data-inline="true">OK</div>
- <div data-role="button" data-inline="true">Cancel</div>
- <div data-role="swipelist-item-cover" id="foo">
- <p>This is a swipelist item cover.<br>
+ The swipe can define a callback for the animationend event, which is fired after a item is swiped and the swipe animation is complete:
+
+ <ul data-role="listview">
+ <li data-role="swipe">
+ <div data-role="swipe-cover">
+ <div data-role="button" data-inline="true">OK</div>
+ <div data-role="button" data-inline="true">Cancel</div>
+ </div>
+ <div data-role="swipe-item-cover" id="foo">
+ <p>This is a swipe item cover.<br>
This will be swiped out when swipe event comes.</p>
</div>
</li>
</ul>
$("#foo").bind("animationend", function (ev)
{
- Console.log("Swipelist cover's animation is complete.");
+ Console.log("Swipe cover's animation is complete.");
});
*/
(function ($) {
defaultCoverTheme = 'ui-body-' + this.options.theme;
- // swipe is a listview
if ( !this.element.parent().hasClass('ui-listview') ) {
this.element.parent().listview();
}
this.element.addClass('ui-swipe');
- // get the list item covers
+ // get the item covers
covers = this.element.find(':jqmData(role="swipe-item-cover")');
item = this.element.find(':jqmData(role="swipe-item")');
this.element.removeClass('ui-swipe');
- // get the list item covers
+ // get the item covers
cover = this.element.find(':jqmData(role="swipe-item-cover")');
item = this.element.find(':jqmData(role="swipe-item")');
.each(
function () {
if ( this !== self.element.get(0) &&
- $( this ).swipe("isOpen") ) {
+ $( this ).swipe("opened") ) {
$( this ).swipe("close");
}
}
} );
},
- isOpen: function () {
+ opened: function () {
return this._isopen;
},
_cellSize : undefined,
_currentItemCount : 0,
_itemCount : 1,
- _isAuto : true,
+ _inheritedSize : null,
// timer
_timerInterval : 0,
return;
}
+ // read defined properties(width and height) from dom element.
+ self._inheritedSize = self._getinheritedSize(self.element);
+
// set a scroll direction.
self._direction = opts.direction === 'x' ? true : false;
self._clipSize = self._calculateClipSize();
self._calculateColumnSize();
self._initPageProperty();
- self._setScrollBarSize( );
+ self._setScrollBarSize();
},
_initPageProperty : function () {
}
},
+ _getinheritedSize : function ( elem ) {
+ var $target = $(elem),
+ height,
+ width,
+ ret = {
+ isDefinedWidth : false,
+ isDefinedHeight : false,
+ width : 0,
+ height : 0
+ };
+
+ while ( $target[0].nodeType === Node.ELEMENT_NODE && (ret.isDefinedWidth === false || ret.isHeightDefined === false )) {
+ height = $target[0].style.height;
+ width = $target[0].style.width;
+
+ if (ret.isDefinedHeight === false && height !== "" ) {
+ // Size was defined
+ ret.isDefinedHeight = true;
+ ret.height = parseInt(height, 10);
+ }
+
+ if ( ret.isDefinedWidth === false && width !== "" ) {
+ // Size was defined
+ ret.isDefinedWidth = true;
+ ret.width = parseInt(width, 10);
+ }
+ $target = $target.parent();
+ }
+ return ret;
+ },
+
resize : function ( ) {
var self = this,
+ ret = null,
rowsPerView = 0,
itemCount = 0,
totalRowCnt = 0,
clipPosition = 0;
itemCount = self._calculateColumnCount();
- if ( self._isAuto && itemCount != self._itemCount ) {
+ if ( itemCount != self._itemCount ) {
totalRowCnt = parseInt(self._numItemData / itemCount , 10 );
self._totalRowCnt = self._numItemData % itemCount === 0 ? totalRowCnt : totalRowCnt + 1;
prevcnt = self._itemCount;
$parent = $(self.element).parent(),
paddingValue = 0,
clipSize = $(window).width();
+
+ if ( self._inheritedSize.isDefinedWidth ) {
+ return self._inheritedSize.width;
+ }
+
if ( $parent.hasClass("ui-content") ) {
paddingValue = parseInt($parent.css("padding-left"), 10);
clipSize = clipSize - ( paddingValue || 0 );
footer = null,
paddingValue = 0,
clipSize = $(window).height();
+
+ if ( self._inheritedSize.isDefinedHeight ) {
+ return self._inheritedSize.height;
+ }
+
if ( $parent.hasClass("ui-content") ) {
paddingValue = parseInt($parent.css("padding-top"), 10);
clipSize = clipSize - ( paddingValue || 0 );
+++ /dev/null
-/**
- * Expandablelist test
- *
- * Youmin Ha <youmin.ha@samsung.com>
- */
-( function ( $ ) {
- var DEBUG = true;
-
- $.mobile.defaultTransition = "none";
-
- module( "ExpandableList", {
- setup: function ( ) {
- var page = $( 'div#expandablelist-main:jqmData(role="page")' ),
- initHtml = '<form>\
- <div data-role="header">\
- <h1>expandable list</h1>\
- </div>\
- <div data-role="content">\
- <ul data-role="listview" id="list1">\
- <li id="exp1" data-expandable="true" data-initial-expansion="true">exp1</li>\
- <li id="exp1-1" data-expandable="true" data-expanded-by="exp1" data-initial-expansion="false">exp1-1</li>\
- <li id="exp1-1-1" data-expanded-by="exp1-1">exp1-1-1</li>\
- <li id="exp2" data-expandable="true">exp2</li>\
- </ul>\
- </div>\
- </form>',
- obj;
-
- if( DEBUG ) {
- page.show( );
- }
- page.append( $( initHtml ) );
-
- obj = $( ':jqmData(role="listview")' );
- obj.listview( );
-
- obj = $( ':jqmData(expandable="true")' );
- obj.expandablelist( );
- },
- teardown: function ( ) {
- var page = $( 'div#expandablelist-main:jqmData(role="page")' );
- page.empty( );
-
- if( DEBUG ) {
- page.hide( );
- }
- }
- } );
-
- function expandCollapseTest ( ) {
- var transitionTimeout = 1000,
- elist = $( ":jqmData(expandable='true')" ),
- li1,
- li1_1,
- li1_1_1,
- val;
-
- elist.expandablelist( );
- ok( elist, "expandablelist object creation" );
-
- li1 = $( "li#exp1" );
- li1_1 = $( "li#exp1-1" );
- li1_1_1 = $( "li#exp1-1-1" );
-
- val = li1_1.height( );
- console.log( "li1_1's height=" + val );
- notEqual( val, 0, "Expanded listitem with expandable parent having data-initial-expansion=true must be visible (height > 0)" );
-
- equal( li1_1_1.height(), 0, "Expanded listitem with expandable parent having data-initial-expansion=false must not be visible (height == 0)" );
-
- li1_1.trigger( 'vclick' );
- setTimeout( function ( ) {
- notEqual( li1_1_1.height( ), 0, "After click, expanded listitem must be visible (height > 0)" );
-
- li1.trigger( 'vclick' );
- setTimeout( function ( ) {
- // All children must be collapsed when top-level expandable listitem is clicked.
- equal( li1_1.height(), 0, "After click, all children must be collapsed. (height == 0)" );
- equal( li1_1_1.height(), 0, "After click, all children must be collapsed. (height == 0)" );
-
- start( );
- }, transitionTimeout );
-
- }, transitionTimeout );
- }
-
- asyncTest( "Basic expand-collapse test", 6, function ( ) {
- expandCollapseTest( );
- } );
-
- asyncTest( "style test - checkbox" , 6, function ( ) {
- var li = $( "li#exp1-1" ),
- subitem = $( '<input type="checkbox" id="checkbox1" >' );
-
- // Prepare
- li.append( subitem );
- li.addClass( 'ui-li-1line-check1' )
- .addClass( 'ui-li-dialogue' );
- subitem.checkboxradio( );
- li.trigger( 'refresh' );
-
- // Run
- expandCollapseTest( );
- } );
-
-} ) ( jQuery );
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Expandable list test</title>
- <script src="../../../build/tizen-web-ui-fw/latest/js/jquery.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"
- data-framework-theme="tizen-white"></script>
- <script src="../../../libs/js/jquery-mobile-1.1.0/tests/unit/jquery.setNameSpace.js"></script>
- <script src="../../../libs/js/jquery-mobile-1.1.0/tests/jquery.testHelper.js"></script>
- <script src="../../../libs/js/jquery-mobile-1.1.0/external/qunit.js"></script>
-
- <link rel="stylesheet" href="../../../libs/js/jquery-mobile-1.1.0/external/qunit.css"/>
-
-</head>
-<body>
- <!-- QUnit template -->
- <div>
- <h1 id="qunit-header">Test : Expandable list</h1>
- <h2 id="qunit-banner"></h2>
- <h2 id="qunit-userAgent"></h2>
- <ol id="qunit-tests"></ol>
- </div>
- <div data-role="page" id="expandablelist-main">
- </div>
- <script src="expandablelist-tests.js"></script>
-</body>
-</html>
/*
- * Unit Test: Shortcut Scroll
+ * Unit Test: FastScroll
*
* Minkyu Kang <mk7.kang@samsung.com>
*/
(function ($) {
- module("Shortcut Scroll");
+ module("FastScroll");
- var unit_shortcutscroll = function ( list ) {
+ var unit_fastscroll = function ( list ) {
var widget,
shortcut,
divider;
- widget = list.parentsUntil(".ui-content").parent().find(".ui-shortcutscroll");
+ widget = list.parentsUntil(".ui-content").parent().find(".ui-fastscroll");
/* Create */
- ok( widget.hasClass("ui-shortcutscroll"), "Create" );
+ ok( widget.hasClass("ui-fastscroll"), "Create" );
shortcut = widget.find("li");
divider = list.find(".ui-li-divider");
};
test( "shortcut", function () {
- unit_shortcutscroll( $("#shortcut") );
+ unit_fastscroll( $("#shortcut") );
});
}( jQuery ));
<link rel="stylesheet" href="../../../libs/js/jquery-mobile-1.1.0/external/qunit.css" />
<script src="../../../libs/js/jquery-mobile-1.1.0/external/qunit.js"></script>
- <script src="shortcutscroll-tests.js"></script>
+ <script src="fastscroll-tests.js"></script>
<title>Shortcut Scroll</title>
</head>
<div id="qunit-fixture">
- <div data-role="page" id="shortcutscroll">
+ <div data-role="page" id="fastscroll">
<div data-role="header" data-position="fixed">
<h1>Shortcut Scroll</h1>
</div>
<div data-role="content">
- <ul id="shortcut" data-role="listview" data-shortcutscroll="true">
+ <ul id="shortcut" data-role="listview" data-fastscroll="true">
<li data-role="list-divider">A</li>
<li>Anton</li>
<li>Arabella</li>
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <script src="../../../build/tizen-web-ui-fw/latest/js/jquery.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"
- data-framework-theme="tizen-gray"
- data-framework-viewport-scale=false>
- </script>
-
- <link rel="stylesheet" href="../../../libs/js/jquery-mobile-1.1.0/external/qunit.css" />
-
- <script src="../../../libs/js/jquery-mobile-1.1.0/external/qunit.js"></script>
- <script src="nocontents-tests.js"></script>
-
- <title>No Contents</title>
-</head>
-
-<body>
-
-<h1 id="qunit-header">No Contents</h1>
-<h2 id="qunit-banner"></h2>
-<div id="qunit-testrunner-toolbar"></div>
-<h2 id="qunit-userAgent"></h2>
-<ol id="qunit-tests"></ol>
-
-<div id="qunit-fixture">
-
- <div data-role="page" id="nocontents0">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents_text" data-type="text">
- <p>text1</p>
- <p>text2</p>
- </div>
- </div>
- </div>
-
- <div data-role="page" id="nocontents1">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents_pic" data-type="picture">
- <p>text1</p>
- <p>text2</p>
- </div>
- </div>
- </div>
-
- <div data-role="page" id="nocontents2">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents_mul" data-type="multimedia">
- <p>text1</p>
- <p>text2</p>
- </div>
- </div>
- </div>
-
- <div data-role="page" id="nocontents2">
- <div data-role="header" data-position="fixed">
- <h1>No Contents</h1>
- </div>
- <div data-role="content">
- <div data-role="nocontents" id="nocontents_un" data-type="unnamed">
- <p>text1</p>
- <p>text2</p>
- </div>
- </div>
- </div>
-
-</div>
-
-</body>
-</html>
+++ /dev/null
-/*
- * Unit Test: Nocontents
- *
- * Minkyu Kang <mk7.kang@samsung.com>
- */
-
-(function ($) {
- module("Nocontents");
-
- var unit_nocontents = function ( widget, type ) {
- var background,
- text,
- i;
-
- /* Create */
- widget.nocontents();
-
- ok( widget.hasClass("ui-nocontents"), "Create" );
-
- /* Check Background */
- background = widget.children( ".ui-nocontents-icon-" + type );
- ok( background, "Background" );
-
- /* Check Texts */
- text = widget.children("p");
-
- for ( i = 0; i < text.length; i++ ) {
- ok( $( text[i] ).hasClass("ui-nocontents-text"), "Text" + i );
- }
- };
-
- test( "text type", function () {
- unit_nocontents( $("#nocontents_text"), "text" );
- });
-
- test( "picture type", function () {
- unit_nocontents( $("#nocontents_pic"), "picture" );
- });
-
- test( "multimedia type", function () {
- unit_nocontents( $("#nocontents_mul"), "multimedia" );
- });
-
- test( "unnamed type", function () {
- unit_nocontents( $("#nocontents_un"), "unnamed" );
- });
-}( jQuery ));
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Pagecontrol test</title>
- <script src="../../../build/tizen-web-ui-fw/latest/js/jquery.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"
- data-framework-theme="tizen-white"></script>
- <script src="../../../libs/js/jquery-mobile-1.1.0/tests/unit/jquery.setNameSpace.js"></script>
- <script src="../../../libs/js/jquery-mobile-1.1.0/tests/jquery.testHelper.js"></script>
- <script src="../../../libs/js/jquery-mobile-1.1.0/external/qunit.js"></script>
-
- <link rel="stylesheet" href="../../../libs/js/jquery-mobile-1.1.0/external/qunit.css"/>
-
- <script src="pagecontrol-tests.js"></script>
-</head>
-<body>
- <!-- QUnit template -->
- <h1 id="qunit-header">Test : Pagecontrol</h1>
- <h2 id="qunit-banner"></h2>
- <h2 id="qunit-userAgent"></h2>
- <ol id="qunit-tests"></ol>
-
- <div id="qunit-fixture">
-
- </div>
-</body>
-</html>
+++ /dev/null
-/**
- * pagecontrol test
- */
-( function ( $ ) {
- $.mobile.defaultTransition = "none";
-
- module( "PageControl" );
-
- test( "Basic pagecontrol test", function ( ) {
- var pc = $( '<div data-role="pagecontrol"></div>' )
- .attr( {
- 'data-max': 10,
- 'data-value': 2
- } ),
- nb;
-
- pc.pagecontrol( );
-
- ok( pc, "pagecontrol object creation" );
- nb = pc.children( 'div.page_n' )[1]; // 2nd button
- console.dir( nb );
- ok( $(nb).hasClass( 'page_n_selected' ), "first button should be activated" );
- equal( $( pc ).pagecontrol( "value" ), 2, "value() method must return 2" );
-
- nb = pc.children( 'div.page_n' )[9];
- ok( nb, "last number button should exist" );
- pc.one( "change", function( ev, val ) {
- equal( val, 10, "pagecontrol element's value must be set when click event comes." );
- ok( $( nb ).hasClass( 'page_n_selected' ), "after click, clicked button should be changed to number type" );
- equal( $( pc ).pagecontrol( "value" ), 10, "value() method must return 10" );
-
- $( pc ).pagecontrol( "value", 5 );
- equal( $( pc ).pagecontrol( "value" ), 5, "value() method must return 5 after running .value(5)" );
-
- } );
- $(nb).trigger( "click" );
- } );
-
-} ) ( jQuery );
-
<div data-role="contents">
</div>
</div>
+
<div data-role="page" id="searchbar-unit-test" data-add-back-btn="true">
<div data-role="header" data-position="fixed">
<h1>Searchbar</h1>
- <input type="search" name="search" id="searchInput" value=""/>
+ <input type="search" data-cancel-btn=true name="search" data-icon="call" id="searchInput" value=""/>
</div>
<div data-role="content" id="searchbar-content">
<p>Hairston</p>
asyncTest( "Searchbar", function () {
/* Initialize */
- var $divSearchbar = $( "div.input-search-bar" ),
+ var $divSearchbar = $( "#searchbar-unit-test div.input-search-bar" ),
$input = $( "input" );
equal( $divSearchbar.length, 1, "initialized" );
equal( $divSearchbar.find( "div.ui-input-search input.ui-input-text" ).length, 1 );
equal( $divSearchbar.find( "div.ui-input-search a.ui-input-clear" ).hasClass( "ui-input-clear-hidden" ), true );
equal( $divSearchbar.find( "div.ui-input-search div.ui-image-search" ).length, 1 );
- equal( $divSearchbar.find( "a.ui-input-cancel" ).hasClass( "ui-btn" ), true );
- equal( $divSearchbar.find( "a.ui-input-cancel" ).hasClass( "ui-btn-icon-cancel" ), true );
+
equal( $("#searchbar-content p").filter( function ( index ) {
return $( this ).css( "display" ) != "none";
} ).length, 30 );
/* Public Method */
/* disable */
$( "#searchInput" ).searchbar( "disable" );
- equal( $( "div.ui-input-search" ).hasClass( "ui-disabled" ), true, "disable" );
+ equal( $( "#searchbar-unit-test div.ui-input-search" ).hasClass( "ui-disabled" ), true, "disable" );
equal( $( "#searchInput" ).attr( "disabled" ), "disabled" );
/* enable */
$( "#searchInput" ).searchbar( "enable" );
- equal( $( "div.ui-input-search" ).hasClass( "ui-disabled" ), false, "enable" );
+ equal( $( "#searchbar-unit-test div.ui-input-search" ).hasClass( "ui-disabled" ), false, "enable" );
equal( $( "#searchInput" ).attr( "disabled" ), undefined );
/* Event */
/* Search : Input and trigger change */
$input.focus();
- equal( $( "div.ui-image-search" ).css( "display" ), "none", "Input and trigger change" );
+ equal( $( "div.ui-image-search" ).css( "display" ), "block", "Input and trigger change" );
$input.val( "a" ).trigger( "change" );
- equal( $("#searchbar-content p").filter( function ( index ) {
- return $( this ).css( "display" ) != "none";
- } ).length, 24 );
-
- $input.val( "ar" ).trigger( "change" );
- equal( $("#searchbar-content p").filter( function ( index ) {
- return $( this ).css( "display" ) != "none";
- } ).length, 10 );
-
$input.val( "are" ).trigger( "change" );
equal( $("#searchbar-content p").filter( function ( index ) {
return $( this ).css( "display" ) != "none";
} ).length, 1 );
- /* Clear button preesed. */
+ /* Clear button pressed. */
$( "a.ui-input-clear" ).trigger( "click" );
equal( $("#searchbar-content p").filter( function ( index ) {
return $( this ).css( "display" ) != "none";
} ).length, 30 );
equal( $divSearchbar.find( "div.ui-input-search a.ui-input-clear" ).hasClass( "ui-input-clear-hidden" ), true, "Clear button pressed" );
- equal( $divSearchbar.find( "a.ui-input-cancel" ).hasClass( "ui-btn" ), true );
- equal( $divSearchbar.find( "a.ui-input-cancel" ).hasClass( "ui-btn-icon-cancel" ), true );
+
+ /* Button test */
+ equal( $( ".ui-btn" ).hasClass( "ui-btn" ), true );
+ equal( $divSearchbar.find( "> .ui-btn" ).jqmData("icon"), "call" );
+
+ /* Cancel test*/
+ equal( $( ".ui-input-cancel" ).hasClass( "ui-btn" ), true );
+ equal( $( ".ui-input-cancel" ).hasClass( "ui-btn-icon-cancel" ), true );
+
+ equal( $( ".ui-input-cancel" ).hasClass( "ui-btn" ), true );
+ equal( $( ".ui-input-cancel" ).hasClass( "ui-btn-icon-cancel" ), true );
/* Cancel button pressed. */
$( "a.ui-btn-icon-cancel" ).trigger( "click" );
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <script src="../../../build/tizen-web-ui-fw/latest/js/jquery.js"></script>
+ <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
+ <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"
+ data-framework-theme="tizen-white"
+ data-framework-viewport-scale=false>
+ </script>
+
+ <link rel="stylesheet" href="../../../libs/js/jquery-mobile-1.1.0/external/qunit.css" />
+
+ <script src="../../../libs/js/jquery-mobile-1.1.0/external/qunit.js"></script>
+ <script src="swipe-tests.js"></script>
+
+ <title>Swipe</title>
+</head>
+<body>
+
+<h1 id="qunit-header">Swipe Tests</h1>
+<h2 id="qunit-banner"></h2>
+<h2 id="qunit-userAgent"></h2>
+<ol id="qunit-tests">
+</ol>
+
+<div id="qunit-fixture" style="top:0px;left:0px;">
+ <div data-role="page" id="swipelistpage">
+ <ul data-role="listview">
+ <li id="swipewidget" data-role="swipe">
+ <div data-role="swipe-item">
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ </div>
+ <div data-role="swipe-item-cover">
+ Swipe2
+ </div>
+ </li>
+ <li data-role="swipe">
+ <div data-role="swipe-item">
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ </div>
+ <div data-role="swipe-item-cover">
+ Swipe1
+ </div>
+ </li>
+ </ul>
+ </div>
+ <div data-role="page" id="swipedestorypage">
+ <ul data-role="listview" >
+ <li id="swipedestroy" data-role="swipe">
+ <div data-role="swipe-item">
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ </div>
+ <div data-role="swipe-item-cover">
+ <div style="display: inline-block;" class="ui-li-text-sub-left">subtext</div>
+ <div style="display: inline-block;" class="ui-li-text-main-right">2line-leftsub2</div>
+ </div>
+ </li>
+ <li data-role="swipe">
+ <div data-role="swipe-item">
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Twitter</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ <div data-role="button" data-inline="true">Facebook</div>
+ </div>
+ <div data-role="swipe-item-cover">
+ <div style="display: inline-block;" class="ui-li-text-sub-left">subtext</div>
+ <div style="display: inline-block;" class="ui-li-text-main-right">1line-leftsub1</div>
+ </div>
+ </li>
+ </ul>
+ </div>
+</div>
+
+</body>
+</html>
--- /dev/null
+/*
+ * swipe unit tests
+ *
+ * Hyunjung Kim <hjnim.kim@samsung.com>
+ *
+ */
+
+( function ( $ ) {
+
+ module("swipe");
+
+ var unit_swipe = function( swipe, type ) {
+ var covers,
+ cover,
+ coverStart,
+ item,
+ slideLeftDone = function () {
+ ok(true, "Animation Complete - sliding left");
+ cover.unbind("animationComplete");
+ equal(cover.position().left, coverStart, "Position - Cover");
+ start();
+ },
+ slideRightDone = function () {
+ ok(true, "Animation Complete - sliding right");
+ setTimeout(function () {
+ cover.unbind("animationComplete");
+ cover.bind("animationComplete", slideLeftDone);
+ item.trigger("swipeleft");
+ }, 0);
+ };
+
+ $("#swipepage").page();
+ swipe.swipe();
+ ok(swipe.hasClass("ui-swipe"), "Create - Swipe");
+
+ covers = swipe.find("div.ui-swipe-item-cover");
+ cover = covers.first();
+
+ coverStart = cover.position().left;
+ item = swipe.find("div.ui-swipe-item").first();
+
+ cover.bind("animationComplete", slideRightDone);
+ cover.trigger("swiperight");
+ stop();
+
+ equal( swipe.find("div.ui-swipe-item").length , 1, "Count - Swipeable li");
+ equal( covers.length , 1, "Count - cover");
+
+ equal( covers.get(0).innerText,
+ "Swipe2",
+ "Check - Cover string value");
+ };
+
+ var unit_swipe_destroy = function(swipe, type) {
+ var covers,
+ new_page = $("#swipedestorypage");
+
+ new_page.page();
+ swipe.swipe();
+ ok(swipe.hasClass("ui-swipe"),"Create - Swipe");
+ covers = swipe.find("div.ui-swipe-item-cover");
+ equal( swipe.find("div.ui-swipe-item").length , 1, "Count - Swipeable ui-swipe-item");
+
+ equal( covers.length , 1, "Count - cover");
+
+ swipe.swipe("destroy");
+
+ equal(new_page.has('.ui-swipe').length, 0, "Destroy - swipe");
+ equal(new_page.has('.ui-swipe-item').length, 0 , "Destroy - item" );
+ equal(new_page.has('.ui-swipe-item-cover').length, 0, "Destroy - cover");
+
+ };
+
+ asyncTest( " swipe ", function() {
+ expect(7);
+ unit_swipe( $("#swipewidget"), "swipe" );
+ start();
+ });
+
+ asyncTest( " swipe - destory", function() {
+ expect(6),
+ unit_swipe_destroy( $("#swipedestroy"), "swipedestroy"),
+ start()
+ });
+
+} ) ( jQuery );
\ No newline at end of file
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <script src="../../../build/tizen-web-ui-fw/latest/js/jquery.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
- <script src="../../../build/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"
- data-framework-theme="tizen-white"
- data-framework-viewport-scale=false>
- </script>
-
- <link rel="stylesheet" href="../../../libs/js/jquery-mobile-1.1.0/external/qunit.css" />
-
- <script src="../../../libs/js/jquery-mobile-1.1.0/external/qunit.js"></script>
- <script src="swipelist-tests.js"></script>
-
- <title>Swipelist</title>
-</head>
-<body>
-
-<h1 id="qunit-header">Swipelist Tests</h1>
-<h2 id="qunit-banner"></h2>
-<h2 id="qunit-userAgent"></h2>
-<ol id="qunit-tests">
-</ol>
-
-<div id="qunit-fixture" style="top:0px;left:0px;">
- <div data-role="page" id="swipelistpage">
- <ul data-role="listview">
- <ul data-role="swipelist" id="swipewidget">
- <li class="ui-li-1line-leftsub1 ui-li-dialogue">
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="swipelist-item-cover">
- <div style="display: inline-block;" class="ui-li-text-sub-left">subtext</div>
- <div style="display: inline-block;" class="ui-li-text-main-right">2line-leftsub2</div>
- </div>
- </li>
- <li class="ui-li-1line-leftsub1 ui-li-dialogue">
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="swipelist-item-cover">
- <div style="display: inline-block;" class="ui-li-text-sub-left">subtext</div>
- <div style="display: inline-block;" class="ui-li-text-main-right">1line-leftsub1</div>
- </div>
- </li>
- </ul>
- </ul>
- </div>
- <div data-role="page" id="swipedestorypage">
- <ul data-role="listview">
- <ul data-role="swipelist" id="swipedestroy">
- <li class="ui-li-1line-leftsub1 ui-li-dialogue">
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="swipelist-item-cover">
- <div style="display: inline-block;" class="ui-li-text-sub-left">subtext</div>
- <div style="display: inline-block;" class="ui-li-text-main-right">2line-leftsub2</div>
- </div>
- </li>
- <li class="ui-li-1line-leftsub1 ui-li-dialogue">
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Twitter</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="button" data-inline="true">Facebook</div>
- <div data-role="swipelist-item-cover">
- <div style="display: inline-block;" class="ui-li-text-sub-left">subtext</div>
- <div style="display: inline-block;" class="ui-li-text-main-right">1line-leftsub1</div>
- </div>
- </li>
- </ul>
- </ul>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-/*
- * swipelist unit tests
- *
- * Hyunjung Kim <hjnim.kim@samsung.com>
- *
- */
-
-( function ( $ ) {
-
- module("swipelist");
-
- var unit_swipe = function( swipelist, type ) {
- var covers,
- cover,
- coverStart,
- item,
- slideLeftDone = function () {
- ok(true, "Animation Complete - sliding left");
- cover.unbind("animationComplete");
- equal(cover.position().left, coverStart, "Position - Cover");
- start();
- },
- slideRightDone = function () {
- ok(true, "Animation Complete - sliding right");
- setTimeout(function () {
- cover.unbind("animationComplete");
- cover.bind("animationComplete", slideLeftDone);
- item.trigger("swipeleft");
- }, 0);
- };
-
- $("#swipelistpage").page();
- swipelist.swipelist();
-
- ok(swipelist.hasClass("ui-swipelist"),"Create - Swipelist");
- covers = swipelist.find("li *.ui-swipelist-item-cover");
- cover = covers.first();
- coverStart = cover.position().left;
- item = swipelist.find("li").first();
-
- cover.bind("animationComplete", slideRightDone);
- cover.trigger("swiperight");
- stop();
-
- equal( swipelist.find("li.ui-swipelist-item").length , 2, "Count - Swipeable li");
- equal( covers.length , 2, "Count - cover");
-
- equal(covers.find("span.ui-swipelist-item-cover-inner:contains('1line-leftsub1')").length,
- 1,
- "Check - Cover string value");
- };
-
- var unit_swipe_destroy = function(swipelist, type) {
- var covers,
- new_page = $("#swipedestorypage");
-
- new_page.page();
- swipelist.swipelist();
- ok(swipelist.hasClass("ui-swipelist"),"Create - Swipelist");
- covers = swipelist.find("li *.ui-swipelist-item-cover");
-
- equal( swipelist.find("li.ui-swipelist-item").length , 2, "Count - Swipeable li");
- equal( covers.length , 2, "Count - cover");
-
- swipelist.swipelist("destroy");
-
- equal(new_page.has('.ui-swipelist').length, 0, "Destroy - list");
- equal(new_page.has('.ui-swipelist-item').length, 0 , "Destroy - item" );
- equal(new_page.has('.ui-swipelist-item-cover').length, 0, "Destroy - cover");
-
- };
-
- asyncTest( " swipelist ", function() {
- expect(7);
- unit_swipe( $("#swipewidget"), "swipelist" );
- start();
- });
-
- asyncTest( " swipelist - destory", function() {
- expect(6),
- unit_swipe_destroy( $("#swipedestroy"), "swipelistdestroy"),
- start()
- });
-
-} ) ( jQuery );
"check",
"controlbar",
"datetimepicker",
- "dayselector",
- "expandablelist",
"extendablelist",
"handler",
"gallery",
"multimediaview",
"navigationbar",
- "nocontents",
"notification",
- "pagecontrol",
"popupwindow",
"popupwindow_ctxpopup",
"progressbar",
"radio",
"searchbar",
"segmentcontrol",
- "shortcutscroll",
+ "fastscroll",
"slider",
- "swipelist",
+ "swipe",
"toggleswitch",
"tokentextarea",
"virtuallist",
projects / platform / framework / web / web-ui-fw.git / commitdiff
