Commit for app window..

This commit is contained in:
Harry Bomrah 2012-05-25 15:41:07 +08:00
parent 6fedf7232a
commit 7488341836
6 changed files with 115 additions and 10 deletions

View File

@ -123,6 +123,14 @@ var orbitDesktop = function(dom){
var ww = $(window).width(); var ww = $(window).width();
$("img#thmbackground").attr({"width":ww}); $("img#thmbackground").attr({"width":ww});
if( $('.tinycanvas') ){ $('.tinycanvas').tinyscrollbar_update(); } if( $('.tinycanvas') ){ $('.tinycanvas').tinyscrollbar_update(); }
if($(o.contentHolder).find("div.app_frame").length > 0){
$(o.contentHolder).find("div.app_frame").each(function(){
var app_holder_height = $(this).height() - 72;
var app_holder_width = $(this).width();
$(this).find("div.app_holder").height(app_holder_height);
$(this).find("div.app_holder iframe").attr({"height":app_holder_height,"width":app_holder_width});
})
}
}); });
var $widget_fn = $('.widget_fn'),$fn_des = $('.fn_des'); var $widget_fn = $('.widget_fn'),$fn_des = $('.fn_des');
$widget_fn.hover(function(){ $widget_fn.hover(function(){
@ -231,7 +239,12 @@ var orbitDesktop = function(dom){
$(this).removeClass('thmc2'); $(this).removeClass('thmc2');
}); });
} }
$("div#group_wrapper ul li[data-category=app]").click(function(){
o.appWindow({
title : $(this).find("a").attr("href"),
appid : $(this).find("a").attr("href")
});
})
} }
var loadTiles = function(id){ //This will load tiles for a specific desktop .. id of section has to be passed here to load tiles var loadTiles = function(id){ //This will load tiles for a specific desktop .. id of section has to be passed here to load tiles
$("div#desktop div#group_wrapper").empty(); $("div#desktop div#group_wrapper").empty();
@ -285,7 +298,7 @@ var orbitDesktop = function(dom){
if(j==0)$group.attr("id",tile.group_id); if(j==0)$group.attr("id",tile.group_id);
if(tile.data_category == "app") 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>'); $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.data_content+'" class="appicon" onclick="return false;"><img src="'+o.iconPath+tile.data_content+'.png" alt="" ></a><h1 class="appname thmtxt">'+tile.title+'</h1></li>');
else 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>'); $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>');

View File

@ -2,7 +2,12 @@
//Harry Bomrah //Harry Bomrah
var orbitDesktopAPI = function(){ var orbitDesktopAPI = function(){
o = this; o = this;
this.windowcounter = 0;
this.notify = function(msg,type,time){ this.notify = function(msg,type,time){
//takes 3 arguments
//msg (string) : message to display
//type (string : success, imp, alert
//time (int) : duration for notification in seconds
var $notify = $("#orbitnote"); var $notify = $("#orbitnote");
var img, n_height; var img, n_height;
if(!type)type=""; if(!type)type="";
@ -31,12 +36,19 @@ var orbitDesktopAPI = function(){
.animate({top:-n_height,opacity:0},200); .animate({top:-n_height,opacity:0},200);
}; };
this.executeFunc = function(func,callbackFn){ this.executeFunc = function(func,callbackFn){
//takes 2 arguments
//func (object Function) : the function which has to be executed
//callbackFn (object function) : the function for callback
func.call(this); func.call(this);
if(callbackFn){ if(callbackFn){
callbackFn.call(this,func); callbackFn.call(this,func);
} }
}; };
this.sortJSON = function(field, reverse, primer){ this.sortJSON = function(field, reverse, primer){
//takes 3 arguments
//field (string): it is the field on which sorting has to be done
//reverse (boolean): this is for asc or desc
//primer (method): for example pass parseInt for converting the field attribute in integer
var key = function (x) {return primer ? primer(x[field]) : x[field]}; var key = function (x) {return primer ? primer(x[field]) : x[field]};
return function (a,b) { return function (a,b) {
var A = key(a), B = key(b); var A = key(a), B = key(b);
@ -44,6 +56,8 @@ var orbitDesktopAPI = function(){
} }
}; };
this.rgb2hex = function(rgb) { this.rgb2hex = function(rgb) {
// takes 1 parameter
// rgb (string) : pass rgb string to convert
rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
var hex = function(x) { var hex = function(x) {
return ("0" + parseInt(x).toString(16)).slice(-2); return ("0" + parseInt(x).toString(16)).slice(-2);
@ -51,10 +65,18 @@ var orbitDesktopAPI = function(){
return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]); return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}; };
this.changeWallpaper = function(wallpaper){ this.changeWallpaper = function(wallpaper){
//takes 1 parameter
//wallpaper (string): takes wallpaper and sets the wallpaper
$("img#thmbackground").attr("src",o.wallpaperPath+wallpaper); $("img#thmbackground").attr("src",o.wallpaperPath+wallpaper);
o.saveWallpaper(wallpaper); o.saveWallpaper(wallpaper);
}; };
this.confirm = function(settings,callbackfn){ this.confirm = function(settings,callbackfn){
//takes set of arguments in array
//settings.buttons (array string) : name of buttons to be displayed
//settings.highlighted (integer) : takes either 1 or 2.. will highlight the button which is passed
//settings.message (string) : takes a string and message to be displayed on the confirmbox
//callbackfn (object function) : function to callback
if(!settings.buttons)settings.buttons=["Ok","Cancel"]; if(!settings.buttons)settings.buttons=["Ok","Cancel"];
if(settings.highlighted!=1 && settings.highlighted!=2)settings.highlighted=2; if(settings.highlighted!=1 && settings.highlighted!=2)settings.highlighted=2;
if(!settings.message)settings.message = "Are you sure?" if(!settings.message)settings.message = "Are you sure?"
@ -80,12 +102,62 @@ var orbitDesktopAPI = function(){
$confirm.stop(1,1).fadeIn(); $confirm.stop(1,1).fadeIn();
}; };
this.getArrayfromJson = function(tjson,key){ this.getArrayfromJson = function(tjson,key){
// returns array and takes json object and key
//json (json object) : json object from which the key has to be extracted
// key (string) : key which has to be extracted
var tempArray = new Array; var tempArray = new Array;
$.each(tjson,function(i,val){ $.each(tjson,function(i,val){
tempArray.push(val[key]); tempArray.push(val[key]);
}) })
return tempArray; return tempArray;
} };
this.appWindow = function(settings,callbackfn){
//takes set of arguments as array and gives callback
//settings.method (string) : like open and close
//settings.title (string) : the window title
//settings.appid (string) : appid.. user can use this appid to open or close or refresh the window
//settings.url (string) : it is the url if you want to force external url to open in appwindow... you have to pass extURL in appid if you want to open externalurl
if(typeof settings == "undefined")settings = {};
if(!settings.appid){
o.notify("Invalid AppID.","imp",3);
return;
}
if(!settings.method)settings.method = "open";
if(settings.method == 'open'){
var appurl = "http://www.rulingcom.com";
o.windowcounter++;
if(!settings.title)settings.title = "New Window "+o.windowcounter;
if(settings.appid=="extURL"){
if(settings.url){
if(settings.url.substr(0,3)!="http")settings.url = "http://"+settings.url;
var urlregex = new RegExp("^(http:\/\/www.|https:\/\/www.|ftp:\/\/www.|www.){1}([0-9A-Za-z]+\.)");
if(urlregex.test(settings.url))
appurl = settings.url;
else{
o.notify("Invalid URL","alert",3);
return;
}
}
else{
o.notify("Invalid URL","alert",3);
return;
}
}
var whtml =$('<div id="app_frame_'+o.windowcounter+'" class="thmc2 app_frame" data-content="'+settings.appid+'"><div id="content"><div id="header" class="hh3"><div class="dtitle w2 hh3 hp" style="text-transform:capitalize;"><span class="thmtxth">'+settings.title+'</span></div><span class="icon-remove hh3 hp thmtxt"></span></div><div id="holder_'+o.windowcounter+'" class="app_holder"><iframe src="'+appurl+'" frameborder="0" scrolling="auto"></iframe><div class="clear"></div></div></div></div>');
$(o.contentHolder).append(whtml);
var parentwindow = $(o.contentHolder).find("div#app_frame_"+o.windowcounter);
var app_holder_height = parentwindow.height() - 72;
var app_holder_width = parentwindow.width();
parentwindow.find("iframe").attr({"height":app_holder_height,"width":app_holder_width});
parentwindow.find("div.app_holder").height(app_holder_height);
parentwindow.find("span.icon-remove").click(function(){
parentwindow.remove();
})
}
if(typeof callbackfn=="function"){
callbackfn.call(this);
}
};
}; };
orbitDesktopAPI.prototype.notifyImgPath = "temp"; orbitDesktopAPI.prototype.notifyImgPath = "temp";
orbitDesktopAPI.prototype.wallpaperPath = "temp"; orbitDesktopAPI.prototype.wallpaperPath = "temp";

View File

@ -74,7 +74,7 @@ a:focus { outline: none; }
position: absolute; position: absolute;
top: 120px; top: 120px;
left: 0; left: 0;
z-index: 9; z-index: 10;
} }
#holder { #holder {
/*overflow: hidden; /*overflow: hidden;
@ -692,7 +692,7 @@ a:focus { outline: none; }
#paper_add label { margin-right: 0; } #paper_add label { margin-right: 0; }
/* App */ /* App */
#app_frame { .app_frame {
margin: 48px 96px 48px 158px; margin: 48px 96px 48px 158px;
min-width: 800px; min-width: 800px;
min-height: 588px; min-height: 588px;
@ -703,14 +703,14 @@ a:focus { outline: none; }
bottom: 0; bottom: 0;
z-index: 9; z-index: 9;
} }
#app_frame .holder { .app_frame .app_holder {
background-color: #fff; background-color: #fff;
position: absolute; position: absolute;
width: 100%; width: 100%;
} }
#app_frame #header .icon-remove { .app_frame #header .icon-remove {
display: block; display: block;
float: left; float: right;
line-height: 60px; line-height: 60px;
font-size: 20px; font-size: 20px;
cursor: pointer; cursor: pointer;

View File

@ -1 +1 @@
<iframe width="250" height="250" src="http://www.youtube.com/embed/RQieoqCLWDo" frameborder="0" allowfullscreen></iframe> <iframe width="250" height="250" src="http://www.youtube.com/embed/RQieoqCLWDo?wmode=transparent" frameborder="0" allowfullscreen></iframe>

View File

@ -0,0 +1,11 @@
var openURL = function(){
$("div[data-content=4fba4bf36f4fea8095e389eb] form#browse_url_4fba4bf36f4fea8095e389eb").submit(function(){
var urlToOpen = $(this).find("input").val();
o.appWindow({
title: "Browser",
appid: "extURL",
url: urlToOpen
});
return false;
})
}

View File

@ -0,0 +1,9 @@
<div data-content="4fba4bf36f4fea8095e389eb">
<form id="browse_url_4fba4bf36f4fea8095e389eb">
<input type="text" /><br />
<button>Open</button>
</form>
</div>
<script type="text/javascript">
openURL();
</script>