I tried to implement this with the following. I'm not familiar with flexbox so I ignored that, but something along these lines would be great.
scope: {
rDirections: "=",
rCenteredX: "=",
rCenteredY: "=",
rWidth: "=",
rHeight: "=",
rFlex: "=",
rGrabber: "@",
rMinWidth: "=",
rMinHeight: "="
}
....
switch(dragDir) {
case 'top':
var newHeight = h + (offset * vy);
if(scope.rFlex) { element[0].style.flexBasis = newHeight + 'px'; }
else { if(!scope.rMinHeight || ( newHeight > scope.rMinHeight)) { element[0].style.height = newHeight + 'px'; } }
break;
case 'right':
var newWidth = w - (offset * vx);
if(scope.rFlex) { element[0].style.flexBasis = newWidth + 'px'; }
else { if(!scope.rMinWidth || ( newWidth > scope.rMinWidth)) { element[0].style.width = newWidth + 'px'; } }
break;
case 'bottom':
var newHeight = h - (offset * vy);
if(scope.rFlex) { element[0].style.flexBasis = h - (offset * vy) + 'px'; }
else { if(!scope.rMinHeight || ( newHeight > scope.rMinHeight)) { element[0].style.height = h - (offset * vy) + 'px'; } }
break;
case 'left':
var newWidth = w + (offset * vx);
if(scope.rFlex) { element[0].style.flexBasis = newWidth + 'px'; }
else { if(!scope.rMinWidth || ( newWidth > scope.rMinWidth)) { element[0].style.width = newWidth + 'px';} }
break;
}
I tried to implement this with the following. I'm not familiar with flexbox so I ignored that, but something along these lines would be great.
scope: { rDirections: "=", rCenteredX: "=", rCenteredY: "=", rWidth: "=", rHeight: "=", rFlex: "=", rGrabber: "@", rMinWidth: "=", rMinHeight: "=" } .... switch(dragDir) { case 'top': var newHeight = h + (offset * vy); if(scope.rFlex) { element[0].style.flexBasis = newHeight + 'px'; } else { if(!scope.rMinHeight || ( newHeight > scope.rMinHeight)) { element[0].style.height = newHeight + 'px'; } } break; case 'right': var newWidth = w - (offset * vx); if(scope.rFlex) { element[0].style.flexBasis = newWidth + 'px'; } else { if(!scope.rMinWidth || ( newWidth > scope.rMinWidth)) { element[0].style.width = newWidth + 'px'; } } break; case 'bottom': var newHeight = h - (offset * vy); if(scope.rFlex) { element[0].style.flexBasis = h - (offset * vy) + 'px'; } else { if(!scope.rMinHeight || ( newHeight > scope.rMinHeight)) { element[0].style.height = h - (offset * vy) + 'px'; } } break; case 'left': var newWidth = w + (offset * vx); if(scope.rFlex) { element[0].style.flexBasis = newWidth + 'px'; } else { if(!scope.rMinWidth || ( newWidth > scope.rMinWidth)) { element[0].style.width = newWidth + 'px';} } break; }