engine.ejs 2.52 KB
<html>

<head>
  <meta charset="UTF-8">
  <title>work.html</title>
  <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
  <meta content="yes" name="apple-mobile-web-app-capable">
  <meta content="black" name="apple-mobile-web-app-status-bar-style">
  <meta content="telephone=no" name="format-detection">
  <meta content="email=no" name="format-detection">
  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
  <script type="text/javascript" src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/flexible.js"></script>
  <!-- <link rel="stylesheet" href="/be-static/be-static-luban-h5/engine/engine.css"> -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/css/swiper.min.css">
  <link rel="stylesheet" href="https://meyerweb.com/eric/tools/css/reset/reset.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/js/swiper.min.js"></script>
  <script>window.__work = <%- JSON.stringify(work) %></script>
  <script src="/engine-assets/engine.js"></script>
  <style>
    * {
      outline: none;
    }
    .swiper-container {
      width: 100%;
      height: 100vh;
    }
  </style>
</head>

<body>
  <div id="app">
    <button class="swiper-button-next" style="position: fixed;left: 1000px">Next</button>
    <button class="swiper-button-prev" style="position: fixed;left: 1000px">Prev</button>
    <engine />
  </div>
  <script>
    // Vue.component('engine', window.Engine)
    new Vue({
      el: '#app',
      data: {
        message: 'Hello Vue!'
      },
      // render: function (h) {
      //   return (<engine />)
      // }
    });
  </script>
  <script>
    var mySwiper = new Swiper('.swiper-container', {
      // Optional parameters
      direction: 'vertical',
      loop: false,
      // If we need pagination
      pagination: {
        el: '.swiper-pagination',
      },
      // Navigation arrows
      navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev',
      },
      // And if we need scrollbar
      scrollbar: {
        el: '.swiper-scrollbar',
      },
    });

    function displayMessage ({ origin, data }) {
      if (data && origin === "http://localhost:8080") {
        document.querySelector(`.swiper-button-${data}`).click()
      }
    }

    if (window.addEventListener) {
      window.addEventListener("message", displayMessage, false);
    } else {
      window.attachEvent("onmessage", displayMessage);
    }
  </script>
  <!-- build:js scripts/vendor.js -->
  <!-- endbuild -->
</body>

</html>