remove riotjs tags

Author: legomushroom

app/build/mojs-curve-editor.js

@@ -11,11 +11,9 @@ import defer        from './helpers/defer';
 import addPointerDown from './helpers/add-pointer-down';
 
 // TODO
-//   - resize down when points are above the editor border
-//   - add points shortcuts
-//   - performance
 //   - import path data
 //   - move bunch of points at once
+//   - add period generator
 
 /*
   API wrapper above the app itself.
@@ -117,15 +115,21 @@ class API {
   }
 
   _compilePath () {
+
     const state     = this.store.getState(),
           points    = state.points.present,
           {path}    = points;
 
-    if ( this._prevPath !== path ) {
-      this._prevPath = path;
-      this._easing = mojs.easing.path( path );
-      this._fireOnChange( path );
-    }
+    if ( !this._easing ) { this._easing = mojs.easing.path( path ); }
+
+    clearTimeout( this._tm );
+    this._tm = setTimeout( () => {
+      if ( this._prevPath !== path ) {
+        this._prevPath = path;
+        this._easing = mojs.easing.path( path );
+        this._fireOnChange( path );
+      }
+    }, 40 );
   }
 
   _fireOnChange ( path ) {

app/build/mojs-curve-editor.min.js

@@ -0,0 +1,8 @@
+
+export default (fn, time = 25) => {
+  let tm = null;
+  return () => {
+    clearTimeout( tm );
+    setTimeout( fn, time );
+  }
+}

app/js/app.babel.jsx

@@ -0,0 +1,18 @@
+import mod from './resize-mod';
+
+export default (x, y, type, state) => {
+  const {resize} = state;
+  // get modulus size for `top` and `bottom` types
+  if ( type !== 'right' ) {
+    const size = resize[type] + y,
+          coef = ( type === 'top' ) ? -1 : 1;
+    // normalize the y delta to modulus of CURVE_SIZEs
+    y = mod( size, coef );
+    y -= resize[type];
+    // ensure size won't be less then CURVE_SIZE
+    if ( size*coef < 0 ) { y = -resize[type]; }
+    // ensure size won't be less then CURVE_SIZE
+  } else if ( resize[type] + x < 0 ) { x = -resize[type]; }
+
+  return { x, y, type, resize };
+}

app/js/helpers/debounce.babel.js

@@ -9,7 +9,7 @@ const mod = ( tempResize_top, coef = 1 ) => {
         GAP = 15;
 
   if (MOD < GAP ) { tempResize_top = DIV*Y_SIZE; }
-  else if ( MOD > Y_SIZE - GAP ) { tempResize_top = coef*(DIV+1)*Y_SIZE; }
+  else if ( MOD > Y_SIZE - GAP ) { tempResize_top = (DIV+(1*coef))*Y_SIZE; }
 
   return tempResize_top;
 }

app/js/helpers/mod-deltas.babel.js

@@ -0,0 +1 @@
+export default [];

app/js/helpers/resize-mod.babel.js

@@ -1,10 +1,10 @@
 import calculatePath from '../helpers/calculate-path';
+import pool from '../pool';
 
-const INITIAL_STATE = {
-  isCode:   false
-}
+const INITIAL_STATE = { isCode: false }
 
 const controls = (state = INITIAL_STATE, action) => {
+  pool.push( state );
   switch (action.type) {
     case 'CODE_TAP': {
       return { ...state, isCode: !state.isCode };

app/js/pool.babel.js

@@ -1,4 +1,3 @@
-
 const INITIAL_STATE = {
   isShow: false,
   type:   'straight'

app/js/reducers/controls-reducer.babel.js

@@ -177,7 +177,34 @@ const pointsReducer = (state = INITIAL_STATE, action) => {
     }
 
     case 'HANDLE_TRANSLATE_END': {
-      return state;//{ ...state };
+      return state;
+    }
+
+    case 'EDITOR_RESIZE': {
+      const {data} = action,
+            points = [...state.points],
+            {type, resize} = data;
+
+      // return state if resize to the `right`
+      if (type === 'right') { return state; }
+
+      // normalize points' y regarding resize
+      if ( type === 'top' ) {
+        for (var i = 0; i < points.length; i++) {
+          const borderTop = Math.min(resize.top + data.y, 0),
+                point     = points[i];
+          if (point.y < borderTop) { point.y = borderTop; }
+        }
+      } else if ( type === 'bottom' ) {
+        for (var i = 0; i < points.length; i++) {
+          const borderBottom = Math.max(resize.bottom + data.y, 0) + C.CURVE_SIZE,
+                point     = points[i];
+
+          if (point.y > borderBottom) { point.y = borderBottom; }
+        }
+      }
+
+      return { ...state, points, ...calculatePath( points ) };
     }
 
   }