import _ from 'lodash';

export const rectAnnotationCalc = (
  position,
  viewHeight,
  scale,
) => ({
  top: viewHeight - position.bottom * scale,
  left: position.left * scale,
  width: (position.right - position.left) * scale,
  height: (position.bottom - position.top) * scale,
});

export const actualRectCalc = (
  position,
  viewHeight,
  scale,
) => ({
  top: Math.round(viewHeight / scale) - position.top,
  left: position.left,
  width: (position.right - position.left),
  height: (position.top - position.bottom),
});

export const rectCalc = (
  position,
  viewHeight,
  scale,
) => ({
  top: viewHeight - position.top * scale,
  left: position.left * scale,
  width: (position.right - position.left) * scale,
  height: (position.top - position.bottom) * scale,
});

export const rectHighlight = (
  position,
  viewHeight,
  scale,
) => {
  const len = position.length;
  let leftVal;
  let rightVal;
  let topVal;
  let bottomVal;
  if (len > 1) {
    leftVal = position.reduce(function (pre, next) {
      return ( pre.left < next.left ? pre : next );
    })
    rightVal = position.reduce(function (pre, next) {
      return ( pre.right > next.right ? pre : next );
    })
    topVal = position.reduce(function (pre, next) {
      return (pre.top < next.top ? pre : next)
    })
    bottomVal = position.reduce(function (pre, next) {
      return ( pre.bottom > next.bottom ? pre : next );
    })
  } else {
    leftVal = position[0];
    rightVal = position[0]
    topVal = position[0];
    bottomVal = position[0];
  }
  return {
    top: viewHeight - position[0].bottom * scale,
    left: leftVal.left * scale,
    width: (rightVal.right - leftVal.left) * scale,
    height: Math.abs(bottomVal.bottom - topVal.top) * scale,
  }
}

export const getPosition = (
  type,
  element,
) => {
  const attributes = element.attributes;

  switch (type) {
    case 'Ink': {
      const gestures = [];
      const nodes = element.childNodes[0].childNodes;
      const nodeList = Array.prototype.slice.call(nodes);
      nodeList.forEach((ele) => {
        if (ele.tagName === 'gesture') {
          const points = [];
          const gestureArray = (ele.innerHTML || ele.textContent || '').split(
            ';',
          );

          gestureArray.forEach((ele1) => {
            const pointArr = ele1.split(',');
            const point = {
              x: Math.round(Number(pointArr[0]) * 100) / 100,
              y: Math.round(Number(pointArr[1]) * 100) / 100,
            };
            points.push(point);
          });
          gestures.push(points);
        }
      });

      return gestures;
    }
    case 'Line': {
      const start = attributes.start.value.split(',');
      const end = attributes.end.value.split(',');
      return {
        start: {
          x: parseInt(start[0], 10),
          y: parseInt(start[1], 10),
        },
        end: {
          x: parseInt(end[0], 10),
          y: parseInt(end[1], 10),
        },
      };
    }
    case 'Square':
    case 'Circle': {
      const width = parseInt(attributes.width.value, 10);
      const rect = attributes.rect.value.split(',');
      return {
        left: parseInt(rect[0], 10) + width,
        bottom: parseInt(rect[1], 10) + width,
        right: parseInt(rect[2], 10) - width,
        top: parseInt(rect[3], 10) - width,
      };
    }
    case 'Text':
    case 'FreeText':
    case 'textfield':
    case 'radiobutton':
    case 'checkbox': {
      const rect = attributes.rect.value.split(',');
      return {
        left: parseInt(rect[0], 10),
        bottom: parseInt(rect[1], 10),
        right: parseInt(rect[2], 10),
        top: parseInt(rect[3], 10),
      };
    }
    case 'Highlight':
    case 'Underline':
    case 'Squiggly':
    case 'StrikeOut': {
      let tempArray = [];

      if (attributes.coords) {
        const coords = attributes.coords.value.split(',');
        tempArray = _.chunk(coords, 8);
      }

      const position = tempArray.map((ele) => ({
        left: parseInt(ele[0], 10),
        bottom: parseInt(ele[5], 10),
        right: parseInt(ele[2], 10),
        top: parseInt(ele[1], 10),
      }));

      return position;
    }
    default:
      return {
        left: 0,
        bottom: 0,
        right: 0,
        top: 0,
      };
  }
}; 

export const parsePositionForBackend = (
  type,
  position,
  pageHeight,
  scale,
) => {
  switch (type) {
    case 'Highlight':
    case 'Underline':
    case 'Squiggly':
    case 'StrikeOut': {
      const positionArray = position;

      return positionArray.map((ele) => ({
        left: Math.round(ele.left * 1000 / scale) / 1000,
        top: Math.round((pageHeight - ele.bottom) * 1000 / scale) / 1000,
        right: Math.round(ele.right * 1000 / scale) / 1000,
        bottom: Math.round((pageHeight - ele.top) * 1000 / scale) / 1000,
      }));
    }
    case 'Square':
    case 'Circle':
    case 'FreeText':
    case 'Text':
    case 'Image':
    case 'textfield':
    case 'radiobutton':
    case 'checkbox': {
      const normalPosition = position;
      return {
        left: Math.round(normalPosition.left * 1000 / scale) / 1000,
        bottom: Math.round((pageHeight - normalPosition.bottom) * 1000 / scale) / 1000,
        right: Math.round(normalPosition.right * 1000 / scale) / 1000,
        top: Math.round((pageHeight - normalPosition.top) * 1000 / scale) / 1000,
      };
    }
    case 'Line': {
      const { start, end } = position;

      return {
        start: {
          x: start.x / scale,
          y: (pageHeight - start.y) / scale,
        },
        end: {
          x: end.x / scale,
          y: (pageHeight - end.y) / scale,
        },
      };
    }
    case 'Ink': {
      if (Array.isArray(position)) {
        const points = position;
        return [
          points[0].map((point) => ({
            x: point.x,
            y: (pageHeight / scale - point.y),
          })),
        ];
      }
      const point = position;
      return {
        x: point.x,
        y: (pageHeight /scale - point.y),
      };
    }
    default:
      return {
        left: 0,
        bottom: 0,
        right: 0,
        top: 0,
      };
  }
};

export const getAbsoluteCoordinate = (
  parentElement,
  clickEvent,
) => {
  if (!parentElement) return { x: 0, y: 0 };

  let pageX = 0;
  let pageY = 0;
  if (clickEvent.touches) {
    const touch = clickEvent.touches[0];
    ({ pageX, pageY } = touch);
  } else {
    ({ pageX, pageY } = clickEvent);
  }

  const rect = parentElement.getBoundingClientRect();
  const offsetX = window.pageXOffset || window.scrollX || 0;
  const offsetY = window.pageYOffset || window.scrollY || 0;
  const coordinate = {
    x: pageX - rect.left - offsetX,
    y: pageY - rect.top - offsetY,
  };
  return coordinate;
};

export default rectCalc;
