|
@@ -0,0 +1,158 @@
|
|
|
+<html xmlns:th="http://www.thymeleaf.org">
|
|
|
+ <head>
|
|
|
+ <title>SecureMail</title>
|
|
|
+ <link rel="icon" type="image/x-icon" th:href="@{/resources/img/favicon.ico}"/>
|
|
|
+ <link th:href="@{/resources/css/bootstrap.css}" rel="stylesheet"></link>
|
|
|
+ <style type="text/css">
|
|
|
+ /* Sticky footer styles
|
|
|
+ -------------------------------------------------- */
|
|
|
+
|
|
|
+ html,
|
|
|
+ body {
|
|
|
+ height: 100%;
|
|
|
+ /* The html and body elements cannot have any padding or margin. */
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Wrapper for page content to push down footer */
|
|
|
+ #wrap {
|
|
|
+ min-height: 100%;
|
|
|
+ height: auto !important;
|
|
|
+ height: 100%;
|
|
|
+ /* Negative indent footer by it's height */
|
|
|
+ margin: 0 auto -60px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Set the fixed height of the footer here */
|
|
|
+ #push,
|
|
|
+ #footer {
|
|
|
+ height: 60px;
|
|
|
+ }
|
|
|
+ #footer {
|
|
|
+ background-color: #f5f5f5;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Lastly, apply responsive CSS fixes as necessary */
|
|
|
+ @media (max-width: 767px) {
|
|
|
+ #footer {
|
|
|
+ margin-left: -20px;
|
|
|
+ margin-right: -20px;
|
|
|
+ padding-left: 20px;
|
|
|
+ padding-right: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ /* Custom page CSS
|
|
|
+ -------------------------------------------------- */
|
|
|
+ /* Not required for template or sticky footer method. */
|
|
|
+
|
|
|
+ .container {
|
|
|
+ width: auto;
|
|
|
+ max-width: 680px;
|
|
|
+ }
|
|
|
+ .container .credit {
|
|
|
+ margin: 20px 0;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ a {
|
|
|
+ color: green;
|
|
|
+ }
|
|
|
+ .navbar-form {
|
|
|
+ margin-left: 1em;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+ <link th:href="@{/resources/css/bootstrap-responsive.css}" rel="stylesheet"></link>
|
|
|
+
|
|
|
+ <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
|
|
|
+ <!--[if lt IE 9]>
|
|
|
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
|
|
+ <![endif]-->
|
|
|
+ <meta name="_csrf" th:content="${_csrf.token}"/>
|
|
|
+ <meta name="_csrf_header" th:content="${_csrf.headerName}"/>
|
|
|
+ </head>
|
|
|
+
|
|
|
+
|
|
|
+ <body>
|
|
|
+ <div id="wrap">
|
|
|
+ <div class="navbar navbar-inverse navbar-static-top">
|
|
|
+ <div class="navbar-inner">
|
|
|
+ <div class="container">
|
|
|
+ <a class="brand" th:href="@{/}"><img th:src="@{/resources/img/logo.png}" alt="Spring Security Sample"/></a>
|
|
|
+ <div class="nav-collapse collapse">
|
|
|
+ <div th:if="${#httpServletRequest.remoteUser != null}">
|
|
|
+ <form class="navbar-form pull-right" th:action="@{/logout}" method="post">
|
|
|
+ <input type="submit" value="Log out" />
|
|
|
+ </form>
|
|
|
+ <p class="navbar-text pull-right" th:text="${#httpServletRequest.remoteUser}">
|
|
|
+ sample_user
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <ul class="nav">
|
|
|
+ <li><a data-bind="click: $root.goToInbox" th:href="@{/}">Inbox</a></li>
|
|
|
+ <li><a data-bind="click: $root.goToCompose" th:href="@{/(form)}">Compose</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Begin page content -->
|
|
|
+ <div class="container">
|
|
|
+ <div data-bind="with: inbox">
|
|
|
+ <h1>Inbox</h1>
|
|
|
+ <table class="table">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th>Created</th>
|
|
|
+ <th>Summary</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody data-bind="foreach: $root.messages">
|
|
|
+ <tr data-bind="click: $root.goToMessage">
|
|
|
+ <td data-bind="text: created"></td>
|
|
|
+ <td><a data-bind="text: summary, attr: { href: id}"></a></td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="container" data-bind="with: chosenMessageData">
|
|
|
+ <h1>Message : <span data-bind="text: summary"></span></h1>
|
|
|
+ <dl>
|
|
|
+ <dt>Created</dt>
|
|
|
+ <dd data-bind="text: created"></dd>
|
|
|
+ <dt>Message</dt>
|
|
|
+ <dd data-bind="html: text"></dd>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="container" data-bind="with: compose">
|
|
|
+ <h1>Messages : Create</h1>
|
|
|
+ <div class="alert alert-error" data-bind="foreach: $root.errors, visible: $root.errors().length">
|
|
|
+ <p data-bind="text: $data"></p>
|
|
|
+ </div>
|
|
|
+ <form action="./" method="post">
|
|
|
+ <label for="summary">Summary</label>
|
|
|
+ <input type="text" id="summary" data-bind="value: summary" name="summary" class="input-xxlarge" />
|
|
|
+ <label for="text">Message</label>
|
|
|
+ <textarea name="text" id="text" data-bind="value: text" class="input-xxlarge"><!-- --></textarea>
|
|
|
+ <div class="form-actions">
|
|
|
+ <input type="button" data-bind="click: $root.save" value="Create" />
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div id="push"><!-- --></div>
|
|
|
+ </div>
|
|
|
+ <div id="footer">
|
|
|
+ <div class="container">
|
|
|
+ <p class="muted credit">Visit the <a href="#">Spring Security</a> site for more <a href="#">samples</a>.</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <script type="text/javascript" th:src="@{/resources/js/jquery-1.8.3.js}"><!-- --></script>
|
|
|
+ <script type="text/javascript" th:src="@{/resources/js/knockout-2.3.0.js}"><!-- --></script>
|
|
|
+ <script type="text/javascript" th:src="@{/resources/js/message.js}"><!-- --></script>
|
|
|
+ </body>
|
|
|
+</html>
|