Mercurial > xmpp-account-manager
view index.xhtml @ 44:1b07435c7891
mathieui: Mark PEP as advanced and add a warning.
author | Emmanuel Gil Peyrot <linkmauve@linkmauve.fr> |
---|---|
date | Sat, 23 May 2020 18:48:04 +0200 |
parents | 6a42b1783c9d |
children | af2874ff7234 |
line wrap: on
line source
<?xml version="1.0"?> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta charset="utf-8"/> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"/> <title>Prosody IM account configuration</title> <link rel="canonical" content-type="text/html" href="https://prosody.im/index"/> <link rel="icon" href="prosody.svg"/> <link rel="apple-touch-icon" href="prosody.svg"/> <link rel="stylesheet" href="share/bootstrap/css/bootstrap.min.css"/> <link rel="stylesheet" href="prosody.css"/> </head> <body> <div class="container"> <div class="row"> <form id="connection"> <input type="email" id="jid" placeholder="JID" title="Enter your JID (or XMPP address), on the form “you@your-server.tld”"/> <input type="password" id="pass" placeholder="Password" title="Enter the password used for this JID"/> <input type="submit" id="connect" value="Log in"/> <img width="24" height="24" id="connect-spinner" hidden=""/> </form> </div> <div id="connected" hidden=""> <div id="navtabs" class="nav nav-tabs nav-justified"> <li id="tab-profile" class="active"><a href="#profile">Profile</a></li> <li id="tab-mam"><a href="#mam">Message Archiving</a></li> <li id="tab-account"><a href="#account">Account</a></li> <li id="tab-pep"><a href="#pep">PEP (advanced)</a></li> </div> <div class="row tab-profile"> <div class="col-sm-4"> <h2>Nickname</h2> </div> <div class="col-sm-8"> <p> <input class="form-control" id="nick" placeholder="Nickname"/> <img width="24" height="24" id="nick-spinner"/> </p> <p>Enter your nickname, so people you know can recognize you.</p> <p class="form-group"> <label for="nick-access">Who can see your nickname?</label> <img width="24" height="24" id="nick-access-spinner" hidden=""/> <select class="form-control" id="nick-access"> <option value="open">Anyone</option> <option value="presence">Only your contacts</option> </select> </p> </div> </div> <hr class="tab-profile"/> <div class="row tab-profile"> <div class="col-sm-4"> <h2>Avatar</h2> <p>This image allows your contact to quickly identify you.</p> </div> <div class="col-sm-8"> <img id="avatar" style="max-width:96px;max-height:96px"/> <span id="avatar-size"/> <img width="24" height="24" id="avatar-spinner"/><br/> <input type="file" style="display:none" accept="image/*" id="avatar-file"/> <p class="custom-file"> <label class="custom-file-label" for="avatar-upload">Upload new avatar</label> <button id="avatar-upload">Choose file…</button> <button id="avatar-change">Use as your avatar</button> </p> <p class="form-group"> <label for="avatar-access">Who can see your avatar?</label> <img width="24" height="24" id="access-model-avatar-spinner" hidden=""/> <select class="form-control" id="avatar-access"> <option value="open">Anyone (pick this if you use public groupchats)</option> <option value="presence">Only your contacts</option> </select> </p> </div> </div> <hr class="tab-profile"/> <div class="row tab-profile"> <div class="col-sm-4"> <h2>Personal Information</h2> <p>Who are you?</p> <img width="24" height="24" id="vcard-spinner" hidden=""/> </div> <div class="col-sm-8"> <p> <label>Full name<br/> <input id="vcard-fn" disabled=""/></label><br/> Enter your name, so people you know can recognize you. </p> <p> <label>Email<br/> <input id="vcard-email" disabled=""/></label><br/> This can be used if you forget your password. </p> <p> <label>Birthday<br/> <input id="vcard-bday" type="date" disabled=""/></label> </p> <p> <label>Who can see your personal information?<br/> <select id="vcard-access"> <option value="open">Anyone</option> <option value="presence">Only your contacts</option> </select></label> <img width="24" height="24" id="vcard-access-spinner" hidden=""/> </p> </div> </div> <div class="row tab-account" hidden=""> <div class="col-sm-4"> <h2>Contact list</h2> </div> <div class="col-sm-8"> <table class="table"> <thead> <tr><th>JID</th><th>Name</th><th>Subscription</th><th>Groups</th><th>⚠️ Delete</th></tr> </thead> <tbody id="roster-table"/> </table> </div> </div> <hr class="tab-account" hidden=""/> <div class="row tab-account" hidden=""> <div class="col-sm-4"> <h2>Dangerous zone</h2> </div> <div class="col-sm-8"> <p> <button disabled="">Change my password</button> <button class="btn btn-danger" disabled="">⚠️ Delete my account</button> </p> </div> </div> <div class="row tab-pep" hidden=""> <div class="col-sm-4"> <h2>PEP (advanced)</h2> </div> <div class="col-sm-8"> <div class="alert alert-warning">This section is for <b>advanced</b> users, use at your own risk!</div> <table class="table"> <thead> <tr><th>PEP node</th><th>Title</th><th>Description</th><th>Type</th><th>⚠️ Delete</th></tr> </thead> <tbody id="pep-table"/> </table> </div> </div> <div class="row tab-mam" hidden=""> <div class="col-sm-4"> <h2>Message Archiving</h2> </div> <div class="col-sm-8"> <p> <label>Which messages to store in your archive?<br/> <select id="mam-prefs-default" disabled=""> <option value="always">All messages</option> <option value="never">No messages</option> <option value="roster">Messages from your contacts only</option> </select></label> <img width="24" height="24" id="mam-prefs-spinner" hidden=""/><br/> <table class="table" hidden=""> <tr> <th>Always:</th> <th>Never:</th> </tr> <tr> <td><textarea id="mam-prefs-always"/></td> <td><textarea id="mam-prefs-never"/></td> </tr> </table> <button id="mam-retrieve">Retrieve my message archive</button> <img width="24" height="24" id="mam-retrieve-spinner" hidden=""/><br/> <button disabled="">View my message archive</button><br/> <button id="mam-download" disabled="">Download my entire message archive</button><br/> <button class="btn btn-danger" disabled="">⚠️ Purge my entire message archive</button> </p> </div> </div> </div> </div> <script src="util.js"/> <script src="strophe.js"/> <script src="strophe.rsm.js"/> <script src="strophe.mam.js"/> <script src="client.js"/> <script src="nickname.js"/> <script src="avatar.js"/> <script src="vcard.js"/> <script src="pep.js"/> <script src="roster.js"/> <script src="mam.js"/> </body> </html>