From db2b371744a5529485b4f3ebaa722cea64c7e4ec Mon Sep 17 00:00:00 2001 From: devin Date: Tue, 5 Mar 2013 17:22:53 +0800 Subject: [PATCH] tinyscrollbar minor update --- .../javascripts/jquery.tinyscrollbar.js | 46 ++++++++++++++----- .../stylesheets/desktop/desktop-component.css | 12 +++++ .../stylesheets/desktop/desktop-main.css | 7 ++- app/views/desktop/index.html.erb | 4 +- lib/desktopapp/views/index.html.erb | 4 +- 5 files changed, 55 insertions(+), 18 deletions(-) diff --git a/app/assets/javascripts/jquery.tinyscrollbar.js b/app/assets/javascripts/jquery.tinyscrollbar.js index 4bca0dfa..fe2f2ba2 100644 --- a/app/assets/javascripts/jquery.tinyscrollbar.js +++ b/app/assets/javascripts/jquery.tinyscrollbar.js @@ -11,19 +11,20 @@ * Depends on library: jQuery * */ -( function( $ ) +;( function( $ ) { $.tiny = $.tiny || { }; $.tiny.scrollbar = { options: { - axis : 'y' // vertical or horizontal scrollbar? ( x || y ). - , wheel : 40 // how many pixels must the mouswheel scroll at a time. - , scroll : true // enable or disable the mousewheel. - , lockscroll : true // return scrollwheel to browser if there is no more content. - , size : 'auto' // set the size of the scrollbar to auto or a fixed number. - , sizethumb : 'auto' // set the size of the thumb to auto or a fixed number. - , onMove : function(){} + axis : 'y' // vertical or horizontal scrollbar? ( x || y ). + , wheel : 40 // how many pixels must the mouswheel scroll at a time. + , scroll : true // enable or disable the mousewheel. + , lockscroll : true // return scrollwheel to browser if there is no more content. + , size : 'auto' // set the size of the scrollbar to auto or a fixed number. + , sizethumb : 'auto' // set the size of the thumb to auto or a fixed number. + , invertscroll : false // Enable mobile invert style scrolling + , onMove : function(){} } }; @@ -59,13 +60,15 @@ , iScroll = 0 , iPosition = { start: 0, now: 0 } , iMouse = {} - , touchEvents = ( 'ontouchstart' in document.documentElement ) ? true : false + , touchEvents = 'ontouchstart' in document.documentElement + , UA = $.browser ; function initialize() { oSelf.update(); setEvents(); + return oSelf; } @@ -124,6 +127,9 @@ { oWrapper[0].addEventListener( 'DOMMouseScroll', wheel, false ); oWrapper[0].addEventListener( 'mousewheel', wheel, false ); + oWrapper[0].addEventListener( 'MozMousePixelScroll', function( event ){ + event.preventDefault(); + }, false); } else if( options.scroll ) { @@ -133,6 +139,16 @@ function start( event ) { + $( "body" ).addClass( "noSelect" ); + // Disable select text under IE10 + if ( UA.msie < 10 ){ + $( "body" ).attr({ + "onselectstart": "return false", + "ondragstart": "return false" + }); + } + oScrollbar.obj.addClass( "dragging" ); + var oThumbDir = parseInt( oThumb.obj.css( sDirection ), 10 ); iMouse.start = sAxis ? event.pageX : event.pageY; iPosition.start = oThumbDir == 'auto' ? 0 : oThumbDir; @@ -181,13 +197,13 @@ { if( oContent.ratio < 1 ) { - if( ! touchEvents ) + if( options.invertscroll && touchEvents ) { - iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( ( sAxis ? event.pageX : event.pageY ) - iMouse.start)))); + iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( iMouse.start - ( sAxis ? event.pageX : event.pageY ) )))); } else { - iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( iMouse.start - ( sAxis ? event.pageX : event.pageY ) )))); + iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( ( sAxis ? event.pageX : event.pageY ) - iMouse.start)))); } iScroll = iPosition.now * oScrollbar.ratio; @@ -198,6 +214,12 @@ function end() { + $( "body" ).removeClass( "noSelect" ); + // Enable select text under IE10 + if ( UA.msie < 10 ){ + $( "body" ).removeAttr( "onselectstart", "ondragstart" ); + } + oScrollbar.obj.removeClass( "dragging" ); $( document ).unbind( 'mousemove', drag ); $( document ).unbind( 'mouseup', end ); oThumb.obj.unbind( 'mouseup', end ); diff --git a/app/assets/stylesheets/desktop/desktop-component.css b/app/assets/stylesheets/desktop/desktop-component.css index 49814067..74700581 100644 --- a/app/assets/stylesheets/desktop/desktop-component.css +++ b/app/assets/stylesheets/desktop/desktop-component.css @@ -364,6 +364,14 @@ height: 6px; width: 6px; } +.noSelect { + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} .tinycanvas .scrollbar { position: absolute; z-index: 9; @@ -373,6 +381,10 @@ -moz-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } +.tinycanvas .scrollbar.dragging { + opacity: 1; + visibility: visible; +} .tinycanvas .scrollbar.sb_h { left: 0; bottom: -6px; diff --git a/app/assets/stylesheets/desktop/desktop-main.css b/app/assets/stylesheets/desktop/desktop-main.css index a6eeee01..a8ec6829 100644 --- a/app/assets/stylesheets/desktop/desktop-main.css +++ b/app/assets/stylesheets/desktop/desktop-main.css @@ -276,7 +276,7 @@ a:focus { outline: none; } height: 100%; left: 0; top: 0; - z-index: 10; + z-index: 12; } #orbitdiag .tile { background-color: #000; } .diag_holder { background-color: #000; } @@ -374,6 +374,9 @@ a:focus { outline: none; } left: 0; top: 0; } +.widget.gs_w { + cursor: move; +} /* header drop menu */ .sdm_mdr .sdm_o { top: 36px; } @@ -699,7 +702,7 @@ a:focus { outline: none; } left: 0; right: 0; bottom: 0; - z-index: 9; + z-index: 12; } .app_frame .app_holder { background-color: #fff; diff --git a/app/views/desktop/index.html.erb b/app/views/desktop/index.html.erb index b7d1ed14..72d55330 100644 --- a/app/views/desktop/index.html.erb +++ b/app/views/desktop/index.html.erb @@ -85,8 +85,8 @@
- - + +
diff --git a/lib/desktopapp/views/index.html.erb b/lib/desktopapp/views/index.html.erb index 47fca2a7..aadb39ad 100755 --- a/lib/desktopapp/views/index.html.erb +++ b/lib/desktopapp/views/index.html.erb @@ -81,8 +81,8 @@
- - + +