isotope experiment for form

1. This is only for DEMO, please don't merge this commit into any branch
2. This demo is only inside the Journal Paper > Add/Edit page
3. Please check the Diff from the original HTML
4. Please update the 'desktop-main.scss', 'desktop-main.css',
'desktop-component.scss', 'desktop-component.css' for update and mistake

.gitignore

@@ -21,3 +21,4 @@ uploads/**/*
 
 .sass-cache/*
 *.supported
+mongoid.yml

Gemfile.lock

@@ -1,409 +0,0 @@
-GIT
-  remote: git://github.com/amatsuda/kaminari.git
-  revision: 2e09b5374fec33b57c6387ca7bac89ecaa60c9eb
-  specs:
-    kaminari (0.14.1)
-      actionpack (>= 3.0.0)
-      activesupport (>= 3.0.0)
-
-GIT
-  remote: git://github.com/charlotte-ruby/impressionist.git
-  revision: 0894f6a550a33f83f4937d655e9f0774521781e4
-  specs:
-    impressionist (1.2.0)
-      httpclient (~> 2.2)
-      nokogiri (~> 1.5)
-
-GEM
-  remote: http://rubygems.org/
-  specs:
-    actionmailer (3.2.12)
-      actionpack (= 3.2.12)
-      mail (~> 2.4.4)
-    actionpack (3.2.12)
-      activemodel (= 3.2.12)
-      activesupport (= 3.2.12)
-      builder (~> 3.0.0)
-      erubis (~> 2.7.0)
-      journey (~> 1.0.4)
-      rack (~> 1.4.5)
-      rack-cache (~> 1.2)
-      rack-test (~> 0.6.1)
-      sprockets (~> 2.2.1)
-    activemodel (3.2.12)
-      activesupport (= 3.2.12)
-      builder (~> 3.0.0)
-    activerecord (3.2.12)
-      activemodel (= 3.2.12)
-      activesupport (= 3.2.12)
-      arel (~> 3.0.2)
-      tzinfo (~> 0.3.29)
-    activeresource (3.2.12)
-      activemodel (= 3.2.12)
-      activesupport (= 3.2.12)
-    activesupport (3.2.12)
-      i18n (~> 0.6)
-      multi_json (~> 1.0)
-    arel (3.0.2)
-    attr_required (0.0.5)
-    bcrypt-ruby (3.0.0)
-    binding_of_caller (0.7.1)
-      debug_inspector (>= 0.0.1)
-    bourne (1.1.2)
-      mocha (= 0.10.5)
-    brakeman (1.9.2)
-      erubis (~> 2.6)
-      fastercsv (~> 1.5)
-      haml (~> 3.0)
-      highline (~> 1.6)
-      multi_json (~> 1.2)
-      ruby2ruby (~> 2.0)
-      ruby_parser (~> 3.1.1)
-      sass (~> 3.0)
-      terminal-table (~> 1.4)
-    bson (1.8.2)
-    bson_ext (1.8.2)
-      bson (~> 1.8.2)
-    builder (3.0.4)
-    capybara (2.0.2)
-      mime-types (>= 1.16)
-      nokogiri (>= 1.3.3)
-      rack (>= 1.0.0)
-      rack-test (>= 0.5.4)
-      selenium-webdriver (~> 2.0)
-      xpath (~> 1.0.0)
-    carrierwave (0.6.2)
-      activemodel (>= 3.2.0)
-      activesupport (>= 3.2.0)
-    carrierwave-mongoid (0.2.2)
-      carrierwave (~> 0.6.1)
-      mongoid (~> 2.1)
-    childprocess (0.3.8)
-      ffi (~> 1.0, >= 1.0.11)
-    chinese_pinyin (0.4.1)
-    chronic (0.9.0)
-    coderay (1.0.9)
-    coffee-rails (3.2.2)
-      coffee-script (>= 2.2.0)
-      railties (~> 3.2.0)
-    coffee-script (2.2.0)
-      coffee-script-source
-      execjs
-    coffee-script-source (1.4.0)
-    columnize (0.3.6)
-    database_cleaner (0.9.1)
-    debug_inspector (0.0.2)
-    debugger (1.2.4)
-      columnize (>= 0.3.1)
-      debugger-linecache (~> 1.1.1)
-      debugger-ruby_core_source (~> 1.1.7)
-    debugger-linecache (1.1.2)
-      debugger-ruby_core_source (>= 1.1.1)
-    debugger-ruby_core_source (1.1.8)
-    delorean (2.1.0)
-      chronic
-    devise (1.5.3)
-      bcrypt-ruby (~> 3.0)
-      orm_adapter (~> 0.0.3)
-      warden (~> 1.1)
-    diff-lcs (1.1.3)
-    encrypted_strings (0.3.3)
-    erubis (2.7.0)
-    exception_notification (3.0.1)
-      actionmailer (>= 3.0.4)
-    execjs (1.4.0)
-      multi_json (~> 1.0)
-    factory_girl (4.2.0)
-      activesupport (>= 3.0.0)
-    factory_girl_rails (4.2.1)
-      factory_girl (~> 4.2.0)
-      railties (>= 3.0.0)
-    faker (1.1.2)
-      i18n (~> 0.5)
-    fastercsv (1.5.5)
-    fattr (2.2.1)
-    fb_graph (2.6.4)
-      httpclient (>= 2.2.0.2)
-      multi_json (>= 1.3)
-      rack-oauth2 (>= 0.14.4)
-      tzinfo
-    ffi (1.4.0)
-    haml (3.1.8)
-    highline (1.6.15)
-    hike (1.2.1)
-    httpclient (2.3.2)
-    i18n (0.6.1)
-    journey (1.0.4)
-    jquery-rails (2.1.4)
-      railties (>= 3.0, < 5.0)
-      thor (>= 0.14, < 2.0)
-    jquery-ui-rails (4.0.1)
-      jquery-rails
-      railties (>= 3.1.0)
-    json (1.7.7)
-    mail (2.4.4)
-      i18n (>= 0.4.0)
-      mime-types (~> 1.16)
-      treetop (~> 1.4.8)
-    metaclass (0.0.1)
-    method_source (0.8.1)
-    mime-types (1.21)
-    mini_magick (3.5.0)
-      subexec (~> 0.2.1)
-    mocha (0.10.5)
-      metaclass (~> 0.0.1)
-    mongo (1.8.2)
-      bson (~> 1.8.2)
-    mongo_session_store-rails3 (3.0.6)
-      actionpack (>= 3.0)
-      mongo
-    mongoid (2.6.0)
-      activemodel (~> 3.1)
-      mongo (~> 1.7)
-      tzinfo (~> 0.3.22)
-    mongoid-encryptor (0.0.5)
-      activesupport (~> 3.0)
-      encrypted_strings (~> 0.3.3)
-      mongoid (~> 2)
-    mongoid-tree (0.7.0)
-      mongoid (~> 2.0)
-    multi_json (1.6.1)
-    net-ldap (0.3.1)
-    nokogiri (1.5.6)
-    options (2.3.0)
-      fattr
-    orm_adapter (0.0.7)
-    polyglot (0.3.3)
-    pr_geohash (1.0.0)
-    progress_bar (0.4.0)
-      highline (~> 1.6.1)
-      options (~> 2.3.0)
-    pry (0.9.12)
-      coderay (~> 1.0.5)
-      method_source (~> 0.8)
-      slop (~> 3.4)
-    pry-debugger (0.2.1)
-      debugger (~> 1.2.0)
-      pry (~> 0.9.10)
-    pry-remote (0.1.6)
-      pry (~> 0.9)
-      slop (~> 3.0)
-    pry-stack_explorer (0.4.9)
-      binding_of_caller (>= 0.7)
-      pry (~> 0.9.11)
-    rack (1.4.5)
-    rack-cache (1.2)
-      rack (>= 0.4)
-    rack-gridfs (0.4.1)
-      mime-types
-      mongo (~> 1.2)
-      rack
-    rack-oauth2 (1.0.0)
-      activesupport (>= 2.3)
-      attr_required (>= 0.0.5)
-      httpclient (>= 2.2.0.2)
-      i18n
-      multi_json (>= 1.3.6)
-      rack (>= 1.1)
-    rack-protection (1.3.2)
-      rack
-    rack-ssl (1.3.3)
-      rack
-    rack-test (0.6.2)
-      rack (>= 1.0)
-    radius (0.7.3)
-    rails (3.2.12)
-      actionmailer (= 3.2.12)
-      actionpack (= 3.2.12)
-      activerecord (= 3.2.12)
-      activeresource (= 3.2.12)
-      activesupport (= 3.2.12)
-      bundler (~> 1.0)
-      railties (= 3.2.12)
-    railties (3.2.12)
-      actionpack (= 3.2.12)
-      activesupport (= 3.2.12)
-      rack-ssl (~> 1.3.2)
-      rake (>= 0.8.7)
-      rdoc (~> 3.4)
-      thor (>= 0.14.6, < 2.0)
-    rake (10.0.3)
-    rdoc (3.12.1)
-      json (~> 1.4)
-    redis (3.0.2)
-    redis-namespace (1.2.1)
-      redis (~> 3.0.0)
-    redis-search (0.9.0)
-      chinese_pinyin (>= 0.3.0)
-      redis (>= 2.1.1)
-      redis-namespace (>= 1.0.2)
-    resque (1.23.0)
-      multi_json (~> 1.0)
-      redis-namespace (~> 1.0)
-      sinatra (>= 0.9.2)
-      vegas (~> 0.1.2)
-    resque-restriction (0.3.0)
-      resque (>= 1.7.0)
-    resque-scheduler (2.0.0)
-      redis (>= 2.0.1)
-      resque (>= 1.20.0)
-      rufus-scheduler
-    rmmseg-cpp-huacnlee (0.2.9)
-    rsolr (1.0.8)
-      builder (>= 2.1.2)
-    rspec (2.12.0)
-      rspec-core (~> 2.12.0)
-      rspec-expectations (~> 2.12.0)
-      rspec-mocks (~> 2.12.0)
-    rspec-core (2.12.2)
-    rspec-expectations (2.12.1)
-      diff-lcs (~> 1.1.3)
-    rspec-mocks (2.12.2)
-    rspec-rails (2.12.2)
-      actionpack (>= 3.0)
-      activesupport (>= 3.0)
-      railties (>= 3.0)
-      rspec-core (~> 2.12.0)
-      rspec-expectations (~> 2.12.0)
-      rspec-mocks (~> 2.12.0)
-    ruby2ruby (2.0.3)
-      ruby_parser (~> 3.1)
-      sexp_processor (~> 4.0)
-    ruby_parser (3.1.1)
-      sexp_processor (~> 4.1)
-    rubyzip (0.9.9)
-    rufus-scheduler (2.0.17)
-      tzinfo (>= 0.3.23)
-    sass (3.2.5)
-    sass-rails (3.2.6)
-      railties (~> 3.2.0)
-      sass (>= 3.1.10)
-      tilt (~> 1.3)
-    select2-rails (3.3.1)
-      sass-rails (>= 3.2)
-      thor (~> 0.14)
-    selenium-webdriver (2.30.0)
-      childprocess (>= 0.2.5)
-      multi_json (~> 1.0)
-      rubyzip
-      websocket (~> 1.0.4)
-    sexp_processor (4.1.5)
-    shoulda-matchers (1.4.2)
-      activesupport (>= 3.0.0)
-      bourne (~> 1.1.2)
-    simplecov (0.7.1)
-      multi_json (~> 1.0)
-      simplecov-html (~> 0.7.1)
-    simplecov-html (0.7.1)
-    sinatra (1.3.4)
-      rack (~> 1.4)
-      rack-protection (~> 1.3)
-      tilt (~> 1.3, >= 1.3.3)
-    slop (3.4.3)
-    social-share-button (0.1.1)
-    spork (0.9.2)
-    sprockets (2.2.2)
-      hike (~> 1.2)
-      multi_json (~> 1.0)
-      rack (~> 1.0)
-      tilt (~> 1.1, != 1.3.0)
-    subexec (0.2.2)
-    sunspot (1.3.3)
-      pr_geohash (~> 1.0)
-      rsolr (~> 1.0.7)
-    sunspot-rails-tester (0.0.4)
-      sunspot_rails (~> 1.2)
-    sunspot_mongo (1.0.1)
-      sunspot_rails
-    sunspot_rails (1.3.3)
-      nokogiri
-      sunspot (= 1.3.3)
-    sunspot_solr (1.3.3)
-    syslog-logger (1.6.8)
-    terminal-table (1.4.5)
-    thor (0.17.0)
-    tilt (1.3.3)
-    tinymce-rails (3.5.8)
-      railties (>= 3.1.1)
-    treetop (1.4.12)
-      polyglot
-      polyglot (>= 0.3.1)
-    tzinfo (0.3.35)
-    uglifier (1.3.0)
-      execjs (>= 0.3.0)
-      multi_json (~> 1.0, >= 1.0.2)
-    vegas (0.1.11)
-      rack (>= 1.0.0)
-    warden (1.2.1)
-      rack (>= 1.0)
-    watchr (0.7)
-    websocket (1.0.7)
-    xpath (1.0.0)
-      nokogiri (~> 1.3)
-
-PLATFORMS
-  ruby
-
-DEPENDENCIES
-  brakeman
-  bson_ext
-  capybara
-  carrierwave
-  carrierwave-mongoid
-  chinese_pinyin (= 0.4.1)
-  coffee-rails
-  database_cleaner
-  debugger
-  delorean
-  devise (= 1.5.3)
-  exception_notification
-  execjs
-  factory_girl_rails
-  faker
-  fb_graph
-  impressionist!
-  jquery-rails (= 2.1.4)
-  jquery-ui-rails
-  kaminari!
-  mime-types
-  mini_magick
-  mongo_session_store-rails3 (= 3.0.6)
-  mongoid (> 2.1, < 3.0.0)
-  mongoid-encryptor
-  mongoid-tree
-  net-ldap (~> 0.3.1)
-  nokogiri
-  progress_bar
-  pry
-  pry-debugger
-  pry-remote
-  pry-stack_explorer
-  rack-gridfs
-  radius
-  rails (~> 3.2.9)
-  rake
-  redis (>= 2.1.1)
-  redis-namespace
-  redis-search
-  resque
-  resque-restriction
-  resque-scheduler
-  rmmseg-cpp-huacnlee (= 0.2.9)
-  rspec (~> 2.0)
-  rspec-rails (~> 2.0)
-  rubyzip
-  sass-rails
-  select2-rails (= 3.3.1)
-  shoulda-matchers
-  simplecov
-  sinatra
-  social-share-button
-  spork
-  sprockets
-  sunspot-rails-tester
-  sunspot_mongo
-  sunspot_solr
-  syslog-logger
-  tinymce-rails
-  uglifier
-  watchr

app/assets/javascripts/desktop.js

@@ -10,10 +10,11 @@
 //= require jquery.form
 //= require jquery.tinyscrollbar
 //= require jquery.miniColors.min
+//= require select2
 //= require bootstrap
 //= require orbitdesktopAPI
 //= require orbitTimeline
 //= require orbitdesktop
 //= require jquery.gridster
+//= require jquery.isotope.min
 //= require desktop/books_pages
-//= require select2

app/assets/javascripts/orbitdesktopAPI.js

@@ -8,32 +8,37 @@ var orbitDesktopAPI = function(){
 		//msg (string) : message to display
 		//type (string : success, imp, alert
 		//time (int) : duration for notification in seconds
-		var $notify = $("#orbitnote");
-		var img, n_height;
+		var $notify = $('#orbitnote'),
+			ani_method = { direction: 'up',easing: 'easeInOutQuint' },
+			img, n_height;
 		if(!type)type="";
 		switch(type){
 			case "alert":
-			img = "note_alert.png";
+				img = "exclamation-sign";
 			break;
 			case "imp":
-			img = "note_imp.png";
+				img = "warning-sign";
 			break;
 			case "success":
-			img = "note_success.png";
+				img = "ok";
 			break;
 			default:
-			img = "note_alert.png";
+				img = "exclamation-sign";
 			break;
 		}
-		$notify.find("img#note_img").attr("src",o.notifyImgPath+img);
-		$notify.find(".note_message").html(msg);
-		n_height = $notify.outerHeight();
-		if(!time)time=5000; else time=time*1000;
-		$notify
-			.css({'top':-n_height, 'display':'block', 'opacity':0})
-			.animate({top:0,opacity:1},200)
+		if( !time || time > 20) time = 5000; else time = time*1000;
+
+		var sign = '<div class="note_type"><span class="sign icon-'+ img +'"></span></div>',
+			message = '<div class="note_message">'+ msg +'</div>',
+			item = '<div class="note_holder admbg">'+ sign + message +'</div>';
+
+		$(item)
+			.prependTo($notify)
+			.stop(1,1)
+			.toggle('slide', ani_method, 300)
 			.delay(time)
-			.animate({top:-n_height,opacity:0},200);
+			.toggle('slide', ani_method, 800);
+		$notify.find('.note_holder:hidden').remove();
 	};
 	this.executeFunc = function(func,callbackFn){
 		//takes 2 arguments 
@@ -67,7 +72,7 @@ var orbitDesktopAPI = function(){
 	this.changeWallpaper = function(wallpaper){
 		//takes 1 parameter
 		//wallpaper (string): takes wallpaper and sets the wallpaper
-		$("img#thmbackground").attr("src",o.wallpaperPath+wallpaper);
+		$("#thmbackground").attr("src",o.wallpaperPath+wallpaper);
 		o.saveWallpaper(wallpaper);
 	};
 	this.confirm = function(settings,callbackfn){
@@ -111,29 +116,35 @@ var orbitDesktopAPI = function(){
 		})
 		return tempArray;
 	};
-	this.appWindow = function(settings,callbackfn){
+	this.appWindow = function(options,callbackfn){
 		//takes set of arguments as array and gives callback
 		//settings.method (string) : like open and close 
 		//settings.title (string) : the window title
 		//settings.extUrl (boolean) : true for opening external url else false
 		//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 = {};
+		var settings = {
+			method : "open",
+			extUrl : true,
+			title : "New Window"
+		}
+		$.extend(settings,options);
 		if(!settings.appid){
 			o.notify("Invalid AppID.","imp",3);
 			return;
 		}
-		if(!settings.method)settings.method = "open";
-		if(!settings.extUrl)settings.extUrl = true;
+		var isWindow = ($("div.app_frame[data-app="+settings.appid+"]").length > 0 ? $("div.app_frame[data-app="+settings.appid+"]") : null);
+		if(isWindow){
+			o.minimizeBarManager.maximize(isWindow);
+			return;
+		}
 		if(settings.method == 'open'){
 			var appurl = "http://www.rulingcom.com";
 			o.windowcounter++;
-			if(!settings.title)settings.title = "New Window "+o.windowcounter;
 			if(settings.extUrl){
 				if(settings.url){
 					
 					if(settings.url.substr(0,4)!="http")settings.url = "http://"+settings.url;
-					console.log(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;
@@ -147,20 +158,64 @@ var orbitDesktopAPI = function(){
 					return;
 				}
 			}
-			var whtml =$('<div id="app_frame_'+o.windowcounter+'" class="thmc2 app_frame" data-app="'+settings.appid+'"><div id="content"><div id="header" class="hh3"><div class="dtitle 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 whtml = $('<div id="app_frame_'+o.windowcounter+'" class="thmc2 app_frame" data-app="'+settings.appid+'" data-title="'+ settings.title +'"><div class="app_frame_header"><div class="dtitle hh2 hp"><span class="thmtxth">'+settings.title+'</span></div><span class="icon-remove hh2 hp thmtxt"></span><span class="icon-minus hh2 hp thmtxt"></span></div><div id="holder_'+o.windowcounter+'" class="app_holder clear"><iframe src="'+appurl+'" frameborder="0" scrolling="auto"></iframe></div></div>');
+			$("body").append(whtml).css('overflow','hidden');
+			var parentwindow = $("#app_frame_"+o.windowcounter);
+			var app_holder_height = parentwindow.height() - 60;
 			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();
+			parentwindow.find("iframe").attr({"height":app_holder_height});
+			parentwindow.find(".app_holder").height(app_holder_height);
+			parentwindow.find(".icon-remove").click(function(){
+				o.appWindow.close(parentwindow);
+			});
+			parentwindow.find(".icon-minus").click(function(){
+				o.appWindow.minimize(parentwindow);
 			})
+
 		}
+
+		this.appWindow.close = function(win){
+			win.remove();
+			$('body').attr('style','');
+		}
+
+		this.appWindow.minimize = function(win){
+			o.minimizeBarManager.minimize(win);
+			var minimizeBar = $('#minimizebar'),
+				minimizeHeight = minimizeBar.height();
+
+			minimizeBar
+				.stop(1,1)
+				.delay(2000)
+				.animate({
+					//'bottom': -minimizeHeight
+					'opacity': 0
+				}, 900, 'easeInOutQuint');
+
+			minimizeBar.on({
+				mouseenter: function(){
+					$(this)
+						.stop(1,1)
+						.animate({
+							'opacity': 1
+						}, 900, 'easeInOutQuint');
+				},
+				mouseleave: function(){
+					$(this)
+						.stop(1,1)
+						.delay(2000)
+						.animate({
+							//'bottom': -minimizeHeight
+							'opacity': 0
+						}, 900, 'easeInOutQuint');
+				}
+			});
+		}
+
 		if(typeof callbackfn=="function"){
-			callbackfn.call(this);
+			callbackfn.call(this,parentwindow);
 		}
+		return parentwindow;
 	};
 	this.toolPopup = function(settings){
 		if(settings == "destroy"){

app/assets/stylesheets/admin/add_attribute_field.js.erb.bak

@@ -1,6 +0,0 @@
-$(".attributes").append('<%= escape_javascript(render :partial=>"attribute_field",:locals=>{:attribute_field=>@attribute_field,:attribute_field_counter=>@attribute_field_counter} )%>');
-            $(".dataType").change(function () {
-                        $(this).parents("legend").next("div").find("div[class^='type']").addClass("hide");
-                        $(this).parents("legend").next("div").find("."+$(this).find("option:selected").attr("ref")).removeClass("hide");
-
-                })

app/assets/stylesheets/desktop/_desktop-helper.scss

@@ -8,6 +8,10 @@ $gray: #ddd;
 	font-family: "Source Sans Pro", Arial, sans-serif;
 	font-size: #{$font-size}px;
 }
+@mixin font-icon($font-size) {
+  font-family: "FontAwesome";
+  font-size: #{$font-size}px;
+}
 @mixin transition-type($property, $sec) {
 	-webkit-transition: #{$property} #{$sec}s ease;
 	   -moz-transition: #{$property} #{$sec}s ease;

app/assets/stylesheets/desktop/desktop-component.css

@@ -1,4 +1,4 @@
-.noSelect {
+.noSelect, .noSelect * {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
@@ -50,6 +50,14 @@
     width: 384px; }
   .s_grid_row .s_grid_12 {
     width: 420px; }
+  .s_grid_row .s_grid_13 {
+    width: 456px; }
+  .s_grid_row .s_grid_14 {
+    width: 492px; }
+  .s_grid_row .s_grid_15 {
+    width: 528px; }
+  .s_grid_row .s_grid_16 {
+    width: 564px; }
   .s_grid_row:last-child {
     margin-bottom: 0; }
   .s_grid_row .s_grid_h_1 {
@@ -93,7 +101,7 @@
   left: 0;
   top: 60px;
   font-size: 15px;
-  width: 120px;
+  min-width: 120px;
   border: solid 2px #dddddd;
   -webkit-box-sizing: border-box;
   /* webkit */
@@ -128,7 +136,7 @@
   font-size: 15px;
   line-height: 36px; }
   .s_menu li {
-    border-top: solid 1px #dddddd; }
+    border-top: solid 1px #eaeaea; }
   .s_menu li:first-child {
     border: none; }
   .s_menu a {
@@ -138,31 +146,23 @@
 .s_tab {
   font-size: 15px;
   line-height: 36px; }
-
-.s_tab ul {
-  overflow: hidden; }
-
-.s_tab li {
-  float: left; }
-
-.s_tab a {
-  display: block; }
-
-.s_tab .admbg {
-  background-color: #f0f0f0; }
+  .s_tab ul {
+    overflow: hidden; }
+  .s_tab li {
+    float: left; }
+  .s_tab a {
+    display: block; }
+  .s_tab .admbg {
+    background-color: #f0f0f0; }
 
 .st_c {
   display: none; }
 
-.st_c:first-child {
-  display: block; }
-
 /* simple form */
 .s_form {
   font-size: 15px; }
   .s_form label {
     font-size: 13px;
-    font-weight: bold;
     display: inline-block;
     vertical-align: middle;
     width: 100px;
@@ -172,6 +172,9 @@
       line-height: 32px; }
   .s_form input[type=text],
   .s_form input[type=password],
+  .s_form input[type=submit],
+  .s_form input[type=reset],
+  .s_form input[type=button],
   .s_form select {
     height: 32px;
     margin-top: 0;
@@ -202,7 +205,6 @@
     .s_form input[type=text]:focus,
     .s_form input[type=password]:focus,
     .s_form textarea:focus {
-      background-color: #f7f7f7;
       border-color: #c4c4c4; }
   .s_form textarea {
     resize: none; }
@@ -218,9 +220,10 @@
   .s_form .s_table td {
     vertical-align: middle; }
   .s_form .s_table thead th {
-    border-bottom: solid 1px #eeeeee; }
+    border-bottom: solid 1px #eee; }
 
-.check_box_g {
+/* simple select */
+.s_select_g {
   padding: 4px 8px;
   -webkit-box-sizing: border-box;
   /* webkit */
@@ -232,22 +235,89 @@
   /* ie */
   box-sizing: border-box;
   /* css3 */ }
-  .check_box_g li {
+  .s_select_g li {
     margin: 0 6px 6px 0;
     padding: 0; }
-  .check_box_g li,
-  .check_box_g li > * {
+  .s_select_g li,
+  .s_select_g li > * {
     display: inline-block;
     vertical-align: middle; }
-  .check_box_g label {
+  .s_select_g label {
     width: auto;
     margin: 0; }
-  .check_box_g > label {
+  .s_select_g > label {
     font-size: 15px;
     display: block;
     padding: 4px 0; }
-  .check_box_g li label {
-    padding-left: 4px; }
+  .s_select_g li label {
+    padding-left: 4px;
+    cursor: pointer; }
+    .s_select_g li label:before {
+      display: inline-block;
+      vertical-align: middle;
+      width: 14px;
+      height: 14px;
+      line-height: 14px;
+      text-align: center;
+      margin-right: 6px;
+      content: '';
+      border: solid 1px #c4c4c4; }
+  .s_select_g input[type=checkbox],
+  .s_select_g input[type=radio] {
+    display: none; }
+  .s_select_g input[type=checkbox]:checked + label:before, .s_select_g input[type=radio]:checked + label:before {
+    background-color: #444444;
+    border-color: #444444;
+    color: #fff;
+    font-family: "FontAwesome";
+    font-size: 12px; }
+  .s_select_g input[type=checkbox]:checked + label:before {
+    content: "\f00c"; }
+  .s_select_g input[type=radio] + label:before {
+    border-radius: 8px; }
+  .s_select_g input[type=radio]:checked + label:before {
+    content: "\f111";
+    font-size: 9px;
+    -webkit-text-size-adjust: none; }
+
+/* simple switch */
+.s_switch {
+  overflow: hidden; }
+  .s_switch .s_switch_status {
+    font-size: 1.5em;
+    line-height: 20px;
+    height: 20px;
+    float: left;
+    margin-right: 60px; }
+  .s_switch .s_switch_switcher {
+    display: block;
+    float: right;
+    position: relative;
+    width: 48px;
+    height: 20px;
+    overflow: hidden; }
+    .s_switch .s_switch_switcher input[type=checkbox] {
+      width: 144px;
+      height: 20px;
+      margin: 0;
+      position: absolute;
+      top: 0;
+      left: -96px; }
+      .s_switch .s_switch_switcher input[type=checkbox] + .s_switch_toggle {
+        display: block;
+        position: absolute;
+        left: -2px;
+        top: -2px;
+        width: 16px;
+        height: 20px;
+        background-color: #000;
+        border: solid 2px #fff;
+        cursor: pointer;
+        -webkit-transition: left 0.3s ease;
+        -moz-transition: left 0.3s ease;
+        transition: left 0.3s ease; }
+      .s_switch .s_switch_switcher input[type=checkbox]:checked + .s_switch_toggle {
+        left: 30px; }
 
 /* tool bar */
 .toolbar {
@@ -255,7 +325,7 @@
   font-size: 15px;
   line-height: 36px;
   position: relative;
-  z-index: 9; }
+  z-index: 99; }
   .toolbar .sdm, .toolbar .fn_g {
     display: inline-block;
     vertical-align: top; }
@@ -282,16 +352,21 @@
     width: auto;
     height: 100%;
     overflow: hidden;
-    position: relative; }
+    position: relative;
+    z-index: 10; }
   .tinycanvas .overview {
     position: absolute;
     left: 0;
     top: 0;
-    min-width: 100%;
+    width: 100%;
     height: 100%; }
+    .tinycanvas .overview:after {
+      content: "";
+      display: table;
+      width: 100%; }
     .tinycanvas .overview > .column {
       float: left;
-      border-right: solid 1px #eeeeee;
+      border-right: solid 1px #eee;
       padding: 0 12px 0 0;
       margin: 0 12px 0 0;
       height: 100%; }
@@ -347,7 +422,7 @@
       width: 6px; }
   .tinycanvas .scrollbar {
     position: absolute;
-    z-index: 9;
+    z-index: 11;
     visibility: hidden;
     opacity: 0;
     -webkit-transition: opacity 0.3s ease;
@@ -358,7 +433,7 @@
       visibility: visible; }
     .tinycanvas .scrollbar.sb_h {
       left: 0;
-      bottom: -6px;
+      bottom: 0;
       height: 6px; }
     .tinycanvas .scrollbar.sb_v {
       right: 0;

app/assets/stylesheets/desktop/desktop-component.scss

@@ -1,6 +1,6 @@
 @import "desktop-helper";
 
-.noSelect {
+.noSelect, .noSelect * {
 	@include no-select;
 }
 
@@ -19,9 +19,11 @@
 			margin-left: 0;
 		}
 	}
-	// fixed width column
-	// full width 420px
-	@for $i from 1 through 12 {
+	// fixed width column with 12px gutter
+	// 276px width for 8 columns
+	// 420px width for 12 columns
+	// 564px width for 16 columns
+	@for $i from 1 through 16 {
 		.s_grid_#{$i} {
 			width: 36px * $i - 12px;
 		}
@@ -38,6 +40,7 @@
 			height: 44px * $j - 12px;
 		}
 	}
+
 }
 
 /* simple dropdown menu */
@@ -58,7 +61,7 @@
 	left: 0;
 	top: 60px;
 	font-size: 15px;
-	width: 120px;
+	min-width: 120px;
 	border: solid 2px $gray;
 	@include box-sizing;
 	
@@ -92,7 +95,7 @@
 	line-height: 36px;
 
 	li {
-		border-top: solid 1px $gray;
+		border-top: solid 1px lighten($gray, 5%);
 	}
 	li:first-child {
 		border: none;
@@ -106,27 +109,25 @@
 .s_tab {
 	font-size: 15px;
 	line-height: 36px;
+
+	ul {
+		overflow: hidden;
+	}
+	li {
+		float: left;
+	}
+	a {
+		display: block;
+	}
+	.admbg {
+		background-color: #f0f0f0;
+	}
 }
 .stb_h {}
 .stb_v {}
-.s_tab ul {
-	overflow: hidden;
-}
-.s_tab li {
-	float: left;
-}
-.s_tab a {
-	display: block;
-}
-.s_tab .admbg {
-	background-color: #f0f0f0;
-}
 .st_c {
 	display: none;
 }
-.st_c:first-child {
-	display: block;
-}
 
 /* simple form */
 .s_form {
@@ -135,7 +136,6 @@
 	// basic style
 	label {
 		font-size: 13px;
-		font-weight: bold;
 		display: inline-block;
 		vertical-align: middle;
 		width: 100px;
@@ -148,6 +148,9 @@
 	}
 	input[type=text],
 	input[type=password],
+	input[type=submit],
+	input[type=reset],
+	input[type=button],
 	select {
 		height: 32px;
 		margin-top: 0;
@@ -169,7 +172,7 @@
 		@include box-sizing;
 
 		&:focus {
-			background-color: lighten($gray, 10%);
+			// background-color: lighten($gray, 10%);
 			border-color: darken($gray, 10%);
 		}
 	}
@@ -198,8 +201,8 @@
 	}
 }
 
-
-.check_box_g {
+/* simple select */
+.s_select_g {
 	padding: 4px 8px;
 	// border: solid 1px $gray;
 	@include box-sizing;
@@ -224,6 +227,87 @@
 	}
 	li label {
 		padding-left: 4px;
+		cursor: pointer;
+
+		&:before {
+			display: inline-block;
+			vertical-align: middle;
+			width: 14px;
+			height: 14px;
+			line-height: 14px;
+			text-align: center;
+			margin-right: 6px;
+			content: '';
+			border: solid 1px darken($gray, 10%);
+		}
+	}
+	input[type=checkbox],
+	input[type=radio]
+	{
+		display: none;
+	}
+	input[type=checkbox]:checked + label:before, input[type=radio]:checked + label:before {
+		background-color: darken($gray, 60%);
+		border-color: darken($gray, 60%);
+		color: #fff;
+		@include font-icon(12);
+	}
+	input[type=checkbox]:checked + label:before {
+		content: "\f00c";
+	}
+	input[type=radio] + label:before {
+		border-radius: 8px;
+	}
+	input[type=radio]:checked + label:before {
+		content: "\f111";
+		font-size: 9px;
+		-webkit-text-size-adjust: none;
+	}
+}
+
+/* simple switch */
+.s_switch {
+	overflow: hidden;
+
+	.s_switch_status {
+		font-size: 1.5em;
+		line-height: 20px;
+		height: 20px;
+		float: left;
+		margin-right: 60px;
+	}
+	.s_switch_switcher {
+		display: block;
+		float: right;
+		position: relative;
+		width: 48px;
+		height: 20px;
+		overflow: hidden;
+
+		input[type=checkbox] {
+			width: 144px;
+			height: 20px;
+			margin: 0;
+			position: absolute;
+			top: 0;
+			left: -96px;
+
+			+ .s_switch_toggle {
+				display: block;
+				position: absolute;
+				left: -2px;
+				top: -2px;
+				width: 16px;
+				height: 20px;
+				background-color: #000;
+				border: solid 2px #fff;
+				cursor: pointer;
+				@include transition-type(left,0.3);
+			}
+			&:checked  + .s_switch_toggle {
+				left: 30px;
+			}
+		}
 	}
 }
 
@@ -233,7 +317,7 @@
 	font-size: 15px;
 	line-height: 36px;
 	position: relative;
-	z-index: 9;
+	z-index: 99;
 	
 	.sdm, .fn_g {
 		display: inline-block;
@@ -268,14 +352,21 @@
 		height: 100%;
 		overflow: hidden;
 		position: relative;
+		z-index: 10;
 	}
 	.overview {
 		position: absolute;
 		left: 0;
 		top: 0;
-		min-width: 100%;
+		width: 100%;
 		height: 100%;
 
+		&:after {
+			content: "";
+			display: table;
+			width: 100%;
+		}
+
 		> .column {
 			float: left;
 			border-right: solid 1px #eee;
@@ -329,7 +420,7 @@
 	}
 	.scrollbar {
 		position: absolute;
-		z-index: 9;
+		z-index: 11;
 		visibility: hidden;
 		opacity: 0;
 		@include transition-type(opacity, 0.3);
@@ -340,7 +431,7 @@
 		}
 		&.sb_h {
 			left: 0;
-			bottom: -6px;
+			bottom: 0;
 			height: 6px;
 		}
 		&.sb_v {

app/assets/stylesheets/desktop/desktop-main.css

@@ -72,6 +72,12 @@ a:focus {
   content: '';
   clear: both; }
 
+.valign:before {
+  content: '';
+  height: 100%;
+  display: inline-block;
+  vertical-align: middle; }
+
 .o-loading {
   font-size: 13px; }
   .fullsize .o-loading {
@@ -80,14 +86,17 @@ a:focus {
     font-size: 20px; }
 
 #thmbackground {
-  min-height: 100%;
-  min-width: 980px;
   width: 100%;
-  height: auto;
+  height: 100%;
   position: fixed;
   top: 0;
   left: 0;
-  z-index: -1; }
+  z-index: -1;
+  background-repeat: no-repeat;
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  -o-background-size: cover;
+  background-size: cover; }
 
 #bgover {
   position: fixed;
@@ -121,13 +130,14 @@ a:focus {
   background-color: #fff; }
 
 .admbg2 {
-  background-color: #ddd; }
+  background-color: #dddddd; }
 
 .admtxt {
   color: #666; }
 
-.admtxt:hover {
-  color: #666; }
+a.admtxt.admbg2:hover {
+  color: #fff;
+  background-color: #aaaaaa; }
 
 .hfn {
   font-size: 15px;
@@ -147,6 +157,15 @@ a:focus {
 .ini_input:focus {
   outline: none; }
 
+.text_ofl {
+  overflow: hidden; }
+  .text_ofl span {
+    display: inline-block;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -o-text-overflow: ellipsis; }
+
 /* - Opacity */
 .op00 {
   opacity: 0; }
@@ -238,7 +257,15 @@ a:focus {
 .element {
   margin: 0 12px 12px 0;
   float: left;
-  position: relative; }
+  position: relative;
+  cursor: pointer;
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  transition: all 0.2s ease; }
+  .element:active {
+    -webkit-transform: scale(0.92);
+    -moz-transform: scale(0.92);
+    transform: scale(0.92); }
 
 .group {
   float: left;
@@ -246,12 +273,14 @@ a:focus {
 
 /* desktop layout */
 #container {
-  padding: 48px 0 0 156px; }
+  padding: 48px 0 0 156px;
+  min-width: 800px; }
 
 #header {
   padding: 0 0 12px 0;
-  min-width: 800px;
-  height: 72px; }
+  height: 72px;
+  position: relative;
+  z-index: 2; }
 
 #side {
   width: 60px;
@@ -260,12 +289,13 @@ a:focus {
   margin-right: 96px;
   top: 120px;
   left: 0;
-  z-index: 11; }
+  z-index: 13; }
 
 #holder {
   height: 516px;
   width: auto;
-  position: relative; }
+  position: relative;
+  z-index: 1; }
 
 #rwidget {
   height: 516px; }
@@ -338,37 +368,59 @@ a:focus {
 
 /* panel */
 #panel_l {
-  background-color: #f0f0f0;
+  background-color: #f7f7f7;
   float: left; }
 
 #panel_r {
+  background-color: #fff;
   margin-left: 252px;
-  position: relative; }
+  position: relative;
+  width: auto; }
 
 /* Desktop Notification */
 #orbitnote {
   position: fixed;
   top: 0;
   left: 50%;
-  margin-left: -206px;
+  margin-left: -200px;
   z-index: 99999;
   width: 400px;
-  padding: 0 6px 6px 6px;
-  background-color: #000;
-  background-color: rgba(0, 0, 0, 0.6); }
+  -webkit-transition: height 2s ease;
+  -moz-transition: height 2s ease;
+  transition: height 2s ease; }
   #orbitnote .note_holder {
-    background-color: #f3f3f3;
-    border: solid 1px white;
-    border-top: none;
     overflow: hidden;
-    padding: 24px 24px; }
+    padding: 36px;
+    border: solid 2px #dddddd;
+    border-top: 0;
+    display: none; }
     #orbitnote .note_holder .note_type {
-      float: left; }
-      #orbitnote .note_holder .note_type img {
-        display: block; }
+      display: inline-block;
+      vertical-align: middle;
+      width: 60px;
+      height: 60px;
+      color: #fff; }
+      #orbitnote .note_holder .note_type .sign {
+        display: block;
+        font-size: 40px;
+        width: 40px;
+        height: 40px;
+        padding: 10px;
+        border-radius: 30px;
+        text-align: center; }
+        #orbitnote .note_holder .note_type .sign.icon-ok {
+          background-color: #5BB75B; }
+        #orbitnote .note_holder .note_type .sign.icon-exclamation-sign {
+          background-color: #DA4F49; }
+        #orbitnote .note_holder .note_type .sign.icon-warning-sign {
+          background-color: #FAA732; }
     #orbitnote .note_holder .note_message {
       color: #333;
-      margin: 10px 0 0 48px;
+      display: inline-block;
+      vertical-align: middle;
+      word-wrap: break-word;
+      width: 240px;
+      margin: 0 0 0 20px;
       font-size: 15px; }
 
 /* Desktop Dialogue */
@@ -378,7 +430,8 @@ a:focus {
   height: 100%;
   left: 0;
   top: 0;
-  z-index: 12; }
+  z-index: 12;
+  display: none; }
   #orbitdiag .tile {
     background-color: #000; }
   #orbitdiag .diag_holder {
@@ -402,7 +455,7 @@ a:focus {
         font-size: 15px;
         line-height: 36px; }
         #orbitdiag .diag_holder .diag_holder_inner .diag_btn:hover {
-          outline: solid 2px white; }
+          outline: solid 2px #fff; }
 
 /* Tile */
 .appname {
@@ -435,7 +488,7 @@ a:focus {
   height: 60px;
   margin: 0 auto;
   position: relative; }
-  [data-sizex="1"] .appicon {
+  [data-sizex="1"] .appicon, .w1.h1 .appicon {
     margin-top: 24px; }
   #sections .appicon {
     width: 30px;
@@ -480,6 +533,11 @@ a:focus {
   cursor: move;
   overflow: hidden; }
 
+.gs_w.dragging {
+  -webkit-transform: scale(0.92);
+  -moz-transform: scale(0.92);
+  transform: scale(0.92); }
+
 /* header drop menu */
 .sdm_mdr .sdm_o {
   top: 36px; }
@@ -495,7 +553,7 @@ a:focus {
   cursor: pointer; }
 
 .theme_thumb, .stock_wallpaper img {
-  border: solid 1px white;
+  border: solid 1px #fff;
   width: 120px;
   margin: 0 auto; }
 
@@ -548,8 +606,9 @@ a:focus {
   padding: 24px 0;
   margin-top: 12px;
   overflow: hidden;
-  border-top: solid 1px #eeeeee;
-  background-color: #fff; }
+  border-top: solid 1px #eee; }
+  .s_action .setting_btn {
+    margin-left: 12px; }
 
 .setting_btn {
   display: block;
@@ -559,28 +618,76 @@ a:focus {
   text-align: center;
   border: 0; }
 
-.group_search {
+/* Apps Manager */
+#app_info {
   float: left;
-  margin-right: 36px; }
+  width: 420px;
+  height: 516px;
+  margin-right: 36px;
+  display: none; }
+  #app_info .app_info_header {
+    height: 120px;
+    margin: -12px -12px 12px -12px;
+    position: relative;
+    background-color: #f7f7f7;
+    -webkit-box-sizing: border-box;
+    /* webkit */
+    -khtml-box-sizing: border-box;
+    /* konqueror */
+    -moz-box-sizing: border-box;
+    /* firefox */
+    -ms-box-sizing: border-box;
+    /* ie */
+    box-sizing: border-box;
+    /* css3 */ }
+    #app_info .app_info_header > * {
+      height: 100%; }
+    #app_info .app_info_header .app_info_icon {
+      display: block;
+      margin: 0 auto;
+      margin-top: 30px;
+      -webkit-box-sizing: border-box;
+      /* webkit */
+      -khtml-box-sizing: border-box;
+      /* konqueror */
+      -moz-box-sizing: border-box;
+      /* firefox */
+      -ms-box-sizing: border-box;
+      /* ie */
+      box-sizing: border-box;
+      /* css3 */ }
+    #app_info .app_info_header .app_info_name {
+      display: inline-block;
+      vertical-align: middle;
+      font-size: 2em;
+      width: 300px;
+      word-wrap: break-word; }
+    #app_info .app_info_header .panel_close {
+      position: absolute;
+      right: 12px;
+      top: 12px;
+      font-size: 20px; }
+  #app_info .app_info_list {
+    line-height: 1.5em;
+    overflow: hidden; }
+    #app_info .app_info_list label {
+      color: #aaaaaa; }
+
+#app_list {
+  float: left; }
+  #app_list .element > * {
+    cursor: pointer; }
 
 .search_result {
   float: left;
-  margin-right: 24px;
-  max-width: 340px; }
-
-.g_sep {
-  width: 12px;
-  border-left: solid 1px white;
-  -webkit-box-sizing: border-box;
-  /* webkit */
-  -khtml-box-sizing: border-box;
-  /* konqueror */
-  -moz-box-sizing: border-box;
-  /* firefox */
-  -ms-box-sizing: border-box;
-  /* ie */
-  box-sizing: border-box;
-  /* css3 */ }
+  overflow: hidden; }
+  .search_result .message {
+    font-size: 15px;
+    word-wrap: break-word; }
+    .search_result .message b {
+      font-size: 20px;
+      display: block;
+      margin-top: 12px; }
 
 .grp {
   height: 528px;
@@ -608,9 +715,10 @@ a:focus {
   overflow: hidden; }
 
 .list_t_title {
-  margin-bottom: 6px;
-  color: #333;
-  font-size: 15px; }
+  padding-bottom: 6px;
+  color: #000;
+  font-size: 15px;
+  line-height: 1.3em; }
 
 .list_t_des {
   line-height: 1.5em;
@@ -618,153 +726,34 @@ a:focus {
   margin-bottom: 4px;
   font-size: 13px; }
 
-.list_item_function a {
-  display: inline-block;
-  padding: 4px;
-  font-size: 11px;
-  -webkit-text-size-adjust: none; }
-
-/* Journal Papers */
-[page-name="journal_p_list"] .list_t_item .inner {
-  padding-left: 30px; }
-[page-name="journal_p_list"] .list_item_action {
-  font-size: 12px;
-  float: left;
-  margin-left: -30px; }
-  [page-name="journal_p_list"] .list_item_action a {
-    display: block;
-    width: 20px;
-    height: 20px;
-    line-height: 20px;
-    margin: 1px 1px 6px 1px; }
-  [page-name="journal_p_list"] .list_item_action .icon-star-empty {
-    color: #999;
-    font-size: 20px; }
-  [page-name="journal_p_list"] .list_item_action .icon-star {
-    color: #faa732;
-    font-size: 20px; }
-  [page-name="journal_p_list"] .list_item_action .icon-check-empty {
-    color: #999;
-    font-size: 20px; }
-  [page-name="journal_p_list"] .list_item_action .icon-check {
-    color: #333;
-    font-size: 20px; }
-[page-name="journal_p_list"] .file_view .list_t_des {
-  overflow: hidden; }
-[page-name="journal_p_list"] .file_view .file {
-  float: left;
-  width: 120px;
-  height: 50px;
-  padding: 6px;
-  margin: 1px;
-  position: relative;
-  -webkit-box-sizing: border-box;
-  /* webkit */
-  -khtml-box-sizing: border-box;
-  /* konqueror */
-  -moz-box-sizing: border-box;
-  /* firefox */
-  -ms-box-sizing: border-box;
-  /* ie */
-  box-sizing: border-box;
-  /* css3 */ }
-  [page-name="journal_p_list"] .file_view .file:hover {
-    background-color: #f7f7f7; }
-  [page-name="journal_p_list"] .file_view .file img {
-    width: 38px;
-    height: 38px;
-    position: absolute;
-    left: 6px;
-    top: 6px; }
-  [page-name="journal_p_list"] .file_view .file .filetitle {
-    display: block;
-    width: 100%;
-    height: 38px;
-    padding-left: 40px;
-    overflow: hidden;
-    -webkit-box-sizing: border-box;
-    /* webkit */
-    -khtml-box-sizing: border-box;
-    /* konqueror */
-    -moz-box-sizing: border-box;
-    /* firefox */
-    -ms-box-sizing: border-box;
-    /* ie */
-    box-sizing: border-box;
-    /* css3 */ }
-
-/* Journal Paper Add */
-#paper_add .s_grid_con {
-  float: left;
-  height: 456px;
-  margin-left: 12px;
-  padding-left: 12px;
-  border-left: solid 1px #eeeeee; }
-  #paper_add .s_grid_con:first-child {
-    margin-left: 0;
-    padding-left: 0;
-    border: none; }
-#paper_add .f_w {
-  width: 336px; }
-#paper_add label {
-  margin-right: 0; }
-
-/* Journal Journal list */
-[page-name="journal_p_journal"] .datalist_item .inner {
-  padding-left: 30px; }
-[page-name="journal_p_journal"] .list_item_action {
-  font-size: 12px;
-  float: left;
-  margin-left: -30px; }
-[page-name="journal_p_journal"] .list_item_action i {
-  color: #999;
-  font-size: 20px;
-  display: block;
-  width: 20px;
-  height: 20px;
-  line-height: 20px;
-  margin: 1px 1px 6px 1px; }
-[page-name="journal_p_journal"] .list_t_desc {
-  font-family: Arial, sans-serif;
-  font-size: 12px;
-  color: #999; }
-
-/* Journal Co-Author */
-[page-name="journal_p_coauthor"] .list_t_item {
-  height: 110px; }
-[page-name="journal_p_coauthor"] .list_item_function a {
-  display: inline-block;
-  padding: 4px;
-  font-family: Arial, sans-serif;
-  font-size: 11px;
-  -webkit-text-size-adjust: none; }
-[page-name="journal_p_coauthor"] .info {
-  font-family: Arial, sans-serif; }
-[page-name="journal_p_coauthor"] .info li {
-  margin-bottom: 8px;
-  color: #999; }
-[page-name="journal_p_coauthor"] .info .name {
-  font-size: 18px;
-  line-height: 24px;
-  color: #333; }
-
-/* Journal Co-Author Relationship*/
-[page-name="journal_p_coauthor_relation"] .edit_co_author_relation {
-  /*margin-left: -10px;*/ }
-[page-name="journal_p_coauthor_relation"] .form_space {
-  margin-bottom: 10px;
-  font-size: 18px;
-  font-family: Arial, sans-serif; }
-
-/* Journal New Co-Author */
-#new_co_author label {
-  margin-right: 0; }
+.list_item_function {
+  position: absolute;
+  right: 0;
+  bottom: -30px;
+  width: 100%;
+  height: 30px;
+  line-height: 30px;
+  text-align: right;
+  -webkit-transition: all 0.3s ease;
+  -moz-transition: all 0.3s ease;
+  transition: all 0.3s ease; }
+  .list_item_function a {
+    display: inline-block;
+    vertical-align: top;
+    margin-left: 4px;
+    padding: 0 6px;
+    font-size: 11px;
+    -webkit-text-size-adjust: none; }
+    .list_item_function a :first-child {
+      margin-left: 0; }
+  .datalist_item:hover .list_item_function {
+    bottom: 0; }
 
 /* App */
 .app_frame {
-  margin: 48px 96px 48px 156px;
+  margin: 60px 0 48px 156px;
   min-width: 800px;
-  min-height: 588px;
+  min-height: 576px;
   position: absolute;
   top: 0;
   left: 0;
@@ -775,17 +764,40 @@ a:focus {
     background-color: #fff;
     position: absolute;
     width: 100%; }
-  .app_frame #header .icon-remove {
-    display: block;
-    float: right;
-    line-height: 60px;
-    font-size: 20px;
-    cursor: pointer; }
+    .app_frame .app_holder iframe {
+      width: 100%; }
+  .app_frame .app_frame_header {
+    height: 60px; }
+    .app_frame .app_frame_header .icon-remove, .app_frame .app_frame_header .icon-minus {
+      display: block;
+      float: right;
+      line-height: 60px;
+      font-size: 20px;
+      cursor: pointer; }
+
+/* Minimize Section */
+#minimizebar {
+  position: fixed;
+  width: 100%;
+  left: 0;
+  bottom: 0;
+  z-index: 14; }
+  #minimizebar .minimize {
+    cursor: pointer;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    line-height: 36px;
+    font-size: 15px;
+    float: left; }
+    #minimizebar .minimize .icon-remove {
+      float: right;
+      line-height: 36px; }
 
 /*Tooltip popup */
 .desktop_toolpopup {
   position: absolute;
-  z-index: 10px;
+  z-index: 10;
   display: none;
   padding: 12px;
   cursor: default;

app/assets/stylesheets/desktop/desktop-main.scss

@@ -68,6 +68,12 @@ a:focus { outline: none; }
 	content: '';
 	clear: both;
 }
+.valign:before {
+	content: '';
+	height: 100%;
+	display: inline-block;
+	vertical-align: middle;
+}
 .o-loading {
 	font-size: 13px;
 	// font-weight: normal;
@@ -80,14 +86,17 @@ a:focus { outline: none; }
 	}
 }
 #thmbackground {
-	min-height: 100%;
-	min-width: 980px;
 	width: 100%;
-	height: auto;
+	height: 100%;
 	position: fixed;
 	top: 0;
 	left: 0;
 	z-index: -1;
+	background-repeat: no-repeat;
+	-webkit-background-size: cover;
+	   -moz-background-size: cover;
+		 -o-background-size: cover;
+			background-size: cover;
 }
 #bgover {
 	position: fixed;
@@ -113,9 +122,12 @@ a:focus { outline: none; }
 
 /* Desktop Global Style */
 .admbg { background-color: #fff; }
-.admbg2 { background-color: #ddd; }
+.admbg2 { background-color: $gray; }
 .admtxt { color: #666; }
-.admtxt:hover { color: #666; }
+a.admtxt.admbg2:hover {
+	color: #fff;
+	background-color: darken($gray, 20%);
+}
 .hfn {
 	font-size: 15px;
 	line-height: 36px;
@@ -130,6 +142,17 @@ a:focus { outline: none; }
 	border: 0;
 	}
 .ini_input:focus { outline: none; }
+.text_ofl {
+	overflow: hidden;
+
+	span {
+		display: inline-block;
+		width: 100%;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		-o-text-overflow: ellipsis;
+	}
+}
 
 /* - Opacity */
 @for $i from 0 through 10 {
@@ -166,7 +189,15 @@ a:focus { outline: none; }
 	margin: 0 12px 12px 0;
 	float: left;
 	position: relative;
+	cursor: pointer;
+	@include transition-type(all,0.2);
+
+	&:active {
+		-webkit-transform: scale(0.92);
+		-moz-transform: scale(0.92);
+		transform: scale(0.92);
 	}
+}
 .group{
 	float: left;
 	margin-right: 24px;
@@ -175,11 +206,13 @@ a:focus { outline: none; }
 /* desktop layout */
 #container {
 	padding: 48px 0 0 156px;
+	min-width: 800px;
 	}
 #header {
 	padding: 0 0 12px 0;
-	min-width: 800px;
 	height: 72px;
+	position: relative;
+	z-index: 2;
 	}
 #side { 
 	width: 60px;
@@ -188,12 +221,13 @@ a:focus { outline: none; }
 	margin-right: 96px;
 	top: 120px;
 	left: 0;
-	z-index: 11;
+	z-index: 13;
 	}
 #holder {
 	height: 516px;
 	width: auto;
 	position: relative;
+	z-index: 1;
 	}
 #rwidget {
 	height: 516px;
@@ -282,12 +316,14 @@ a:focus { outline: none; }
 }
 /* panel */
 #panel_l {
-	background-color: #f0f0f0;
+	background-color: lighten($gray, 10%);
 	float: left;
 }
 #panel_r {
+	background-color: #fff;
 	margin-left: 252px;
 	position: relative;
+	width: auto;
 }
 
 /* Desktop Notification */
@@ -295,30 +331,46 @@ a:focus { outline: none; }
 	position: fixed;
 	top: 0;
 	left: 50%;
-	margin-left: -206px;
+	margin-left: -200px;
 	z-index: 99999;
 	width: 400px;
-	padding: 0 6px 6px 6px;
-	background-color: #000;
-	background-color: rgba(0,0,0,0.6);
+	@include transition-type(height,2);
 
 	.note_holder {
-		background-color: #f3f3f3;
-		border: solid 1px #fff;
-		border-top: none;
 		overflow: hidden;
-		padding: 24px 24px;
+		padding: 36px;
+		border: solid 2px $gray;
+		border-top: 0;
+		display: none;
 
 		.note_type {
-			float: left;
+			display: inline-block;
+			vertical-align: middle;
+			width: 60px;
+			height: 60px;
+			color: #fff;
 			
-			img {
+			.sign {
 				display: block;
+				font-size: 40px;
+				width: 40px;
+				height: 40px;
+				padding: 10px;
+				border-radius: 30px;
+				text-align: center;
+
+				&.icon-ok { background-color: #5BB75B; }
+				&.icon-exclamation-sign { background-color: #DA4F49; }
+				&.icon-warning-sign { background-color: #FAA732; }
 			}
 		}
 		.note_message {
 			color: #333;
-			margin: 10px 0 0 48px;
+			display: inline-block;
+			vertical-align: middle;
+			word-wrap: break-word;
+			width: 240px;
+			margin: 0 0 0 20px;
 			font-size: 15px;
 			// font-weight: normal;
 		}
@@ -333,6 +385,7 @@ a:focus { outline: none; }
 	left: 0;
 	top: 0;
 	z-index: 12;
+	display: none;
 
 	.tile {
 		background-color: #000;
@@ -411,7 +464,7 @@ a:focus { outline: none; }
 	margin: 0 auto;
 	position: relative;
 
-	[data-sizex="1"] & {
+	[data-sizex="1"] &, .w1.h1 & {
 		margin-top: 24px;
 	}
 	#sections & {
@@ -460,11 +513,11 @@ a:focus { outline: none; }
 	cursor: move;
 	overflow: hidden;
 }
-// .app.gs_w:active {
-// 	-webkit-transform: scale(0.9);
-// 	-moz-transform: scale(0.9);
-// 	transform: scale(0.9);
-// }
+.gs_w.dragging {
+	-webkit-transform: scale(0.92);
+	-moz-transform: scale(0.92);
+	transform: scale(0.92);
+}
 
 /* header drop menu */
 .sdm_mdr .sdm_o { top: 36px; }
@@ -546,7 +599,11 @@ a:focus { outline: none; }
 	margin-top: 12px;
 	overflow: hidden;
 	border-top: solid 1px #eee;
-	background-color: #fff;
+	// background-color: #fff;
+
+	.setting_btn {
+		margin-left: 12px;
+	}
 }
 .setting_btn {
 	display: block;
@@ -558,21 +615,74 @@ a:focus { outline: none; }
 	border: 0;
 }
 
-
-.group_search{
+/* Apps Manager */
+#app_info {
 	float: left;
+	width: 420px;
+	height: 516px;
 	margin-right: 36px;
+	display: none;
 
+	.app_info_header {
+		height: 120px;
+		margin: -12px -12px 12px -12px;
+		position: relative;
+		background-color: lighten($gray, 10%);
+		@include box-sizing;
+		
+		> * {
+			height: 100%;
+		}
+		.app_info_icon {
+			display: block;
+			margin: 0 auto;
+			margin-top: 30px;
+			@include box-sizing;
+		}
+		.app_info_name {
+			display: inline-block;
+			vertical-align: middle;
+			font-size: 2em;
+			width: 300px;
+			word-wrap: break-word;
+		}
+		.panel_close {
+			position: absolute;
+			right: 12px;
+			top: 12px;
+			font-size: 20px;
+		}
+	}
+	.app_info_list {
+		line-height: 1.5em;
+		overflow: hidden;
+
+		label {
+			color: darken($gray, 20%);
+		}
+	}
+}
+#app_list {
+	float: left;
+
+	.element > * {
+		cursor: pointer;
+	}
 }
 .search_result{
 	float: left;
-	margin-right: 24px;
-	max-width: 340px;
-}
-.g_sep {
-	width: 12px;
-	border-left: solid 1px #fff;
-	@include box-sizing;
+	overflow: hidden;
+
+	.message {
+		font-size: 15px;
+		word-wrap: break-word;
+
+		b {
+			font-size: 20px;
+			display: block;
+			margin-top: 12px;
+		}
+	}
 }
 
 
@@ -596,11 +706,14 @@ a:focus { outline: none; }
 }
 
 /* list item */
-.list_t_item { overflow: hidden; }
+.list_t_item { 
+	overflow: hidden;
+}
 .list_t_title { 
-	margin-bottom: 6px;
-	color: #333;
+	padding-bottom: 6px;
+	color: #000;
 	font-size: 15px;
+	line-height: 1.3em;
 	// font-weight: normal;
 }
 .list_t_des { 
@@ -609,164 +722,38 @@ a:focus { outline: none; }
 	margin-bottom: 4px;
 	font-size: 13px;
 }
-.list_item_function a {
-	display: inline-block;
-	padding: 4px;
-	font-size: 11px;
-	-webkit-text-size-adjust: none;
-}
+.list_item_function {
+	position: absolute;
+	right: 0;
+	bottom: -30px;
+	width: 100%;
+	height: 30px;
+	line-height: 30px;
+	text-align: right;
+	@include transition-type(all,0.3);
 
-/* Journal Papers */
-[page-name="journal_p_list"] {
-	.list_t_item .inner { padding-left: 30px; }
-	.list_item_action {
-		font-size: 12px;
-		float: left;
-		margin-left: -30px;
-		
-		a { 
-			display: block;
-			width: 20px; 
-			height: 20px;
-			line-height: 20px;
-			margin: 1px 1px 6px 1px;
-		}
-		.icon-star-empty { color: #999; font-size: 20px; }
-		.icon-star { color: #faa732; font-size: 20px; }
-		.icon-check-empty { color: #999; font-size: 20px; }
-		.icon-check { color: #333; font-size: 20px; }
-	}
-	
-	.file_view {
-		.list_t_des {
-			overflow: hidden;
-		}
-		.file {
-			float: left;
-			width: 120px;
-			height: 50px;
-			padding: 6px;
-			margin: 1px;
-			position: relative;
-			@include box-sizing;
-
-			&:hover {
-				background-color: lighten($gray, 10%);
-			}
-			img {
-				width: 38px;
-				height: 38px;
-				position: absolute;
-				left: 6px;
-				top: 6px;
-			}
-			.filetitle {
-				display: block;
-				width: 100%;
-				height: 38px;
-				padding-left: 40px;
-				overflow: hidden;
-				@include box-sizing;
-			}
-		}
-	}
-}
-
-/* Journal Paper Add */
-#paper_add {
-	.s_grid_con {
-		float: left;
-		height: 456px;
-		margin-left: 12px;
-		padding-left: 12px;
-		border-left: solid 1px #eee;
-
-		&:first-child {
-			margin-left: 0;
-			padding-left: 0;
-			border: none;
-		}
-	}
-	.f_w { width: 336px; }
-	label { margin-right: 0; }
-}
-
-/* Journal Journal list */
-[page-name="journal_p_journal"] {
-
-	.datalist_item .inner {
-		padding-left: 30px;
-	}
-	.list_item_action {
-		font-size: 12px;
-		float: left;
-		margin-left: -30px;
-	}
-	.list_item_action i {
-		color: #999;
-		font-size: 20px;
-		display: block;
-		width: 20px;
-		height: 20px;
-		line-height: 20px;
-		margin: 1px 1px 6px 1px;
-	}
-	.list_t_desc {
-		font-family: Arial, sans-serif;
-		font-size: 12px;
-		color: #999;
-	}
-}
-
-/* Journal Co-Author */
-[page-name="journal_p_coauthor"] {
-	.list_t_item {
-		height: 110px;
-	}
-	.list_item_function {}
-	.list_item_function a {
+	a {
 		display: inline-block;
-		padding: 4px;
-		font-family: Arial, sans-serif;
+		vertical-align: top;
+		margin-left: 4px;
+		padding: 0 6px;
 		font-size: 11px;
 		-webkit-text-size-adjust: none;
-	}
-	.info {
-		font-family: Arial, sans-serif;
-	}
-	.info li {
-		margin-bottom: 8px;
-		color: #999;
-	}
-	.info .name {
-		font-size: 18px;
-		line-height: 24px;
-		color: #333;
-	}
-}
 
-/* Journal Co-Author Relationship*/
-[page-name="journal_p_coauthor_relation"]{
-	.edit_co_author_relation {
-		/*margin-left: -10px;*/
+		:first-child {
+			margin-left: 0;
+		}
 	}
-	.form_space {
-		margin-bottom: 10px;
-		font-size: 18px;
-		font-family: Arial, sans-serif;
+	.datalist_item:hover & {
+		bottom: 0;
 	}
 }
-/* Journal New Co-Author */
-#new_co_author label {
-	margin-right: 0;
-}
-
 
 /* App */
 .app_frame {
-	margin: 48px 96px 48px 156px;
+	margin: 60px 0 48px 156px;
 	min-width: 800px;
-	min-height: 588px;
+	min-height: 576px;
 	position: absolute;
 	top: 0;
 	left: 0;
@@ -778,20 +765,55 @@ a:focus { outline: none; }
 		background-color: #fff;
 		position: absolute;
 		width: 100%;
+
+		iframe {
+			width: 100%;
+		}
 	}
-	#header .icon-remove {
-		display: block;
-		float: right;
-		line-height: 60px;
-		font-size: 20px;
+	.app_frame_header{
+		height: 60px;
+
+		.icon-remove, .icon-minus {
+			display: block;
+			float: right;
+			line-height: 60px;
+			font-size: 20px;
+			cursor: pointer;
+		}
+	}
+}
+
+/* Minimize Section */
+#minimizebar {
+	position: fixed;
+	width: 100%;
+	left: 0;
+	bottom: 0;
+	z-index: 14;
+
+	.minimize {
 		cursor: pointer;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		line-height: 36px;
+		font-size: 15px;
+		float: left;
+
+		.icon-remove {
+			float: right;
+			line-height: 36px;
+		}
+	}
+	> :first-child {
+		// margin-top: 48px;
 	}
 }
 
 /*Tooltip popup */
 .desktop_toolpopup {
 	position: absolute;
-	z-index: 10px;
+	z-index: 10;
 	display: none;
 	padding: 12px;
 	cursor: default;

app/assets/stylesheets/desktop/desktop-media.css

@@ -1,10 +1,10 @@
 @media only screen and (min-width: 1240px){
 
-	#panel_r.pw { width: 800px; }
+	/*#panel_r.pw { width: 800px; }*/
 
 }
 @media only screen and (min-width: 1900px){
 
-	#panel_r.pw { width: 1400px; }
+	/*#panel_r.pw { width: 1400px; }*/
 
 }

app/assets/stylesheets/desktop/desktop-select2.css

@@ -271,7 +271,7 @@ disabled look for disabled choices in the results dropdown
 .select2-container.select2-container-disabled .select2-choice {
   background-color: #f4f4f4;
   background-image: none;
-  border: 1px solid #dddddd;
+  border: 1px solid #ddd;
   cursor: default; }
 
 .select2-container.select2-container-disabled .select2-choice div {
@@ -326,7 +326,7 @@ disabled look for disabled choices in the results dropdown
   background: white url("select2/spinner.gif") no-repeat 100% !important; }
 
 .select2-default {
-  color: #999999 !important; }
+  color: #999 !important; }
 
 .select2-container-multi .select2-choices .select2-search-choice {
   padding: 3px 5px 3px 18px;
@@ -374,12 +374,12 @@ disabled look for disabled choices in the results dropdown
 .select2-container-multi.select2-container-disabled .select2-choices {
   background-color: #f4f4f4;
   background-image: none;
-  border: 1px solid #dddddd;
+  border: 1px solid #ddd;
   cursor: default; }
 
 .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
   padding: 3px 5px 3px 5px;
-  border: 1px solid #dddddd;
+  border: 1px solid #ddd;
   background-image: none;
   background-color: #f4f4f4; }
 

app/assets/stylesheets/desktop/desktop-select2.scss

@@ -155,7 +155,7 @@ Version: 3.3.1 Timestamp: Wed Feb 20 09:57:22 PST 2013
 }
 
 .select2-search input.select2-active {
-    background: #fff image-url('select2-spinner.gif') no-repeat 100%;
+    background: #fff url('select2/spinner.gif') no-repeat 100%;
 }
 
 .select2-container-active .select2-choice,
@@ -273,7 +273,7 @@ disabled look for disabled choices in the results dropdown
 }
 
 .select2-more-results.select2-active {
-    background: #f4f4f4 image-url('select2-spinner.gif') no-repeat 100%;
+    background: #f4f4f4 url('select2/spinner.gif') no-repeat 100%;
 }
 
 .select2-more-results {
@@ -352,7 +352,7 @@ disabled look for disabled choices in the results dropdown
 }
 
 .select2-container-multi .select2-choices .select2-search-field input.select2-active {
-    background: #fff image-url('select2-spinner.gif') no-repeat 100% !important;
+    background: #fff url('select2/spinner.gif') no-repeat 100% !important;
 }
 
 .select2-default {

app/controllers/desktop_apps_controller.rb

@@ -0,0 +1,49 @@
+class DesktopAppsController < OrbitBackendController
+	require "net/http"
+	require "uri"
+  	require 'zip/zip'
+
+	def index
+		@desktopapps = DesktopApp.all
+	end
+
+	def upload
+		if !params[:desktop_app].nil?
+			temp_file = Tempfile.new("temp_file");
+			original_file = params[:desktop_app][:package_file]
+			temp_file.write(original_file.read.force_encoding("UTF-8"))
+			temp_file.rewind
+			filename = File.basename(original_file.original_filename,".zip")
+			unzip_app(temp_file,filename)
+			temp_file.close
+		end
+	end
+
+	def unzip_app(file, zip_name)
+	    Zip::ZipFile.open(file) { |zip_file|
+	      da = DesktopApp.new.from_json(zip_file.read("#{zip_name}/settings.json"))
+	      Dir.mktmpdir('f_path') { |dir|
+	        images_entries = []
+	        zip_file.entries.each do |entry|
+	          case (path = entry.to_s)
+	            when /\A(#{zip_name})\/(images)\/.*((\.jpg)|(\.png)|(\.gif))\z/   #for img
+	              images_entries << entry
+	          end
+	        end
+	        
+	        images_entries.each do |image|
+	        	da.images.build(:file => get_temp_file(zip_file,dir,image))
+	        end	        
+	   		}
+	      da.save
+	    }
+  end
+
+   def get_temp_file(zip_file, dir, entry)
+    filename = File.basename(entry.to_s)
+    temp_file = File.new(dir + '/' + filename, 'w+') 
+    temp_file.write (zip_file.read entry ).force_encoding('UTF-8')
+    temp_file
+  end
+
+end

app/controllers/desktop_controller.rb

@@ -31,7 +31,7 @@ class DesktopController< ApplicationController
     render :layout => false
   end
   
-  def themes
+  def get_themes
     @themes = DesktopTheme.all
   #  raise @themes.inspect
     render "desktop/settings/themes", :layout => false
@@ -42,6 +42,7 @@ class DesktopController< ApplicationController
   end
   
   def connections
+    @url = "http://fb.tp.rulingcom.com/login?callback=http://harry.tp.rulingcom.com/facebook/register_fb?user="+current_user.id.to_s
     render "desktop/settings/connections", :layout => false
   end
   
@@ -107,18 +108,19 @@ class DesktopController< ApplicationController
   def getgroups
     @section = Section.find(params["sectionid"])
     @groups = @section.groups
-    
     gr = Array.new
     @groups.each do |group|
       a = Array.new
-      t = group.tiles
-      t.each do |tile|
+      @t = group.tiles
+
+      @t.each do |tile|
         data_content = ""
         jsfile = []
         cssfile = ""
         shape = "w1 h1"
-        fullsize = false
         link = ""
+        icon= ""
+        fullsize = false
         if tile.data_category == "widget"
           widge = DesktopWidget.find(tile.desktop_widget_id.to_s)
           # data_content = widge.widget_layout.file
@@ -127,21 +129,17 @@ class DesktopController< ApplicationController
           cssfile = widge.css_default.file.as_json[:file]
           shape = widge.shape
           title = widge.name
+          icon = widge.images.where(:name => widge.icon).first.file.url
           # binding.pry
-          if not widge.fullsize.nil?
-            fullsize = widge.fullsize
-          end
+          fullsize = widge.fullsize
         else
-          data_content = tile.data_content
-          title = tile.title
-          case data_content
-            when "envocab"
-              link = "http://www.english-vocabulary.eu/"
-            when "wikibooks"
-              link = "http://www.wikibooks.org"
-          end
+          app = DesktopApp.find(tile.desktop_app_id.to_s)
+          title = app.name
+          link = app.url
+          icon = app.images.where(:name => app.icon).first.file.url
+
         end
-          gr << {"id"=>tile.id,"data_category"=>tile.data_category,"data_content"=>data_content,"js"=>jsfile,"css"=>cssfile,"shape"=>shape,"position"=>tile.position,"row"=>tile.row,"column"=>tile.column, "title"=>title,"fullsize"=>fullsize,"link"=>link}
+          gr << {"id"=>tile.id,"data_category"=>tile.data_category,"data_content"=>data_content,"js"=>jsfile,"css"=>cssfile,"shape"=>shape,"position"=>tile.position,"row"=>tile.row,"column"=>tile.column, "title"=>title,"fullsize"=>fullsize,"link"=>link,"icon"=>icon}
        
         
       end
@@ -152,9 +150,11 @@ class DesktopController< ApplicationController
 
   def widget_layout
     widget = DesktopWidget.find(params[:id])
-    link = '<link href="'+widget.css_default.file.to_s+'" media="screen" rel="stylesheet" type="text/css" />'
+     # link = '<link href="'+widget.css_default.file.to_s+'" media="screen" rel="stylesheet" type="text/css" />'
+    css = widget.css_default.content;
+    css = "<style>" + css + "</style>"
     content = widget.widget_layout.body
-    dhtml = link + content
+    dhtml = css + content
     render :text => dhtml.html_safe
   end
   
@@ -195,6 +195,46 @@ class DesktopController< ApplicationController
      render :json=>a.to_json
   end
 
+   def getapplistforManager
+    @dwss = DesktopWidget.all
+    @dapps = DesktopApp.all
+    @tiles = Array.new
+    desktop = Desktop.find(params['desktopid'])
+    sections = desktop.sections
+    sections.each do |section|
+      groups = section.groups
+      groups.each do |group|
+        @tiles += group.tiles
+      end
+    end
+    @validtiles = Array.new
+    @allWidgets = Array.new
+    @dwss.each do |dw|
+      @id = dw.id
+      @validtiles = @tiles.select{|t| t.desktop_widget_id == @id}
+      @sections = Array.new
+      @validtiles.each do |vt|
+        grp = Group.find(vt.group_id)
+        sec = Section.find(grp.section_id);
+        @sections << {"id"=>sec.id,"name"=>sec.name}
+      end
+      @allWidgets << {"id"=>dw.id, "data_category"=> "widget","title" => dw.name, "version" => dw.version, "author"=>dw.author, "last_update"=>dw.updated_at, "icon"=>dw.images.where(:name=>dw.icon).first.file.url, "text_color" => dw.text_color, "background" => dw.bg_color, "sections" => @sections}
+    end
+    validtiles = Array.new
+    @dapps.each do |da|
+      @id = da.id
+      @validtiles = @tiles.select{|t| t.desktop_app_id == @id}
+      @sections = Array.new
+      @validtiles.each do |vt|
+        grp = Group.find(vt.group_id)
+        sec = Section.find(grp.section_id);
+        @sections << {"id"=>sec.id,"name"=>sec.name}
+      end
+      @allWidgets << {"id"=>da.id, "data_category"=> "app","title" => da.name, "version" => da.version, "author"=>da.author, "last_update"=>da.updated_at, "icon"=>da.images.where(:name=>da.icon).first.file.url, "sections" => @sections}
+    end
+    render :json=>@allWidgets.to_json
+  end
+  
   def newpositions
     @newpositions = params[:newpositions]
 
@@ -237,4 +277,47 @@ class DesktopController< ApplicationController
     render :xml=>feed
   end
 
+  def appactivation
+    @group = Section.find(params[:section_id]).groups.first
+    @type = params[:type]
+    if @type == "widget"
+      @widget = DesktopWidget.find(params[:id])
+      status = params[:status]
+
+      case status
+      when "true"
+        tile = Tile.new(data_category: "widget", position: 8, desktop_widget_id: @widget.id)
+        @group.tiles+=[tile]
+        @group.save
+      when "false"
+        tile = @group.tiles.where("desktop_widget_id"=>@widget.id).first
+        if tile != nil
+          tile.destroy
+        end
+      end
+    end
+
+    if @type == "app"
+      @app = DesktopApp.find(params[:id])
+      status = params[:status]
+      case status
+      when "true"
+        tile = Tile.new(data_category: "app", position: 8, desktop_app_id: @app.id)
+        @group.tiles+=[tile]
+        @group.save
+      when "false"
+        tile = @group.tiles.where("desktop_app_id"=>@app.id).first
+        if tile != nil
+          tile.destroy
+        end
+      end
+    end
+
+    b = Array.new
+    b = {"success"=>"true"}
+    render :json=>b.to_json
+  end
+
+
+  
 end

app/controllers/desktop_themes_controller.rb

@@ -0,0 +1,86 @@
+class DesktopThemesController < OrbitBackendController
+	require "net/http"
+	require "uri"
+  	require 'zip/zip'
+
+	def index
+		@desktopThemes = DesktopTheme.all
+	end
+
+	def destroy
+		dt = DesktopTheme.find(params[:id])
+		dt.destroy
+		redirect_to desktop_theme_path
+	end
+
+	def upload
+	if !params[:desktop_theme].nil?
+	    temp_file = Tempfile.new("temp_file")
+	    original_file = params[:desktop_theme][:package_file]
+	      #if original_file.content_type == 'application/zip'
+	        temp_file.write(original_file.read.force_encoding('UTF-8'))
+	        temp_file.rewind
+	        filename = File.basename(original_file.original_filename,".zip")
+	        unzip_widget(temp_file, filename)
+	      #else
+	      #  flash[:error] = "Upload file should be in zip format"
+	      #end
+	      temp_file.close
+	 end
+	end
+	def edit
+		@dw = DesktopWidget.find(params[:id])
+	end
+
+	
+	def unzip_widget(file, zip_name)
+	    Zip::ZipFile.open(file) { |zip_file|
+	      dt = DesktopTheme.new.from_json(zip_file.read("#{zip_name}/settings.json"))
+	      Dir.mktmpdir('f_path') { |dir|
+	        images_entries = []
+	        zip_file.entries.each do |entry|
+	          case (path = entry.to_s)
+	            when /\A(#{zip_name})\/(theme\.css)\z/
+	                #for default css
+	              dt.build_css_default(:file => get_temp_file(zip_file, dir, entry))
+	            when /\A(#{zip_name})\/(background)\/.*((\.jpg)|(\.png)|(\.gif))\z/   #for img
+	              images_entries << entry
+	          end
+	        end
+			images_entries.each do |image|
+	        	dt.images.build(:file => get_temp_file(zip_file,dir,image))
+	        end	  
+	      }
+	      dt.save
+	    }
+  end
+  def get_temp_file(zip_file, dir, entry)
+    filename = File.basename(entry.to_s)
+    temp_file = File.new(dir + '/' + filename, 'w+') 
+    temp_file.write (zip_file.read entry ).force_encoding('UTF-8')
+    temp_file
+  end
+
+  def settings
+  	if params[:id] == "custom"
+  		@id = DesktopTheme.first.id.to_s
+  	else 
+  		@id = params[:id]
+  	end
+  	dt = DesktopTheme.find(@id)
+  	if !dt.nil?
+  		dt['css'] = dt.css_default.file.url
+  		dt['background'] = dt.images.where(:name=>dt.background).first.file.url
+  	end
+  	icons = DesktopTheme::ICONS
+  	dt['icons'] = icons
+  	
+  	render :json => dt.to_json
+  end
+	
+end
+
+
+
+
+

app/controllers/desktop_widgets_controller.rb

@@ -4,6 +4,7 @@ class DesktopWidgetsController < OrbitBackendController
   	require 'zip/zip'
 
 	def index
+		@desktopWidgets = DesktopWidget.all
 	end
 
 	def upload
@@ -21,6 +22,19 @@ class DesktopWidgetsController < OrbitBackendController
 	      temp_file.close
 	 end
 	end
+	def edit
+		@dw = DesktopWidget.find(params[:id])
+	end
+
+	def update
+		@dw = DesktopWidget.find(params[:id])
+		if(params[:desktop_widget])
+			@imagefile = params[:desktop_widget][:image]
+			@dw.images.build(:file => @imagefile)
+			@dw.save
+		end
+		redirect_to action: "index"
+	end
 
 	def unzip_widget(file, zip_name)
 	    Zip::ZipFile.open(file) { |zip_file|

app/controllers/facebook_controller.rb

@@ -0,0 +1,31 @@
+require "net/http"
+require "uri"
+require 'json'
+
+class FacebookController< ApplicationController
+
+	def register_fb
+		user = User.find(params[:user])
+		if !user.facebook
+			user.build_facebook(fb_identifier: params[:identifier],connected: true)
+			user.save!
+		end
+    	render :json=>{"success"=>true,"user"=>user.facebook.fb_identifier}.to_json
+  	end
+
+  	def get_friends
+  		@url = "http://fb.tp.rulingcom.com/get_friends?identifier=" + current_user.facebook.fb_identifier
+	    uri = URI.parse(@url)
+	    http = Net::HTTP.new(uri.host, uri.port)
+	    request = Net::HTTP::Get.new(uri.request_uri)
+	    response = http.request(request)
+	    friends = response.body
+	    friends = JSON.parse(friends)
+	    output = Array.new
+	    friends.each do |friend|
+	    	output << friend['name']
+	    end
+  		render :json=>{"count"=>friends.count,"friends"=>output}.to_json
+  	end
+
+end

app/models/design/css_default.rb

@@ -4,5 +4,8 @@ class CssDefault < Stylesheet
   # belongs_to :desktop_widget
 
   belongs_to :css, polymorphic: true
+  def content
+    self.file.read.force_encoding("UTF-8") rescue ''
+  end
   
 end

app/models/desktop/desktop.rb

@@ -2,7 +2,7 @@ class Desktop
   include Mongoid::Document
   include Mongoid::Timestamps
   
-  field :theme, default: "4f8d3f533b67fcd05f08635a"
+  field :theme
   field :customtheme
   field :wallpaper
   

app/models/desktop/desktop_app.rb

@@ -0,0 +1,20 @@
+class DesktopApp
+	include Mongoid::Document
+  	include Mongoid::Timestamps
+
+  	field :name
+  	field :author
+  	field :shape
+  	field :version, :type => String
+    field :text_color, :type => String, default: ""
+    field :bg_color, :type => String, default: ""
+    field :icon, default: "icon.png"
+    field :url
+
+  has_many :images, as: :imgs, :autosave => true, :dependent => :destroy
+  has_and_belongs_to_many :desktops, :autosave => true
+  has_many :tiles, :autosave => true
+	
+	accepts_nested_attributes_for :images, :allow_destroy => true
+	
+end

app/models/desktop/desktop_theme.rb

@@ -2,8 +2,62 @@ class DesktopTheme
   include Mongoid::Document
   include Mongoid::Timestamps
 
-  field :name
-  field :author
+  	field :name
+  	field :author
+  	field :background
+  	field :tilecolor ,type: Array, default: ["thmc1","thmc2"] 
+  	ICONS = {
+  		"home"=>"d_home.png",
+		"app_manager"=>"d_app_manager.png",
+		"sections"=>"d_sections.png",
+		"settings"=>"d_settings.png",
+		"publication"=>"d_publication.png",
+		"journal_p"=>"d_journal_p.png",
+		"conference_p"=>"d_conference_p.png",
+		"books"=>"d_books.png",
+		"research"=>"d_research.png",
+		"research_d"=>"d_research_d.png",
+		"research_p"=>"d_research_p.png",
+		"patents"=>"d_patents.png",
+		"labs"=>"d_labs.png",
+		"experience"=>"d_experience.png",
+		"working"=>"d_working.png",
+		"education"=>"d_education.png",
+		"honors"=>"d_honors.png",
+		"activities"=>"d_activities.png",
+		"clubs"=>"d_clubs.png",
+		"landt"=>"d_landt.png",
+		"courses"=>"d_courses.png",
+		"homework"=>"d_homework.png",
+		"certification"=>"d_certification.png",
+		"personal"=>"d_personal.png",
+		"mypage"=>"d_mypage.png",
+		"blog"=>"d_blog.png",
+		"album"=>"d_album.png",
+		"calendar"=>"d_calendar.png",
+		"files"=>"d_files.png",
+		"orbit"=>"d_orbit.png",
+		"connection"=>"d_connection.png",
+		"appstore"=>"d_appstore.png"
+  	}
+  	
+  	has_one :css_default, as: :css, :autosave => true, :dependent => :destroy
+	has_many :images, as: :imgs, :autosave => true, :dependent => :destroy
+  	has_and_belongs_to_many :desktops, :autosave => true
+	
+	accepts_nested_attributes_for :images, :allow_destroy => true
+	
+	# after_save :parse_css_for_images
+
+  	# belongs_to :desktop
+
+
+  # 	protected
+  
+ 	# def parse_css_for_images
+	 #    self.css_default.parse_urls
+  # 	end
+
   
   
 end

app/models/desktop/desktop_widget.rb

@@ -5,9 +5,12 @@ class DesktopWidget
 
   	field :name
   	field :author
-  	field :shape
-    field :fullsize, :type => Boolean
+  	field :shape, default: "w1 h1"
+    field :fullsize, :type => Boolean, default: false
   	field :version, :type => String
+    field :text_color, :type => String, default: ""
+    field :bg_color, :type => String, default: ""
+    field :icon, default: "icon.png"
 
   has_one :css_default, as: :css, :autosave => true, :dependent => :destroy
 	has_one :widget_layout, :autosave => true, :dependent => :destroy

app/models/desktop/facebook.rb

@@ -0,0 +1,9 @@
+class Facebook
+	include Mongoid::Document
+  	include Mongoid::Timestamps
+
+  	field :fb_identifier
+  	field :connected, type: Boolean
+
+  	belongs_to :user
+end

app/models/desktop/group.rb

@@ -7,11 +7,11 @@ class Group
   before_create :initialize_tile
   
   def initialize_tile
-    self.tiles.build(data_category: "app", data_content: "quotes", position: 5, shape: "w1 h1", title: "Quotes")
-    self.tiles.build(data_category: "app", data_content: "dailyenglish", position: 6, shape: "w1 h1", title: "Daily English Word")
+    # self.tiles.build(data_category: "app", data_content: "quotes", position: 5, shape: "w1 h1", title: "Quotes")
+    # self.tiles.build(data_category: "app", data_content: "dailyenglish", position: 6, shape: "w1 h1", title: "Daily English Word")
     widgets = self.section.desktop.desktop_widgets.collect{|widget| widget.id}
-    for i in 0..3
-      self.tiles.build(data_category: "widget", position: i+1,desktop_widget_id: widgets[i])
+    widgets.each_with_index do |w,i|
+      self.tiles.build(data_category: "widget", position: i+1,desktop_widget_id: w)
     end
   end
 end

app/models/desktop/tile.rb

@@ -13,5 +13,6 @@ class Tile
   
   belongs_to :group
   belongs_to :desktop_widget
+  belongs_to :desktop_app
     
 end

app/models/user/user.rb

@@ -26,6 +26,7 @@ class User
 
   has_many :managing_apps,:class_name => "AppManager", :dependent => :destroy
   has_one :desktop, :autosave => true, :dependent => :destroy
+  has_one :facebook, :autosave => true, :dependent => :destroy
   has_many :other_accounts, :autosave => true, :dependent => :destroy
   # has_many :journals, :autosave => true, :dependent => :destroy
   # has_many :papers, :autosave => true, :dependent => :destroy

app/views/desktop/allsections.html.erb

@@ -6,10 +6,7 @@
 			</div>
 		</div>
 		<div id="holder">
-			<div id="group_wrapper" class="overview" content-layout="simple">
-				
-				<div class="clear"></div>
-			</div>
+			<div id="group_wrapper" class="overview" content-layout="simple"></div>
 		</div>
 	</div>
 	</div>

app/views/desktop/app_manager.html.erb

@@ -5,26 +5,55 @@
 		<a href="" class="hfn w1 hh1 hp"><span class="tile thmc1 op06"></span><span class="thmtxt">Date</span></a>
 		<a href="ascending" class="hfn w1 hh1 hp" id="alphabet_sort_btn" ><span class="tile thmc2 op03"></span><span class="thmtxt">Alphabet [A-Z]</span></a>
 		<div id="search_app" class="hfn w2 hh1 hp thmc3">
-			<input type="text" class="ini_input form" value="Search" id="searchbox" />
+			<input type="text" class="ini_input form" value="Search" maxlength="30" id="searchbox" />
 			<input type="submit" class="ini_input submit thmc1" value="Submit"/>
 		</div>
 		<div class="clear"></div>
 	</div>
-	<div class="search_result" style="min-width:120px;">
 	
-			</div>
 	<div id="holder">
 		<div id="group_wrapper" class="overview" content-layout="simple">
-			
-			<div class="group g_sep op03" id='seperator' style="height: 516px;display:none;"></div>
-			<div class="group_search" id="app_list">
-			<!--<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-Music</h1>
-				</div>-->
+			<div id="app_info" class="admbg vp hp s_column">
+				<div class="app_info_header s_grid_row hp">
+					<div class="s_grid s_grid_3">
+						<img class="app_info_icon" src="/assets/icons/wikibooks.png" alt="">
+					</div>
+					<div class="s_grid s_grid_9 valign">
+						<h2 class="app_info_name"></h2>
+						<a href="" class="panel_close icon-remove"></a>
+					</div>
+				</div>
+				<ul class="app_info_list">
+					<li class="s_grid_row">
+						<label class="s_grid s_grid_3">Activation</label>
+						<div info="app_section_activation" class="s_grid s_grid_9"></div>
+					</li>
+					<li class="s_grid_row">
+						<label class="s_grid s_grid_3">Description</label>
+						<div class="s_grid s_grid_9">
+							Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+						</div>
+					</li>
+					<li class="s_grid_row">
+						<label class="s_grid s_grid_3">Version</label>
+						<div class="s_grid s_grid_9" info="app_version"></div>
+					</li>
+					<li class="s_grid_row">
+						<label class="s_grid s_grid_3">Last Update</label>
+						<div class="s_grid s_grid_9" info="app_last_update"></div>
+					</li>
+					<li class="s_grid_row">
+						<label class="s_grid s_grid_3">Author</label>
+						<div class="s_grid s_grid_9" info="app_author"></div>
+					</li>
+				</ul>
+				<div class="s_action">
+					<a href="" id="" class="setting_btn admbg2 admtxt w1 hh1 hp" onclick="return false;">Remove</a>
+					<a href="" id="" class="setting_btn thmc1 thmtxt w1 hh1 hp" onclick="return false;">Setting</a>
+				</div>
 			</div>
-			<div class="clear"></div>
+			<div class="search_result s_column"></div>
+			<div id="app_list" class="s_column"></div>
 		</div>
 	</div>
 </div>

app/views/desktop/app_view1.html.erb

@@ -4,9 +4,8 @@
 			<div class="dtitle w2 hh2 hp"><span class="thmtxth">Appname</span></div>
 			<span class="icon-remove hh2 hp thmtxt"></span>
 		</div>
-		<div id="holder">
+		<div id="holder" class="clear">
 			<!-- app content -->
-			<div class="clear"></div>
 		</div>
 	</div>
 </div>

app/views/desktop/desktop.html.erb

@@ -1,26 +1,22 @@
 <div id="desktop">
-<div id="content">
-	<div id="header" class="hh2">
-		<div class="dtitle w2 hh2 hp sdm">
-			<div class="thmtxth sdm_t" id="section_heading"></div>
-			<div class="admbg sdm_o w2">
-				<ul id="section_list">
-				</ul>
+	<div id="content">
+		<div id="header" class="hh2">
+			<div class="dtitle w2 hh2 hp sdm">
+				<div class="thmtxth sdm_t" id="section_heading"></div>
+				<div class="admbg sdm_o w2">
+					<ul id="section_list">
+					</ul>
+				</div>
 			</div>
 		</div>
-	</div>
-	<div id="holder">
-		<div class="tinycanvas">
-			<div class="scrollbar sb_h"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
-				<div class="viewport">
-				        <div id="group_wrapper" class="overview">
-				       
-			                <div class="clear"></div>
+		<div id="holder">
+			<div class="tinycanvas">
+				<div class="scrollbar sb_h"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
+					<div class="viewport">
+					        <div id="group_wrapper" class="overview">
+					</div>
 				</div>
 			</div>
 		</div>
 	</div>
-            
-	        </div>
-	<div class="clear"></div>
 </div>

app/views/desktop/index.html.erb

@@ -2,9 +2,8 @@
   <div id="rwidget" class="wh2 thmc4">
     <ul class="docklist">
       <li class="d_cate"><a callback-method='initializeDesktop' href="desktop/desktop" class="widget_fn wh2 hh2" id='home' onclick="return false;"><span class="widget_icon"><img src="" alt="Home" id="home_icon" width="30" height="30"/></span></a>
-      <ul class="dock_child hh2 thmc4" style="width: 180px;">
-        <li class="dock_item"><a callback-method='initializeAppSearch' href="<%= desktop_app_manager_path %>" class="widget_fn wh2 hh2" id="d_app_manager" onclick="return false;"><span class="widget_icon"><img src="" alt="App Manager" id="app_manager_icon" width="30" height="30"/></span></a></li>
-        <li class="dock_item"><a callback-method='initializeSectionsManager' href="<%= desktop_allsections_path %>" class="widget_fn wh2 hh2" id="d_sections" custom-load="sections" onclick="return false;"><span class="widget_icon"><img src="" alt="All Sections" id="sections_icon" width="30" height="30"/></span></a></li>
+      <ul class="dock_child hh2 thmc4" style="width: 120px;">
+        <li class="dock_item"><a callback-method='initializeAppManager' href="<%= desktop_app_manager_path %>" class="widget_fn wh2 hh2" id="d_app_manager" onclick="return false;"><span class="widget_icon"><img src="" alt="App Manager" id="app_manager_icon" width="30" height="30"/></span></a></li>
         <li class="dock_item"><a callback-method='initializeSettings' href="<%= desktop_settings_path %>" custom-load="settings" class="widget_fn wh2 hh2" id="d_settings" onclick="return false;"><span class="widget_icon"><img src="" alt="Settings" id="settings_icon" width="30" height="30"/></span></a></li>
       </ul>
       </li>
@@ -63,23 +62,17 @@
   </div>
 </div>
 <div id="container">
-
   <div id='ajax_container'>
 
 
   </div>
 </div>
 <!--<div id="orbitbar"></div>-->
-
-<img src="" id="thmbackground" />
+<div id="minimizebar" class="admbg"></div>
+<div id="thmbackground"></div>
 <div id="bgover" ></div>
-<div id="orbitnote" style="display:none;">
-  <div class="note_holder">
-    <div class="note_type"><img id='note_img' alt=""/></div>
-    <div class="note_message">Check the Notifications section for more information.</div>
-  </div>
-</div>
-<div id="orbitdiag" style="display: none;">
+<div id="orbitnote"></div>
+<div id="orbitdiag">
   <div class="tile op07"></div>
   <div class="diag_holder">
     <div class="diag_holder_inner">
@@ -100,7 +93,12 @@
   orbitDesktop.prototype.currentUsername = "<%= @currentusername %>";
   //uselessfunction();
   var od = new orbitDesktop("#ajax_container");
+  if($.browser.msie){
+    if($.browser.version < 9){
+      $.fx.off =  true;
+    o.notify("We turn off the animation (javascript) for you, but still you can turn it on",10);
+    }
+  }
   o.notify("Welcome "+o.currentUsername+"!!","alert",3);
 </script>
-<%= javascript_include_tag "personal_journal" %>
-<%= javascript_include_tag "personal_conference" %>
+

app/views/desktop/settings.html.erb

@@ -9,10 +9,10 @@
       <div id="panel_l" class="ph">
         <div class="s_menu sm_v" content-type="menu">
           <ul id='setting_left_nav'>
-            <li><a href="" class="admtxt hh1 w2 hp" load="true" onclick='return false;'>Overview</a></li>
+            <li><a href="" class="admtxt hh1 w2 hp" onclick='return false;'>Overview</a></li>
             <li><a href="<%= edit_user_registration_path %>" callback-method="account" custom-load="account" class="admtxt hh1 w2 hp" onclick='return false;'>Account</a></li>
             <li><a href="<%= desktop_sections_path %>" callback-method="sections" custom-load="sections" class="admtxt hh1 w2 hp" onclick='return false;'>Sections</a></li>
-            <li><a href="<%= desktop_themes_path %>" callback-method="themes" class="admtxt hh1 w2 hp" onclick='return false;'>Theme</a></li>
+            <li><a href="<%= desktop_get_themes_path %>" load="true" callback-method="themes" class="admtxt hh1 w2 hp" onclick='return false;'>Theme</a></li>
             <li><a href="<%= desktop_connections_path %>" callback-method="connection" class="admtxt hh1 w2 hp" onclick='return false;'>Connection</a></li>
           </ul>
         </div>

app/views/desktop/settings/connections.html.erb

@@ -1,6 +1,9 @@
 
-		<div id="connection_setting" class="overview vp">
-			<ul class="s_form w2 hp" id="facebook_connection">
+		<div id="connection_setting" class="overview vp" content-layout="simple"> 
+			<a href="" onclick="window.open('<%= @url %>','login_window','height=250,width=400,titlebar=0,statusbar=0,location=0');return false;">Connect FaceBook</a>
+
+			<a href="/facebook/get_friends" ajax-remote="get" >Get Friends</a>
+			<!-- <ul class="s_form w2 hp" id="facebook_connection">
 				<li><span class="c_status">No Connection</span></li>
 				<li><img src="/assets/connection/facebook.png" alt="" class="c_icon"><h1 class="c_name">Facebook</h1></li>
 				<li><label for="">Account</label><input type="text"></li>
@@ -35,7 +38,7 @@
 						<a href="gmail" class="setting_btn thmc1 thmtxt hp" onclick="return false;" for="delete" style="display:none;">Remove</a>
 					</div>
 				</li>
-			</ul>
+			</ul> -->
 		</div>
 		<!-- <div style="z-index:999;position:relative;"><button onclick="o.tempFunc()">Twitter</button> -->
 	

app/views/desktop/settings/themes.html.erb

@@ -1,16 +1,16 @@
 <div class="s_tab stb_h">
 	<ul>
-		<li><a href="#st1" class="hh1 hp thmtxt thmc2">Select Theme</a></li>
-		<li><a href="#st2" class="hh1 hp admtxt admbg">Custom Theme</a></li>
+		<li><a href="#st1" class="hh1 hp thmc2 thmtxt" data-active="true">Themes</a></li>
+		<li><a href="#st2" class="hh1 hp admtxt admbg">Theme Color</a></li>
 		<li><a href="#st3" class="hh1 hp admtxt admbg">Wallpaper</a></li>
 	</ul>
 </div>
 
-		<div class="overview" content-layout="simple">
-			<div id="st1" class="st_c">
+		<div class="overview tab_holder" content-layout="simple">
+			<div id="st1" class="st_c" style="display:block;">
 				<div class="theme_list ssl">
 					<% @themes.each do |theme| %>
-						<div id="<%= theme.id %>" class="ssl_item"><div class="theme_thumb"><img src="/assets/sample_theme.jpg" alt="" width="120" height="96"></div><span class="theme_name ssl_des"><%= theme.name %></span></div>
+						<div id="<%= theme.id %>" class="ssl_item"><div class="theme_thumb"><img src="<%= theme.images.where(:name=>theme.background).first.file.thumb.url %>" alt="" width="120" height="96"></div><span class="theme_name ssl_des"><%= theme.name %></span></div>
 						<% end %>
 				</div>
 			</div>

app/views/desktop_apps/index.html.erb

@@ -0,0 +1,10 @@
+<div>
+	<ul>
+		<% @desktopapps.each do |da| %>
+			<li> <%= da.name %> 
+				<%= link_to "Delete", desktop_app_path(da), :method=>"delete", :confirm=>"Are you sure?" %>
+				<%#= link_to "Edit", edit_desktop_app_path(da) %>
+			</li> 
+		<% end %>
+	</ul>
+</div>

app/views/desktop_apps/upload.html.erb

@@ -0,0 +1,12 @@
+<h4>Upload App Package </h4>
+<div class="main2">
+	<%= form_tag '',:multipart => true,:action=>"post" do |f| %>
+
+	<p>
+	<%= file_field :desktop_app,:package_file %>
+	</p>
+	<%= submit_tag  %>
+
+	<% end %>
+
+</div>

app/views/desktop_themes/edit.html.erb

@@ -0,0 +1,16 @@
+<div>
+	<%= @dw.name %>
+
+	<h4>Upload Widget image </h4>
+	<div class="main2">
+		<%= form_for @dw, :url => desktop_widget_path(@dw) do |f| %>
+
+		<p>
+		<%= f.file_field :image %>
+		</p>
+		<%= submit_tag  %>
+
+		<% end %>
+
+	</div>
+</div>

app/views/desktop_themes/index.html.erb

@@ -0,0 +1,9 @@
+<div>
+	<ul>
+		<% @desktopThemes.each do |dw| %>
+			<li> <%= dw.name %> 
+				<%= link_to "Delete", desktop_theme_path(dw), :method=>"delete", :confirm=>"Are you sure?" %>
+			</li> 
+		<% end %>
+	</ul>
+</div>

app/views/desktop_themes/upload.html.erb

@@ -0,0 +1,12 @@
+<h4>Upload Theme Package </h4>
+<div class="main2">
+	<%= form_tag '',:multipart => true,:action=>"post" do |f| %>
+
+	<p>
+	<%= file_field :desktop_theme,:package_file %>
+	</p>
+	<%= submit_tag  %>
+
+	<% end %>
+
+</div>

app/views/desktop_widgets/edit.html.erb

@@ -0,0 +1,16 @@
+<div>
+	<%= @dw.name %>
+
+	<h4>Upload Widget image </h4>
+	<div class="main2">
+		<%= form_for @dw, :url => desktop_widget_path(@dw) do |f| %>
+
+		<p>
+		<%= f.file_field :image %>
+		</p>
+		<%= submit_tag  %>
+
+		<% end %>
+
+	</div>
+</div>

app/views/desktop_widgets/index.html.erb

@@ -0,0 +1,10 @@
+<div>
+	<ul>
+		<% @desktopWidgets.each do |dw| %>
+			<li> <%= dw.name %> 
+				<%= link_to "Delete", desktop_widget_path(dw), :method=>"delete", :confirm=>"Are you sure?" %>
+				<%= link_to "Edit", edit_desktop_widget_path(dw) %>
+			</li> 
+		<% end %>
+	</ul>
+</div>

config/environments/production.rb.bak

@@ -1,54 +0,0 @@
-PrototypeR4::Application.configure do
-  # Settings specified here will take precedence over those in config/application.rb
-
-  # The production environment is meant for finished, "live" apps.
-  # Code is not reloaded between requests
-  config.cache_classes = true
-
-  # Full error reports are disabled and caching is turned on
-  config.consider_all_requests_local       = false
-  config.action_controller.perform_caching = true
-
-  # Specifies the header that your server uses for sending files
-  config.action_dispatch.x_sendfile_header = "X-Sendfile"
-
-  # For nginx:
-  # config.action_dispatch.x_sendfile_header = 'X-Accel-Redirect'
-
-  # If you have no front-end server that supports something like X-Sendfile,
-  # just comment this out and Rails will serve the files
-
-  # See everything in the log (default is :info)
-  # config.log_level = :debug
-
-  # Use a different logger for distributed setups
-  # config.logger = SyslogLogger.new
-
-  # Use a different cache store in production
-  # config.cache_store = :mem_cache_store
-
-  # Disable Rails's static asset server
-  # In production, Apache or nginx will already do this
-  config.serve_static_assets = false
-
-  # Enable serving of images, stylesheets, and javascripts from an asset server
-  # config.action_controller.asset_host = "http://assets.example.com"
-
-  # Disable delivery errors, bad email addresses will be ignored
-  # config.action_mailer.raise_delivery_errors = false
-
-  # Enable threaded mode
-  # config.threadsafe!
-
-  # Enable locale fallbacks for I18n (makes lookups for any locale fall back to
-  # the I18n.default_locale when a translation can not be found)
-  config.i18n.fallbacks = true
-
-  # Send deprecation notices to registered listeners
-  config.active_support.deprecation = :notify
-
-
-  #compress both stylesheets and Javascripts
-  config.assets.js_compressor = :uglifier
-  config.assets.css_compressor = :scss
-end

config/mongoid.yml

@@ -8,7 +8,10 @@ defaults: &defaults
 
 development:
   <<: *defaults
-  database: production_7
+  database: test_site
+
+
+
 test:
   <<: *defaults
   database: test_site

config/routes.rb

@@ -196,11 +196,29 @@ Orbit::Application.routes.draw do
       post 'upload'
     end
   end
+   match "desktop_themes/settings" => "desktop_themes#settings"
+  resources :desktop_themes do
+
+    collection do
+      get 'upload'
+      get 'delete'
+      post 'upload'
+    end
+
+  end
+
+  resources :desktop_apps do
+    collection do
+      get 'upload'
+      get 'delete'
+      post 'upload'
+    end
+  end
 
   match "/desktop/compatibility" =>  "desktop#compatibility"
   match "desktop" =>  "desktop#index"
   match "/desktop/desktop" => "desktop#desktop"
-  match '/desktop/desktop'=>'desktop#desktop'
+  match '/desktop/appactivation'=>'desktop#appactivation'
   match '/desktop/app_manager'=>'desktop#app_manager'
   match '/desktop/allsections'=>'desktop#allsections'
   match '/desktop/settings'=>'desktop#settings'
@@ -208,9 +226,10 @@ Orbit::Application.routes.draw do
   match '/desktop/save_desktop_settings/'=>'desktop#save_desktop_settings'
   match '/desktop/getgroups/'=>'desktop#getgroups'
   match '/desktop/getsectionlist/'=>'desktop#getsectionlist'
-  match '/desktop/themes/'=>'desktop#themes'
+  match '/desktop/get_themes/'=>'desktop#get_themes'
   match '/desktop/sections/'=>'desktop#sections'
   match '/desktop/getapplist/'=>'desktop#getapplist'
+  match '/desktop/getapplistforManager/'=>'desktop#getapplistforManager'
   match '/desktop/newpositions/'=>'desktop#newpositions'
   match '/desktop/connections/'=>'desktop#connections'
   match '/desktop/widget_layout' => 'desktop#widget_layout'
@@ -247,6 +266,10 @@ Orbit::Application.routes.draw do
   match '/desktop_orbit/eventajaxload'=> 'desktop_orbit#eventajaxload'
   match '/desktop_orbit/gettimelinespan' => 'desktop_orbit#gettimelinespan'
 
+  match "/facebook/register_fb" => "facebook#register_fb"
+  match "/facebook/get_friends" => "facebook#get_friends"
+ 
+
 
   #match '/desktop_orbit/eventajaxload' => 'desktop_publications#create_journal'
   #match '/desktop_orbit/eventajaxload' => 'desktop_publications#delete_journal'

lib/desktopapp/views/app_view1.html.erb

@@ -4,9 +4,8 @@
 			<div class="dtitle w2 hh3 hp"><span class="thmtxth">Appname</span></div>
 			<span class="icon-remove hh3 hp thmtxt"></span>
 		</div>
-		<div id="holder">
+		<div id="holder" class="clear">
 			<!-- app content -->
-			<div class="clear"></div>
 		</div>
 	</div>
 </div>

lib/desktopapp/views/journal_pages/add.erb

@@ -49,7 +49,7 @@
 					<li class="s_grid_row"><textarea class="s_grid_6 s_grid" name="" id="">Paper Title</textarea></li>
 					<li class="s_grid_row"><input class="s_grid_6 s_grid" type="text" value="Journal Title"><span class="icon-plus input_append"></span></li>
 					<li class="s_grid_row">
-						<div class="check_box_g">
+						<div class="s_select_g">
 							<label for="">Journal Level</label>
 							<ul>
 								<li><input type="checkbox"><label for="">SCI</label></li>

public/desktop_themes/4f8d3f3c3b67fcd05f086358/css/default.css

@@ -1,45 +0,0 @@
-/* 
-Theme Color
-
-random apply to:
-.widget_fn - on hover status
-#search_app .submit
-.tile
-
-*/
-.thmc1 { background: #6F0; }
-.thmc2 { background: #C09; }
-
-/*
-sub1 Theme Color
-
-apply to:
-#search_app
-
-*/
-.thmc3 { background: #FFFFFF; }
-
-/*
-sub1 Theme Color
-
-apply to:
-#rwidget
-
-*/
-.thmc4 { background: #000000; }
-
-
-/* Theme Text Color */
-.thmtxt { color: #fff; }
-.thmtxth { color: #000; }
-
-/* Group Seprate Color */
-.g_sep { border-color: #fff; }
-
-/*
-theme bg image 
-
-#thmbackground img - background
-#bgover - upon #thmbackground
-
-*/

public/desktop_themes/4f8d3f3c3b67fcd05f086358/settings/4f8d3f3c3b67fcd05f086358.json

@@ -1,39 +0,0 @@
-{
-	"css":"default.css",
-	"background":"background.jpg",
-	"tilecolor":["thmc1","thmc2"],
-	"icons":{
-		"home":"d_home.png",
-		"app_manager":"d_app_manager.png",
-		"sections":"d_sections.png",
-		"settings":"d_settings.png",
-		"publication":"d_publication.png",
-		"journal_p":"d_journal_p.png",
-		"conference_p":"d_conference_p.png",
-		"books":"d_books.png",
-		"research":"d_research.png",
-		"research_d":"d_research_d.png",
-		"research_p":"d_research_p.png",
-		"patents":"d_patents.png",
-		"labs":"d_labs.png",
-		"experience":"d_experience.png",
-		"working":"d_working.png",
-		"education":"d_education.png",
-		"honors":"d_honors.png",
-		"activities":"d_activities.png",
-		"clubs":"d_clubs.png",
-		"landt":"d_landt.png",
-		"courses":"d_courses.png",
-		"homework":"d_homework.png",
-		"certification":"d_certification.png",
-		"personal":"d_personal.png",
-		"mypage":"d_mypage.png",
-		"blog":"d_blog.png",
-		"album":"d_album.png",
-		"calendar":"d_calendar.png",
-		"files":"d_files.png",
-		"orbit":"d_orbit.png",
-		"connection":"d_connection.png",
-		"appstore":"d_appstore.png"
-		}
-	}

public/desktop_themes/4f8d3f493b67fcd05f086359/css/default.css

@@ -1,45 +0,0 @@
-/* 
-Theme Color
-
-random apply to:
-.widget_fn - on hover status
-#search_app .submit
-.tile
-
-*/
-.thmc1 { background: #0099CC; }
-.thmc2 { background: #3366CC; }
-
-/*
-sub1 Theme Color
-
-apply to:
-#search_app
-
-*/
-.thmc3 { background: #FFFFFF; }
-
-/*
-sub1 Theme Color
-
-apply to:
-#rwidget
-
-*/
-.thmc4 { background: #000000; }
-
-
-/* Theme Text Color */
-.thmtxt, .thmtxt:hover { color: #fff; }
-.thmtxth { color: #fff; }
-
-/* Group Seprate Color */
-.g_sep { border-color: #fff; }
-
-/*
-theme bg image 
-
-#thmbackground img - background
-#bgover - upon #thmbackground
-
-*/