the group more structured and also demo connecting with gmail account..

This commit is contained in:
Harry Bomrah 2012-04-30 21:17:20 +08:00
parent 1b7fb106f8
commit 769a67f026
5 changed files with 87 additions and 208 deletions

View File

@ -162,13 +162,15 @@ var orbitDesktop = function(dom){
$.post("/desktop/newpositions",{"sectionid":o.sectionId,"newpos":newpostitions,"groupids":groupids}); $.post("/desktop/newpositions",{"sectionid":o.sectionId,"newpos":newpostitions,"groupids":groupids});
}, },
update:function(){ update:function(){
var s = $(this).find('.element').length, var s = $(this).find('.element').length;
last = $(this).find('.element').eq(s-1).position(), if(s!=0){
lasth = $(this).find('.element').eq(s-1).outerHeight(true); last = $(this).find('.element').eq(s-1).position(),
lasth = $(this).find('.element').eq(s-1).outerHeight(true);
if ((last.top+lasth)>528){
$(this).sortable('cancel'); if ((last.top+lasth)>528){
} $(this).sortable('cancel');
}
}else{$(this).remove();}
}, },
receive: function(event, ui){ receive: function(event, ui){
@ -216,39 +218,51 @@ var orbitDesktop = function(dom){
$li, $li,
bdsum = 0, bdsum = 0,
bwsum = 0, bwsum = 0,
bhsum = 0; bhsum = 0,
small = 0,
single = false;
$group.append($col); $group.append($col);
for(j=0;j<group.length;j++){
$.each(group,function(j,tile){ var tile = group[j];
var tilecolor = tilecolors[Math.floor(Math.random()*tilecolors.length)];
var op = opacity[Math.floor(Math.random()*opacity.length)];
if(j==0)$group.attr("id",tile.group_id);
if(tile.data_category == "app")
$li = $('<li id="'+tile._id+'" class="element '+tile.shape+' hp vp" data-category="'+tile.data_category+'" data-content="'+tile.data_content+'"><span class="tile '+tilecolor+' '+op+'"></span><a href="'+tile._id+'" class="appicon" onclick="return false;"><img src="'+o.iconPath+tile.data_content+'.png" alt="" ></a><h1 class="appname thmtxt">'+tile.title+'</h1></li>');
else
$li = $('<li id="'+tile._id+'" class="element '+tile.shape+' hp vp" data-category="'+tile.data_category+'" data-content="'+tile.data_content+'"><span class="tile '+tilecolor+' '+op+'"></span><h1 class="appname thmtxt">'+tile.title+'</h1><div class="appholder">Loading...</div></li>');
// $group.find("ul").append($li);
// column experiment start
var brick = tile.shape.replace(' holder_f','').split(' '), var brick = tile.shape.replace(' holder_f','').split(' '),
bw = parseInt(brick[0].substr(1)), bw = parseInt(brick[0].substr(1)),
bh = parseInt(brick[1].substr(1)), bh = parseInt(brick[1].substr(1)),
bd = bw * bh; bd = bw * bh;
if(bh==1 && bw==1){
small++;
}else if(bh!=1 && bw!=1){
single = true;
}
if(small==2){
small=0;
single=false;
}else if(small==1 && single==true){
bh++;
small=0;
single=false;
}else{small=0;single=false;}
bdsum+=bd; bdsum+=bd;
bwsum+=bw; bwsum+=bw;
bhsum+=bh; bhsum+=bh;
if( bdsum > 8 ){
bdsum = 0, bhsum = 0, colindex+=1; if(bdsum > 8 || bhsum > 6){
bdsum = 0, bhsum = 0, colindex++,j--;
$group.append('<ul class="g_col g_col_w2 col'+ colindex +'"/>'); $group.append('<ul class="g_col g_col_w2 col'+ colindex +'"/>');
$group.find('.col'+colindex).eq(colindex).append($li); }else{
} else { var tilecolor = tilecolors[Math.floor(Math.random()*tilecolors.length)];
$group.find('.col'+colindex).eq(0).append($li); var op = opacity[Math.floor(Math.random()*opacity.length)];
if(j==0)$group.attr("id",tile.group_id);
if(tile.data_category == "app")
$li = $('<li id="'+tile._id+'" class="element '+tile.shape+' hp vp" data-category="'+tile.data_category+'" data-content="'+tile.data_content+'"><span class="tile '+tilecolor+' '+op+'"></span><a href="'+tile._id+'" class="appicon" onclick="return false;"><img src="'+o.iconPath+tile.data_content+'.png" alt="" ></a><h1 class="appname thmtxt">'+tile.title+'</h1></li>');
else
$li = $('<li id="'+tile._id+'" class="element '+tile.shape+' hp vp" data-category="'+tile.data_category+'" data-content="'+tile.data_content+'"><span class="tile '+tilecolor+' '+op+'"></span><h1 class="appname thmtxt">'+tile.title+'</h1><div class="appholder">Loading...</div></li>');
$group.find('.col'+colindex).append($li);
} }
}
});
$("div#desktop div#group_wrapper").append($group); $("div#desktop div#group_wrapper").append($group);
}) })
bindHandlers(); bindHandlers();
@ -345,8 +359,19 @@ var orbitDesktop = function(dom){
allApps = $("div#app_manager .group_search .element").sort(sortDescending); allApps = $("div#app_manager .group_search .element").sort(sortDescending);
break; break;
} }
$("div#app_manager #app_list").empty();
$("div#app_manager .group_search").html(allApps); var count = 0, colindex = 0;
$('#app_list').append('<div class="g_col g_col_w1 col'+ colindex +'"/>');
$.each(allApps,function(i,app){
count++;
if( count > 4 ){
count = 1, colindex+=1;
$('#app_list').append('<div class="g_col g_col_w1 col'+ colindex +'"/>');
$('.g_col.col'+ colindex).append(app);
} else {
$('.g_col.col'+ colindex).append(app);
}
})
return false; return false;
}) })
$('.tinycanvas') $('.tinycanvas')
@ -362,11 +387,8 @@ var orbitDesktop = function(dom){
$.each(appss,function(i,apps){ $.each(appss,function(i,apps){
$.each(apps,function(i,app){ $.each(apps,function(i,app){
var $app; var $app;
count++; count++;
$app = $('<div class="element w1 h1 hp vp thmc2" data-category="'+app.data_category+'" data-content="'+app.data_content+'"><span class="tile thmc2"></span><a href="'+app._id+'" class="appicon"><img src="'+o.iconPath+app.data_content+'.png" alt="" onclick="return false;"></a><h1 class="appname thmtxt">'+app.title+'</h1></div>'); $app = $('<div class="element w1 h1 hp vp thmc2" data-category="'+app.data_category+'" data-content="'+app.data_content+'"><span class="tile thmc2"></span><a href="'+app._id+'" class="appicon"><img src="'+o.iconPath+app.data_content+'.png" alt="" onclick="return false;"></a><h1 class="appname thmtxt">'+app.title+'</h1></div>');
if( count > 4 ){ if( count > 4 ){
count = 1, colindex+=1; count = 1, colindex+=1;
$('#app_list').append('<div class="g_col g_col_w1 col'+ colindex +'"/>'); $('#app_list').append('<div class="g_col g_col_w1 col'+ colindex +'"/>');
@ -374,10 +396,6 @@ var orbitDesktop = function(dom){
} else { } else {
$('.g_col.col'+ colindex).append($app); $('.g_col.col'+ colindex).append($app);
} }
console.log(count, colindex);
}) })
}) })
@ -736,7 +754,23 @@ var orbitDesktop = function(dom){
var connection = function(){ var connection = function(){
var bindHandlers = function(){ var bindHandlers = function(){
$("#gmail_connect_btn").click(function(){
var usernm = $("input#gmail_username").val(),
pwd = $("input#gmail_password").val(),
type = $(this).attr("href"),
what = "edit";
if(usernm!="" && pwd!="")
saveaccount(usernm,pwd,type,what);
})
}
var saveaccount = function(usernm,pwd,type,what){
$.post("/desktop/save_account_info",{email:usernm,password:pwd,account:type,dowhat:what},function(result){
if(result[0].success=="true")
o.notify("Gmail account connected!!","success",2);
else
o.notify("Gmail account connection failed!!","imp",2);
})
} }
$("div#settings div#panel_r").load("/desktop/settingconnection",function(){ $("div#settings div#panel_r").load("/desktop/settingconnection",function(){
bindHandlers(); bindHandlers();
@ -845,7 +879,7 @@ var orbitDesktop = function(dom){
}) })
}; };
this.saveWallpaper = function(wallpaper){ // this function saves wallpaper in db this.saveWallpaper = function(wallpaper){ // this function saves wallpaper in db
$.post("desktop/save_desktop_settings",{"save":"wallpaper","wallpapernm":wallpaper,"desktopid":o.desktopId},function(result,status){ $.post("desktop/save_desktop_settings",{"save":"wallpaper","wallpapernm":wallpaper,"desktopid":o.desktopId},function(result){
if(result[0].success=="true") if(result[0].success=="true")
o.notify("Wallpaper saved!!","success",2); o.notify("Wallpaper saved!!","success",2);
else else

View File

@ -6,10 +6,17 @@ class OtheraccountsController< ApplicationController
include REXML include REXML
def saveaccountinfo def saveaccountinfo
@dowhat = params['dowhat']
@email = params['email'] @email = params['email']
@password = params['password'] @password = params['password']
@account = params['account'] @account = params['account']
OtherAccount.create(user_id: current_user.id, email: @email, encrypted_password: @password, type: @account) case @dowhat
when "new"
OtherAccount.create(user_id: current_user.id, email: @email, encrypted_password: @password, type: @account)
when "edit"
@otheraccount = OtherAccount.where(:type.all => [@account],:user_id.all => [current_user.id])
@otheraccount.first.update_attributes(:email => @email, :encrypted_password => @password)
end
a = Array.new a = Array.new
a << {"success"=>"true"} a << {"success"=>"true"}
render :json=>a.to_json render :json=>a.to_json

View File

@ -21,157 +21,7 @@
<div class="group g_sep op03" id='seperator' style="height: 516px;display:none;"></div> <div class="group g_sep op03" id='seperator' style="height: 516px;display:none;"></div>
<div class="group_search" id="app_list"> <div class="group_search" id="app_list">
<!-- <div class="element w1 h1 hp vp thmc2" data-category="desktop"> <!--<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">社團記事</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">每日英文</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">名人名言</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Homework</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">School Events</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">MyCoursesTimeTable</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Clock</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Weather</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">myRefer</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">O-Journals</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">O-Doc</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">ToDos</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Project Progress</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Paper Progress</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Team Stream</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">TED</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Twitter</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Facebook</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">News Feed</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">iClock</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Research Networks</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Gmail</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Youtube</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Calendar</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Talk</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Diary</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Bookeeper</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Movies</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Girls Wall</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">Album</h1>
</div>
<div class="element w1 h1 hp vp thmc2" data-category="desktop">
<span class="tile thmc2"></span> <span class="tile thmc2"></span>
<a href="" class="appicon"><img src="" alt=""></a> <a href="" class="appicon"><img src="" alt=""></a>
<h1 class="appname thmtxt">O-Music</h1> <h1 class="appname thmtxt">O-Music</h1>

View File

@ -7,11 +7,11 @@
<table width="100%" class="s_form"> <table width="100%" class="s_form">
<tr> <tr>
<td rowspan="2"><img src="assets/gmail.png" alt=""></td> <td rowspan="2"><img src="assets/gmail.png" alt=""></td>
<td valign="top"><label for="s_name1">Username</label><input type="text" /></td> <td valign="top"><label for="s_name1">Username</label><input type="text" id="gmail_username" /></td>
</tr> </tr>
<tr> <tr>
<td width="400"><label for="s_name1">Password</label><input type="password" /></td> <td width="400"><label for="s_name1">Password</label><input type="password" id="gmail_password" /></td>
<td><a href="" id="connection_save_btn" class="setting_btn thmc1 thmtxt w1 hh2 hp" onclick='return false;' style='float:left;'>Connect</a></td> <td><a href="gmail" id="gmail_connect_btn" class="setting_btn thmc1 thmtxt w1 hh2 hp" onclick='return false;' style='float:left;'>Connect</a></td>
</tr> </tr>
<tr> <tr>
<td rowspan="2"><img src="assets/facebook.png" alt=""></td> <td rowspan="2"><img src="assets/facebook.png" alt=""></td>
@ -28,9 +28,6 @@
<td><label for="s_name1">Password</label><input type="password" /></td> <td><label for="s_name1">Password</label><input type="password" /></td>
</tr> </tr>
</table> </table>
<div class="s_action">
<a href="" id="connection_save_btn" class="setting_btn thmc1 thmtxt w1 hh2 hp" onclick='return false;'>Save</a>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -33,12 +33,3 @@ var gmail = function(){
}); });
} }
var saveaccount = function(){
var usernm = $("#gmail input[type=text]").val();
var pwd = $("#gmail input[type=password]").val();
usernm = "harry@rulingcom.com";
pwd = "hr08973";
if(usernm!="" && pwd!=""){
$.post("/desktop/save_account_info",{email:usernm,password:pwd,account:"yahoo"})
}
}