Added a modal mockup.

cfd1f3fa · bbaer · f7332d04 · cfd1f3fa
Commit cfd1f3fa authored Apr 20, 2017 by bbaer
--- a/mockup/modal.html
+++ b/mockup/modal.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
+    <link rel="stylesheet" href="../css/bootstrap.min.css">
+    <link rel="stylesheet" href="../css/bootstrap-theme.min.css">
+    <link rel="stylesheet" href="../css/jqx.base.css">
+    <link rel="stylesheet" href="../css/jqx.bootstrap.css">
+    <link rel="stylesheet" href="../css/qfq-bs.css">
+    <title>Input Mode Switcher</title>
+
+
+</head>
+<body>
+<div class="container">
+    <div class="row">
+        <div class="col-md-10 ">
+            <div class="btn-toolbar pull-right" role="toolbar">
+                <div class="btn-group" role="group">
+                    <button id="save-button" type="button" class="btn btn-default navbar-btn"><span
+                            class="glyphicon glyphicon-ok"></span></button>
+                    <button id="close-button" type="button" class="btn btn-default navbar-btn"><span
+                            class="glyphicon glyphicon-remove"></span></button>
+                </div>
+                <div class="btn-group" role="group">
+                    <button id="delete-button" type="button" class="btn btn-default navbar-btn"><span
+                            class="glyphicon glyphicon-trash"></span></button>
+                </div>
+                <div class="btn-group" role="group">
+                    <a id="form-new-button" href="personmock.html?s=badcaffe1" class="btn btn-default navbar-btn"><span
+                            class="glyphicon glyphicon-plus"></span></a>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Button trigger modal -->
+    <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" data-backdrop="static">
+        Launch demo modal
+    </button>
+
+    <!-- Modal -->
+    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+        <div class="modal-dialog" role="document">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h4 class="modal-title" id="myModalLabel">Loading Document</h4>
+                </div>
+                <div class="modal-body" style="text-align: center;">
+                    <span class="glyphicon glyphicon-cog glyphicon-spin text-large-with-margin text-primary"></span>
+                    <p>PDF Document is being generated. Please wait.</p>
+                </div>
+                <div class="modal-footer">
+                    <p>In Progress..</p>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</div>
+
+<script src="../js/jquery.min.js"></script>
+<script src="../js/bootstrap.min.js"></script>
+<script src="../js/validator.min.js"></script>
+<script src="../js/jqx-all.js"></script>
+<script src="../js/EventEmitter.min.js"></script>
+<script src="../js/qfq.debug.js"></script>
+<script type="text/javascript">
+    $(function () {
+        var qfqPage = new QfqNS.QfqPage({
+            tabsId: 'myTabs',
+            formId: 'myForm',
+            submitTo: 'api/' + $("#submitTo").val(),
+            deleteUrl: 'api/' + $("#deleteUrl").val(),
+            fileUploadTo: 'api/' + $("#uploadTo").val(),
+            fileDeleteUrl: 'api/' + $("#fileDeleteUrl").val(),
+        });
+
+        QfqNS.Log.level = 0;
+
+    });
+</script>
+</body>
+</html>
\ No newline at end of file