tinyscrollbar fixed

This commit is contained in:
harrybomrah authored and Rueshyna committed 2013-03-04 12:37:29 +08:00
1 parent 0f12314213
commit 23c8c28b52
11 files changed
+100 -404

No files matched your search

+72 -70
View File
@@ -11,6 +11,12 @@
// 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.
//for layout tinyscrollbar
//content-layout="datalist|column|simple" datalist is for data list from database.. column is usually for forms and some other pages.. simple is without any columns, the page will be displayed as it is.. base width will be considered the default width for tinyscrollbar
//base-width="300" this is the basic width of each column and in case of simple layout it ll be the final width
//per-column="5" this option is only for datalist layout.. this ll specify number of enteries per column.. default is 4
//column="true" this option is only for column layout... the columns will be formed on this column=true attribute and it should be a div
$.extend($.expr[':'], {
'containsi': function (elem, i, match, array) {
@@ -163,8 +169,10 @@ var orbitDesktop = function(dom){
if(typeof data == "string"){
if(ca)
$(ca).html(data);
else
$("div[container=true]").html(data);
else{
o.layout_data(data);
// $("div[container=true]").html(data);
}
}
if(exe)
window.o[o.data_method][exe](data,$e);
@@ -251,6 +259,51 @@ var orbitDesktop = function(dom){
})
};
this.layout_data = function(h){
var $e = $(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":
total_columns++;
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);
var entries = column_container.find("li"),x = 0;
entries.each(function(i,li){
if(x == 0){
column = $("<div class='g_col list_t' style='width:"+base_width+"px'><ul></ul></div");
total_columns++;
}
column.find("ul").append(li);
x++;
if(x == no_of_entries){
x = 0;
temp_div.append(column);
}
})
break;
case "column":
var entries = column_container.find("div[column=true]"),x = 0,column;
entries.each(function(i,ul){
column = $("<div class='s_grid_con' style='width:"+base_width+"px'></div");
total_columns++;
column.append(ul);
x++;
temp_div.append(column);
})
break;
}
column_container.empty();
$("div[container=true]").html(h);
$("div[container=true] div.overview").html(temp_div.html());
o.tinyscrollbar_ext({
main : ".tinycanvas",
fill : base_width * total_columns
})
}
this.menu_item = function(dom,customload,submenuitem){
if(!customload)customload=false;
var target = dom.attr("id");
@@ -310,17 +363,25 @@ var orbitDesktop = function(dom){
this.sub_menu_item = function(dom){
var sub_data_method = dom.attr('callback-method');
if(sub_data_method){
$("div[container=true]").load(dom.attr("href"),function(){
if(typeof o.data_method != "undefined"){
if(o.data_method != ""){
if(typeof sub_data_method != "undefined"){
if(sub_data_method != ""){
window.o[o.data_method][sub_data_method]();
$.ajax({
url : dom.attr("href"),
type : "get",
success : function(data){
o.layout_data(data);
if(typeof o.data_method != "undefined"){
if(o.data_method != ""){
if(typeof sub_data_method != "undefined"){
if(sub_data_method != ""){
window.o[o.data_method][sub_data_method]();
}
}
}
}
}
})
// $("div[container=true]").load(dom.attr("href"),function(data){
// })
}
$('*[content-type=menu] a').removeClass('thmc1 thmtxt active');
dom.addClass('thmc1 thmtxt active');
@@ -765,9 +826,7 @@ var orbitDesktop = function(dom){
},
accept: '.to_drop'
});
o.tinyscrollbar_ext({
main: '.tinycanvas'
})
};
@@ -1216,64 +1275,6 @@ var orbitDesktop = function(dom){
bindHandlers();
}
this.initializeResearchDomain = function(target,url,cache){
this.initializeResearchDomain.list = function(){
var bindHandlers = function(){
o.tinyscrollbar_ext({
main : ".tinycanvas",
fill : ".list_t"
})
}
bindHandlers();
}
this.initializeResearchDomain.add_this = function(){
var bindHandlers = function(){
}
bindHandlers();
}
this.initializeResearchDomain.list();
}
this.initializeResearchProject = function(target,url,cache){
this.initializeResearchProject.list = function(){
var bindHandlers = function(){
o.tinyscrollbar_ext({
main : ".tinycanvas",
fill : ".list_t"
})
}
bindHandlers();
}
this.initializeResearchProject.add_this = function(){
var bindHandlers = function(){
o.simple_drop_down();
o.tinyscrollbar_ext({
main: '.tinycanvas',
fill: '.s_grid_con'
})
}
bindHandlers();
}
this.initializeResearchProject.list();
}
this.loadWallpaper = function(wallpaper){ // this is to load new wallpaper
if(!wallpaper)wallpapernm = o.themesettings.background;else wallpapernm = wallpaper
var ww = $(window).width();
@@ -1331,13 +1332,14 @@ var orbitDesktop = function(dom){
var tinysettings = ( typeof tinysettings == 'undefined' ) ? {"axis":"x"} : tinysettings ;
var count,baseWidth,fillArray,pxs;
if( typeof target.fill == 'string' ){
fillArray = target.main.find(target.fill);
count = fillArray.length;
baseWidth = $(target.fill).eq(1).outerWidth(true);
target.main.find('.overview').width( baseWidth * count);
} else if( typeof target.fill == 'number' ){
target.main.find('.overview').width( target.fill );
} else if( typeof target.fill == 'undefined' ){
+3 -161
View File
@@ -9,167 +9,9 @@
<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">
<div class="section_label" >
<ul>
<li class="element w1 h1 hp vp thmtxt"><span class="tile thmc1"></span><span class="thmtxt">section 1</span></li>
<li class="element w1 h1 hp vp thmtxt " style="display: none;" data-category="section2"><span class="tile thmc2 op06"></span><span class="thmtxt">section 2</span></li>
<li class="element w1 h1 hp vp thmtxt " style="display: none;" data-category="section3"><span class="tile thmc2 op06"></span><span class="thmtxt">section 3</span></li>
<li class="element w1 h1 hp vp thmtxt " style="display: none;" data-category="section4"><span class="tile thmc2 op06"></span><span class="thmtxt">section 4</span></li>
</ul>
</div>
<ul class="grp" id="section1">
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
</ul>
</div>
<div class="group">
<div class="section_label" >
<ul>
<li class="element w1 h1 hp vp thmtxt"><span class="tile thmc1"></span><span class="thmtxt">section 2</span></li>
<li class="element w1 h1 hp vp thmtxt " style="display: none;" data-category="section1"><span class="tile thmc2 op06"></span><span class="thmtxt">section 1</span></li>
<li class="element w1 h1 hp vp thmtxt " style="display: none;" data-category="section3"><span class="tile thmc2 op06"></span><span class="thmtxt">section 3</span></li>
<li class="element w1 h1 hp vp thmtxt " style="display: none;" data-category="section4"><span class="tile thmc2 op06"></span><span class="thmtxt">section 4</span></li>
</ul>
</div>
<ul class="grp" id="section2">
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxth">Garage Band</h1>
</li>
</ul>
</div>-->
<div class="clear"></div>
<div id="group_wrapper" class="overview" content-layout="simple" base-width="3000">
<div class="clear"></div>
</div>
</div>
</div>
+1 -1
View File
@@ -1,7 +1,7 @@
<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">
<div class="overview" content-layout="simple" base-width="1000">
<div class="s_title hh3">Section Names</div>
<ul class="s_form" id="desktop_names">
<li><label for="s_name1">Section 1</label><input id="s_name1" type="text" value=""></li>
+1 -1
View File
@@ -8,7 +8,7 @@
<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">
<div class="overview" content-layout="simple" base-width="1000">
<div id="st1" class="st_c">
<div class="theme_list ssl">
<% @themes.each do |theme| %>