diff --git a/app/assets/Archive/javascripts/orbitdesktop.js b/app/assets/Archive/javascripts/orbitdesktop.js index dea7c3f5..50f77661 100755 --- a/app/assets/Archive/javascripts/orbitdesktop.js +++ b/app/assets/Archive/javascripts/orbitdesktop.js @@ -315,7 +315,9 @@ var orbitDesktop = function(dom){ $(window).resize(function(){ // var ww = $(window).width(); // $("img#thmbackground").attr({"width":ww}); - if( $('.tinycanvas').length > 0 ){ $('.tinycanvas').tinyscrollbar_update('relative'); } + // if( $('.tinycanvas').length > 0 ){ + $('.tinycanvas').tinyscrollbar_update('relative'); + // } if($(o.contentHolder).find("div.app_frame").length > 0){ $(o.contentHolder).find("div.app_frame").each(function(){ var app_holder_height = $(this).height() - 72; @@ -369,7 +371,7 @@ var orbitDesktop = function(dom){ var temp_div = $("
"); var entries = []; switch (layout){ - case "simple": + case "simple": total_columns++; temp_div.append(column_container.html()); total_width = "auto"; @@ -462,6 +464,7 @@ var orbitDesktop = function(dom){ o.simple_drop_down(); o.autocomplete(); o.use_select2(); + o.check_simple_layout(); } this.paging = true; this.pagination = function(link,variable,page_no){ @@ -612,7 +615,6 @@ var orbitDesktop = function(dom){ } } this.sub_menu_item = function(dom,data){ - console.log(dom) var sub_data_method = dom.attr('callback-method'); if(sub_data_method){ o.lastlink = dom.attr("href"); @@ -833,26 +835,37 @@ var orbitDesktop = function(dom){ var $elements = $("#app_manager .element"), $result = $("#app_manager .search_result"), $appinfo = $("#app_info"), - $apptitle = $("#app_info .app_info_name"), - $appicon = $("#app_info .app_info_icon") - $appinfolist = $("#app_info .app_info_list"); + $applist = $("#app_list"), + $apptitle = $appinfo.find(".app_info_name"), + $appicon = $appinfo.find(".app_info_icon"), + $appinfolist = $appinfo.find(".app_info_list"), + $canvas = $result.parents('.overview'), + current_width = $canvas.css('width'); $("#app_manager #searchbox") .focus(function(){ $(this).val(""); }) .keyup(function(e){ - if($(this).val()){ - $result.empty(); - $elements.hide(); + var query = $(this).val(); + if(query){ + $appinfo.hide().attr('style',''); + $result.empty().show(); + $applist.hide(); - searchArray = $elements.filter(":containsi("+$(this).val()+")"); + // searchArray = $elements.filter(":containsi("+$(this).val()+")").clone(1,1); + // searchArray = $('#app_list').find('[data-title*="'+query+'"]').clone(1,1); + searchArray = $elements.filter(function(){ + var matcher = new RegExp(query, "i"); + return matcher.test( $(this).attr('data-title') ); + }).clone(1,1); + if(searchArray.length > 0){ // searchArray.each(function(){ // $(this).hide("fold","fast"); // }) // $("#app_manager #seperator").show(); - var i = 0; + var i = 0, c = 1; // c for numbers of columns var $column; searchArray.each(function(){ i++; @@ -864,23 +877,50 @@ var orbitDesktop = function(dom){ if(i == 4){ $result.append($column); i = 0; + c++; } - }) + }); if(i != 0){ $result.append($column); + c*=132; + searchArray + .eq(0) + .parents('.overview') + .animate({ + 'width': c + },0, function(){ + $(this) + .parents('.tinycanvas') + .tinyscrollbar_update(); + }); } - elementSetting(); } else { - $result.text("No Result Found."); + var $no_result = $('
No result for
'); + $no_result + .find('b') + .text('"'+$(this).val()+'"') + .end() + .show() + .appendTo($result); + $canvas.animate({ + 'width':252 + }, 0, function(){ + $(this) + .parents('.tinycanvas') + .tinyscrollbar_update(); + }); } - - } else { + } else if( query == "" ) { + info_close(); $result.empty(); - $elements.show(); + $applist.show(); + $canvas.css('width',current_width); } }) .blur(function(){ - if($(this).val()=="") $(this).val("Search"); + if($(this).val()==""){ + $(this).val("Search"); + } }); //for Alphabet sorting @@ -914,15 +954,20 @@ var orbitDesktop = function(dom){ var elementSetting = function(){// for element setting load - $(".element").click(function(){ - $e = $(this); + $elements.click(function(){ + var $e = $(this); $apptitle.text($e.data("title")); $appicon.attr("src",$e.find("img").attr("src")); - $appinfolist.find("li:eq(2) div").text($e.data("version")); + $appinfolist.find("[info=app_version]").text($e.data("version")); var dt = new Date($e.data("update")); - $appinfolist.find("li:eq(3) div").text(dt.toUTCString()); - $appinfolist.find("li:eq(4) div").text($e.data("author")); - + $appinfolist.find("[info=app_last_update]").text(dt.toUTCString()); + $appinfolist.find("[info=app_author]").text($e.data("author")); + $appinfo + .find(".app_info_header") + .css({ + "background-color": $e.data("background"), + "color": $e.data("text-color") + }); var sections = elementSettingsData[$e.data("id")].sections; var sectionids = new Array(); @@ -930,18 +975,18 @@ var orbitDesktop = function(dom){ sectionids.push(sec.id); }) - $appinfolist.find("[info=section_activation]").empty(); + $appinfolist.find("[info=app_section_activation]").empty(); $.each(o.sectionList,function(i,sec){ var present = $.inArray(sec._id,sectionids); if(present == -1){ - $sectionswitch = $('
Off
'); + $sectionswitch = $('
Off
'); }else{ - $sectionswitch = $('
On
'); + $sectionswitch = $('
On
'); } - $appinfolist.find("[info=section_activation]").append($sectionswitch); - }) - $appinfo.show(); + $appinfolist.find("[info=app_section_activation]").append($sectionswitch); + }); + info_open(); o.simple_switch(function(dom){ var options = { "status" : dom.is(":checked"), @@ -956,45 +1001,101 @@ var orbitDesktop = function(dom){ data : options, success : function(data){ if(data.success == "true"){ - elementSettingsData[$e.data("id")].sections.push({"id" : dom.data("section"),"name":sectionDetails.name}); - if(dom.is(":checked")) + elementSettingsData[$e.data("id")].sections.push({ + "id" : dom.data("section"), + "name":sectionDetails.name + }); + if(options.status) o.notify("Added to " + sectionDetails.name,"success"); else o.notify("Removed from " + sectionDetails.name,"success"); } } - }) + }); }); - }) + return false; + }); } $appinfo.find("a.panel_close").click(function(){ - $appinfo.hide(); + info_close(); return false; - }) + }); + + var info_open = function(){ + if($appinfo.is(":hidden")){ + $('.overview').stop().animate({'width': '+=480'},0 , function(){ + $('.tinycanvas').tinyscrollbar_update(); + }); + $appinfo + .css({ + 'display': 'block', + 'margin-left': -480 + }) + .delay(300) + .animate({ + 'margin-left': 0 + }, 500, 'easeInOutQuint'); + } else { + $('.tinycanvas').tinyscrollbar_update(); + } + } + + var info_close = function(){ + if( $appinfo.is(":visible") ){ + $appinfo + .stop() + .animate({ + 'margin-left': -480 + },500 , 'easeInOutQuint', function(){ + $('.overview').animate({'width': '-=480'}, 0, function(){ + $('.tinycanvas').tinyscrollbar_update(); + }); + $(this).attr("style",""); + }); + } else { + $('.tinycanvas').tinyscrollbar_update(); + } + } + $(window).on('keydown', function(){ + if($('#searchbox').val() == 'Search'){ + $('#searchbox').focus(); + } + }); elementSetting(); o.appname_substr('#group_wrapper .element'); - + o.check_simple_layout(); } var elementSettingsData = {}; var loadApps = function(){ //this load apps for sorting and searching - $('#app_list').empty(); + $('#app_info').attr('style',''); + $('.search_result').hide().text(""); + $('#app_list').empty().show(); $.getJSON("/desktop/getapplistforManager",{desktopid:o.desktopId},function(apps){ - var count = 0, colindex = 0; - $('#app_list').append('
'); - $.each(apps,function(i,app){ - var $app; - count++; - elementSettingsData[app.id] = {"sections" : app.sections}; - $app = $('

'+app.title+'

'); - if( count > 4 ){ - count = 1, colindex+=1; - $('#app_list').append('
'); - $('.g_col.col'+ colindex).append($app); - } else { - $('.g_col.col'+ colindex).append($app); - } - }); + var count = 0, + colindex = 0, + apps_sum = apps.length, + col_sum; + + col_sum = (apps_sum - (apps_sum % 4)) / 4 + 1; + + $('#app_list') + .css('width',col_sum * 132) + .append('
'); + + $.each(apps,function(i,app){ + var $app; + count++; + elementSettingsData[app.id] = {"sections" : app.sections}; + $app = $('

'+app.title+'

'); + if( count > 4 ){ + count = 1, colindex+=1; + $('#app_list').append('
'); + $('.g_col.col'+ colindex).append($app); + } else { + $('.g_col.col'+ colindex).append($app); + } + }); bindHandlers(); }); } @@ -1614,6 +1715,25 @@ var orbitDesktop = function(dom){ o.tinyscrollbar = target.main.tinyscrollbar( settings ); }; + this.check_simple_layout = function(){ + // use for various width of columns inside canvas(.overview) + // only count width for visible element which has "s_column" class + // then set width to canvas + // ** not sure to update canvas here ( $.tinyscrollbar_update() ) + var sw = 0, + $simple_layout = $('#content .overview[content-layout=simple]'); + if($simple_layout.find(".s_column").length > 0){ + $simple_layout.each(function(){ + $(this).find(".s_column").filter(":visible").each(function(){ + sw += $(this).outerWidth(); + }); + $simple_layout.css('width',sw); + }); + } + // if($simple_layout.find(".s_column").length > 0){ + // $simple_layout.css('width',sw); + // } + }; this.simple_drop_down = function(){ // simple dropdown menu var $sdm = $('.sdm'); @@ -1673,8 +1793,9 @@ var orbitDesktop = function(dom){ $status.text(status_off); break; } - if(typeof func == "function") + if(typeof func == "function"){ func.call(this,$(this)); + } }); }); }; diff --git a/app/assets/Archive/stylesheets/desktop/desktop-component.css b/app/assets/Archive/stylesheets/desktop/desktop-component.css index c18b2b5b..44474b32 100644 --- a/app/assets/Archive/stylesheets/desktop/desktop-component.css +++ b/app/assets/Archive/stylesheets/desktop/desktop-component.css @@ -360,8 +360,12 @@ 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; diff --git a/app/assets/Archive/stylesheets/desktop/desktop-component.scss b/app/assets/Archive/stylesheets/desktop/desktop-component.scss index 61b09495..4f7331e1 100644 --- a/app/assets/Archive/stylesheets/desktop/desktop-component.scss +++ b/app/assets/Archive/stylesheets/desktop/desktop-component.scss @@ -362,9 +362,15 @@ 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; diff --git a/app/assets/Archive/stylesheets/desktop/desktop-main.css b/app/assets/Archive/stylesheets/desktop/desktop-main.css index f1d42a54..fd3b1803 100644 --- a/app/assets/Archive/stylesheets/desktop/desktop-main.css +++ b/app/assets/Archive/stylesheets/desktop/desktop-main.css @@ -245,7 +245,15 @@ a.admtxt.admbg2:hover { .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; @@ -253,11 +261,11 @@ a.admtxt.admbg2:hover { /* 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; position: relative; z-index: 2; } @@ -603,7 +611,8 @@ a.admtxt.admbg2:hover { float: left; width: 420px; height: 516px; - margin-right: 36px; } + margin-right: 36px; + display: none; } #app_info .app_info_header { height: 120px; margin: -12px -12px 12px -12px; @@ -652,8 +661,21 @@ a.admtxt.admbg2:hover { #app_info .app_info_list label { color: #aaaaaa; } +#app_list { + float: left; } + #app_list .element > * { + cursor: pointer; } + .search_result { + float: left; 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; diff --git a/app/assets/Archive/stylesheets/desktop/desktop-main.scss b/app/assets/Archive/stylesheets/desktop/desktop-main.scss index 932c9695..c249e68b 100644 --- a/app/assets/Archive/stylesheets/desktop/desktop-main.scss +++ b/app/assets/Archive/stylesheets/desktop/desktop-main.scss @@ -175,7 +175,15 @@ a.admtxt.admbg2:hover { 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; @@ -184,10 +192,10 @@ a.admtxt.admbg2:hover { /* 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; @@ -599,6 +607,7 @@ a.admtxt.admbg2:hover { width: 420px; height: 516px; margin-right: 36px; + display: none; .app_info_header { height: 120px; @@ -639,8 +648,27 @@ a.admtxt.admbg2:hover { } } } +#app_list { + float: left; + + .element > * { + cursor: pointer; + } +} .search_result{ + float: left; overflow: hidden; + + .message { + font-size: 15px; + word-wrap: break-word; + + b { + font-size: 20px; + display: block; + margin-top: 12px; + } + } } diff --git a/app/controllers/desktop_controller.rb b/app/controllers/desktop_controller.rb index aedc752b..b5ab6f1e 100644 --- a/app/controllers/desktop_controller.rb +++ b/app/controllers/desktop_controller.rb @@ -215,7 +215,7 @@ class DesktopController< ApplicationController 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, "sections" => @sections} + @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 render :json=>@allWidgets.to_json end diff --git a/app/models/desktop/desktop_widget.rb b/app/models/desktop/desktop_widget.rb index ae2fd9b6..b91ec518 100644 --- a/app/models/desktop/desktop_widget.rb +++ b/app/models/desktop/desktop_widget.rb @@ -8,8 +8,8 @@ class DesktopWidget field :shape field :fullsize, :type => Boolean, default: false field :version, :type => String - field :text_color, :type => String, default: "#fff" - field :bg_color, :type => String, default: "#fff" + 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 diff --git a/app/views/desktop/allsections.html.erb b/app/views/desktop/allsections.html.erb index 49f10ff7..cb6a84ca 100644 --- a/app/views/desktop/allsections.html.erb +++ b/app/views/desktop/allsections.html.erb @@ -6,10 +6,7 @@
-
- -
-
+
\ No newline at end of file diff --git a/app/views/desktop/app_manager.html.erb b/app/views/desktop/app_manager.html.erb index 335ab79f..2628ca6f 100644 --- a/app/views/desktop/app_manager.html.erb +++ b/app/views/desktop/app_manager.html.erb @@ -5,7 +5,7 @@ Date Alphabet [A-Z]
- +
@@ -13,20 +13,20 @@
-
diff --git a/app/views/desktop/desktop.html.erb b/app/views/desktop/desktop.html.erb index 0426feee..abf0593b 100644 --- a/app/views/desktop/desktop.html.erb +++ b/app/views/desktop/desktop.html.erb @@ -14,8 +14,6 @@
- -