Ionic modal sample with remote

diagram.html

<ion-view title="Diagram" hide-back-button="true">
  <ion-content class="diagram">
    <div class="padding">
      <div class="card">
        <div class="item-diagram item-begin">
          <div class="diagram-thumbnail"> <img src="img/diagram/img-step-1.png" alt=""> </div>
          <div class="diagram-content">
            <div class="arrow-verticle"></div>
            <div class="shape-content"> Bắt đầu quy trình <br>đánh số hợp đồng </div>
          </div>
        </div>
        <div class="item-diagram">
          <div class="diagram-thumbnail"> <img src="img/diagram/img-step-2.png" alt=""> </div>
          <div class="diagram-content">
            <div class="arrow-verticle"></div>
            <div class="shape-content">
              Sales cần chuẩn bị các thông tin để soạn hợp đồng trước khi gửi BP đánh số.
              <div><button class="button-diagram" ng-click="openModal(0)">Xem chi tiết</button></div>
            </div>
          </div>
        </div>
        <div class="item-diagram">
          <div class="diagram-thumbnail"> <img src="img/diagram/img-step-3.png" alt=""> </div>
          <div class="diagram-content">
            <div class="arrow-verticle"></div>
            <div class="shape-content"> Sales gửi yêu cầu đánh số cho bộ phận đánh số </div>
          </div>
        </div>
        <div class="item-diagram item-decision">
          <div class="diagram-thumbnail"> <img src="img/diagram/img-step-4.png" alt=""> </div>
          <div class="diagram-content">
            <div class="arrow-verticle"></div>
            <div class="shape-content">
              <div class="content-inner">
                Bộ phận đánh số <br>kiểm tra thông tin
                <div><button class="button-diagram btn-red" ng-click="openModal(1)">No</button></div>
              </div>
            </div>
          </div>
        </div>
        <div class="item-diagram">
          <div class="diagram-thumbnail"> <img src="img/diagram/img-step-5.png" alt=""> </div>
          <div class="diagram-content">
            <div class="arrow-verticle"></div>
            <div class="shape-content"> Theo đúng chính sách, quy định thì sau 40 phút, bộ phận đánh số sẽ gửi lại số hợp đồng cho sales </div>
          </div>
        </div>
        <div class="item-diagram item-end">
          <div class="diagram-thumbnail"> <img src="img/diagram/img-step-6.png" alt=""> </div>
          <div class="diagram-content">
            <div class="arrow-verticle"></div>
            <div class="shape-content"> KẾT THÚC QUY TRÌNH <br>ĐÁNH SỐ HỢP ĐỒNG </div>
          </div>
        </div>
      </div>
    </div>
  </ion-content>
</ion-view>
<script><div class="modal diagram-modal"> <header class="bar bar-header bar-energized"> <h1 class="title">Filter Modal</h1> <div class="button button-clear" ng-click="closeModal(0)"><span class="icon ion-ios-close-empty"></span></div><button class="button button-clear text-uppercase" ng-click="closeModal(0)">Save</button> </header> <ion-content class="has-header"> <div class="padding"> <div class="card"> <li class="item item-icon-right"> <p>Video 1</p><p><video width="100%" height="100%" controls="controls" preload="metadata" webkit-playsinline="webkit-playsinline" class="videoPlayer"><source src="http://e-learning.admicro.vn/wp-content/uploads/2016/05/quytrinhdanhsohopdong.mp4" type="video/mp4"/></video></p></li></div></div></ion-content></div></script><script><div class="modal diagram-modal"> <header class="bar bar-header bar-energized"> <h1 class="title">Filter Modal</h1> <div class="button button-clear" ng-click="closeModal(1)"><span class="icon ion-ios-close-empty"></span></div><button class="button button-clear text-uppercase" ng-click="closeModal(1)">Save</button> </header> <ion-content class="has-header"> <div class="padding"> <div class="card"> <li class="item item-icon-right"> <p>Video</p><p><video width="100%" height="100%" controls="controls" preload="metadata" webkit-playsinline="webkit-playsinline" class="videoPlayer"><source src="http://e-learning.admicro.vn/wp-content/uploads/2016/05/quytrinhdanhsohopdong.mp4" type="video/mp4"/></video></p></li></div></div></ion-content></div></script>