js片段

// 判断iPhone系统版本是否大于7
var ver = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
if(parseInt(ver[1], 10)>7){
  $('html').addClass('ios-gt-8');
  return;
}

/* modal */

define(['./vendor/vendor.min', './wear'], function (a, wear) {
  var modal = function modal(opts) {
    var opts = opts || {};
    var defaultOpts = {
      title: '', // 标题
      content: '', // 内容 | html
      class: '', // 自定义弹框class
      effect: 'zoomIn', // 出现效果 (默认变大后变小)
      autoClose: false, // 是否自动关闭 (默认否)
      autoTime: 2000, // 自动关闭时间 （默认2s）
      blankClose: false, // 点击黑框关闭  (默认否)
      modalClose: false, // 是否显示关闭图标 (默认否)
      buttons: [{ text: '取消', onClick: function onClick() {} }, { text: '确定', onClick: function onClick() {} }]

    };
    for (var i in defaultOpts) {
      if (opts[i] === undefined) {
        opts[i] = defaultOpts[i];
      }
    }

    var _modalTemplateTempDiv = document.createElement('div');
    var modalHTML = '';
    var buttonHTML = '';

    if (opts.buttons) {
      for (var _i = 0; _i < opts.buttons.length; _i++) {
        buttonHTML += '<div class="modal-button">' + opts.buttons[_i].text + '</div>';
      }
    }
    var titleHTML = opts.title ? '<div class="modal-title hairline">' + opts.title + '</div>' : '';
    var textHTML = opts.content ? '<div class="modal-text">' + opts.content + '</div>' : '';
    var modalCloseHTML = opts.modalClose ? '<div class="modal-close"></div>' : '';
    var maskHTML = '<div class="modal-mask"></div>';
    modalHTML = '<div class="modal"><div class="modal-inner">' + (modalCloseHTML + titleHTML + textHTML) + '</div><div class="modal-buttons">' + buttonHTML + '</div></div>';
    _modalTemplateTempDiv.innerHTML = modalHTML;

    var modal = $(_modalTemplateTempDiv).children();

    $(document.body).append(modal[0]);
    if ($('.modal-mask').length === 0) {
      $(document.body).append(maskHTML);
    }
    modal.addClass(opts.class).show().css('marginTop', -($(modal).height() / 2)).hide();

    setTimeout(function () {
      modal.show().addClass(opts.effect);
    }, 10);
    // 固定
    wear.fixed();

    function closeModal() {
      $(modal || '.modal').remove();
      $('.modal-mask').remove();
      // 释放
      wear.loose();
    }

    $(modal).find('.modal-button').each(function (index, el) {
      $(el).on('click', function (event) {
        closeModal();
        if (opts.buttons[index].onClick) opts.buttons[index].onClick();
      });
    });

    // 自动关闭
    if (opts.autoClose) {
      setTimeout(function () {
        closeModal();
      }, opts.autoTime);
    }
    // 点击空白关闭
    if (opts.blankClose) {
      $('.mask').on('click', function (event) {
        event.preventDefault();
        /* Act on the event */
        closeModal();
      });
    }
    // 点击关闭按钮
    if (opts.modalClose) {
      $('.modal-close').on('click', function (event) {
        event.preventDefault();
        /* Act on the event */
        closeModal();
      });
    }
  };
  return {
    modal: modal
  };
});

/* toast */
define(['./vendor/vendor.min'], function () {
  var toast = function toast(msg) {
    var mask = $("<div class='mask-transparent'></div>").appendTo(document.body);
    var tempHTML = $('<div class="toast"><p>' + msg + '</p></div>');
    $('body').append(tempHTML);
    setTimeout(function () {
      tempHTML.remove();
      $('.mask-transparent').remove();
    }, 2000);
  };

  return toast;
});

// 移动端拖拽物体
var spaceWidth = document.documentElement.clientWidth - block.offsetWidth;
var spaceHeight = document.documentElement.clientHeight - block.offsetHeight;
function defaultEvent(e) {
  e.preventDefault();
}
var xx,yy,XX,YY;
block.addEventListener("touchstart", function(e){
  xx = e.targetTouches[0].screenX - block.offsetLeft;
  yy = e.targetTouches[0].screenY - block.offsetTop;
  document.addEventListener("touchmove", defaultEvent, false);
});
block.addEventListener("touchmove", function(e){
  XX = e.targetTouches[0].screenX - xx;
  YY = e.targetTouches[0].screenY - yy;
  if (XX < 0) {
    XX = 0;
  } else if(XX > spaceWidth){
    XX = spaceWidth;
  }
  if (YY < 0) {
    YY = 0;
  } else if(YY > spaceHeight){
    YY = spaceHeight;
  }
  block.style.left = XX + "px";
  block.style.top = YY + "px";
});
block.addEventListener("touchend", function() {
  if (XX < document.documentElement.clientWidth/2) {
    block.style.left = 0 + "px";
  }else if(XX > document.documentElement.clientWidth/2){
    block.style.left = spaceWidth + "px";
  }
  document.removeEventListener("touchmove", defaultEvent, false);
}, false);