developers
/
orbit-basic
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

theme setting update

This commit is contained in:
devin 2012-04-11 13:46:32 +08:00
parent ee85380ab2
commit 42f45aa137
6 changed files with 64 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/assets/images/sample_theme.jpg Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

29
app/assets/javascripts/orbitdesktop.js
View File

@ -292,8 +292,10 @@ var orbitDesktop = function(dom){
o.currenthtml = target; o.currenthtml = target;
o.currentface = "settings"; o.currentface = "settings";
var bindHandlers = function(){ var bindHandlers = function(){
$("select#change_theme").change(function(){ $(".theme_list > li").click(function(){
o.changeTheme($(this).val()); o.changeTheme($(this).find('.theme_name').text());
$(".theme_list > li").removeClass('thmc1').data('clicked',null);
$(this).addClass('thmc1').data('clicked',true);
}); });
$('.tinycanvas').each(function(){ $('.tinycanvas').each(function(){
@ -312,9 +314,9 @@ var orbitDesktop = function(dom){
var target = $(this).attr('href'); var target = $(this).attr('href');
$anchor $anchor
.removeClass('thmc2 thmtxt admtxt') .removeClass('thmc2 thmtxt admtxt admbg')
.addClass('admtxt'); .addClass('admtxt admbg');
$(this).toggleClass('thmc2 thmtxt admtxt'); $(this).toggleClass('thmc2 thmtxt admtxt admbg');
$tabcontent.hide(); $tabcontent.hide();
$(target).show(); $(target).show();
$('.tinycanvas').tinyscrollbar_update(); $('.tinycanvas').tinyscrollbar_update();
@ -330,6 +332,23 @@ var orbitDesktop = function(dom){
}); });
$('.theme_list li').hover(function(){
$(this)
.addClass('thmc1')
.find('.theme_name')
.addClass('thmtxt');
}, function(){
var c = 'thmc1',
t = 'thmtxt';
if( $(this).data('clicked') ){
t = '', c = '';
}
$(this)
.removeClass(c)
.find('.theme_name')
.removeClass(t);
});
} }
// if(!o.desktopData[o.currentface]){ // if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load("/desktop/"+target,function(){ $(o.contentHolder).empty().load("/desktop/"+target,function(){

15
app/assets/stylesheets/desktopmain.css
View File

@ -1,4 +1,3 @@
@import url(http://fonts.googleapis.com/css?family=Cuprum);
/* http://meyerweb.com/eric/tools/css/reset/ /* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126 v2.0 | 20110126
License: none (public domain) License: none (public domain)
@ -247,10 +246,24 @@ a:focus { outline: none; }
.s_tab ul { overflow: hidden; } .s_tab ul { overflow: hidden; }
.s_tab li { float: left; } .s_tab li { float: left; }
.s_tab a { display: block; } .s_tab a { display: block; }
.s_tab .admbg { background-color: #f0f0f0; }
.st_c { display: none; } .st_c { display: none; }
.st_c:first-child { display: block; } .st_c:first-child { display: block; }
/* Setting Page */ /* Setting Page */
.theme_list {}
.theme_list li {
display: inline-block;
vertical-align: top;
margin: 0 0 24px 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_name { font-size: 15px; padding: 8px 6px; display: block; }
.theme_preview { width: 528px; height: 150px; line-height: 36px; font-size: 15px; } .theme_preview { width: 528px; height: 150px; line-height: 36px; font-size: 15px; }
.theme_plate { overflow: hidden; } .theme_plate { overflow: hidden; }
.theme_plate > div { float: left; margin-right: 12px; } .theme_plate > div { float: left; margin-right: 12px; }

4
app/assets/stylesheets/jquery.miniColors.css
View File

@ -19,8 +19,8 @@
} }
.miniColors-selector.black { .miniColors-selector.black {
background: #000; background: #222;
border-color: #000; border-color: #222;
} }
.miniColors-colors { .miniColors-colors {

1
app/assets/stylesheets/style.css.erb
View File

@ -1,3 +1,4 @@
@import url(http://fonts.googleapis.com/css?family=Cuprum);
@font-face{ @font-face{
font-family: 'WebSymbolsRegular'; font-family: 'WebSymbolsRegular';
src: url(<%= asset_path 'websymbols-regular-webfont.eot' %>); src: url(<%= asset_path 'websymbols-regular-webfont.eot' %>);

28
app/views/desktop/settings.html.erb
View File

@ -21,14 +21,32 @@
<div class="s_tab stb_h"> <div class="s_tab stb_h">
<ul> <ul>
<li><a href="#st1" class="hh2 hp thmtxt thmc2">Select Theme</a></li> <li><a href="#st1" class="hh2 hp thmtxt thmc2">Select Theme</a></li>
<li><a href="#st2" class="hh2 hp admtxt">Custom Theme</a></li> <li><a href="#st2" class="hh2 hp admtxt admbg">Custom Theme</a></li>
</ul> </ul>
</div> </div>
<div class="tinycanvas vp"> <div class="tinycanvas vp">
<div class="scrollbar sb_v vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div> <div class="scrollbar sb_v vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport"> <div class="viewport">
<div class="overview hp"> <div class="overview">
<div id="st1" class="st_c">try</div> <div id="st1" class="st_c">
<ul class="theme_list">
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">default</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">snake</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">sexy</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">vintage</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Woodstock westwood allenwood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">chris</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
<li><div class="theme_thumb"><img src="assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name">Wood</span></li>
</ul>
</div>
<div id="st2" class="st_c"> <div id="st2" class="st_c">
<div class="s_title hh3">Preview</div> <div class="s_title hh3">Preview</div>
<div class="theme_preview vp" style="background-image: url(/desktop_themes/default/images/background.jpg);"> <div class="theme_preview vp" style="background-image: url(/desktop_themes/default/images/background.jpg);">
@ -77,7 +95,7 @@
</div> </div>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
<select id="change_theme"> <!-- <select id="change_theme">
<option value='default'>Default Theme</option> <option value='default'>Default Theme</option>
<option value='snake'>Snake Theme</option> <option value='snake'>Snake Theme</option>
<option value='sexy'>Sexy Theme</option> <option value='sexy'>Sexy Theme</option>
@ -85,6 +103,6 @@
<option value='chris'>Chris Theme</option> <option value='chris'>Chris Theme</option>
</select> </select>
<br /> <br />
<button onClick="od.tempFunc();">Save</button> <button onClick="od.tempFunc();">Save</button> -->
</div> </div>
</div> </div>