libs/js/jquery-mobile-1.0.1pre/experiments/themeswitcher/jquery.mobile.themeswitcher.js

   1 //quick & dirty theme switcher, written to potentially work as a bookmarklet
   2 (function($){
   3         $.themeswitcher = function(){
   4                 if( $('[data-'+ $.mobile.ns +'-url=themeswitcher]').length ){ return; }
   5                 var themesDir = 'http://jquerymobile.com/test/css/themes/',
   6                         themes = ['default','valencia'],
   7                         currentPage = $.mobile.activePage,
   8                         menuPage = $( '<div data-'+ $.mobile.ns +'url="themeswitcher" data-'+ $.mobile.ns +'role=\'dialog\' data-'+ $.mobile.ns +'theme=\'a\'>' +
   9                                                 '<div data-'+ $.mobile.ns +'role=\'header\' data-'+ $.mobile.ns +'theme=\'b\'>' +
  10                                                         '<div class=\'ui-title\'>Switch Theme:</div>'+
  11                                                 '</div>'+
  12                                                 '<div data-'+ $.mobile.ns +'role=\'content\' data-'+ $.mobile.ns +'theme=\'c\'><ul data-'+ $.mobile.ns +'role=\'listview\' data-'+ $.mobile.ns +'inset=\'true\'></ul></div>'+
  13                                         '</div>' )
  14                                         .appendTo( $.mobile.pageContainer ),
  15                         menu = menuPage.find('ul');
  16
  17                 //menu items
  18                 $.each(themes, function( i ){
  19                         $('<li><a href="#" data-'+ $.mobile.ns +'rel="back">' + themes[ i ].charAt(0).toUpperCase() + themes[ i ].substr(1) + '</a></li>')
  20                                 .bind("vclick", function(){
  21                                         addTheme( themes[i] );
  22                                         menuPage.dialog( "close" );
  23                                         return false;
  24                                 })
  25                                 .appendTo(menu);
  26                 });
  27
  28                 //remover, adder
  29                 function addTheme(theme){
  30                         $('head').append( '<link rel=\'stylesheet\' href=\''+ themesDir + theme +'/\' />' );
  31                 }
  32
  33                 //create page, listview
  34                 menuPage.page();
  35
  36         };
  37 })(jQuery);