From b743413be95898f19109f35e9fe1c4bbc83d9b21 Mon Sep 17 00:00:00 2001 From: devin Date: Wed, 18 Apr 2012 13:17:12 +0800 Subject: [PATCH] function update --- app/assets/javascripts/orbitdesktop.js | 148 +++++++++++++++------ app/assets/stylesheets/desktopmain.css | 23 ++-- app/views/desktop/desktop.html.erb | 2 +- app/views/desktop/settings/themes.html.erb | 54 ++++---- 4 files changed, 148 insertions(+), 79 deletions(-) diff --git a/app/assets/javascripts/orbitdesktop.js b/app/assets/javascripts/orbitdesktop.js index c80142d8..d0a7e3f0 100755 --- a/app/assets/javascripts/orbitdesktop.js +++ b/app/assets/javascripts/orbitdesktop.js @@ -169,12 +169,11 @@ var orbitDesktop = function(dom){ } } }); - $('div#desktop .tinycanvas').tinyscrollbar({ axis: 'x'}); - $("div#desktop div.scrollbar").hover(function(){ - $(this).removeClass('op01'); - }, function(){ - $(this).addClass('op01'); - }); + $('div#desktop .tinycanvas') + .tinyscrollbar({ axis: 'x' }) + .find('.scrollbar') + .delay(1500) + .addClass('op00', 500); // simple dropdown menu var $sdm = $('.sdm'); @@ -305,7 +304,11 @@ var orbitDesktop = function(dom){ $("div#app_manager .group_search").html(allApps); return false; }) - $('.tinycanvas').tinyscrollbar({ axis: 'x'}); + $('.tinycanvas') + .tinyscrollbar({ axis: 'x'}) + .find('.scrollbar') + .delay(1500) + .addClass('op00', 500); } var loadApps = function(){ $.getJSON("/desktop/getapplist",{desktopid:o.desktopId},function(appss){ @@ -371,7 +374,11 @@ var orbitDesktop = function(dom){ $(this).find('span.tile').addClass('op06'); } }); - $('.tinycanvas').tinyscrollbar({ axis: 'x'}); + $('.tinycanvas') + .tinyscrollbar({ axis: 'x'}) + .find('.scrollbar') + .delay(1500) + .addClass('op00', 500); var $sdm = $('.sdm'); if( !$sdm.children('.sdm_o') ){ @@ -431,34 +438,43 @@ var orbitDesktop = function(dom){ o.currenthtml = target; o.currentface = "settings"; var bindHandlers = function(){ - $("div#settings ul#setting_left_nav li a").click(function(){ - if(!$(this).data("clicked")){ - var tfunc = $(this).attr("href"); - switch(tfunc){ - case "themes": - themes(); - break; - case "sections": - sections(); - break; - } - $("div#settings ul#setting_left_nav li a").removeClass('thmc1 thmtxt').data('clicked',null); - $(this).addClass('thmc1 thmtxt').data('clicked',true); + $("div#settings ul#setting_left_nav li a").on({ + click: function(){ + if(!$(this).data("clicked")){ + var tfunc = $(this).attr("href"); + switch(tfunc){ + case "themes": + themes(); + break; + case "sections": + sections(); + break; + } + $("div#settings ul#setting_left_nav li a").removeClass('thmc1 thmtxt').data('clicked',null); + $(this).addClass('thmc1 thmtxt').data('clicked',true); + } + }, + mouseenter: function(){ + $(this).removeClass('admtxt').addClass('thmc1 thmtxt'); + }, + mouseleave: function(){ + var t = $(this).data('clicked') ? '' : 'thmc1 thmtxt'; + $(this).removeClass(t).addClass('admtxt'); } }); - $("div#settings ul#setting_left_nav li a").hover(function(){ - $(this).removeClass('admtxt').addClass('thmc1 thmtxt'); - }, function(){ - var t = $(this).data('clicked') ? '' : 'thmc1 thmtxt'; - $(this).removeClass(t).addClass('admtxt'); - }); + } var sections = function(){ var bindHandlers = function(){ $('.tinycanvas').each(function(){ var h = $(this).parent().height(), sh = $(this).siblings('.s_tab').height(); - $(this).css({'height': h-sh-24}).tinyscrollbar({ axis: 'y'}); + $(this) + .css({'height': h-sh-24}) + .tinyscrollbar({ axis: 'y'}) + .find('.scrollbar') + .delay(1500) + .addClass('op00', 500); }); $("a#name_save_btn").click(function(){ @@ -493,27 +509,51 @@ var orbitDesktop = function(dom){ } var themes = function(){ var bindHandlers = function(){ - $(".theme_list > li").click(function(){ + // live change theme + $(".theme_list > .ssl_item").click(function(){ o.changeTheme($(this).attr("id")); - $(".theme_list > li").removeClass('thmc1').data('clicked',null).find('.theme_name').removeClass('thmtxt'); - $(this).addClass('thmc1').data('clicked',true).find('.theme_name').addClass('thmtxt'); + // $(".theme_list > li").removeClass('thmc1').data('clicked',null).find('.theme_name').removeClass('thmtxt'); + // $(this).addClass('thmc1').data('clicked',true).find('.theme_name').addClass('thmtxt'); $.post("/desktop/save_desktop_settings",{"save":"theme","desktopid":o.desktopId,"theme":$(this).attr("id")},function(result,status){ if(status=="success"){ - if(result[0].success=="true") + if(result[0].success=="true"){ o.notify("Theme Saved!!","success",2); - else + loadthmc(); + } else { o.notify("Theme saving failed!!","imp",2); + } }else{ o.notify("Connection problem!!","alert",2); } }); }); + + // single select + $('.ssl .ssl_item').each(function(){ + $(this).on({ + click: function(){ + $(this).switchClass('','thmc1 active',300); + $(this).siblings('.thmc1').switchClass('thmc1 active','',100); + + if( $(this).find('.ssl_des') ){ + $(this).parents('.ssl').find('.ssl_des').removeClass('thmtxt'); + $(this).find('.ssl_des').addClass('thmtxt'); + } + } + }); + }); $('.tinycanvas').each(function(){ var h = $(this).parent().height(), sh = $(this).siblings('.s_tab').height(); - $(this).css({'height': h-sh-24}).tinyscrollbar({ axis: 'y'}); + $(this) + .css({'height': h-sh-24}) + .tinyscrollbar({ axis: 'y'}) + .find('.scrollbar') + .delay(1500) + .addClass('op00', 500); }); + // tab var $anchor = $('.s_tab a[href*=#]'), $tabcontent = $('.st_c'); @@ -528,12 +568,38 @@ var orbitDesktop = function(dom){ return false; }); }); - /* $("tr#color_inputs input").each(function(){ - var what = $(this).attr("for"); - alert($("#theme_preview_area ."+what).css("background-color")) - $(this).val() - }) */ - + + loadthmc(); + function loadthmc(){ + $('#color_input .color-picker').each(function(){ + var cc = $(this).attr('for'), hex, color; + + switch(cc){ + case 'thmtxt': + case 'thmtxth': + hex = 'color'; + break; + case 'g_sep': + hex = 'borderColor'; + break; + default: + hex = 'backgroundColor'; + break; + } + + color = $('.'+cc).css( hex ); + $(this).val(rgb2hex(color)); + + }); + } + // Awesome RGBA to HEX (alpha ignored) + function rgb2hex(rgb) { + rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); + function hex(x) { + return ("0" + parseInt(x).toString(16)).slice(-2); + } + return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]); + } $('.color-picker').miniColors({ change:function(hex){ var changewhat = $(this).attr("for"); @@ -546,7 +612,7 @@ var orbitDesktop = function(dom){ case "g_sep": previewarea.find("."+changewhat).css({"border-color":hex}); break; - case "background": + case "thmbgc": previewarea.css({"background-color":hex}); break; default: diff --git a/app/assets/stylesheets/desktopmain.css b/app/assets/stylesheets/desktopmain.css index fa7f5c5c..f0a1e9a8 100644 --- a/app/assets/stylesheets/desktopmain.css +++ b/app/assets/stylesheets/desktopmain.css @@ -259,29 +259,34 @@ a:focus { outline: none; } /* Setting Page */ .theme_list {} -.theme_list li { +.theme_list .ssl_item, .stock_wallpaper .ssl_item { display: inline-block; vertical-align: top; - margin: 0 0 24px 0; + margin: 0 0 12px 0; padding: 6px 0px; width: 132px; text-align: center; cursor: pointer } -.theme_thumb { border: solid 1px #fff; width: 120px; margin: 0 auto; } -.theme_thumb img { display: block; } +.theme_thumb, .stock_wallpaper img { border: solid 1px #fff; width: 120px; margin: 0 auto; } +.theme_thumb img, .stock_wallpaper img { display: block; } .theme_name { font-size: 15px; padding: 8px 6px; display: block; } .theme_preview { width: 528px; height: 150px; line-height: 36px; font-size: 15px; } .theme_plate { overflow: hidden; } .theme_plate > div { float: left; margin-right: 12px; } .theme_plate > div:first-child { margin-right: 48px;} -.stock_background ul { overflow: hidden; } -.stock_background li { float: left; margin: 6px; } -.stock_background a { border: solid 3px #f6f6f6; display: block; } -.stock_background img { display: block; margin: 0 auto; border: solid 1px #fff; } +.stock_wallpaper { } +.stock_wallpaper .ssl_item { margin-bottom: 6px; } +.stock_wallpaper img { } .s_title { font-size: 15px; line-height: 60px; text-align: left; } -.s_action { padding: 24px 0; overflow: hidden; } +.s_action { + padding: 24px 0; + margin-top: 12px; + overflow: hidden; + border-top: solid 1px #eee; + background-color: #fff; +} .setting_btn { display: block; float: right; diff --git a/app/views/desktop/desktop.html.erb b/app/views/desktop/desktop.html.erb index 79ac832d..f8904136 100755 --- a/app/views/desktop/desktop.html.erb +++ b/app/views/desktop/desktop.html.erb @@ -15,7 +15,7 @@
-
+
diff --git a/app/views/desktop/settings/themes.html.erb b/app/views/desktop/settings/themes.html.erb index da60fd51..375ca463 100644 --- a/app/views/desktop/settings/themes.html.erb +++ b/app/views/desktop/settings/themes.html.erb @@ -2,7 +2,7 @@
@@ -10,18 +10,18 @@
-
    -
  • Default
    • -
  • Snake
    • -
  • Sexy
    • -
  • Vintage
    • -
  • Natural
    • -
  • Chris
    • -
+
+
Default
+
Snake
+
Sexy
+
Vintage
+
Natural
+
Chris
+
Preview
-
+
Theme Text1
@@ -31,14 +31,14 @@
- +
- +
Theme Color Line Color Text Color Background Color
@@ -52,7 +52,7 @@ - +
@@ -63,21 +63,19 @@
-
-
    -
    • -
    • -
    • -
    • -
    • -
    • -
    • -
    • -
    • -
    • -
    • -
    • -
+
+
+
+
+
+
+
+
+
+
+
+
+
Confirm