main.js 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277
  1. import $ from 'jquery';
  2. import Vue from 'vue';
  3. import HiydSdk from 'extSdk';
  4. // import Vuex from 'vuex';
  5. import App from './components/app.vue';
  6. import lib from 'lib';
  7. import BDY from 'BDY';
  8. // import NProgress from './depend/nprogress/nprogress';
  9. // import User from './store/user';
  10. // Vue.use(Vuex);
  11. // const store = new Vuex.Store({
  12. // mutations: {},
  13. // actions: {},
  14. // getters: {},
  15. // modules: {
  16. // }
  17. // })
  18. Vue.component('loading', resolve => require(['./components/loading.vue'], resolve));
  19. Vue.component('share-moment',resolve => require(['./page/share/moment.vue'], resolve))
  20. Vue.component('share-video',resolve => require(['./page/share/video.vue'], resolve))
  21. Vue.component('download-index',resolve => require(['./page/download/index.vue'], resolve))
  22. Vue.component('download-index2',resolve => require(['./page/download/index2.vue'], resolve))
  23. var pages = {};
  24. var oldPage;
  25. var VM = new Vue({
  26. // store,
  27. el: "#app",
  28. data: {
  29. currentView: "",
  30. isForward: true,
  31. isInit: true,
  32. transitionName: "fade"
  33. },
  34. computed: {
  35. transitionMode () {
  36. return this.isForward ? "out-int" : "in-out";
  37. }
  38. },
  39. mounted() {
  40. var _self = this;
  41. var page = lib.getParam("page") || "share-moment";
  42. lib.setParam("page", page);
  43. _self._redirectPage(page);
  44. // 点击事件
  45. $('body').off(BDY.click + ".data-href").on(BDY.click + ".data-href", '[data-href]', function () {
  46. var $this = $(this);
  47. var href = $this.attr('data-href') || $this.attr('href');
  48. var clientParam = $this.attr('data-client');
  49. if (clientParam != null) {
  50. var title = $this.attr('data-title');
  51. _self.redirectClient(href, clientParam, title);
  52. } else {
  53. _self.redirect(href);
  54. }
  55. return false;
  56. });
  57. $('body').off(BDY.click + ".data-url").on(BDY.click + ".data-url", '[data-url]', function () {
  58. var $this = $(this);
  59. var href = $this.attr('data-url');
  60. if (window.Hiyd) {
  61. if (href.indexOf('http') !== 0) {
  62. href = location.protocol + '//' + location.host + href;
  63. }
  64. var title = $this.attr('data-title');
  65. HiydSdk.openUrl(href, title, true);
  66. } else {
  67. location.href = href;
  68. }
  69. return false;
  70. });
  71. window.onpopstate = function (event) {
  72. // 支持onpopstate
  73. var count = 0;
  74. for (var page in pages) {
  75. if (count++ > 1) {
  76. break;
  77. };
  78. }
  79. // 防止首次进入就触发onpopstate导致再次刷新
  80. if (count > 1) {
  81. var newPage = lib.getParam('page') || 'share-moment';
  82. _self._redirectPage(newPage);
  83. }
  84. }
  85. initActiveEvent();
  86. },
  87. methods: {
  88. afterEnter: function () {
  89. if (VM.isForward) {
  90. scrollTo(0, 0);
  91. } else {
  92. var scrollTop = pages[lib.getParam("page")]['scrollTop'] || 0;
  93. scrollTo(0, scrollTop);
  94. }
  95. VM.isForward = false;
  96. // NProgress.done();
  97. },
  98. _redirectPage(_page) {
  99. var _self = this;
  100. /** 当前页面不重复请求 */
  101. if (_self.currentView == _page) {
  102. return;
  103. }
  104. pages[_page] = pages[_page] || {};
  105. // NProgress.start();
  106. if (oldPage) {
  107. pages[oldPage] = pages[oldPage] || {};
  108. //保存滚动条位置$pageswarp
  109. // pages[oldPage]['scrollTop'] = document.body.scrollTop;
  110. //console.log("oldPage:" + oldPage + ", scrollTop:" + pages[oldPage]['scrollTop']);
  111. // pages[oldPage]['height'] = $pageswarp.height();
  112. lib.clearRes();
  113. }
  114. _self.currentView = _page;
  115. $(document).trigger(BDY.pageChange, _page);
  116. oldPage = _page;
  117. },
  118. redirect(param) {
  119. this._redirect(param, true);
  120. },
  121. _redirect(param, causeHistory) {
  122. oldPage = this.currentView;
  123. pages[oldPage] = pages[oldPage] || {};
  124. pages[oldPage]['scrollTop'] = _getScrollTop();
  125. var values = lib.parseHash(param);
  126. this.isForward = true;
  127. lib.setParam(values, causeHistory);
  128. // 这里需要自己渲染
  129. this._redirectPage(values['page']);
  130. },
  131. redirect2(param) {
  132. var oldUrl = document.location.href;
  133. this._redirect(param, false);
  134. if (oldUrl != document.location.href) {
  135. var newPage = lib.getParam('page') || 'share-moment';
  136. this._redirectPage(newPage);
  137. }
  138. },
  139. redirectClient(param, clientParam, title) {
  140. var _self = this;
  141. oldPage = this.currentView;
  142. var values = lib.parseHash(param);
  143. if (window.Hiyd) {
  144. var search = document.location.search;
  145. search = lib.setParam2(values, search);
  146. if (clientParam) {
  147. values = lib.parseHash(clientParam);
  148. search = lib.setParam2(values, search);
  149. }
  150. HiydSdk.openUrl(location.origin + location.pathname + search, title, true);
  151. } else {
  152. _self.redirect(param);
  153. }
  154. },
  155. historyBack() {
  156. var curPage = this.currentView;
  157. pages[curPage] = pages[curPage] || {};
  158. pages[curPage]['scrollTop'] = 0;
  159. if (!HiydSdk.historyBack()) {
  160. history.back();
  161. }
  162. }
  163. }
  164. })
  165. function initActiveEvent() {
  166. var selector = "input[type='submit'], [data-active]";
  167. var $elem, $activeElem;
  168. var timeHandler = 0;
  169. var LONG_TAP_TIME = 500;
  170. $(document).off(BDY.touchstart + ".body").on(BDY.touchstart + ".body", function (e) {
  171. $elem = $(e.target);
  172. $activeElem = $elem;
  173. if (!$activeElem.filter(selector).length) {
  174. $activeElem = $activeElem.parents(selector);
  175. }
  176. var activeStyle = $activeElem.attr("data-active") || "active";
  177. $activeElem.addClass(activeStyle);
  178. timeHandler = lib.setTimeout(function () {
  179. $elem && $elem.trigger('longTap');
  180. _removeActive();
  181. }, LONG_TAP_TIME);
  182. });
  183. $(document).off("touchmove.body, scroll.body").on("touchmove.body, scroll.body", function (event) {
  184. clearTimeout(timeHandler);
  185. timeHandler = 0;
  186. _removeActive();
  187. $elem = null;
  188. });
  189. $(document).off("mouseout.body").on("mouseout.body", selector, function (event) {
  190. _removeActive();
  191. $elem = null;
  192. });
  193. window.onResume = document.createEvent('Event');
  194. window.onResume.initEvent('onResume', true, true);
  195. $(document).on('onResume', function () {
  196. console.log('onResume');
  197. });
  198. var lastTime = 0;
  199. $(document).off(BDY.touchend + ".body").on(BDY.touchend + ".body", function (e) {
  200. clearTimeout(timeHandler);
  201. timeHandler = 0;
  202. if ($elem) {
  203. var currentTime = (new Date()).getTime();
  204. var duration = currentTime - lastTime;
  205. var MIN_TRIGGER_INTERVAL = 300;
  206. if (duration > MIN_TRIGGER_INTERVAL) {
  207. $elem.trigger('touchclick');
  208. // 记录当前时间
  209. lastTime = currentTime;
  210. }
  211. }
  212. _removeActive();
  213. });
  214. function _removeActive() {
  215. if ($activeElem != null) {
  216. var activeStyle = $activeElem.attr("data-active") || "active";
  217. $activeElem.blur();
  218. $activeElem.removeClass(activeStyle);
  219. $activeElem = null;
  220. }
  221. $elem = null;
  222. }
  223. ['longTap', 'touchclick'].forEach(function (m) {
  224. $.fn[m] = function (callback) {
  225. return this.on(m, callback);
  226. };
  227. });
  228. }
  229. function _getScrollTop() {
  230. return document.documentElement.scrollTop || document.body && document.body.scrollTop;
  231. }