Merge branch 'desktop_harry' into desktop_devin

This commit is contained in:
Harry Bomrah 2012-05-11 15:28:05 +08:00
commit 1a9fa8f505
53 changed files with 358 additions and 337 deletions

View File

@ -26,6 +26,7 @@ gem 'sprockets'
gem 'tinymce-rails' gem 'tinymce-rails'
gem 'therubyracer' if RUBY_PLATFORM.downcase.include?("linux") gem 'therubyracer' if RUBY_PLATFORM.downcase.include?("linux")
gem 'mongoid-encryptor', :require => 'mongoid/encryptor' gem 'mongoid-encryptor', :require => 'mongoid/encryptor'
# gem 'twitter'
# Gems used only for assets and not required # Gems used only for assets and not required
# in production environments by default. # in production environments by default.

View File

@ -26,7 +26,7 @@ var orbitDesktop = function(dom){
this.transitionTime = 500; this.transitionTime = 500;
this.currenthtml = "desktop.html"; this.currenthtml = "desktop.html";
this.currentface = "home"; this.currentface = "home";
this.desktopData = {"home":"","settings":"","work":"","favorite":"","apps_manager":"","sections":"","journal_p":""}; this.desktopData = {"home":"","settings":"","work":"","favorite":"","apps_manager":"","sections":"","journal_p":"","appstore":""};
this.tp = ""; this.tp = "";
this.sectionList; this.sectionList;
this.initialize = function(){ this.initialize = function(){
@ -55,7 +55,7 @@ var orbitDesktop = function(dom){
$(document).ready(function(){o.loadWallpaper(customwallpaper);o.bindDesktopEvents();o.loadIconCache();o.initializeDesktop();}); $(document).ready(function(){o.loadWallpaper(customwallpaper);o.bindDesktopEvents();o.loadIconCache();o.initializeDesktop();});
}) })
} }
}; }
this.changeTheme = function(theme){ // this function is used for changing theme this.changeTheme = function(theme){ // this function is used for changing theme
o.theme = theme; o.theme = theme;
$.getJSON("/"+o.themefolder+"/"+theme+"/settings/"+theme+".json",function(ts){ $.getJSON("/"+o.themefolder+"/"+theme+"/settings/"+theme+".json",function(ts){
@ -112,6 +112,15 @@ var orbitDesktop = function(dom){
}); });
} }
}); });
$("a#d_appstore").click(function(){
var target = $(this).attr("href");
if(o.currenthtml!=target){
o.desktopData[o.currentface] = $(o.contentHolder).html();
$("#content").hide("drop",o.transitionTime,function(){
o.initializeAppstore(target);
});
}
});
$(window).resize(function(){ $(window).resize(function(){
var ww = $(window).width(); var ww = $(window).width();
$("img#thmbackground").attr({"width":ww}); $("img#thmbackground").attr({"width":ww});
@ -314,9 +323,7 @@ var orbitDesktop = function(dom){
}; };
this.tempFunc = function(th){ this.tempFunc = function(th){
o.confirm("What","","",function(reply){ $.post("desktop/twitter",function(){});
alert(reply);
})
}; };
this.initializeAppSearch = function(target){ //this is application search ie is app manager initialization this.initializeAppSearch = function(target){ //this is application search ie is app manager initialization
@ -1020,7 +1027,7 @@ var orbitDesktop = function(dom){
bindSecondaryHandlers(); bindSecondaryHandlers();
} }
$("div#settings div#panel_r").load("/desktop/journal_p_list",function(){ $("div#journal_p div#panel_r").load("/desktop/journal_p_list",function(){
$.getJSON("/desktop_publications/getjournals",function(journals){ $.getJSON("/desktop_publications/getjournals",function(journals){
journalData = eval(journals); journalData = eval(journals);
journalview(); journalview();
@ -1048,7 +1055,7 @@ var orbitDesktop = function(dom){
.delay(1500) .delay(1500)
.addClass('op00', 500); .addClass('op00', 500);
} }
$("div#settings div#panel_r").load("/desktop/journal_p_add",function(){ $("div#journal_p div#panel_r").load("/desktop/journal_p_add",function(){
bindHandlers(); bindHandlers();
}) })
} }
@ -1064,6 +1071,161 @@ var orbitDesktop = function(dom){
list(); list();
} }
}; };
this.initializeAppstore = function(target){
o.currenthtml = target;
o.currentface = "appstore";
var bindHandlers = function(){
$('.s_menu a').on({
click: function(){
if(!$(this).hasClass('active')){
var tfunc = $(this).attr('href');
switch(tfunc){
case 'widgets':
widgets();
break;
}
$('.s_menu a').removeClass('thmc1 thmtxt active');
$(this).addClass('thmc1 thmtxt active');
}
},
mouseenter: function(){
if(!$(this).hasClass('active')){
$(this).switchClass('admtxt','thmc1 thmtxt',0);
}
},
mouseleave: function(){
var t = $(this).hasClass('active') ? '' : 'thmc1 thmtxt';
$(this).switchClass(t,'admtxt',0);
}
});
}
var widgets = function(){
var bindHandlers = function(){
$("#widget_list a").click(function(){
var sectionid = $(this).attr("for");
var widgetid = $(this).parent().parent().attr("for");
switch($(this).attr("href")){
case "addthis":
$this = $(this);
o.confirm({
message: "Are you sure you want to add this widget?",
buttons: ['Yes','No'],
highlighted: 1
},function(reply){
if(reply){
$.post("desktop_appstore/widgets_settings",{section:sectionid, widget:widgetid, what:"add"},function(result){
if(result[0].success){
$this.attr("href","removethis");
$targetDom = $this.parent().parent().find("div.status");
$parentDom = $this.parent();
if($targetDom.find("a").length == 0)
$targetDom.html("Status : Installed on");
$targetDom.append(" ").append($this);
if($parentDom.find("a").length == 0)
$parentDom.empty();
o.desktopData["home"]="";
o.notify("Widget added.","success",2);
}else{
o.notify(result[0].error,"imp",2);
}
})
}
})
break;
case "removethis":
$this = $(this);
o.confirm({
message: "Are you sure you want to remove this widget?",
buttons: ['Yes','No'],
highlighted: 2
},function(reply){
if(reply){
$.post("desktop_appstore/widgets_settings",{section:sectionid, widget:widgetid, what:"remove"},function(result){
if(result[0].success){
$this.attr("href","addthis");
$targetDom = $this.parent().parent().find("div.not_status");
$parentDom = $this.parent();
if($targetDom.html()=="")
$targetDom.html("Install on");
$targetDom.append(" ").append($this);
if($parentDom.find("a").length == 0)
$parentDom.html("Status : Downloaded");
o.desktopData["home"]="";
o.notify("Widget removed.","success",2);
}
})
}
})
break;
}
return false;
})
}
$("div#apps_store div#panel_r").load("/desktop_appstore/widgets",function(){
$.getJSON("/desktop_appstore/getuserwidgets",function(userwidgets){
var column = $('<div class="g_col list_t" style="width:350px;"><ul></ul></div>'),
counter = 1,
li;
$.each(userwidgets,function(i,widge){
if(!widge.status)widge.status = "Downloaded";
var brick = widge.shape.split(' '),
bw = parseInt(brick[0].substr(1)),
bh = parseInt(brick[1].substr(1)),
shp = bw+" X "+bh;
li = $('<li class="list_t_item" for="'+widge._id+'"><div class="list_t_title">'+widge.name+'</div><div class="list_t_des">Author : '+widge.author+'</div><div class="list_t_des">Shape : '+shp+'</div><div class="list_t_des status">Status : '+widge.status+'</div><div class="list_t_des not_status"></div></li>');
var cur_section_names = new Array();
var section_names = new Array();
var section_links = new Array();
if(widge.section){
var s_name_list = "";
$.each(widge.section,function(x,sec){
$.each(o.sectionList,function(j,s){
if(s._id==sec){
cur_section_names.push(s.name);
s_name_list+= "<a href='removethis' for='"+s._id+"' style='text-decoration:underline;'>"+s.name +"</a> ";
}
})
})
var section_names = o.getArrayfromJson(o.sectionList,"name");
var section_links = o.getArrayfromJson(o.sectionList,"_id");
var s_name_list_not = "";
$.each(section_names,function(j,sec_name){
if($.inArray(sec_name,cur_section_names)==-1){
var sec_link = section_links[j];
s_name_list_not+= "<a href='addthis' for='"+sec_link+"' style='text-decoration:underline;'>"+sec_name+"</a> ";
}
})
li.find("div.status").html("Status : Installed on "+s_name_list);
if(s_name_list_not)
li.find("div.not_status").html("Install on "+s_name_list_not);
}else{
li.find("div.not_status").html("Install on "+o.sectionList[0].name+", "+o.sectionList[1].name+", "+o.sectionList[2].name+", "+o.sectionList[3].name);
}
//console.log(section_names);
column.find("ul").append(li);
if(counter%4==0){
$("#apps_store div#widget_list").append(column);
column = $('<div class="g_col list_t" style="width:350px;"><ul></ul></div>');
}
counter++;
})
$("#apps_store div#widget_list").append(column);
bindHandlers();
})
})
}
if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load("/desktop_appstore/"+target,function(){
widgets();
bindHandlers();
});
}else{
$(o.contentHolder).html(o.desktopData[o.currentface]);
widgets();
bindHandlers();
}
}
this.loadWallpaper = function(wallpaper){ // this is to load new wallpaper this.loadWallpaper = function(wallpaper){ // this is to load new wallpaper
if(!wallpaper)wallpapernm = o.themesettings.background;else wallpapernm = wallpaper if(!wallpaper)wallpapernm = o.themesettings.background;else wallpapernm = wallpaper
var ww = $(window).width(); var ww = $(window).width();

View File

@ -79,6 +79,13 @@ var orbitDesktopAPI = function(){
}); });
$confirm.stop(1,1).fadeIn(); $confirm.stop(1,1).fadeIn();
}; };
this.getArrayfromJson = function(tjson,key){
var tempArray = new Array;
$.each(tjson,function(i,val){
tempArray.push(val[key]);
})
return tempArray;
}
}; };
orbitDesktopAPI.prototype.notifyImgPath = "temp"; orbitDesktopAPI.prototype.notifyImgPath = "temp";
orbitDesktopAPI.prototype.wallpaperPath = "temp"; orbitDesktopAPI.prototype.wallpaperPath = "temp";

View File

@ -0,0 +1,97 @@
class DesktopAppstoreController< ApplicationController
def appstore
render "desktop/appstore", :layout => false
end
def widgets
render "desktop/appstore/widgets", :layout => false
end
def getuserwidgets
@widgets = current_user.desktop.desktop_widgets
@groups = Array.new
@sections = current_user.desktop.sections
@sections.each do |section|
@groups << section.groups
end
@widgets.each do |widget|
@count = 0;
@sectionids = Array.new
@groups.each do |group|
group.each do |grp|
@widge = 0
@gid = widget.id.to_s
@widge = grp.tiles.where(:data_content.all => [@gid]).count
@count = @count + @widge
if @widge > 0
@sectionids << grp.section_id
end
end
end
if @count > 0
widget.status = "Installed"
widget.section = @sectionids
else
widget.status = "Downloaded"
end
end
render :json=>@widgets.to_json
end
def widgets_settings
what = params["what"]
@widgetid = params["widget"]
@sectionid = params["section"]
@msg = Array.new
case what
when "remove"
@section = Section.find(@sectionid)
@groups = @section.groups
@groups.each do |group|
@tile = group.tiles.where(:data_content.all => [@widgetid])
if @tile.count > 0
@thistile = @tile
end
end
@t = Tile.find(@thistile.first.id)
@t.delete
@msg << {"success"=>true}
when "add"
@widget = current_user.desktop.desktop_widgets.find(@widgetid)
@section = Section.find(@sectionid)
@groups = @section.groups
@totalwidgets = 0
@groups.each do |group|
@tile = group.tiles.where(:data_content.all => [@widgetid]).count
if @tile > 0
@msg << {"success"=>false,"error"=>"Duplicate widget"}
else
no_of_widgets = group.tiles.where(:data_category.all => ["widget"]).count
@totalwidgets = @totalwidgets + no_of_widgets
end
end
if @totalwidgets >= 12
@msg << {"success"=>false,"error"=>"Section full"}
else
wshape = @widget.shape
wdata_content = @widgetid
wdata_category = "widget"
wname = @widget.name
if @groups.first.tiles.where(:data_category.all => ["widget"]).count >= 6
groupid = @groups.last.id
else
groupid = @groups.first.id
end
Tile.create(data_category: wdata_category,data_content: wdata_content, group_id: groupid, position: 10, title: wname, shape: wshape)
@msg << {"success"=>true}
end
end
render :json=>@msg.to_json
end
end

View File

@ -3,6 +3,7 @@ class OtheraccountsController< ApplicationController
require 'rexml/document' require 'rexml/document'
require 'net/http' require 'net/http'
require 'net/https' require 'net/https'
# require 'twitter'
include REXML include REXML
def saveaccountinfo def saveaccountinfo
@ -50,6 +51,12 @@ class OtheraccountsController< ApplicationController
end end
def twitter def twitter
# token = "Yh9qYe0lhWk27TZJamnhrA"
# secret = "iBgxJ5BrxfGFLkp7aB6pyCSzd0zcJiYDqJGFBK6Wdo"
# oauth = Twitter::OAuth.new(token,secret)
# oauth_token = oauth.request_token.token
# oauth_secret = oauth.request_token.secret
end end

View File

@ -9,6 +9,7 @@ class Desktop
belongs_to :user belongs_to :user
has_many :sections, :autosave => true, :dependent => :destroy has_many :sections, :autosave => true, :dependent => :destroy
has_many :desktop_widgets, :autosave => true, :dependent => :destroy
before_create :initialize_section before_create :initialize_section

View File

@ -0,0 +1,13 @@
class DesktopWidget
include Mongoid::Document
include Mongoid::Timestamps
field :name
field :author
field :shape
field :desktop_id
field :status
field :section
belongs_to :desktop
end

View File

@ -19,6 +19,7 @@ class User
has_one :desktop, :autosave => true, :dependent => :destroy has_one :desktop, :autosave => true, :dependent => :destroy
has_many :other_accounts, :autosave => true, :dependent => :destroy has_many :other_accounts, :autosave => true, :dependent => :destroy
has_many :journals, :autosave => true, :dependent => :destroy has_many :journals, :autosave => true, :dependent => :destroy
belongs_to :role belongs_to :role
has_and_belongs_to_many :sub_roles has_and_belongs_to_many :sub_roles
accepts_nested_attributes_for :attribute_values, :allow_destroy => true accepts_nested_attributes_for :attribute_values, :allow_destroy => true

View File

@ -0,0 +1,26 @@
<div id="apps_store">
<div id="content">
<div id="header" class="hh3">
<div class="dtitle w2 hh3 hp">
<span class="thmtxth">App Store</span>
</div>
</div>
<div id="holder">
<div id="panel_l" class="ph">
<div class="s_menu sm_v">
<ul id='setting_left_nav'>
<li><a href="" class="admtxt hh2 w2 hp" onclick='return false;'>Online Store</a></li>
<li><a href="widgets" class="admtxt hh2 w2 hp" onclick='return false;'>Widgets</a></li>
<li><a href="" class="admtxt hh2 w2 hp" onclick='return false;'>Apps</a></li>
<li><a href="" class="admtxt hh2 w2 hp" onclick='return false;'>Registeration</a></li>
</ul>
</div>
</div>
<div id="panel_r" class="ph pw admbg hp">
</div>
<div class="clear"></div>
</div>
</div>
</div>

View File

@ -0,0 +1,11 @@
<div class="s_title hh3">Your Widgets</div>
<div class="tinycanvas hp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview vp">
<div class="overview" id="widget_list">
</div>
</div>
</div>
</div>

View File

@ -1,10 +1,13 @@
<div id="journal_p"> <div id="journal_p">
<div id="settings">
<div id="content"> <div id="content">
<div id="header" class="hh3"> <div id="header" class="hh3">
<div class="dtitle w2 hh3 hp"> <div class="dtitle w2 hh3 hp">
<span class="thmtxth">Journal Papers</span> <span class="thmtxth">Journal Papers</span>
</div> </div>
<div id="search_app" class="hfn w2 hh2 hp thmc3">
<input type="text" class="ini_input form" value="Search" id="searchbox" />
<input type="submit" class="ini_input submit thmc1" value="Submit"/>
</div>
</div> </div>
<div id="holder"> <div id="holder">
<div id="panel_l" class="ph"> <div id="panel_l" class="ph">

View File

@ -39,5 +39,6 @@
</li> </li>
</ul> </ul>
</div> </div>
<!-- <div style="z-index:999;position:relative;"><button onclick="o.tempFunc()">Twitter</button> -->
</div> </div>
</div> </div>

View File

@ -116,16 +116,23 @@ Orbit::Application.routes.draw do
match '/desktop/newpositions/'=>'desktop#newpositions' match '/desktop/newpositions/'=>'desktop#newpositions'
match '/desktop/settingconnection/'=>'desktop#settingconnection' match '/desktop/settingconnection/'=>'desktop#settingconnection'
match '/desktop/journal_p/'=>'desktop_publications#journal_p' match '/desktop/journal_p/'=>'desktop_publications#journal_p'
match '/desktop/journal_p_list/'=>'desktop_publications#journal_p_list' match '/desktop/journal_p_list/'=>'desktop_publications#journal_p_list'
match '/desktop/journal_p_add/'=>'desktop_publications#journal_p_add' match '/desktop/journal_p_add/'=>'desktop_publications#journal_p_add'
match '/desktop_publications/getjournals' => 'desktop_publications#getjournals' match '/desktop_publications/getjournals' => 'desktop_publications#getjournals'
match '/desktop/twitter/'=>'otheraccounts#twitter'
match '/desktop/forgmail/'=>'otheraccounts#gmail' match '/desktop/forgmail/'=>'otheraccounts#gmail'
match '/desktop/getaccounts'=>'otheraccounts#getaccounts' match '/desktop/getaccounts'=>'otheraccounts#getaccounts'
match '/desktop/save_account_info/'=>'otheraccounts#saveaccountinfo' match '/desktop/save_account_info/'=>'otheraccounts#saveaccountinfo'
match '/desktop_appstore/appstore'=>'desktop_appstore#appstore'
match '/desktop_appstore/widgets'=>'desktop_appstore#widgets'
match '/desktop_appstore/getuserwidgets'=>'desktop_appstore#getuserwidgets'
match '/desktop_appstore/widgets_settings'=>'desktop_appstore#widgets_settings'
match '/desktop/temp_func/'=>'desktop#temp_func' match '/desktop/temp_func/'=>'desktop#temp_func'
match '/panel/:app_name/front_end/:app_action/:id' => 'pages#show_from_link', :constraints => lambda { |request| match '/panel/:app_name/front_end/:app_action/:id' => 'pages#show_from_link', :constraints => lambda { |request|

View File

Before

Width:  |  Height:  |  Size: 9.4 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

View File

Before

Width:  |  Height:  |  Size: 6.7 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

View File

Before

Width:  |  Height:  |  Size: 9.5 KiB

After

Width:  |  Height:  |  Size: 9.5 KiB

View File

@ -51,16 +51,16 @@
.clock .bg.left{ left:0px; } .clock .bg.left{ left:0px; }
/* Individual styles for each color: */ /* Individual styles for each color: */
.orange .bg.left{ background:url(desktop_widgets/clock/img/bg_orange.png) no-repeat left top; } .orange .bg.left{ background:url(desktop_widgets/4fa7810ac88514014d7c59bc/img/bg_orange.png) no-repeat left top; }
.green .bg.left{ background:url(desktop_widgets/clock/img/bg_green.png) no-repeat left top; } .green .bg.left{ background:url(desktop_widgets/4fa7810ac88514014d7c59bc/img/bg_green.png) no-repeat left top; }
.blue .bg.left{ background:url(desktop_widgets/clock/img/bg_blue.png) no-repeat left top; } .blue .bg.left{ background:url(desktop_widgets/4fa7810ac88514014d7c59bc/img/bg_blue.png) no-repeat left top; }
/* The right part of the background: */ /* The right part of the background: */
.clock .bg.right{ left:37.5px; } .clock .bg.right{ left:37.5px; }
.orange .bg.right{ background:url(desktop_widgets/clock/img/bg_orange.png) no-repeat right top; } .orange .bg.right{ background:url(desktop_widgets/4fa7810ac88514014d7c59bc/img/bg_orange.png) no-repeat right top; }
.green .bg.right{ background:url(desktop_widgets/clock/img/bg_green.png) no-repeat right top; } .green .bg.right{ background:url(desktop_widgets/4fa7810ac88514014d7c59bc/img/bg_green.png) no-repeat right top; }
.blue .bg.right{ background:url(desktop_widgets/clock/img/bg_blue.png) no-repeat right top; } .blue .bg.right{ background:url(desktop_widgets/4fa7810ac88514014d7c59bc/img/bg_blue.png) no-repeat right top; }
.clock .front.left{ .clock .front.left{

View File

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 16 KiB

View File

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

View File

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 16 KiB

View File

Before

Width:  |  Height:  |  Size: 5.3 KiB

After

Width:  |  Height:  |  Size: 5.3 KiB

View File

@ -22,7 +22,7 @@ input {
</style> </style>
<center> <center>
<form id="search"> <form id="search">
<img src="desktop_widgets/googlesearch/img/google_64.png" style='margin-right:10px;'><br /> <img src="desktop_widgets/4fa78140c88514014d7c59be/img/google_64.png" style='margin-right:10px;'><br />
<input id="googlesearch"> <input id="googlesearch">
<input type="submit" style="display:none;"> <input type="submit" style="display:none;">
<br> <br>

View File

@ -1,6 +1,6 @@
var eventsjson = new Array; var eventsjson = new Array;
var loadEvents = function(){ var loadEvents = function(){
$.getJSON(o.widgetfolder+"/school_events/events.json",function(events){ $.getJSON(o.widgetfolder+"/4fa78153c88514014d7c59bf/events.json",function(events){
$.each(events,function(i,event){ $.each(events,function(i,event){
eventsjson.push(event); eventsjson.push(event);
}) })

View File

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -28,7 +28,7 @@
</style> </style>
<div class="g_weather"> <div class="g_weather">
<div class="gw_recent"> <div class="gw_recent">
<img src="desktop_widgets/weather/img/sunny.png" alt="sunny" class="gw_condition"> <img src="desktop_widgets/4fa7817cc88514014d7c59c2/img/sunny.png" alt="sunny" class="gw_condition">
<div class="gw_temp"> <div class="gw_temp">
<span class="gw_temp_num thmtxt">29</span><span class="gw_temp_unit thmtxt">°C</span> <span class="gw_temp_num thmtxt">29</span><span class="gw_temp_unit thmtxt">°C</span>
</div> </div>

View File

@ -1,171 +0,0 @@
/*!
* jquery.tzineClock.js - Tutorialzine Colorful Clock Plugin
*
* Copyright (c) 2009 Martin Angelov
* http://tutorialzine.com/
*
* Licensed under MIT
* http://www.opensource.org/licenses/mit-license.php
*
* Launch : December 2009
* Version : 1.0
* Released: Monday 28th December, 2009 - 00:00
*/
(function($){
// A global array used by the functions of the plug-in:
var gVars = {};
// Extending the jQuery core:
$.fn.tzineClock = function(opts){
// "this" contains the elements that were selected when calling the plugin: $('elements').tzineClock();
// If the selector returned more than one element, use the first one:
var container = this.eq(0);
if(!container)
{
try{
console.log("Invalid selector!");
} catch(e){}
return false;
}
if(!opts) opts = {};
var defaults = {
/* Additional options will be added in future versions of the plugin. */
};
/* Merging the provided options with the default ones (will be used in future versions of the plugin): */
$.each(defaults,function(k,v){
opts[k] = opts[k] || defaults[k];
})
// Calling the setUp function and passing the container,
// will be available to the setUp function as "this":
setUp.call(container);
return this;
}
function setUp()
{
// The colors of the dials:
var colors = ['orange','blue','green'];
var tmp;
for(var i=0;i<3;i++)
{
// Creating a new element and setting the color as a class name:
tmp = $('<div>').attr('class',colors[i]+' clock').html(
'<div class="display"></div>'+
'<div class="front left"></div>'+
'<div class="rotate left">'+
'<div class="bg left"></div>'+
'</div>'+
'<div class="rotate right">'+
'<div class="bg right"></div>'+
'</div>'
);
// Appending to the container:
$(this).append(tmp);
// Assigning some of the elements as variables for speed:
tmp.rotateLeft = tmp.find('.rotate.left');
tmp.rotateRight = tmp.find('.rotate.right');
tmp.display = tmp.find('.display');
// Adding the dial as a global variable. Will be available as gVars.colorName
gVars[colors[i]] = tmp;
}
// Setting up a interval, executed every 1000 milliseconds:
setInterval(function(){
var currentTime = new Date();
var h = currentTime.getHours();
var m = currentTime.getMinutes();
var s = currentTime.getSeconds();
animation(gVars.green, s, 60);
animation(gVars.blue, m, 60);
animation(gVars.orange, h, 24);
},1000);
}
function animation(clock, current, total)
{
// Calculating the current angle:
var angle = (360/total)*(current+1);
var element;
if(current==0)
{
// Hiding the right half of the background:
clock.rotateRight.hide();
// Resetting the rotation of the left part:
rotateElement(clock.rotateLeft,0);
}
if(angle<=180)
{
// The left part is rotated, and the right is currently hidden:
element = clock.rotateLeft;
}
else
{
// The first part of the rotation has completed, so we start rotating the right part:
clock.rotateRight.show();
clock.rotateLeft.show();
rotateElement(clock.rotateLeft,180);
element = clock.rotateRight;
angle = angle-180;
}
rotateElement(element,angle);
// Setting the text inside of the display element, inserting a leading zero if needed:
clock.display.html(current<10?'0'+current:current);
}
function rotateElement(element,angle)
{
// Rotating the element, depending on the browser:
var rotate = 'rotate('+angle+'deg)';
if(element.css('MozTransform')!=undefined)
element.css('MozTransform',rotate);
else if(element.css('WebkitTransform')!=undefined)
element.css('WebkitTransform',rotate);
// A version for internet explorer using filters, works but is a bit buggy (no surprise here):
else if(element.css("filter")!=undefined)
{
var cos = Math.cos(Math.PI * 2 / 360 * angle);
var sin = Math.sin(Math.PI * 2 / 360 * angle);
element.css("filter","progid:DXImageTransform.Microsoft.Matrix(M11="+cos+",M12=-"+sin+",M21="+sin+",M22="+cos+",SizingMethod='auto expand',FilterType='nearest neighbor')");
element.css("left",-Math.floor((element.width()-200)/2));
element.css("top",-Math.floor((element.height()-200)/2));
}
}
})(jQuery)

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.5 KiB

View File

@ -1,76 +0,0 @@
<style>
.clock{
/* The .clock div. Created dynamically by jQuery */
background-color:#252525;
height:75px;
width:75px;
position:relative;
overflow:hidden;
float:left;
}
.clock .rotate{
/* There are two .rotate divs - one for each half of the background */
position:absolute;
width:75px;
height:75px;
top:0;
left:0;
}
.rotate.right{
display:none;
z-index:11;
}
.clock .bg, .clock .front{
width:37.5px;
height:75px;
background-color:#252525;
position:absolute;
top:0;
}
.clock .display{
/* Holds the number of seconds, minutes or hours respectfully */
position:absolute;
width:75px;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
z-index:20;
color:#F5F5F5;
font-size:22.5px;
text-align:center;
top:27.5px;
left:0;
/* CSS3 text shadow: */
text-shadow:4px 4px 5px #333333;
}
/* The left part of the background: */
.clock .bg.left{ left:0; }
/* Individual styles for each color: */
.orange .bg.left{ background:url(desktop_widgets/clock/img/bg_orange.png) no-repeat left top; }
.green .bg.left{ background:url(desktop_widgets/clock/img/bg_green.png) no-repeat left top; }
.blue .bg.left{ background:url(desktop_widgets/clock/img/bg_blue.png) no-repeat left top; }
/* The right part of the background: */
.clock .bg.right{ left:37.5px; }
.orange .bg.right{ background:url(desktop_widgets/clock/img/bg_orange.png) no-repeat right top; }
.green .bg.right{ background:url(desktop_widgets/clock/img/bg_green.png) no-repeat right top; }
.blue .bg.right{ background:url(desktop_widgets/clock/img/bg_blue.png) no-repeat right top; }
.clock .front.left{
left:0;
z-index:10;
}
</style>
<div id="fancyClock1"></div>
<script>
$('#fancyClock1').tzineClock();
</script>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

View File

@ -1,69 +0,0 @@
.clock{
/* The .clock div. Created dynamically by jQuery */
background-color:#252525;
height:200px;
width:200px;
position:relative;
overflow:hidden;
float:left;
}
.clock .rotate{
/* There are two .rotate divs - one for each half of the background */
position:absolute;
width:200px;
height:200px;
top:0;
left:0;
}
.rotate.right{
display:none;
z-index:11;
}
.clock .bg, .clock .front{
width:100px;
height:200px;
background-color:#252525;
position:absolute;
top:0;
}
.clock .display{
/* Holds the number of seconds, minutes or hours respectfully */
position:absolute;
width:200px;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
z-index:20;
color:#F5F5F5;
font-size:60px;
text-align:center;
top:65px;
left:0;
/* CSS3 text shadow: */
text-shadow:4px 4px 5px #333333;
}
/* The left part of the background: */
.clock .bg.left{ left:0; }
/* Individual styles for each color: */
.orange .bg.left{ background:url(bg_orange.png) no-repeat left top; }
.green .bg.left{ background:url(bg_green.png) no-repeat left top; }
.blue .bg.left{ background:url(bg_blue.png) no-repeat left top; }
/* The right part of the background: */
.clock .bg.right{ left:100px; }
.orange .bg.right{ background:url(bg_orange.png) no-repeat right top; }
.green .bg.right{ background:url(bg_green.png) no-repeat right top; }
.blue .bg.right{ background:url(bg_blue.png) no-repeat right top; }
.clock .front.left{
left:0;
z-index:10;
}