oxen-io/session-desktop
1
0
Fork 0
mirror of https://github.com/oxen-io/session-desktop.git synced 2023-12-14 02:12:57 +01:00
Code Issues Projects Releases Wiki Activity

Make popup a little nicer to look at

Browse source 
Also add a little auto-suggestion contacts list. For now it just
contains your own number.
This commit is contained in:
lilia 2014-04-02 01:52:29 -07:00
parent 2ae5628122
commit a67ab3a46f
3 changed files with 123 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
js/popup.js
View file

@ -59,8 +59,12 @@ registerOnLoadFunction(function() {
fillMessages();
});
fillMessages();
$('.my-number').text(storage.getUnencrypted("number_id").split(".")[0]);
storage.putUnencrypted("unreadCount", 0);
chrome.browserAction.setBadgeText({text: ""});
$("#me").click(function() {
$('#popup_send_numbers').val($('.my-number').text());
});
$("#popup_send_button").click(function() {
var numbers = [];

91
popup.css Normal file
View file

@ -0,0 +1,91 @@
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
body {
margin: 0;
min-width: 300px;
min-height: 500px;
font-family: sans-serif;
color: #333;
}
.container {
max-width: 960px;
margin: auto;
padding: 0 1em;
}
header {
background-color: ccc;
padding: 5px 0;
}
form.compose {
position: relative;
}
label {
float: left;
margin-right: 1em;
}
input[type=text], textarea {
display: block;
padding: 0.5em;
margin: 0.5em 0;
border-radius: 4px;
border: 1px solid #ddf;
}
textarea {
resize: vertical;
width: 100%;
min-height: 100px;
box-sizing: border-box;
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 18px;
}
#send input[type=submit] {
float: right;
}
#popup_send_numbers {
margin-bottom: 0;
}
#popup_send_numbers:focus + .contacts,
.contacts:hover {
display: block;
}
.contacts {
display: none;
position: absolute;
left: 10px;
}
.contact {
border: solid 1px #ccc;
background: #fff;
font-size: 88%;
padding-right: 5px;
cursor: pointer;
}
.contact .pic {
display: block;
float: left;
width: 30px;
height: 30px;
background: #ddd;
}
.contact .name, .contact .number {
line-height: 30px;
margin-left: 5px;
}

43
popup.html
View file

@ -1,22 +1,35 @@
<html>
<head>
<link type='text/css' rel='stylesheet' href='popup.css'>
</head>
<body data-name="curve25519" data-tools="pnacl" data-configs="Debug Release" data-path="pnacl/{config}">
<div id="listener"></div>
<div id="log"></div>
<a id="inbox_link">Inbox</a>
<a id="send_link">Send</a>
<div id="inbox">
<ul id="messages">
</ul>
</div>
<div id="send" style="display:none;">
<form>
<input id="popup_send_numbers" />
<input id="popup_send_text" />
<a id="popup_send_button">Send</a>
</form>
<header class="clearfix">
<div class='container'>
<button id="inbox_link">Inbox</button>
<button id="send_link">Compose</button>
</div>
</header>
<div class='container'>
<div id="listener"></div>
<div id="log"></div>
<div id="inbox">
<ul id="messages">
</ul>
</div>
<div id="send" style="display:none;">
<form class="compose">
<input id="popup_send_numbers" type='text' placeholder="To">
<div class='contacts'>
<div id='me' class='contact'>
<span class='pic'></span>
<span class='name'>Me</span>
<span class='number my-number'></span>
</div>
</div>
<textarea id="popup_send_text"></textarea>
<button id="popup_send_button">Send</button>
</form>
</div>
</div>
<script type="text/javascript" src="js-deps/nacl-common.js"></script>