Major tinyscrollbar update

This commit is contained in:
Harry Bomrah 2013-03-06 19:04:33 +08:00 committed by Matt K. Fu
parent 8e98cb3ec9
commit 1d06bcaae7
17 changed files with 91 additions and 109 deletions

View File

@ -4,13 +4,14 @@
//callback-method will be called after desktop controlled ajax call
//container=true is the area where the view will be loaded
//load = true is used to load the list element by default
//load = true is used to load the submenu item by default
//response-type = "json"|"script"|"xml|html" default is json
//autocomplete-list = "listname" an array from which autocomplete will be attached to its respective input or textarea
//ajax-remote="get/delete/post/false" this will automatically bind the <a> with remote ajax call. By default if the resposne is html, it ll be inserted in container=true, false option will not make any calls and also stop page refresh
// content-holder = "jquery dom", the returned html of server will be put inside the dom mentioned in content-holder of a tag. this can be used in a tags as attributes
//confirm-message ="Some message", this will prompt user with a confirm box and show the message before ajax call is made.
//"toggle-onclick" = "classes to get toggle" this will toggle classes on toggle when a tags are clicked.
//"delete-item" = "true" this will remove its respective item from the list.
//for layout tinyscrollbar
@ -181,16 +182,22 @@ var orbitDesktop = function(dom){
type : t,
url : $e.attr("href"),
success : function(data){
if(typeof data == "string"){
if(ca)
$(ca).html(data);
else{
o.layout_data(data);
// $("div[container=true]").html(data);
if(typeof data == "string"){
if(ca)
$(ca).html(data);
else{
o.layout_data(data);
// $("div[container=true]").html(data);
}
}
if(exe)
window.o[o.data_method][exe](data,$e);
if(t == "delete"){
if($e.attr("delete-item")=="true"){
var li_to_delete = $e.parentsUntil("li[item=true]").find("li[item=true]");
li_to_delete.slideUp();
}
}
}
if(exe)
window.o[o.data_method][exe](data,$e);
}
});
}
@ -275,8 +282,9 @@ var orbitDesktop = function(dom){
};
this.layout_data = function(h){
var $e = $(h);
var column_container = $e.find("div.overview");
var $e = $("<div></div>");
$e.html(h);
var column_container = $e.find("div.overview");
var layout = column_container.attr("content-layout"), base_width = parseInt(column_container.attr("base-width")), no_of_entries,temp_div = $("<div></div>"),total_columns=0;
switch (layout){
case "simple":
@ -284,13 +292,15 @@ var orbitDesktop = function(dom){
temp_div.append(column_container.html());
break;
case "datalist":
no_of_entries = (typeof column_container.attr("per-column") != "undefined"? column_container.attr("per-column") : 4);
no_of_entries = (typeof column_container.attr("per-column") != "undefined"? parseInt(column_container.attr("per-column")) : 4);
var height_percentage = 100/no_of_entries;
var entries = column_container.find("li[item=true]"),x = 0;
entries.each(function(i,li){
if(x == 0){
column = $("<div class='column type_datalist' style='width:"+base_width+"px'><ul></ul></div");
total_columns++;
}
$(li).addClass("datalist_item").height(height_percentage+"%");
column.find("ul").eq(0).append(li);
x++;
if(x == no_of_entries){
@ -310,8 +320,8 @@ var orbitDesktop = function(dom){
})
break;
}
column_container.empty();
$("div[container=true]").html(h);
$("div[container=true]").html(h).find("div.overview").wrap('<div class="tinycanvas vp"><div class="viewport"></div></div>');
$("div[container=true]").find("div.tinycanvas").prepend('<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>');
$("div[container=true] div.overview").html(temp_div.html());
if(isNaN(base_width)){
o.tinyscrollbar_ext({
@ -342,19 +352,19 @@ var orbitDesktop = function(dom){
var cache = false;
if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load(url,function(){
$(o.contentHolder).empty().load(url,function(data){
if(typeof o.data_method != "undefined"){
if(o.data_method != "")
window.o[o.data_method](target,url,cache);
}
try{
if(!customload)
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"));
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"),data);
else{
if(submenuitem)
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[custom-load="+submenuitem+"]"));
else
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"));
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"),data);
}
}catch(EX){}
@ -363,12 +373,12 @@ var orbitDesktop = function(dom){
$(o.contentHolder).html(o.desktopData[o.currentface]);
try{
if(!customload)
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"));
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"),data);
else{
if(submenuitem)
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[custom-load="+submenuitem+"]"));
else
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"));
o.sub_menu_item($(o.contentHolder).find("*[content-type=menu] a[load=true]"),data);
}
}catch(EX){}
cache = true;
@ -380,7 +390,7 @@ var orbitDesktop = function(dom){
});
}
}
this.sub_menu_item = function(dom){
this.sub_menu_item = function(dom,data){
var sub_data_method = dom.attr('callback-method');
if(sub_data_method){
$.ajax({
@ -399,13 +409,12 @@ var orbitDesktop = function(dom){
}
}
})
// $("div[container=true]").load(dom.attr("href"),function(data){
// })
o.highlight_sub_menu_item(dom);
}
if(dom.length == 0)
o.layout_data(data);
// $('*[content-type=menu] a').removeClass('thmc1 thmtxt active');
// dom.addClass('thmc1 thmtxt active');
o.highlight_sub_menu_item(dom);
}
this.highlight_sub_menu_item = function(no){
$('*[content-type=menu] a').removeClass('thmc1 thmtxt active');
@ -732,7 +741,6 @@ var orbitDesktop = function(dom){
};
this.initializeAppSearch = function(target,url,cache){ //this is application search ie is app manager initialization
var searchArray,allApps;
var bindHandlers = function(){ // bind handler for app manager page
var gn = $('.g_col').length,

View File

@ -1,4 +1,4 @@
<div id="sections">
<div id="sections" container="true">
<div id="content">
<div id="header" class="hh2">
<div class="dtitle w2 hh2 hp">
@ -6,15 +6,10 @@
</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" content-layout="simple" base-width="3000">
<div id="group_wrapper" class="overview" content-layout="simple">
<div class="clear"></div>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -1,4 +1,4 @@
<div id='app_manager'>
<div id='app_manager' container="true">
<div id="content">
<div id="header" class="hh2">
<div class="dtitle thmtxth w2 hh2 hp">Apps Manager</div>
@ -14,23 +14,18 @@
</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="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>
<div class="clear"></div>
</div>
</div>
</div>
<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>
<div class="clear"></div>
</div>
</div>
</div>
</div>

View File

@ -1,6 +1,4 @@
<div class="tinycanvas hp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="connection_setting" class="overview vp">
<ul class="s_form w2 hp" id="facebook_connection">
<li><span class="c_status">No Connection</span></li>
@ -40,5 +38,4 @@
</ul>
</div>
<!-- <div style="z-index:999;position:relative;"><button onclick="o.tempFunc()">Twitter</button> -->
</div>
</div>

View File

@ -1,6 +1,4 @@
<div class="tinycanvas vp">
<div class="scrollbar sb_v hp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview" content-layout="simple" base-width="1000">
<div class="s_title hh2">Section Names</div>
<ul class="s_form" id="desktop_names">
@ -14,5 +12,3 @@
<a href="" id="name_save_btn" class="setting_btn thmc1 thmtxt w1 hh1 hp" onclick='return false;'>Confirm</a>
</div>
</div>
</div>
</div>

View File

@ -5,9 +5,7 @@
<li><a href="#st3" class="hh1 hp admtxt admbg">Wallpaper</a></li>
</ul>
</div>
<div class="tinycanvas vp">
<div class="scrollbar sb_v vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview" content-layout="simple">
<div id="st1" class="st_c">
<div class="theme_list ssl">
@ -82,5 +80,3 @@
<div class="clear"></div>
</div>
</div>
</div>
</div>

View File

@ -12,11 +12,12 @@
</div>
</div>
<div id="co_author_relation_table" class="tinycanvas vp">
<!-- <div id="co_author_relation_table" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="datalist" per-column="4" base-width="300">
<%= render :partial => 'show_form'%>
</div>
</div>
<!-- </div>
</div>
-->

View File

@ -4,9 +4,9 @@
<%= link_to "New Type", panel_personal_conference_desktop_conference_co_author_relations_path, :class=>"bt-new-type fn_btn hp hh1 thmc2 thmtxt", "ajax-remote"=>"get" %>
</div>
</div>
<div id="co_author" class="tinycanvas vp">
<!-- <div id="co_author" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="datalist" per-column="4" base-width="400">
<% @conference_co_authors.each_with_index do |co_author,i| %>
<div class="g_col">
@ -26,5 +26,5 @@
</div>
<% end %>
</div>
</div>
</div>
<!-- </div>
</div> -->

View File

@ -22,7 +22,7 @@
<div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
</div>
</div>
<div id="paper_add" class="tinycanvas vp">
<!-- <div id="paper_add" class="tinycanvas vp">
<div class="scrollbar sb_h vp">
<div class="track">
<div class="thumb thmc2">
@ -31,7 +31,7 @@
</div>
</div>
</div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="column" base-width="450">
<div column="true">
<div class="s_form">
@ -206,8 +206,8 @@
</div>
</div>
</div>
</div>
</div>
<!-- </div>
</div> -->
<%= stylesheet_link_tag "token-input-facebook" %>
<%= javascript_include_tag :defaults, "jquery.tokeninput" %>

View File

@ -13,9 +13,9 @@
<div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
</div>
</div>
<div id="conference_list" class="tinycanvas vp">
<!-- <div id="conference_list" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="datalist" per-column="5" base-width="300">
<% @conference_lists.each_with_index do |conference_list,i| %>
<div class="g_col">
@ -32,5 +32,6 @@
</div>
<% end %>
</div>
</div>
<!-- </div>
</div>
-->

View File

@ -65,13 +65,13 @@
<div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
</div>
</div>
<div id="paper_list" class="tinycanvas vp">
<!-- <div id="paper_list" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="datalist" per-column="5" base-width="300">
<% @writing_conferences.each do |w| %>
<%= publication_record w, @view_by%>
<% end %>
</div>
</div>
</div>
<!-- </div>
</div> -->

View File

@ -56,6 +56,7 @@ module Panel::PersonalJournal::Desktop::JournalPagesHelper
"ajax-remote" => "delete",
"confirm-message" => t("sure?"),
"callback-method" => "paperDelete",
"delete-item" => "true",
:class => "journal_paper_delete admbg2 admtxt",
:href => panel_personal_journal_desktop_journal_page_path(publication))
end

View File

@ -12,11 +12,12 @@
</div>
</div>
<div id="co_author_relation_table" class="tinycanvas vp">
<!-- <div id="co_author_relation_table" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="datalist" per-column="5" base-width="300">
<%= render :partial => 'show_form'%>
</div>
</div>
<!-- </div>
</div>
-->

View File

@ -4,9 +4,9 @@
<%= link_to "New Type", panel_personal_journal_desktop_journal_co_author_relations_path, :class=>"bt-new-type fn_btn hp hh1 thmc2 thmtxt", "ajax-remote"=>"get" %>
</div>
</div>
<div id="co_author" class="tinycanvas vp">
<!-- <div id="co_author" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="datalist" per-column="4" base-width="300">
<ul>
<% @journal_co_authors.each_with_index do |co_author,i| %>
@ -24,5 +24,6 @@
<% end %>
</ul>
</div>
</div>
<!-- </div>
</div>
-->

View File

@ -23,7 +23,7 @@
<div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
</div>
</div>
<div id="paper_add" class="tinycanvas vp">
<!-- <div id="paper_add" class="tinycanvas vp">
<div class="scrollbar sb_h vp">
<div class="track">
<div class="thumb thmc2">
@ -31,7 +31,7 @@
</div>
</div>
</div>
<div class="viewport">
<div class="viewport"> -->
<div class="overview" content-layout="column" base-width="450">
<div column="true">
<div class="s_form">
@ -190,12 +190,9 @@
<td colspan="3">
<div id='add_plugin_file' class="info_input plugin_files_block s_action">
<%= hidden_field_tag 'plugin_file_field_count', @writing_journal.writing_journal_files.count %>
<<<<<<< Updated upstream
<a class="add setting_btn thmc1 thmtxt w1 hh1 hp" href=""><i class="icon-plus icon-white"></i> add</a>
=======
<a class="add setting_btn thmc1 thmtxt w1 hh2 hp" href="#"><i class="icon-plus icon-white"></i> add</a>
>>>>>>> Stashed changes
<a class="add setting_btn thmc1 thmtxt w1 hh1 hp" href="#"><i class="icon-plus icon-white"></i> add</a>
</div>
</td>
</tr>
@ -232,9 +229,9 @@
</div>
</div>
</div>
</div>
<!-- </div>
</div>
-->
<script>
$(document).ready(function(){
$("#writing_conference_author_tokens").tokenInput("/panel/personal_conference/desktop/conference_pages/new.json", {

View File

@ -77,14 +77,10 @@
<div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
</div>
</div>
<div id="paper_list" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview" content-layout="datalist" base-width="300" per-column="5">
<% @writing_journals.each do |w| %>
<%= publication_record w, @view_by%>
<% end %>
</div>
</div>
</div>

View File

@ -13,9 +13,7 @@
<div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
</div>
</div>
<div id="journal_list" class="tinycanvas vp">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview" content-layout="datalist" base-width="300" per-column="5">
<% @journal_lists.each_with_index do |journal_list,i| %>
<div class="g_col">
@ -32,5 +30,4 @@
</div>
<% end %>
</div>
</div>
</div>