doc/themes/weex/layout/index.ejs

<script>
  ;(function(){
    var currentOrigin = location.origin || 'https://weex-project.io',
        currentPathname = location.pathname,
        currentLang = navigator.language || navigator.browserLanguage || 'en',
        selectedLang = '';

    if (window.localStorage) {
      selectedLang = window.localStorage.getItem('lang')
      currentLang = selectedLang ? selectedLang : currentLang
    }

    if (/zh|cn/i.test(currentLang)) { // Chinese
      if (currentPathname.indexOf('/cn/') != 0) {
        location.href = currentOrigin + '/cn/'
      }
    } else if (/en/i.test(currentLang)) { // English
      if (!/^\/$|^\/index/.test(currentPathname)) {
        location.href = currentOrigin
      }
    } else { // Other
      if (!/^\/$|^\/index/.test(currentPathname)) {
        location.href = currentOrigin
      }
    }
  })();
</script>
<div class="scene header" style="background: #00BDFF;">
  <div class="scene-container">
    <div class="galaxy left">
      <canvas width="560" height="560" id="left-canvas"></canvas>
    </div>
    <div class="galaxy right">
      <canvas width="500" height="500" id="right-canvas"></canvas>
    </div>
    <%- partial('_partial/slider') %>
  </div>
</div>
<div class="scene edge overlength horizon">
  <div class="scene-container">
    <div class="textbox">
      <h2><%= _p('index.edge.title') %></h2>
    </div>
    <div class="sketch-content">
      <div class="inner-box">
        <img src="//gw.alicdn.com/tps/TB17ga7PXXXXXbnXXXXXXXXXXXX-120-121.svg" alt="Lightweight">
        <h3><%= _p('index.edge.edge1.title') %></h3>
        <span class="underline"></span>
        <p><%= _p('index.edge.edge1.content') %></p>
      </div>
      <div class="inner-box">
        <img src="//gw.alicdn.com/tps/TB1BGSCPXXXXXb1aXXXXXXXXXXX-79-79.svg" alt="Extendable">
        <h3><%= _p('index.edge.edge2.title') %></h3>
        <span class="underline"></span>
        <p><%= _p('index.edge.edge2.content') %></p>
      </div>
      <div class="inner-box">
        <img src="//img.alicdn.com/tps/TB1uMC9PXXXXXaFXXXXXXXXXXXX-80-69.svg" alt="High Performance">
        <h3><%= _p('index.edge.edge3.title') %></h3>
        <span class="underline"></span>
        <p><%= _p('index.edge.edge3.content') %></p>
      </div>
    </div>
  </div>
</div>

<div class="scene feature">
  <div class="scene-container">
    <div class="feature-content">
      <div class="left-text">
        <h2><%= _p('index.feature.title') %></h2>
        <p><%= _p('index.feature.content') %></p>
      </div>
      <div class="right-box">
        <div class="imgbox phone-layer level1">
        </div>
        <div class="imgbox phone-layer level2">
        </div>
        <div class="imgbox phone-layer level3">
        </div>
        <div class="imgbox phone-layer level4">
        </div>
      </div>
    </div>
  </div>
</div>

<div class="scene cross-platform horizon">
  <div class="scene-container">
    <div class="textbox">
      <h2><%= _p('index.cross_platform.title') %></h2>
      <p><%= _p('index.cross_platform.content') %></p>
    </div>
    <div class="sketch-content">
      <div class="inner-box imgbox ios"></div>
      <div class="inner-box imgbox android"></div>
      <div class="inner-box imgbox h5"></div>
    </div>
  </div>
</div>

<div class="scene supporting-vue horizon">
  <div class="scene-container">
    <div class="textbox">
      <h2><%= _p('index.vue.title') %></h2>
      <p><%= _p('index.vue.content') %></p>
    </div>
    <div class="sketch-content imgbox">
      <div class="imgbox"></div>
    </div>
  </div>
</div>

<div class="scene schematic horizon">
  <div class="scene-container">
    <div class="textbox">
      <h2><%= _p('index.schematic.title') %></h2>
      <p><%= _p('index.schematic.content') %></p>
    </div>
    <div class="sketch-content imgbox">
    </div>
  </div>
</div>

<div class="scene users horizon overlength">
  <div class="scene-container">
    <div class="textbox">
      <h2><%= _p('index.users.title') %></h2>
    </div>
    <div class="sketch-content">
      <div class="user-logo tmall-logo">
        <h3><%= _p('index.users.tmall.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.tmall.title') %></h4>
          <p><%= _p('index.users.tmall.content') %></p>
        </div>
      </div>
      <div class="user-logo aliyun-logo">
        <h3><%= _p('index.users.aliyun.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.aliyun.title') %></h4>
          <p><%= _p('index.users.aliyun.content') %></p>
        </div>
      </div>
      <div class="user-logo taobao-logo">
        <h3><%= _p('index.users.taobao.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.taobao.title') %></h4>
          <p><%= _p('index.users.taobao.content') %></p>
        </div>
      </div>
      <div class="user-logo ding-logo">
        <h3><%= _p('index.users.dingtalk.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.dingtalk.title') %></h4>
          <p><%= _p('index.users.dingtalk.content') %></p>
        </div>
      </div>
      <div class="user-logo alibaba-logo">
        <h3><%= _p('index.users.alibaba.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.alibaba.title') %></h4>
          <p><%= _p('index.users.alibaba.content') %></p>
        </div>
      </div>
      <div class="user-logo cainiao-logo">
        <h3><%= _p('index.users.cainiao.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.cainiao.title') %></h4>
          <p><%= _p('index.users.cainiao.content') %></p>
        </div>
      </div>
      <div class="user-logo xiami-logo">
        <h3><%= _p('index.users.xiami.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.xiami.title') %></h4>
          <p><%= _p('index.users.xiami.content') %></p>
        </div>
      </div>
      <div class="user-logo youku-logo">
        <h3><%= _p('index.users.youku.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.youku.title') %></h4>
          <p><%= _p('index.users.youku.content') %></p>
        </div>
      </div>
      <div class="user-logo taopiaopiao-logo">
        <h3><%= _p('index.users.taopiaopiao.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.taopiaopiao.title') %></h4>
          <p><%= _p('index.users.taopiaopiao.content') %></p>
        </div>
      </div>
      <div class="user-logo fliggy-logo">
        <h3><%= _p('index.users.fliggy.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.fliggy.title') %></h4>
          <p><%= _p('index.users.fliggy.content') %></p>
        </div>
      </div>
      <div class="user-logo juhuasuan-logo">
        <h3><%= _p('index.users.juhuasuan.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.juhuasuan.title') %></h4>
          <p><%= _p('index.users.juhuasuan.content') %></p>
        </div>
      </div>
      <div class="user-logo qianniu-logo">
        <h3><%= _p('index.users.qianniu.title') %></h3>
        <div class="user-info">
          <h4><%= _p('index.users.qianniu.title') %></h4>
          <p><%= _p('index.users.qianniu.content') %></p>
        </div>
      </div>
    </div>
    <!--<div class="more">
      <a class="more" href="">More</a>
    </div>-->
  </div>
</div>

<div class="scene feedback horizon overlength">
  <div class="scene-container">
    <div class="textbox">
      <h2><%= _p('index.feedback.title') %></h2>
    </div>
    <div class="sketch-content">
      <div class="user-feedback">
        <img class="avatar" src="//gw.alicdn.com/tps/TB1xHiYPXXXXXc8XpXXXXXXXXXX-130-130.jpg" alt="avatar">
        <p class="user-name"><%= _p('index.feedback.user1.name') %></p>
        <p class="user-title"><%= _p('index.feedback.user1.title') %></p>
        <p class="user-say"><%= _p('index.feedback.user1.content') %></p>
      </div>
      <div class="user-feedback">
        <img class="avatar" src="//gw.alicdn.com/tps/TB1e.CYPXXXXXcsXpXXXXXXXXXX-130-130.jpg" alt="avatar">
        <p class="user-name"><%= _p('index.feedback.user2.name') %></p>
        <p class="user-title"><%= _p('index.feedback.user2.title') %></p>
        <p class="user-say"><%= _p('index.feedback.user2.content') %></p>
      </div>
      <div class="user-feedback">
        <img class="avatar" src="//gw.alicdn.com/tps/TB15MOQPXXXXXbCXFXXXXXXXXXX-130-130.jpg" alt="avatar">
        <p class="user-name"><%= _p('index.feedback.user3.name') %></p>
        <p class="user-title"><%= _p('index.feedback.user3.title') %></p>
        <p class="user-say"><%= _p('index.feedback.user3.content') %></p>
      </div>
    </div>
    <div class="go-2-doc">
      <a href="<%= url_for_lang('guide/index.html') %>" class="button get-started"><%= _p('index.get_started') %> →</a>
    </div>
  </div>
</div>
<a href="javascript:;" id="back2top" class="back2top"><span class="iconfont icon-arrow-small"></span></a>
<%- partial('_partial/footer') %>
<%- partial('_partial/after-footer') %>

<%- js('js/swiper.min') %>
<%- js('js/velocity.js') %>
<script>
var swiper = new Swiper('.swiper-container', {
  nextButton: '.swiper-button-next',
  prevButton: '.swiper-button-prev',
  slidesPerView: 1,
  spaceBetween: 30,
  loop: false,
  autoplay: false,
  autoplayDisableOnInteraction: false
});
</script>