From eef2aff22fbdf6a57c215a4653f82a09233a98c4 Mon Sep 17 00:00:00 2001
From: MinRK <benjaminrk@gmail.com>
Date: Mon, 15 Sep 2014 01:44:32 -0700
Subject: [PATCH] simplify dialog HTML with template macros

---
 share/jupyter/templates/admin.html | 82 +++++++-----------------------
 share/jupyter/templates/page.html  | 21 ++++++++
 2 files changed, 38 insertions(+), 65 deletions(-)

diff --git a/share/jupyter/templates/admin.html b/share/jupyter/templates/admin.html
index 3a8cd30e..52dcb2a2 100644
--- a/share/jupyter/templates/admin.html
+++ b/share/jupyter/templates/admin.html
@@ -36,75 +36,27 @@
   </table>
 </div>
 
+{% call modal('Delete User', btn_class='btn-danger delete-button') %}
+  Are you sure you want to delete user <span class="delete-username">USER</span>?
+  This operation cannot be undone.
+{% endcall %}
 
-<div class="modal fade" id="edit-user-dialog" tabindex="-1" role="dialog" aria-labelledby="edit-user-label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
-        <h4 class="modal-title" id="edit-user-label">Edit User</h4>
-      </div>
-      <div class="modal-body">
-        <div class="form-group">
-          <input type="text" class="form-control username-input" placeholder="username">
-        </div>
-        <div class="checkbox">
-          <label>
-            <input type="checkbox" class="admin-checkbox">Admin
-          </label>
-        </div>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-        <button type="button" class="btn btn-primary save-button" data-dismiss="modal">Save changes</button>
-      </div>
-    </div>
-  </div>
+{% macro user_modal(name) %}
+{% call modal(name, btn_class='btn-primary save-button') %}
+<div class="form-group">
+  <input type="text" class="form-control username-input" placeholder="username">
 </div>
+<div class="checkbox">
+  <label>
+    <input type="checkbox" class="admin-checkbox">Admin
+  </label>
+</div>
+{% endcall %}
+{% endmacro %}
 
-<div class="modal fade" id="delete-user-dialog" tabindex="-1" role="dialog" aria-labelledby="delete-user-label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
-        <h4 class="modal-title" id="delete-user-label">Delete User</h4>
-      </div>
-      <div class="modal-body">
-        Are you sure you want to delete user <span class="delete-username">USER</span>?
-        This operation cannot be undone.
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
-          <button type="button" class="btn btn-danger delete-button" data-dismiss="modal">Delete User</button>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
+{{ user_modal('Edit User') }}
 
-<div class="modal fade" id="add-user-dialog" tabindex="-1" role="dialog" aria-labelledby="add-user-label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
-        <h4 class="modal-title" id="add-user-label">Add User</h4>
-      </div>
-      <div class="modal-body">
-        <div class="form-group">
-          <input type="text" class="form-control username-input" placeholder="username">
-        </div>
-        <div class="checkbox">
-          <label>
-            <input type="checkbox" class="admin-checkbox">Admin
-          </label>
-        </div>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-        <button type="button" class="btn btn-primary save-button" data-dismiss="modal">Save changes</button>
-      </div>
-    </div>
-  </div>
-</div>
+{{ user_modal('Add User') }}
 
 {% endblock %}
 
diff --git a/share/jupyter/templates/page.html b/share/jupyter/templates/page.html
index f568182b..8926f5ba 100644
--- a/share/jupyter/templates/page.html
+++ b/share/jupyter/templates/page.html
@@ -1,3 +1,24 @@
+{% macro modal(title, btn_label=None, btn_class="btn-primary") %}
+{% set key = title.replace(' ', '-').lower() %}
+{% set btn_label = btn_label or title %}
+<div class="modal fade" id="{{key}}-dialog" tabindex="-1" role="dialog" aria-labelledby="{{key}}-label" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
+        <h4 class="modal-title" id="{{key}}-label">{{title}}</h4>
+      </div>
+      <div class="modal-body">
+        {{ caller() }}
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+        <button type="button" class="btn {{btn_class}}" data-dismiss="modal" data-dismiss="modal">{{btn_label}}</button>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %}
 <!DOCTYPE HTML>
 <html>