harmacist/darkwire.io
1
0
Fork 0
mirror of https://github.com/darkwire/darkwire.io.git synced 2025-07-24 05:00:17 +00:00
Code Issues Projects Releases Wiki Activity

Improve editing key and change footer button styles

Browse Source
This commit is contained in:
Alan Friedman 2016-01-12 20:59:29 -05:00
parent f59c8d2231
commit 11814aae88
3 changed files with 32 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/js/main.js
View File

@ -394,10 +394,19 @@ $(function() {
}
$('#join-modal .key').on('input propertychange paste change', function() {
var val = $(this).val();
var val = $(this).val().trim();
joinKeyInputChanged(val);
});
$('#settings-modal input.key').on('input propertychange paste change', function() {
var val = $(this).val().trim();
if (val !== encryptionKey && val.length) {
$('#settings-modal #save-key-edit').removeAttr('disabled');
} else {
$('#settings-modal #save-key-edit').attr('disabled', 'disabled');
}
});
$('.navbar .participants').click(function() {
renderParticipantsList();
$('#participants-modal').modal('show');
@ -427,7 +436,8 @@ $(function() {
// Prevent closing join-modal
$('#join-modal').modal({
backdrop: 'static',
show: false
show: false,
keyboard: false
});
$('.read-key').click(function() {
@ -437,19 +447,24 @@ $(function() {
});
$('.edit-key #cancel-key-edit').click(function() {
$('.edit-key').hide();
$('.read-key').show();
updateKeyVal(encryptionKey);
cancelSaveKey();
});
$('.edit-key #save-key-edit').click(function() {
saveKey();
});
function saveKey() {
function cancelSaveKey() {
$('.edit-key').hide();
$('.read-key').show();
updateKeyVal(encryptionKey);
}
function saveKey() {
var key = $('.edit-key input.key').val().trim();
if (!key.length) return;
$('.edit-key').hide();
$('.read-key').show();
updateKeyVal(key || encryptionKey);
}
@ -464,4 +479,8 @@ $(function() {
$('#join-modal').modal('hide');
}
$('#settings-modal').on('hide.bs.modal', function (e) {
cancelSaveKey();
});
});

20
src/public/style.css
View File

@ -167,26 +167,6 @@ input {
border-radius: 0px;
}
#settings-modal .modal-footer button.encryption-inactive {
display: none;
}
.chat #input-icons {
position: absolute;
bottom: 15px;
right: 15px;
}
.chat .warning-sign {
display: none;
cursor: pointer;
width: 35px;
}
.inputMessage.encryption-disabled {
background-color: rgba(254, 6, 6, 0.15);
}
.participants {
position: relative;
top: 16px;

18
src/views/index.mustache
View File

@ -53,9 +53,6 @@
</ul>
</div>
<input class="inputMessage" placeholder="Type here..."/>
<div id="input-icons">
<img src="https://s3.amazonaws.com/fattychat/img/warning-icon.png" class="warning-sign">
</div>
</li>
</ul>
@ -74,7 +71,7 @@
<p>Questions/comments? Email us at hello[at]fatty.chat</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
@ -100,14 +97,13 @@
<input class="form-control key" placeholder="Enter key here" type="text" id="settings-key"></input>
<div class="input-group-btn">
<button class="btn btn-default" type="button" id='cancel-key-edit'>Cancel</button>
<button class="btn btn-primary" type="button" id='save-key-edit'>Save</button>
<button class="btn btn-primary" type="button" id='save-key-edit' disabled="disabled">Save</button>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success encryption-active" data-dismiss="modal">Done</button>
<button type="button" class="btn btn-danger encryption-inactive" data-dismiss="modal">Continue Without Encryption</button>
<button type="button" class="btn btn-default encryption-active" data-dismiss="modal">Close</button>
</div>
</div>
</div>
@ -122,10 +118,10 @@
</div>
<div class="modal-body">
<p>We've placed you in a new chat room. Invite people to join using the text below.</p>
<p id="share-text">Let's chat on FattyChat at <span class='room-url bold' id='first-room-url'></span>&nbsp;using the key <span class="key bold"></span>&nbsp;&nbsp;<button class="btn btn-default btn-xs copyable" type="button" data-clipboard-target="#share-text"><span class="glyphicon glyphicon-copy"></span>&nbsp;&nbsp;Copy</button></p>
<p id="share-text">Let's chat on FattyChat at <span class='room-url bold' id='first-room-url'></span>&nbsp;using the key <span class="key bold"></span>&nbsp;&nbsp;<button class="btn btn-primary btn-xs copyable" type="button" data-clipboard-target="#share-text"><span class="glyphicon glyphicon-copy"></span>&nbsp;&nbsp;Copy</button></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success encryption-active" data-dismiss="modal">Done</button>
<button type="button" class="btn btn-default encryption-active" data-dismiss="modal">Got It</button>
</div>
</div>
</div>
@ -142,7 +138,7 @@
<input class="form-control key" placeholder="Enter key here" type="text" id='join-key'></input>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success encryption-active" disabled="disabled" data-dismiss="modal">Done</button>
<button type="button" class="btn btn-primary encryption-active" disabled="disabled" data-dismiss="modal">Done</button>
</div>
</div>
</div>
@ -159,7 +155,7 @@
<ul class="users"></ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>