mobileoa-common-modules/app/scripts/modules/gesturepassword/services/GestureScreenLayout.js

移动办公平台前端公共功能模块

'use strict';
var angular = require('angular');
require('../modules');
var module = angular.module('gesturepassword.services');

function GestureScreenLayout(width, height) {
  this.height = height;
  this.width = width;
  this.topContentHeight = GestureScreenLayout.DEFAULT_TOP_CONTENT_HEIGHT;
  this.bottomContentHeight = GestureScreenLayout.DEFAULT_BOTTOM_CONTENT_HEIGHT;
}

GestureScreenLayout.DEFAULT_TOP_CONTENT_HEIGHT = 80;
GestureScreenLayout.DEFAULT_BOTTOM_CONTENT_HEIGHT = 30;
GestureScreenLayout.MIN_RADIUS = 30;
GestureScreenLayout.MAX_RADIUS = 60;
GestureScreenLayout.MAX_TOP_WHITE = 30;
GestureScreenLayout.MAX_BOTTOM_WHITE = 30;
GestureScreenLayout.MIN_WHITE = 10;
GestureScreenLayout.DEFAULT_INDICATOR_WIDTH = 10;
GestureScreenLayout.DEFAULT_INNER_RADIUS = 10;

function toInt(num) {
  return (num + 0.5) | 0;
}

GestureScreenLayout.prototype = {
  calcWhite: function() {
    var contentHeight = this.calcContent().height,
      whiteSize = (this.height - contentHeight - this.topContentHeight - this.bottomContentHeight) / 2;
    return (whiteSize + 0.5) | 0;
  },

  calc: function() {
    var white = this.calcWhite(),//头部和底部的空隙
      topContentHeight = this.topContentHeight,
      content = this.calcContent(),//内容区的实体类信息
      contentHeight = content.height,//内容区的高度
      topContentStartY = white,//头部空隙
      contentStartY = white + this.topContentHeight,//内容区的开始高度
      bottomContentStartY = contentStartY + contentHeight + white / 2,//底部内容区的高度
      bottomContentHeight = this.bottomContentHeight,//底部内容区的高度
      radius = content.radius,//节点的半径
      gap = content.white,//节点间的空隙
      topWhite = content.topWhite,//中间内容区的顶部空白
      leftWhite = content.leftWhite,//内容区左部的空白
      bottomWhiteBottomStartY = this.height - bottomContentStartY - bottomContentHeight;
    return {
      top: {
        white: {
          startY: 0,
          topHeight: toInt(topContentStartY)
        },
        content: {
          startY: toInt(topContentStartY),
          height: toInt(topContentHeight)
        }
      },
      content: {
        startY: toInt(contentStartY),
        startX: toInt(leftWhite),
        height: toInt(contentHeight),
        width: toInt(this.width - 2 * leftWhite),
        radius: toInt(radius),
        gap: toInt(gap),
        topWhite: toInt(topWhite),
        scale: 30 / radius
      },
      bottom: {
        whiteTop: {
          startY: toInt(contentStartY + contentHeight),
          height: toInt(white/2)
        },
        content: {
          startY: toInt(bottomContentStartY),
          height: toInt(bottomContentHeight)
        },
        whiteBottom: {
          startY: toInt(bottomWhiteBottomStartY),
          height: toInt(white/2)
        }
      }
    };
  },

  calcContent: function() {
    var contentMaxHeight = this.height - this.topContentHeight - this.bottomContentHeight;
    var width = Math.min(this.width, contentMaxHeight);
    var avgRadius = width / 10;
    var radius, avgWhite, height = width, white, topWhite, bottomWhite, leftAndRigthWhite, leftWhite;
    if (avgRadius < GestureScreenLayout.MIN_RADIUS) {
      radius = GestureScreenLayout.MIN_RADIUS;
      avgWhite = (height - radius * 6) / 4;
      white = Math.max(avgWhite, GestureScreenLayout.MIN_WHITE);
      radius = (height - white * 4) / 6 - 4;
    } else if (avgRadius > GestureScreenLayout.MAX_RADIUS) {
      radius = GestureScreenLayout.MAX_RADIUS -4;
      avgWhite = (height - radius * 6) / 4;
      white = Math.max(avgWhite, GestureScreenLayout.MIN_WHITE);
    } else {
      radius = avgRadius - 4;
      white = radius;
    }

    topWhite = Math.min(white, GestureScreenLayout.MAX_TOP_WHITE);
    bottomWhite = Math.min(white, GestureScreenLayout.MAX_BOTTOM_WHITE);
    height = width - (white - topWhite) * 2;
    leftAndRigthWhite = this.width - 4 * white - 6 * radius;
    leftWhite = leftAndRigthWhite / 2;
    return {
      height: height,
      radius: Math.round(radius),
      white: white,
      topWhite: topWhite,
      bottomWhite: bottomWhite,
      leftWhite: leftWhite
    };
  }
};

module.factory('GestureScreenLayout', function() {
  return GestureScreenLayout;
});

module.exports = GestureScreenLayout;