tinyscrollbar minor update

app/assets/javascripts/jquery.tinyscrollbar.js

@@ -11,7 +11,7 @@
  * Depends on library: jQuery
  *
  */
-( function( $ ) 
+;( function( $ ) 
 {
     $.tiny = $.tiny || { };
 
@@ -23,6 +23,7 @@
             ,   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 );

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;

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;

app/views/desktop/index.html.erb

@@ -85,8 +85,8 @@
     <div class="diag_holder_inner">
       <div class="diag_message"></div>
       <div class="diag_action">
-        <a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
+        <a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
-        <a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
+        <a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
       </div>
     </div>
   </div>

lib/desktopapp/views/index.html.erb

@@ -81,8 +81,8 @@
 		<div class="diag_holder_inner">
 			<div class="diag_message"></div>
 			<div class="diag_action">
-				<a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
+				<a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
-				<a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
+				<a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
 			</div>
 		</div>
 	</div>