demos/tizen-winsets/main.js

   1 $( document ).bind("pagecreate", function () {
   2         /* Color widget demo */
   3         $("input[type='checkbox'][data-widget-type-list]").bind("change", function() {
   4                 var ls = $( this ).attr("data-widget-type-list").split(","),
   5                         page = $( this ).closest(":jqmData(role='page')"),
   6                         disabled = $( this ).is(":checked");
   7
   8                 $.each(ls, function( idx, widgetType ) {
   9                         var ar = widgetType.split("-");
  10
  11                         if ( ar.length === 2 ) {
  12                                 page.find(":" + widgetType)[ar[1]]( "option", "disabled", disabled );
  13                         }
  14                 });
  15         });
  16
  17         $('#scroller-demo').bind('pageshow', function ( e ) {
  18                 $page = $( e.target );
  19                 /*
  20                  * many options cannot be set without subclassing since they're
  21                  * used in the _create method - it seems as if these are for
  22                  * internal use only and scrollDuration is only changable by
  23                  * chance.
  24                  */
  25                 var $scroller2List = $('#scroller2').find('ul');
  26                 $scroller2List.scrollview( 'option','scrollDuration','10000' );
  27
  28                 // only works by manipulating css
  29                 // the only other way is to use attribute 'scroll-method="scroll"' in html
  30                 $('#scroller2 .ui-scrollbar').css( 'visibility','hidden' );
  31
  32                 /*
  33                  * make toggle button switch scroll bars on and off
  34                  */
  35                 var scrollBarVisible = $('#scroller2').find('.ui-scrollbar').css('visibility') === "visible";
  36
  37                 var $toggleScrollBars = $('#toggleScrollBars');
  38                 $toggleScrollBars.attr( "checked", scrollBarVisible ).checkboxradio("refresh");
  39
  40                 /* the 'label' is the thing that is clicked, not the input element */
  41                 var $label = $toggleScrollBars.siblings('label').attr( 'for', '#toggleScrollBars' );
  42                 $label.bind("click", function () {
  43                         var $scrollBar = $('#scroller2').find('.ui-scrollbar');
  44                         var scrollBarVisible = $scrollBar.css('visibility') === "visible";
  45                         var newVisibility = scrollBarVisible ? "hidden" : "visible";
  46                         $scrollBar.css( 'visibility', scrollBarVisible ? "hidden" : "visible" );
  47                 });
  48         });
  49
  50         $("#demo-date").bind("date-changed", function ( e, newDate ) {
  51                 $("#selected-date1").text( newDate.toString() );
  52         });
  53
  54         $("#demo-date2").bind("date-changed", function ( e, newDate ) {
  55                 $("#selected-date2").text( newDate.toString() );
  56         });
  57
  58         $("#demo-date3").bind("date-changed", function ( e, newDate ) {
  59                 $("#selected-date3").text( newDate.toString() );
  60         });
  61
  62         $("#demo-date4").bind("date-changed", function ( e, newDate ) {
  63                 $("#selected-date4").text( newDate.toString() );
  64         });
  65
  66         $('#noti-demo').bind('vmouseup', function ( e ) {
  67                 $('#notification').notification('open');
  68         });
  69
  70         $('#noti-icon1').bind('vclick', function ( e ) {
  71                 $('#notification').notification('icon', './test/icon02.png');
  72         });
  73
  74         $('#noti-icon2').bind('vclick', function ( e ) {
  75                 $('#notification').notification('icon', './test/icon01.png');
  76         });
  77
  78         $('#gallery-demo').bind('pageshow', function () {
  79                 $('#gallery').gallery('add', './test/01.jpg');
  80                 $('#gallery').gallery('add', './test/02.jpg');
  81                 $('#gallery').gallery('add', './test/03.jpg');
  82                 $('#gallery').gallery('add', './test/04.jpg');
  83                 $('#gallery').gallery('add', './test/05.jpg');
  84                 $('#gallery').gallery('add', './test/06.jpg');
  85                 $('#gallery').gallery('add', './test/07.jpg');
  86                 $('#gallery').gallery('add', './test/08.jpg');
  87                 $('#gallery').gallery('add', './test/09.jpg');
  88                 $('#gallery').gallery('refresh', 3);
  89         });
  90
  91         $('#gallery-demo').bind('pagebeforehide', function () {
  92                 $('#gallery').gallery('empty');
  93         });
  94
  95         $('#gallery-add').bind('vmouseup', function ( e ) {
  96                 $('#gallery').gallery('add', './test/10.jpg');
  97                 $('#gallery').gallery('add', './test/11.jpg');
  98                 $('#gallery').gallery('refresh');
  99         });
 100
 101         $('#gallery-del').bind('vmouseup', function ( e ) {
 102                 $('#gallery').gallery('remove');
 103         });
 104
 105         $('#selectioninfo-demo').bind('vmouseup', function ( e ) {
 106                 $('#smallpopup_selectioninfo').notification( "text",
 107                         $("#dayselector1").find(".ui-checkbox-on").length + " items are selected" );
 108                 $('#smallpopup_selectioninfo').notification('open');
 109         });
 110
 111         $('#groupindex-demo').bind('pageshow', function () {
 112                 $('#groupindex').scrolllistview();
 113         });
 114
 115         $("#showVolumeButton").bind("vclick", function ( e ) {
 116                 $("#myVolumeControl").volumecontrol("open");
 117         });
 118
 119         $("#volumecontrol_setBasicTone").bind("change", function ( e ) {
 120                 var basicTone = !($("#volumecontrol_setBasicTone").next('label')
 121                                 .find(".ui-icon").hasClass("ui-icon-checkbox-on"));
 122
 123                 if ( basicTone ) {
 124                         $("#myVolumeControl").volumecontrol( "option", "basicTone", true );
 125                         $("#myVolumeControl").volumecontrol( "option", "title", "Basic Tone" );
 126                 } else {
 127                         $("#myVolumeControl").volumecontrol( "option", "basicTone", false );
 128                         $("#myVolumeControl").volumecontrol( "option", "title", "Volume" );
 129                 }
 130         });
 131
 132         $("#myoptionheader").bind('collapse', function () {
 133                 console.log('option header was collapsed');
 134         });
 135
 136         $("#myoptionheader").bind('expand', function () {
 137                 console.log('option header was expanded');
 138         });
 139
 140         /* Gen list : Dummy DB load */
 141         $(".virtuallist_demo_page").live("pagecreate", function () {
 142                 /* ?_=ts code for no cache mechanism */
 143                 $.getScript( "./virtuallist-db-demo.js", function ( data, textStatus ) {
 144                         $("ul").filter( function () {
 145                                 return $( this ).data("role") == "virtuallistview";
 146                         }).addClass("vlLoadSuccess");
 147
 148                         $(".virtuallist_demo_page").die();
 149                         $("ul.ui-virtual-list-container").virtuallistview("create");
 150                 });
 151         });
 152
 153         /*Expandable list : Dummy DB load*/
 154         $("#genlist_extendable_page").live("pagecreate", function ( el ) {
 155                 /*?_=ts code for no cache mechanism*/
 156                 $.getScript( "./virtuallist-db-demo.js", function ( data, textStatus ) {
 157                         $("ul").filter( function () {
 158                                 return $( this ).data("role") == "extendablelist";
 159                         }).addClass("elLoadSuccess");
 160
 161                         $("#genlist-extendable-page").die();
 162                         $("ul.ui-extendable-list-container").extendablelist("create");
 163                         // TODO: 'create' is called twice!!
 164                 });
 165         });
 166 });
 167
 168 $(document).bind( "pageinit" , function() {
 169         $.mobile.tizen.enableSelection($("div:jqmData(role='page')"), 'none');
 170 });
 171 $(document).ready( function () {
 172         // add current datetime with browser language format
 173         // NOTE: Globalize.* functions must be run after docoument ready.
 174         $('#current_date').html(Globalize.culture().name + " -- " +
 175                                 Globalize.format( new Date(), "F" ));
 176         $('#html_font_size').html('html font size:' + $('html').css('font-size'));
 177 });