Mercurial > xmpp-account-manager

view index.xhtml @ 27:02b5bceeca64

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Add vCard birthday support, and only include complete values in the vCard.
author Emmanuel Gil Peyrot <linkmauve@linkmauve.fr>
date Sun, 23 Dec 2018 16:51:53 +0100
parents 28967a0bb1b2
children e6d8095f2c0a
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>

<nav class="navbar navbar-default">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-toggle collapsed" href="index.html#navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
      <a class="navbar-brand" href="index.html">Prosody IM</a>
    </div>
    <div id="navbar" class="navbar-collapse">
      <ul class="nav navbar-nav">
        <li><a href="https://prosody.im/download">Download</a></li>
        <li><a href="https://prosody.im/doc">Documentation</a></li>
        <li><a href="https://prosody.im/discuss">Support</a></li>
        <li><a href="https://prosody.im/bugs">Issues</a></li>
        <li><a href="https://prosody.im/source">Source</a></li>
        <li><a href="https://prosody.im/doc/developers">Dev docs</a></li>
      </ul>
    </div>
  </div>
</nav>

<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-pep"><a href="#pep">PEP</a></li>
<li id="tab-account"><a href="#account">Account</a></li>
</div>

<div class="row tab-profile">
<div class="col-sm-4">
<h2>Nickname</h2>
</div>
<div class="col-sm-8">
<p>
<input 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>
</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><label>Upload new avatar<br/>
<button id="avatar-upload">Choose file…</button></label><br/>
<button id="avatar-change" hidden="">Use as your avatar</button><br/>
<label>Who can see your avatar?<br/>
<select id="avatar-access">
<option value="open">Anyone (pick this if you use public groupchats)</option>
<option value="presence">Only your contacts</option>
</select></label> <img width="24" height="24" id="access-model-avatar-spinner" hidden=""/>
</p>
</div>
</div>

<hr class="tab-profile"/>

<div class="row tab-profile">
<div class="col-sm-4">
<h2>vCard</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 vCard?<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>
<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 disabled="">⚠️ Delete my account</button>
</p>
</div>
</div>

<div class="row tab-pep" hidden="">
<div class="col-sm-4">
<h2>PEP</h2>
</div>
<div class="col-sm-8">
<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? <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>
<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 disabled="">⚠️ Purge my entire message archive</button>
</p>
</div>
</div>

</div>
</div>

<footer class="container">
  <dl class="col-xs-4">
    <dt class="hidden-xs">License</dt>
    <dd><a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/" title="Creative Commons Attribution-ShareAlike 4.0 International License.">cc-by-sa</a></dd>
  </dl>
  <dl class="col-xs-4">
    <dt class="hidden-xs">Last change</dt>
    <dd><datetime datetime="2018-12-18">2018-12-18</datetime></dd>
  </dl>
  <dl class="col-xs-4 pull-right">
    <dt class="hidden-xs">Page source</dt>
    <dd><a rel="alternate" href="https://hg.prosody.im/site/file/e956afb61f21/index.md">index.md</a></dd>
  </dl>
</footer>

<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>