update left resize option

Author: ateliee

README.md

@@ -119,6 +119,7 @@ insert body
 |rows|{object}|schedule data|
 |draggable|{boolean}|enable draggable(default true)|
 |resizable|{boolean}|enable resizable(default true)|
+|resizableLeft|{boolean}|enable left handle resizable(default false)|
 
 ### Schedule Data
 

demo/index.html

@@ -199,6 +199,11 @@ <h2 id="option">Option</h2>
                 <td>Boolean</td>
                 <td>enable resizable</td>
             </tr>
+            <tr>
+                <td colspan="2">resizableLeft</td>
+                <td>Boolean</td>
+                <td>enable left handle resizable(default false)</td>
+            </tr>
             <tr>
                 <td rowspan="3">rows</td>
                 <td></td>
@@ -336,6 +341,7 @@ <h2 id="data">Schedule Data</h2>
             bundleMoveWidth: 6,  // width to move all schedules to the right of the clicked time line cell
             draggable: isDraggable,
             resizable: isResizable,
+            resizableLeft: true,
             rows : {
                 '0' : {
                     title : 'Title Area1',

dist/css/style.css

@@ -74,20 +74,19 @@
   color: #fff;
   background: #4f93d6;
   cursor: pointer;
-  z-index: 10;
-  overflow: hidden; }
+  z-index: 10; }
   .jq-schedule .sc_bar .head {
     display: block;
     margin-top: 6px;
-    padding: 0 8px 0;
     font-size: 12px;
+    padding: 0 14px;
     height: 1.2em;
     overflow: hidden; }
   .jq-schedule .sc_bar .text {
     display: block;
     margin-top: 6px;
-    padding: 0 16px 0;
     font-weight: bold;
+    padding: 0 14px;
     height: 1.2em;
     overflow: hidden; }
   .jq-schedule .sc_bar .ui-resizable-handle {
@@ -97,8 +96,12 @@
     height: 100%;
     right: 0;
     top: 0;
-    width: 10px;
+    width: 5px;
     background: #2e7ac4; }
+    .jq-schedule .sc_bar .ui-resizable-handle.ui-resizable-e {
+      right: 0; }
+    .jq-schedule .sc_bar .ui-resizable-handle.ui-resizable-w {
+      left: 0; }
 
 .jq-schedule .timeline,
 .jq-schedule .sc_main .tb {

dist/css/style.min.css

@@ -499,8 +499,14 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
             }
           }
         });
+        var resizableHandles = ['e'];
+
+        if (setting.resizableLeft) {
+          resizableHandles.push('w');
+        }
+
         $node.resizable({
-          handles: 'e',
+          handles: resizableHandles.join(','),
           grid: [setting.widthTimeX, setting.timeLineY - setting.timeBorder],
           minWidth: setting.widthTimeX,
           containment: $this.find('.sc_main_scroll'),
@@ -928,6 +934,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
           // width to move all schedules to the right of the clicked time cell
           draggable: true,
           resizable: true,
+          resizableLeft: false,
           // event
           onInitRow: null,
           onChange: null,