inverted and fixed drag scrolling

hourglass/client/main/main.html

@@ -297,7 +297,7 @@
         </div>
         <div>
             <span class="workTitle">Description:</span><br>
-            <textarea id="wDescription" class="clickModify restrict" style="color:{{divColor 'textColor'}}" value="{{work 'description'}}" rows="5" tabindex="12" maxLength="150"></textarea>
+            <textarea id="wDescription" class="clickModify restrict" style="color:{{divColor 'textColor'}}" value="{{work 'description'}}" rows="5" tabindex="12" maxLength="300"></textarea>
             <span style="opacity:0">.</span>
             <span class="resText">{{restrict 'wDescription'}}</span>
         </div>

hourglass/client/main/main.js

@@ -73,21 +73,25 @@ Template.classesMode.rendered = function() {
     $(".mainClass .slimScrollBar").css("display", "none");
     
     // Classes mode drag scrolling
-    var dX = 0;
+    var area = $("#classesMode");
-    var currX = 0;
+    var curDown;
-    var sidebar = $("#classesMode");
+    var curXPos;
-    new Hammer(sidebar[0], {
+
-        domEvents: true
+    area.mousedown(function(m){
+        curDown = true;
+        curXPos = m.pageX;
     });
 
-    sidebar.on('panmove', function(e) {
+    area.mouseup(function(){
-        dX = currX + (e.originalEvent.gesture.deltaX);
+        curDown = false;
-        sidebar.scrollLeft(dX);
+    });
+
+    area.mousemove(function(m){
+        if(curDown) {
+            area.scrollLeft($(window).scrollLeft() + (curXPos - m.pageX));
+        }
     });
 
-    sidebar.on('panend', function(e) {
-        currX = dX;
-    }); 
 };
 
 // Global Helpers

hourglass/client/mobile/mobile.css

@@ -489,6 +489,15 @@
 	right: 21vw;
 }
 
+#mDelete {
+	padding: 3%;
+	background-color: rgba(255,255,255,0.1);
+
+	position: absolute;
+	bottom: 7vw;
+	left: 7vw;
+}
+
 .mOption {
 	font-size: 3.7vw;
 	width: 92%;

hourglass/client/mobile/mobile.html

@@ -224,6 +224,7 @@
 		<i class="fa fa-exclamation-triangle" aria-hidden="true" ></i>
 	</div>
 	<p id="mReportNum" class="mNum">{{work 'reports'}}</p>
+	<!-- <h4 id="mDelete">Delete Work</h4> -->
 </template>
 
 <template name="mViewWork">

hourglass/client/mobile/mobile.js

@@ -488,6 +488,10 @@ Template.mEditWork.rendered = function() {
 		Session.set("select", "type");
 		toggleSidebar(true);
 	});
+
+	/*addMobileButton($("#mDelete"), 0.2, "brightness", function() {
+		
+	})*/
 }
 
 Template.mAddWork.events({