Move persistent/ownerpass form in its own modal dialog

Accessible with a simple button in the conf menu

templates/default/join.html.ep

@@ -116,6 +116,11 @@
                         <span class="glyphicon glyphicon-leaf">
                         </span>
                       </label>
+                      <label class="btn btn-default help" id="persistentLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'MAKE_THIS_ROOM_PERSISTENT' %>">
+                        <input type="checkbox" id="persistentButton">
+                        <span class="glyphicon glyphicon-pushpin">
+                        </span>
+                      </label>
                     </div>
                   </div>
                 </center>
@@ -144,28 +149,6 @@
               <li class="divider">
               </li>
               <li>
-                <form class="navbar-form" id="ownerPassForm">
-                  <center>
-                    <p><%=l 'OWNER_PASSWORD_MAKES_PERSISTENT' %></p>
-                  </center>
-                  <div class="input-group">
-                    <input type="password" id="ownerPass" class="form-control help" placeholder="<%=l 'PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'OWNER_PASSWORD' %>"/>
-                    <span class="input-group-btn">
-                      <button id="setOwnerPassButton" type="submit" class="btn btn-default help disabled" data-toggle="tooltip" data-placement="bottom" title="<%=l 'OWNER_PASSWORD' %>">
-                        <span class="glyphicon glyphicon-ok">
-                        </span>
-                      </button>
-                      <button id="removeOwnerPassButton" type="button" class="btn btn-default help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'REMOVE_OWNER_PASSWORD' %>">
-                        <span class="glyphicon glyphicon-remove">
-                        </span>
-                      </button>
-                    </span>
-                  </div>
-                </form>
-              </li>
-              <li class="divider">
-              </li>
-              <li>
                 <center>
                   <p><%=l 'NOTIFICATION_ON_JOIN' %></p>
                 </center>
@@ -311,6 +294,28 @@
         </div>
       </div>
     </div>
+    <div class="modal fade" role="dialog" id="persistentModal" aria-labelledby="persistentModal" aria-hidden="true">
+      <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+          <div class="modal-header">
+            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+            <h4 class="modal-title" id="persistentTitle"><%=l 'MAKE_THIS_ROOM_PERSISTENT' %></h4>
+          </div>
+          <div class="modal-body">
+            <form class="navbar-form" id="persistentForm">
+              <center>
+                <p><%=l 'YOU_MUST_SET_A_PASSWORD' %></p>
+              </center>
+              <div class="input-group">
+                <input type="password" id="ownerPass" class="form-control help" placeholder="<%=l 'PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PASSWORD' %>"/>
+                <input type="password" id="ownerPassConfirm" class="form-control help" placeholder="<%=l 'CONFIRM_PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'CONFIRM_PASSWORD' %>"/>
+                <button id="setOwnerPassButton" type="submit" class="btn btn-default help disabled" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SUBMIT' %>"><%=l 'SUBMIT' %></button>
+              </div>
+            </form>
+          </div>
+        </div>
+      </div>
+    </div>
     <div class="frame">
       <div id="chatMenu" class="nav-collapse collapse">
         <div id="chatHistory" class="form-control">