import Ember from 'ember';

const {
  String: { htmlSafe }
} = Ember;

export function pageTransform(width) {
  let transform = `transform: translate3d(${width}%, 0px, 0px)`;
  return htmlSafe(`-webkit-${transform}; -ms-${transform}; ${transform}`);
}

export function pageTransformOffset(offset, columns) {
  let width = 1.0 / columns * 100.0;
  let widthStr = -(width + offset).toFixed(14);
  return pageTransform(widthStr);
}

let SLIDER_TRANSFORM_COMMON = 'transition-duration: 400ms; transition-timing-function: cubic-bezier(0.5, 0, 0.1, 0); transition-delay: 0ms;';

export function 
(width) {
  return htmlSafe(`transform: translate3d(${width}px, 0px, 0px); ${SLIDER_TRANSFORM_COMMON}`);
}

export function sliderTransformHover(width) {
  return htmlSafe(`transform: scale(2) translate3d(${width}px, 0px, 0px); z-index: 4; ${SLIDER_TRANSFORM_COMMON}`);
}

sliderTransform